Clase 2: HTML


Hyper Text MarkUp Lenguage

A diferencia de la lectura en secuencia característica de los textos, los hipertextos permiten una lectura no secuencial a través de la interacción entre links. *En código HTML todo se escribe en minúsculas.


Sistema de Etiquetas

  • ! --Comentarios-->
  • Títulos: h1, h2, h3,..., h6
  • Parrafos: p
  • Links: a (ancla), a href --} href: "#" (atributo en donde # es el valor de este)
  • Listado: ul - li
  • Listado ordenado: ol - li
  • Elementos de bloque: p
  • Elementos de línea: em

Anidación

Cuando una etiqueta contiene a otra, por ejemplo:
-p- Mi gato es -strong-muy-/strong-grunón.-p-

"-" representa los diple "<"">"


Identación

Aplicación de niveles sucesivos de márgenes de acuerdo con la anidación de etiquetas, para identificar con mayor facilidad problemas de anidación o desbalance en el cierre de etiquetas. Se puede ocupar la tabulación o espacios.


Recomendaciones para nombres de archivos y carpetas:

  • Preferentemente uso de minúsculas
  • Utilizar sólo números, letras y guiones
  • Utilizar guiones para separar palabras
  • Definir nombres cortos y relevantes

Estructura base de un código HTML

Existe una metolodologia de diseño centrado en el usuario que tiene las siguiente características:

  1. -!DOCTYPE html-
  2. html lang="es" (definición idioma)
  3. -head-
  4. -title-tídulo documento-/title-
  5. -/head-
  6. -body
  7. -h1-contenido-/h1-
  8. -/body-
  9. -/html-

¡IMPORTANTE!

W3C validator: Validar el código HTML