Tecnologías Web para la creación de un sitio 4 "B" by Ana Vega https://padlet.com/anamve03/dkmy1rrusfddywm7 Tipos de lenguaje y para qué sirven cada uno Trabajo realizado por: Candelaria Gómez, Guadalupe Perez, Francys Vega y Ana Vega. en-us 2021-10-14 13:31:30 UTC 2025-12-04 23:12:12 UTC hello@padlet.com https://padlet.net/icons/png/1f5a5.png HTML anamve03 https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1817068214 Se entiende como Lenguaje de Marcado de Hipertexto (también conocido como HTML), es un código que se emplea para estructurar y desplegar una página web y sus contenidos. Un ejemplo sería, una lista con viñetas o imágenes y tablas de datos.

Los códigos HTML son el lenguaje universal que se utiliza para crear y dar formato a los sitios web: funcionan en cualquier sistema operativo (Windows, Mac, Linux, etc.) y con cualquier navegador (Chrome, Explorer o Mozilla).

]]> 2021-10-14 13:37:04 UTC https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1817068214 CSS anamve03 https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1817076365 Cascading Style Sheets o mejor conocido como CSS es un lenguaje que determina el estilo de los documentos HTML: dentro de este, se abarcan opciones relativas a fuentes, colores, márgenes, líneas, altura, anchura, imágenes de fondo, entre otros. En la actualidad es posible utilizar lenguaje HTML para desarrollar el formato de páginas web.]]> 2021-10-14 13:39:21 UTC https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1817076365 JavaScript anamve03 https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1817078569 JavaScript es lenguaje de programación, dialecto del estándar ECMAScript. Se define como orientado a objetos,​ basado en prototipos, imperativo, débilmente tipado y dinámico. Es el único lenguaje de programación que funciona en los navegadores de forma nativa (lenguaje interpretado sin necesidad de compilación). Por tanto se utiliza como complemento de HTML y CSS para crear páginas webs.]]> 2021-10-14 13:39:56 UTC https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1817078569 Introducción: ¿Qué son estos tipos de lenguaje? anamve03 https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1817085036 HTML y CSS en realidad no son lenguajes de programación técnica: son solo la estructura de la página y la información de estilo. Principalmente presentaremos HTML y CSS que están en la parte frontal de cada página web y aplicación antes de pasar a JavaScript.]]> 2021-10-14 13:41:33 UTC https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1817085036 ¿Cómo funciona HTML? anamve03 https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1820638511 Gracias a el Lenguaje de Marcado de Hipertexto le permite a los usuarios web pueden crear y estructurar secciones, párrafos y enlaces mediante elementos, etiquetas y atributos.]]> 2021-10-16 02:12:10 UTC https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1820638511 ¿Para qué sirve CSS? anamve03 https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1820643521 Resulta muy fácil para un diseñador front-end realizar cambios en la apariencia de una web sin afectar de manera dramática a su contenido. El contenido siempre será el mismo, solo cambia como aquello que podemos ver. CSS es fácil de entender y aprender, y nos da un potente control de cómo diseñar los documentos HTML.

