Archivo de la etiqueta: html

La etiqueta DOCTYPE

La etiqueta DOCTYPE es la primera que aparece en cualquier documento HTML. Su función es la de informar al navegador sobre el tipo de documento que va a cargar así como de informar sobre la codificación de caracteres. Además ésta etiqueta es fundamental si queremos que nuestro fichero HTML sea validado.

HTML 4

El lenguaje HTML, en sus distintas versiones, ha ido evolucionando En la versión de HTML 4 aparecieron 3 variantes de DOCTYPE para indicar caracteristicas especiales para los documentos o atributos que aceptan:

  • Strict: En la que la permisividad es inexistente. Deberemos utilizar únicamente etiquetas de la versión 4 de HTML.
  • Transitional: En la que se permite el uso de etiquetas html mas antiguas.
  • Frameset: Opción que deberemos añadir si estamos utilizando marcos en nuestra página

<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”>

<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>

<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Frameset//EN” “http://www.w3.org/TR/html4/frameset.dtd”>

HTML 5

En cambio con la revolución que ha supuesto la llegada de HTML 5, la etiqueta DOCTYPE ha sido reducida a la mínima expresión.

<!DOCTYPE html>

Como se aprecia no hay ninguna referencia ni al lenguaje ni a la permisividad. Los desarrolladores han llegado a la conclusión de que con la continua evolución tanto de la web como de los navegadores, es preferible que sean éstos últimos quienes se ocupen de detectar las especificaciones y que actúen en consecuencia. Además, el navegador cargará lo que ‘entienda’ y lo que no, lo obviará.

Entonces, ¿por qué en la nueva revisión no se ha eliminado la etiqueta DOCTYPE? Pues en primer lugar, por razones históricas, ya que aun existen navegadores que visualizan la página de acuerdo a lo especificado (una etiqueta DOCTYPE sin más, indica que utilizamos el modo estricto). En segundo lugar,  porque así ayudamos a los robots de los motores de búsqueda a identificar y codificar correctamente nuestra página.

Facebooktwittergoogle_plus

Comprobar si las etiquetas son compatibles con cierto navegador

Como saber si el código que hemos creado para nuestra web es compatible con cierto navegador. Desde la web caniuse.com nos permiten comprobar para cada etiqueta, ya sea HTML5, CSS3, JS o SVG, en que navegadores está soportada e incluso en que versión de éstos.

La web muestra un listado de las etiquetas y pulsando sobre cada una de ellas, veremos una amplia tabla de navegadores con sus respectivas versiones. También se nos muestra un porcentaje de soporte, tanto parcial como total.

Sin duda una web a tener en cuenta para comprobar las etiquetas antes de aplicarlas a nuestra web.

Facebooktwittergoogle_plus

Crear degradados mediante CSS

En los navegadores Webkit como Safari o Chrome, existe una propiedad CSS para crear degradados. Esta propiedad también ha sido agregada a Firefox, el problema es que no es estándar, y hay que especificar los parámetros correctos para cada navegador. Si queremos que nuestra web tenga, por ejemplo, un fondo degradado de gris a blanco y de arriba a abajo, escribiremos en la hoja de estilos, dentro de la etiqueta body lo siguiente :

          background-image: -moz-linear-gradient(top, #666, #fff);
          background-image: -webkit-gradient(linear, left top,left bottom, from(#666), to(#fff));
          background-image: linear-gradient(top, #666, #fff);

Deberemos indicar en el caso de Mozilla el punto de partida en este caso top, el color de inicio y el color de fin. Para el caso de navegadores webkit, indicaremos el tipo de degradado (en este caso lineal), el punto de origen y el punto de destino, el color de inicio y el color de fin. Añadiremos también la especificación W3C, aunque como hemos comentado anteriormente, no es todavía estándar.

Facebooktwittergoogle_plus