
1. Documento de la www accesible desde los navegadores web
2. Lenguajes estructurales
2.1. Ejemplos
2.1.1. HTML
2.1.1.1. Lenguaje de marcado estándar para la creación de páginas Web
2.1.1.2. Describe la estructura de las páginas utilizando etiquetas (tags) que abren y cierran. Una etiqueta puede abrir y cerrar, pueden abrir y cerrar en la misma etiqueta, por ejemplo <br />
2.1.1.3. Las etiquetas pueden tener atributos para definir información adicional, siempre se colocan en la etiqueta de apertura
2.1.1.4. Etiquetas
2.1.1.4.1. <!DOCTYPE html> Todo documento html debe iniciar con la declaración del tipo
2.1.1.4.2. <html></html> Marcan el inicio y fin del documento
2.1.1.4.3. <head></head> Sirve para definir información del documento
2.1.1.4.4. <title></title> Sirve para definir el título del documento
2.1.1.4.5. <body></body> Sirve para definir el cuerpo (el contenido) del documento
2.1.1.4.6. Ejemplo de estructura: <!DOCTYPE html> <html> <head> <title>Título del documento</title> </head> <body> Contenido del documento </body> </html>
2.1.2. XHTML
2.1.2.1. Es HTML que sigue las reglas del XML
2.1.2.2. Está más estandarizado y por lo tanto todos los navegadores los reconocen
2.1.2.3. Más estricto que el HTML
2.1.3. XML
2.1.3.1. Permite almacenar y transportar datos
2.1.3.2. Su estructura DEBE estar bien formada
2.1.3.3. Es independiente del hardware y software
2.1.3.4. A partir de 1998, Es una recomendación de la W3C
2.1.3.5. A diferencia de HTML y XHTML, no es un lenguaje para desplegar datos
2.1.3.6. No utiliza etiquetas predefinidas
3. Componentes
4. Estructura
5. Diseño y Presentación
5.1. Utilizados para mejorar la percepción visual. Son los elementos necesarios para lograr comunicarnos eficazmente con el usuario. Se debe cuidar no ser muy escuetos en su uso pero tampoco saturar el sitio con elementos que distraigan demasiado al usuario. Deben ser acordes al tema del sitio
6. Comportamiento e interactividad
7. Lenguajes de presentación
7.1. Hojas de Estilo en Cascada (CSS)
7.1.1. Tiene tres niveles
7.1.1.1. CSS1
7.1.1.1.1. Ya está obsoleto
7.1.1.2. CSS2
7.1.1.2.1. Actualmente es una recomendación
7.1.1.3. CSS3
7.1.1.3.1. Está por convertirse en estándar
7.1.2. Utilizadas para dar formato, presentación y estilo al documento html
7.1.3. Describen cómo se mostrarán los elementos html
7.1.4. Permiten controlar el diseño del sitio completo desde un solo lugar (la cascada)
7.1.5. Sintaxis: selector {propiedad1:valor1; propiedad2:valor2;}
7.1.6. Se utilizan selectores para acceder y dar estilo a los elementos html. Se pueden utilizar combinados y en variantes
7.1.7. Selectores básicos
7.1.7.1. Selector elemento. Es el nombre del elemento. Se aplica el estilo a todos los elementos de ese tipo, por ejemplo: p {...} - todos los párrafos, div {...}- todos los divs, table - todas las tablas
7.1.7.2. Selector clase. Sólo afecta a los elementos que tengan esa clase, se utiliza de la forma .nombreClase, por ejemplo: .titulo {...} - afectará a todos los elementos con clase titulo (<div class=”titulo otrasPosiblesClases”></div>)
7.1.7.3. Selector id. Sólo afecta a los elementos que tengan el id de la cascada, por ejemplo: #nombre {...} - afectará al elemento con id=”nombre” (<input type=”text” id=”nombre” />)
8. Elementos para dar presentación a la página web
8.1. Texto. El usuario generalmente busca información de este tipo, por lo tanto, es el elemento principal
8.2. Imágenes. Muestran información de forma visual. No se debe abusar de su uso
8.3. Audio. Permite agregar sonido a las páginas, el formato más usado por su calidad y peso es el mp3
8.4. Video. Debido a la velocidad que ha ganado el internet, es posible colocar video en los sitios web
8.5. Color. Debe tenerse especial cuidado en la combinación y tonos de los colores, ya que se puede generar una página ilegible
8.6. Tipografía. De ella depende la claridad del contenido
8.7. Íconos. Debe cuidarse que expresen lo que el usuario necesita, deben ser comprensibles para todos
9. Modelo de objetos DOM
9.1. Es una de las técnicas que surgen por la necesidad de acceder y manipular eficientemente documentos XML, y con ello HTML y XHTML
9.2. Convierte la estructura del documento a una estructura en forma de árbol con nodos anidados
9.3. Es independiente del lenguaje de programación
9.4. Permite el dinamismo de la página web
10. Lenguajes de secuencia de comandos. Lenguajes del lado del cliente
10.1. Ejemplos
10.1.1. ECMAScript
10.1.1.1. Lenguaje que formó las bases para JavaScript
10.1.2. JavaScript
10.1.2.1. Lenguaje basado en Java que permite programar el comportamiento de la página web
10.1.3. VBScript
10.1.3.1. Está basado en visualBasic que sólo es funcional para internet explorer a partir de su versión 4
11. Applets
11.1. Miniaplicaciones del lado del cliente que no son independientes, es decir, se ejecutan dentro de otra aplicación mediante plugins
11.2. Tipos
11.2.1. JavaApplets
11.2.1.1. Pequeñas aplicaciones que pueden ser interactivas
11.2.2. Animaciones de flash
11.2.2.1. Animaciones que ocupan poco espacio
11.2.3. Windows Media Player
11.2.3.1. Permite mostrar videos al usuario