A la hora de llevar a cabo páginas web, de dar salida al código HTML, es importante darse cuenta de que el cliente, el navegador, ha de procesar dicho código HTML y que esto tiene consecuencias que notará el lector de nuestra página. Antes, cuando se usaban tablas para maquetar páginas web, esto era acaso más conocido, puesto que, por ejemplo, el navegador Internet Explorer, no mostraba el contenido de una tabla hasta que la misma estuviera completamente "cargada".

Si en la celda de una tabla existía una imagen, por ejemplo, Internet Explorer no mostraba la tabla en cuestión hasta que la imagen estuviera cargada completamente. Hoy no se utilizan tablas para "maquetar" (¿cómo? ¿que todavía hay algún caso?) pero, sigue siendo necesario tener algunas cosas en cuenta a la hora de dar salida a nuestro código HTML. En esta entrada voy a hablar de una de ellas: la necesidad de incluir el estilo de una página antes de cualquier otra cosa, si puede ser.

Si usas hojas de estilo en tus páginas (que será lo más normal) y también usas código JavaScript, como pueda ser la biblioteca jQuery, pongamos por caso, sitúa en la cabecera del documento HTML, en primer lugar, las hojas de estilo, y, a continuación, el código JavaScript. No conviene hacerlo al revés, por lo que he mencionado más arriba: el navegador, que es el encargado de procesar el código HTML, podría mostrar parte o toda la página "sin estilo", precisamente, porque se encuentra cargando el código JavaScript necesario.

Como la página se muestra al usuario sin estilo, pero, sólo por un par de segundos, en el mejor de los casos, se causa una especie de "flash": el usuario verá la página sin estilo durante un segundo o dos y, luego, ¡zas!, el navegador aplica el estilo que faltaba y la página "cambia" en un momento a la vista del usuario. Todo esto se evita, como queda dicho, añadiendo antes los estilos que el código JavaScript, para que, cuando el navegador muestre la página, esta ya cuente con su estilo correspondiente, aunque quede por cargar aún su código JavaScript.