Gracias al CSS podemos definir que todas las etiquetas <H1> de un texto cambie su apariencia por aquella que definamos, cambiando colores, fuentes y añadiendo efectos sin modificar nada del contenido que sirve de base.

]]> 2021-10-16 02:18:23 UTC https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1820643521 Algunos de los usos más comunes de HTML anamve03 https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1820648677
  • Desarrollo web: Los desarrolladores utilizan el código HTML para diseñar la forma en que un navegador muestra los elementos de la página web, como el texto, los hipervínculos y los archivos multimedia.
  • Navegación por Internet: Los visitantes pueden navegar fácilmente y seguir enlaces entre páginas y sitios web relacionados, ya que el HTML se utiliza en gran medida para incrustar hipervínculos.
  • Documentación web: HTML permite organizar y dar formato a los documentos, de forma similar a Microsoft Word.
    • ]]>     2021-10-16 02:24:16 UTC https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1820648677     ¿Para qué sirve JavaScript? anamve03 https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1820658916 Con JavaScript podemos crear efectos y animaciones sin ninguna interacción, o respondiendo a eventos causados por el propio usuario, su principal función es ayudar a crear páginas webs dinámicas.

    JavaScript es capaz de detectar errores en formularios, de crear bonitos sliders que se adapten a cualquier pantalla, de hacer cálculos matemáticos de forma eficiente, entre otros.

    Pero también JS es el encargado de que existan herramientas como Google Analytics, Google Tag Manager, Facebook Pixel y tantas otras, que son claros ejemplos de JavaScript.

    Aunque no la sepamos reconocer, es la encargada de que podamos conseguir más mensajes, tweets, emails, sólo pulsando un botón, sin tener que recargar la página.

    ]]>     2021-10-16 02:36:37 UTC https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1820658916     Para qué se usa el JavaScript anamve03 https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1820661616 Aunque el desarrollo de sitios web -incluyendo la adición de elementos como formularios interactivos y animaciones- es el uso más tradicional de JavaScript, también se utiliza en:

    • Juegos basados en el navegador web, incluidos los juegos 2D y 3D
    • Desarrollo de aplicaciones para móviles: beneficioso porque es independiente de la plataforma telefónica
    • Presentaciones: creación de presentaciones de diapositivas animadas en la web
    ]]>     2021-10-16 02:39:01 UTC https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1820661616     Ejemplos realizados anamve03 https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1821458840
    Las etiquetas HTML son pequeños bloques de código, que indican al navegador como debe interpretar el contenido recogido entre dichas etiquetas. 

    ]]>     2021-10-16 22:12:40 UTC https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1821458840     Ejemplos de etiquetas HTML anamve03 https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1821459235 Las etiquetas HTML son pequeños bloques de código, que indican al navegador como debe interpretar el contenido recogido entre dichas etiquetas.

    Algunos ejemplos
    • Insertar imagen utilizamos <img>, que requiere de por lo menos de un atributo para ser utilizado: src (a veces denominado por su nombre completo, source).
    • Insertar un botón. La etiqueta de HTML <button> representa un elemento cliqueable de tipo botón que puede ser utilizado en formularios o en cualquier parte de la página que necesite un botón estándar y simple de aplicar.
    • Insertar link especifica la relación entre el documento actual y un recurso externo <link>. Este elemento es más frecuentemente usado para enlazar hojas de estilos.
    • HTML "Div" este elemento es la abreviación de "division" en español división. Sirve para crear secciones o agrupar contenidos. Sus etiquetas son: <div> y </div> (ambas obligatorias). Está definido como: Elemento en bloque.
    ]]>     2021-10-16 22:13:35 UTC https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1821459235     Página Web: Ciudades anamve03 https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1884053283 https://francyscarolinaveg.wixsite.com/my-site-2]]> 2021-11-11 12:44:40 UTC https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1884053283 Ejemplo de Try Editor anamve03 https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1884059178 <!DOCTYPE html>
    <html>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
    <style>
    body,h1,h2,h3,h4,h5 {font-family: "Raleway", sans-serif}
    </style>
    <body class="w3-light-grey">

    <div class="w3-content" style="max-width:1400px">

    <!-- Header -->
    <header class="w3-container w3-center w3-padding-32"> 
      <h1><b>TRYIT EDITOR</b></h1>
      <p>Ejemplo realizado por<span class="w3-tag">Ana Vega, Guadalupe Perez, Francys Vega y Candelaria Gomez</span></p>
      <sub>En este trabajo se investigó acerca de la interfaz TRYIT EDITOR para la realización del mismo.</sub>
    </header>

    <!-- Grid -->
    <div class="w3-row">

    <!-- Blog entries -->
    <div class="w3-col l8 s12">
      <!-- Blog entry -->
      <div class="w3-card-4 w3-margin w3-white">
        <img src="https://blog.hubspot.es/hubfs/como-hacer-una-pagina-web-en-html.jpg" style="width:100%">
        <div class="w3-container">
          <h3><b>TRYIT EDITOR</b></h3>
          <h3>¿Qué es Tryit Editor?
        </div>
        
    <div class="w3-container">
    <p>El HTML Tryit Editor permite el desarrollo rápido de páginas web sin comprometer el rendimiento y el uso de la memoria. La aplicación ofrece varias funciones como JS Interactive Console, formateador JSON para registros de consola, soporte de objetos de consola, etc.</p>

    <h3>¿Para qué sirve?</h4>
    </div>

    <div class="w3-container">
    <p>Tryit editor posee una página web en el que te enseñan más sobre la interfaz: con tutoriales fáciles y explicaciones sencillas para el entendimiento de cada una de las etiquetas disponibles para la creación de una página web, ya sean: HTML, JS o CSS.

    Algunos post interesantes que puedes encontrar en su página web son:</p>

    <div class="w3-container">
    <li> Plantillas editables para la estética de tu página web: puedes aprender a realizarlas paso por paso o también utilizarlas y cambiarles su contenido a tu estilo.
    <li> Insertar imágenes: Posee diversos tipos de tutoriales en el que te enseñan a como insertar una imágen, cambiarle el tamaño, su ubicación, entre otros.
    <li> Insertar botones: Puedes insertar botones redireccionables o desplegables a tu página web.
    <li> Cambiar el color de fondo: Te enseñan a como cambiar el color del fondo ya sea por código o nombre del mismo, sus tutoriales son bastante fáciles de utilizar e incluso te dejan un mezclador de colores para que juegues o consigas una paleta de colores para ru página.
    </li>

    <p> A su vez, en su página, cuentas con apartados para poder practicar las etiquetas o comandos que te dan en los tutoriales y un ejemplo de como quedarían una vez insertados.</p>
          </li>  
        </ul>
      </div>
      <hr> 

    <img src="https://miro.medium.com/max/1400/0*aVQR9kZAltUzmu8e" style="width:100%">
    <div class="w3-container">
    <h3><b>CONCLUSIÓN</b></h3>

    <div class="w3-container">
    <p>Como conclusion de esta prueba podemos destacar los siguientes puntos a partir de la investigación realizada: Tryit editor es una interfaz simple y fácil de usar para los que recién inician en el diseño de páginas. Si bien existen páginas prediseñadas que te ofrecen plantillas ya creadas en las que solo tienes que insetar información, con Tryit editor puedes aprender a diseñar y conocer las etiquetas básicas para crear tu propia página web.

    <!-- END Introduction Menu -->
    </div>

    <!-- END GRID -->
    </div><br>

    <!-- END w3-content -->
    </div>

    <!-- Footer -->
    <footer class="w3-container w3-dark-grey w3-padding-32 w3-margin-top">
    </footer>
    </body>
    </html>

    ]]>     2021-11-11 12:47:38 UTC https://padlet.com/anamve03/dkmy1rrusfddywm7/wish/1884059178