Un espacio para los entusiastas del web

10 razones para usar CSS

Publicado el 8 de Agosto, 2006

Así que ya tienes tu primera web, ¿no? Eso está muy bien. Pero veo que no estás usando una hoja de estilo (CSS) en tu diseño. ¿Por qué? ¿Acaso no conoces sus ventajas? Bueno, pues yo intentaré mostrarte algunas.

A continuación te describo diez ventajas de usar Hojas de Estilo en
Cascada (Cascade Style Sheets o "CSS"):

1.- Separación del contenido y presentación.

Las hojas de estilo generalmente se encuentran en archivos separados del código principal (html, por ejemplo). Esto nos va a permitir que en un equipo de trabajo, programador y diseñador puedan realizar sus tareas de forma independiente aunque paralela, sin correr el riesgo de que haya interferencias entre ambos, y ello no alterará el resultado final.

2.- Flexibilidad.

Podríamos comparar las hojas de estilo con la ropa que guardamos en nuestros cajones. Nosotros somos los mismos, pero dependiendo de la temporada variamos nuestra apariencia.

En el caso de las hojas de estilo sucede lo mismo: podemos cambiar en cualquier momento alguna parte o la totalidad del diseño de nuestras páginas con sólo modificar nuestra hoja de estilo, sin que ello suponga modificar el contenido.

3.- Unificación del diseño de las páginas del sitio.

Un sitio web, ya sea dinámico o estático, suele estar formado por unas cuantas páginas. Mantener una misma apariencia se puede volver una tarea pesada y tediosa si tenemos que copiar y pegar código cada vez que creemos una página nueva, o que deseemos modificar una misma cosa en todas.

Enlazando a cada una de nuestras páginas nuestras hojas de estilo, agilizamos este proceso y minimizamos el trabajo.

4.- Optimización de los tiempos de carga y de tráfico en el servidor.

Al haber dividido contenido y apariencia obtenemos archivos más ligeros, y esto nos reporta dos beneficios: por un lado, reducimos notablemente los tiempos de carga del sitio en el navegador. A esto debemos unir la capacidad de éste para mantener nuestra hoja de estilo en caché.

Por otro lado, reducimos el volumen de tráfico de nuestro servidor, que siempre es de agradecer, tanto si disfrutamos de servicios gratuitos en que solemos tener cuotas muy reducidas, como si pagamos por tener alojamiento propio.

5.- Precisión o elasticidad.

Desde el momento en que usemos CSS, el tamaño y posicionamiento de los elementos que formen nuestras páginas podrá ser exacto. Podremos indicarle al navegador en qué píxel debe colocar ésta o aquélla imagen, o qué alto y ancho deberá mostrar.

Pero al mismo tiempo, podremos emplear medidas variables o relativas que nos permitan expandir el contenido hasta ocupar la totalidad de la ventana de navegación a nuestro antojo, o contraerla a sólo una parte de la misma, con independencia de la resolución de pantalla del usuario.

6.- Accesibilidad y estructuración.

La combinación de CSS y marcadores descriptivos va a posibilitar que nuestra página se vea correctamente con o sin hoja de estilos, puesto que en cualquier caso, la información se mantendrá estructurada y ordenada.

Esto supone que podrá ser accesible sin ningún tipo de problemas tanto por navegadores antiguos o sin soporte para CSS, como para personas con algún tipo discapacidad.

7.- Limpieza del código fuente.

Si escribimos una hoja de estilo independiente, el código fuente de nuestra web va a resultar menos farragoso y agilizaremos las tareas de localización de las líneas que busquemos.

8.- Compatibilidad y continuidad.

Las reglas establecidas por la especificación CSS-1 fijaron los estándares del diseño, y se mantienen y respetan en la CSS-2. Es de prever que en el nivel 3 sucederá lo mismo con respecto a su predecesor.

Pero lo realmente interesante es que los navegadores que no soporten CSS-3 no tendrán problemas a la hora de asimilar el contenido CSS puesto que siempre les quedará la compatibilidad de CSS-2, o la CSS-1 en su caso. La compatibilidad de las especificaciones CSS anteriores estará siempre garantizada.

9.- Estandarización frente a especificaciones propietarias.

La adopción de estándares por la W3C ofrece la ventaja de la compatibilidad del código entre los diferentes navegadores web. El uso de “soluciones propietarias”, como es el caso de muchas etiquetas o patrones usadas por Microsoft.

En su interpretación de lo que es y no es CSS, dificulta la creación de páginas web, porque supone tener que escribir dos códigos distintos para obtener un mismo resultado, en función del tipo de navegador que use el visitante.

El uso del estándar CSS de la W3C evitará visualizaciones incorrectas de nuestras páginas en distintos navegadores.

