jueves, 15 de enero de 2015

Tutorial de Html5


En estos días he estado estudiando bastante lo que es el código html5, me apaciona la idea de ser un diseñador 100% profesional y freelance de páginas web.
En busca del elixir del saber me he topado con grandes páginas y weblogs que tienen temas relacionados con la rama, entre ellos y claro que lo postearé es el blog de ITECHNODE este es uno de los sitios que frecuento mucho por su alto contenido en la red, en uno de sus posts hablan específicamente de la maravillosa herramienta Sublime Text que es un editor de código html5, html, php y un sin fin de lenguajes que los compila e interpreta bien.


este es el editor que utilizo y tiene características incorporadas que acá en el blog de ITECHNODE se mencionan y son muy útiles para poder ser incorporado en tu SUBLIME TEXT 2, aunque yo lo incorporé en la versión 3 de este editor.

Bueno hablamos de la estructura básica del html5, acá lo voy a dejar y lo explicaré abajo.


1. Esta línea define el tipo de documento que estamos creando, el motor de los navegadores ya entienden que esta sintáxsis pertenece a la estructura del html5 y le indica al navegador que las etiquetas y la estructura perteneces a este nuevo estándar. Por cierto, la w3c tenía previsto declarar al lenguaje html5 como estándar para el año 2,014.
2. Html con esta etiqueta no pasa nada, prácticamente es la misma de siempre y nos indica el final e inicio de nuestro documento escrito en este lenguaje.
3. Head, esta etiqueta básicamente contiene a la etiqueta title y hacen en la etiqueta hija de Head, la etiqueta meta una mejora, ya que varios autores y conferencistas indican que ya no es necesario colocar la etiqueta name con el atributo descriptio y la misma etiqueta con el atributo keywords. Eso indicaría que colocamos unicamente a la etiqueta meta con su atributo charset y el valor UTF-8 para que podamos escribir cualquier caracter y que el navegador lo interprete de la forma en que queremos que lo muestre como ejemplo los caracteres acentuados, la ñ y otros tantos...
4. Es la etiqueta title que en cuestión designa el título de nuestra página web.
6. La etiqueta body es el cuerpo y la parte visible de nuestra página web, en ella se alojan etiquetas que tendrán relación directa con el diseño visual de nuestra web hacia el usuario.
7. La etiqueta header puede ser utilizado para colocar el logo, la parte inicial de nuestra web, o el nombre de la misma.
9. La etiqueta nav, contendrá la barra de navegación, conocida también como botonera o menú.
10. Section, es un fragmento de nuestra página web y define espacios reservados y modificados que no modifiquen de forma general la página, regularmente lo vemos ocupado por un listado de artículos, entradas, anclas e información importante del sitio.
11. Article es una etiqueta que incorpora una peculiaridad en su interior ya que dentro de ella también es factible definir una etiqueta header y una etiqueta footer para formatear de mejor forma el contenido de la misma.
15. La etiqueta aside contiene información que no tiene relación directa con el contenido de la web, es decir, que no es de la temática de la web y que al mismo tiempo puede contener íconos como el de las redes sociales.
17. Llegamos a la parte final de nuestra estructura simple y básica del html5; al que se dará a conocer como el footer, la función de esta etiqueta es de contener el pie de página, el fin del sitio con información relevante acerca de la empresa tales como: el teléfono, dirección de correos electrónicos, enlaces a redes sociales o autor de la web.


El body debería de ser idéntico a este formato o por lo menos debería de ser estándar en las páginas web, sim embargo, la creatividad y el arte de cada programador va a determinar la calidad de un sitio colgado en el internet.

Acá se ha hecho mención de la estructura básica de html5 y del editor Sublime Text para aquellas personas que les guste codear desde cero o la mayor parte de su web.


No hay comentarios:

Publicar un comentario

Deja tu comentario, nos es útil para poder saber más de tí.