Introducción simple a HTML
August 6, 2013
Tiempo total: 0 días con 0:10:39 hrs
Ahora, llego el momento de explicaciones previas a la construcción de los documentos HTML. Para iniciar las conversiones de diseños profesionales realizados en Photoshop, Illustrator o bien GIMP, será necesario tener la configuración necesaria en nuestras mentes para saber a que nos referimos con determinados conceptos.
HTML
Es el lenguaje utilizado para la realización de páginas web, sus siglas significan Lenguaje de Marcado HiperTextual y está compuesto por contenido encerrado en etiquetas, y estas con atributos.
Su estructura básica es la siguiente:
<html>
<head>
</head>
<body>
</body>
</html>
La etiqueta <html></html> indican donde inicia y donde termina el documento HTML, es decir que todo el contenido deberá de estar dentro de estas etiquetas.
La etiqueta <head></head> es la cabecera del documento HTML. En esta se encierra la información que no es mostrada al usuario de manera grafica o bien directamente.
El cuerpo del documento es mostrado por las etiquetas <body></body>, por ejemplo en esta etiqueta es donde se mostrara el texto e imágenes que describirán nuestra página y que serán mostradas a nuestros visitantes de manera directa.
Estándares W3C
Es necesario seguir el estándar que se ha impuesto para ver el mismo resultado en cualquier navegador web, pues estos son de distintas compañías desarrollados por distintas personas las cuales se basan en los estándares W3C.
W3C es el consorcio de la red informática mundial (world wide web) el cual se dedica al desarrollo de estándares cuya única misión es llevar a la web a su máximo potencial. La dirección para verificar que los documentos web que hemos realizado cumplan con los estándares es:
Es decir que no importa si tenemos terminada nuestra página web, que fue creada en algún editor HTML, como por ejemplo Dreamweaver, y que por mencionar un ejemplo: la podemos ver perfectamente en nuestro único navegador. Si no se siguen los estándares observaremos una total atrocidad en IE7, o bien Opera, por ejemplo.
Es necesario mencionar que obtener código HTML estándar es algo simple, y lo será más aun conforme se obtenga más experiencia en este campo.
HTML estricto… o bien extendido
HTML permite la combinación de las estructuras de las etiquetas, por ejemplo el desarrollador podrá iniciar un tag, y terminarlo dentro de otro que inicio después del primer tag. Por ejemplo:
<p><b>Hola mundo</p></b>
Lógicamente lo anterior no tiene orden alguno, también podemos encontrar más formas de crear relajos, como por ejemplo:
<IMg sRc=”img/hola_mundo.jpg” WidTH=”300″ HeiGHT=”400″ />
Es decir, admite que los tags y sus atributos estén escritos tanto en mayúsculas como en minúsculas. Como todo desarrollador, busco únicamente un lenguaje que me permita construir siguiendo un orden, respetando las reglas y que si tengo algún error sintáctico en mi código, alguien como él validador W3C pueda indicármelo.
Para esto XHTML, el cual es un lenguaje basado estrictamente en la semántica, es decir tags con una estructura ordenada. Es preferible la construcción de sitios web con el lenguaje XHTML o bien HTML5 a pesar de que este último, posee algunas tecnologías que pueden ser interpretadas únicamente por los últimos navegadores, de esto se encarga de indicarlo el validador W3C al momento de su validación, es decir que no podrán ser animadas y mostradas por navegadores antiguos, por ejemplo el IE7.
La versión 5 de HTML es un lenguaje que utiliza nuevas etiquetas, como por ejemplo <video> o <audio>, en la actualidad para su utilización en sitios web será necesario también la utilización de distintas validaciones para reemplazar el contenido que no puede ser visto de manera adecuada, por una solución apropiada para cada navegador.
Finalizando
Este es el primer post hacerca de desarrollo web, a pesar de que no redacte informacion especifica hacerca de cómo desarrollar sitios web a partir de un diseño PSD, Illustrator o bien GIMP (para los que quieren utilizar software libre existiran mas soluciones). Es necesario iniciar con los mas basico.
Gracias por la lectura! a este sencillo contenido.