10.- Permite la diferenciación de estilos para imprimir / visualizar en pantalla.

El uso de CSS nos va a permitir también maquetar separadamente el contenido de nuestra web para ser mostrado en pantalla o para ser impreso.

Tengamos en cuenta que las necesidades y propiedades de un folio de papel y de un monitor nunca van a ser las mismas, y gracias a CSS podremos determinar cómo queremos que se imprima lo que mostramos en la pantalla, manteniendo siempre una apariencia limpia, ordenada y agradable visualmente.

Espero que estas pequeñas reflexiones hayan servido para animarte a dar el gran salto y vestir a tu web con un bonito traje CSS hecho a medida. Y si aún no te animas a usar CSS en tu sitio, te invitamos a conocer CSS Reinicia, una iniciativa que busca que sitios web en nuestro idioma se reinventen gracias a esta tecnología.

Otros artículos relacionados

Califica esta nota:

1 estrella2 estrellas3 estrellas4 estrellas5 estrellas (3 votos, promedio: 5.00 de 5)
Loading ... Loading ...

Comentarios

  1. Noname

    En el punto 9 pones < >

    Esta frase está vacía. Quizá deberías utilizar una hoja de estilo para escribir: sujeto, verbo y predicado. Por lo demás, está bien, sobretodo porque lo entienden los neófitos, como yo.


  2. Raúl

    Acabo de advertir el error. Contactaré con Stephanie para que añada el trocito que falta. Muchas gracias !!! :D

    // http://www.presuntoculpable.com //


  3. Álvaro

    En http://www.librodeblogs.com/caps/6/curso-de-blogs-ii-weblogs-y-estandares-web-una-pareja-explosiva.php publicaron también ventajas de los estándares web y lo relacionaban con los blogs


  4. cvander

    Muy buenos los 10 tips Raúl. Esperemos que este próximo lunes veamos una importante transición en sitios de habla hispana gracias al proyecto de CSS Reinicia. Éxitos.


  5. Adan G

    Excelente Articulo, creo que incluire un link en mi Blog a este articulo!! es muy interesante.


  6. ronald

    Buen dia a todos. yo les quiero decir que eso del css, pues por lo que ustedes dicen esta bien. pero yo no encuentro un articulo que explique claramente paso a paso como se incluye un CSS, yo cuando diseño un sitio web unicamente me voy por el diseño y en ningun momento miro el codigo html ni nada de eso. ustedes diran ahorita que estoy loco, pero asi es como he aprendido a trabajar (solo). me gustaria saber si alguien me puede ayudar y enseñarme o darme algun tutorial de css. pero hablo de uno completo no de esos que solo te dicen “usalo” pero no te dicen como usarlo. tambien es espantoso encontrar un tutorial que te empiece a dar un monton d e ventajas pero nunca te de los pasos para meter tan siquiera una linea de codigo o algo asi.
    me gustaria aprender a utilizar el css, a ver si alguien buena onda se anima a colaborar.
    gracias espero me escriban. rrronalddd—-arroba—hotmail–com


  7. Romer Blacutt Leon

    Por que no colocan cogidos para que funcionen con deiferentes navegadores??????????????????????????????????


  8. Gabriel

    Me ha gustado mucho este post.

    Soy programador web y la agencia inglesa para la que hago gran parte de mi trabajo está comenzando ahora a pedir todas las páginas hechas con estilos debido al tema de la accesibilidad.

    A ver que tal se me da hacer una web completa sólo con estilos :)

    Le pegaré un vistazo a vuestro portal.

    Un saludo.


  9. carlrob

    Me gusto como desarrolló la explicacion, y me esta ayudando mucho ya que estoy empezando y quiero aprender mucho…gracias don Raúl.


  10. maria

    muy buena tu explicación…estoy tratando de aprender un poco de css y me estoy quemando el cerebro, entonces me pregunté…valdrá la pena tanto esfuerzo? jajajajaja!!!! Tu explicación me dio la respuesta


Deja tu Comentario

Maestros del Web se reserva el derecho de moderación de los comentarios. Evita utilizar palabras soeces, ataques directos, descalificativos, insultos, de lo contrario tu comentario será eliminado.


Sobre el Autor

Raúl García Carrero

Raúl García Carrero
Webmaster, diseñador freelance, Co-director y desarrollador de cssreinicia.com.

Más artículos de Raúl García Carrero

Las Notas en tu correo


Acerca de

Maestros del Web nace cuando intentamos traducir Webmaster al Español. Nacimos orientados al diseño y desarrollo web. Hoy somos un espacio de apoyo para los entusiastas que participan en proyectos en la red.
Leer más de Maestros del Web