Antes de empezar como siempre voy a dar unas cuestiones que va a seguir
Y es que si miras en cualquier parte de internet no vas a encontrar un verdadero Tutorial de HTML5 y es porque se da solo lo nuevo pero no como es lo completo y es porque como HTML5 no se ha adoptado en el 100% por medio o no sé qué solo se enseña lo nuevo que incluye a diferencia de sus otras versiones y siento que esto es erróneo ya que en un ejemplo
Si digamos llega a salir en un futuro el office ONE (jejejeje) se trata que no solo se tiene que enseñar lo nuevo que trae a los que apenas van a empezar a usarlo así que esto no sería de gran ayuda, lo que necesita uno completo que le enseño como abrirlo hasta como cerrarlo.
Es lo que yo pretendo con este tutorial que sea un HTML5 olvidando por completo versiones pasadas y tomarlo de una vez como lo necesario de aprender, así que vamos a ver la estructura de una etiqueta y todo lo que incluye por ejemplo los atributos que tienen:
Empecemos
<div id="contenedor"> </div>
Como vimos tiene una estructura muy sencilla en este caso podemos ver lo siguiente y que es en la mayoría de las etiquetas
1. Lo primero vemos lo que hay una etiqueta de apertura que es formada por un menor que < este es obligatorio en todos y siempre va a estar en todos nuestros documentos HTML
2. Lo que continua es que vemos tiene un nombre que en la mayoría es en inglés o que es una abreviatura y que es propia de cada uno y significa en la mayoría de los casos lo que realiza por ejemplo:
<head> significa cabecera
3. Continua si es necesario agregar diferente tipos de atributos que observamos un ejemplo de ello podemos observar
id="contenedor"
De esta forma tiene un atributo id que significa identificador (esto más adelante lo veremos más a detalle) que tiene un valor, en este caso es contenedor que más adelante puede ser usado para colocar estilos por medio de CSS3 o utilizarlo con JavaScript o solo para recordar para que sirve o qué papel desempeña en nuestro documento
4. Se cierra esta etiqueta con un mayor que > que al final obtendríamos
<div id="contenedor">
De esta forma se cierra la primera parte de la estructura de un tag completo
5. Después de esto si se da el caso va todo lo que corresponde dentro de esa etiqueta por ejemplo lo que es la tag head va todo los enlaces o el mismo CSS3 o metatags (que también veremos más adelante), a diferencia de lo que puedes colocar en la tag body que aquí corresponde los div, p,br,etc.
6. cuando termines todo lo necesario viene la hora de cerrar con la forma
<div id="contenedor"> </div>
Excepciones:
Hay grandes tag de excepción que no siguen estas reglas generales las cuales son
Img esta etiqueta no sigue el cierre digamos el siguiente ejemplo:
<img src="image.gif" />
Solo lo abrevia con />
Hay otras como por ejemplo
<br> se puede dejar así o más adecuado </br> de esta forma las dos funcionan muy bien y más en estos tiempos que google no toma muy importante como está tu código HTML ya que ahora con sus nuevos algoritmos tiene más importantes otras cosas
Espero que de esta forma quede entendido la estructura de una etiqueta en HTML5, cuando estudies y estudies y no solo eso lo practiques veras que las doscientos y tantas etiquetas que maneja se grabaran en tu mente de forma incociente.
Saludos y los veo en la siguiente entrega
No hay comentarios:
Publicar un comentario