La escritura de este lenguaje de etiquetas conlleva a una de apertura y una de cierre.
Apertura (color azul)
<nombre-del-elemento>
<nombre-del-elemento>
Cierre (color rojo)
</nombre-del-elemento>
</nombre-del-elemento>
Nota: La de cierre lleva el mismo nombre que la apertura de la etiqueta.
Como hemos observado la apertura posee entre los corchetes angulares el nombre del elemento. Mientras que el cierre posee una pleca ( / ) antes del nombre del elemento, Esto no todo el tiempo es así ya que en HTML existes etiquetas que no poseen cierre; como el caso de la etiqueta para insertar imagen. En estos casos para una sintaxis limpia se le coloca la pleca al final del nombre del elemento.
<img src="dirección-de-imagen"/>
Una etiqueta HTML posee elemento y atributos. una etiqueta puede llevar varios atributos.
Nota: la sintaxis del atributo puede ir nombreAtributo="valor" ó nombreAtributo='valor'
<nombre-del-elemento atributo="valor"> </nombre-del-elemento>
Veremos como ejemplo la etiqueta párrafo de HTML que se escribe de la siguiente manera.
<p style="background:#80bfff">Este es un párrafo de ejemplo </p>
Resultado: Este es un párrafo de ejemplo
Como podemos ver en la etiqueta párrafo de HTML posee elemento(p) y un solo atributo(style).
Ahora que ya conocemos un poco sobre la escritura de una etiqueta HTML podemos pasar a ver la estructura de una pagina web.
Principalmente toda pagina web escrita en este lenguaje tiene que empezar con la etiqueta html seguido de sus dos partes principales.
La cabecera, que se escribe con la etiqueta head: es donde ira la parte del documento que no se mostrara. Las etiquetas para agregar documentos css externos,código javascript. El titulo de la Web y su respectivo icono o mejor conocido como favicon.
Cuerpo, que se escribe con la etiqueta body: es donde ira todo lo que se mostrara de la pagina web, este incluye menú, barras laterales, contenido principal entre otros.
Ejemplo de la estructura de un documento HTML
<html>
<head>
<title>Nombre de web</title>
</head>
<body>
<p>Este es un ejemplo de un documento HTML</p>
</body>
</html>
<head>
<title>Nombre de web</title>
</head>
<body>
<p>Este es un ejemplo de un documento HTML</p>
</body>
</html>
Siguiendo con la sintaxis HTML estas poseen parentesco. así como una persona posee a su padre, hermanos, hijos. En el ejemplo de la estructura de un documento HTML podemos observar a simple vista el parentesco. La etiqueta html dentro de ella se encuentran sus hijos que son head y body asi mismo head y body son hermanos y estas poseen su propios hijos.
El siguiente esquema ejemplifica como funciona el parentesco.
Nota: HTML no distingue entre minúsculas y mayúsculas. tanto que escribir <p>Este es un Párrafo</P> a html le da igual, sigue siendo una etiqueta de párrafo. pero lo mas adecuado y aconsejable es escribirlo en minúscula. ya que trae problemas de lectura al convivir con código (XML)
HTML posee entidades ó caracteres especiales. las vocales con tilde entre otros no pueden ser leídos correctamente. así que poseen entidades que las distingue de otros caracteres, estas comienzan con el signo ampersand (&) y terminan con punto y coma (;)
Tabla de entidades HTML
Carácter
|
Entidad HTML
|
©
|
©
|
á
|
á
|
é
|
é
|
í
|
í
|
ó
|
ó
|
ú
|
ú
|
ü
|
ü
|
ñ
|
ñ
|
¡
|
¡
|
¿
|
¿
|
á
|
Á
|
é
|
É
|
í
|
Í
|
ó
|
Ó
|
ú
|
Ú
|
ü
|
Ü
|
ñ
|
Ñ
|
No hay comentarios.:
Publicar un comentario