Como hacer que tu pagina “sea bonita” en todos los navegadores

Hoy en dia el estandar CSS ha hecho sitios muuuuy bonitos, hermosos y que no necesitan de inclusiones de flash para que tengamos cosas hermosas. ahora tenemos CSS3 el cual nos permite hacer demasiadas cosas como transiciones, animaciones, sombras que hacen que nuestra web sea hermosa y no necesitemos otra cosa.

Pero… cabe decir que esto tiene un lado oscuro. el cual si no sabemos llevar nuestro sitio por ese camino, podemos llegar a hacer grandes desastres como los que vemos en la pagina hedionda del dia.

algunos consejos que nos pueden ser utiles son los siguientes:

  • Usar Normalize.css: este grandioso CSS nos ayuda a que cuando nuestro navegador(sin importar cual sea) interprete nuestra web, este no haga que nuestra bonita pagina se vea diferente. A que me refiero, te explico. cada navegador asigna estilos por defecto a todas las etiquetas de html y si nosotros queremos estilizar nuestro website tenemos que usar las llamadas hojas de estilo para cambiar esas propiedades por defecto y darle una vista bonita, personal y unica. ¿donde esta el problema? esta en que estos estilos por defecto no son los mismos en todos los navegadores ya que cada navegador da los tamaños que el quiere a sus etiquetas (titulos, parrafos, span, etc). la salvacion a esto se llama Normalize.css. Lo que hace esta hoja de estilos es acabar con esos estilos por defecto y agregar estilos predefinidos a nuestro sitio web y combinados con nuestra hoja de estilos hara que en cualquier navegador los estilos no cambien y se vean GENIALES. justo como los quisiste hacer.
  • usar un prepocesador de CSS: siendo sinceros escribir un CSS para un gran sitio es muy dificil. y mas aun hoy en dia que tenemos que repetir ciertos patrones en los estilos de nuestras etiquetas. para esto tenemos los fabulosos preprocesadores de css que nos brindan de la posibilidad de “programar” nuestro CSS a un formato diferente y compilarlo a un archivito CSS. entre los conocidos estan LESS, SASS, COMPASS y STYLUS que te dan la opcion de codificar tus hojas de estilo como si estuvieras programando y usar variables y funciones para una vez que acabes tu tan solo compiles y se genere el css que te dara estilos a tu web.
  • Usar librerias para los prefijos: cuando css3 fue implementado por los navegadores no se pusieron de acuerdo y agregaron cada quien su prefijo para estas etiquetas. pero…¿que es un prefijo? veras, un prefijo es una palabra que incluyes antes de la propiedad que quieres usar como por ejemplo estan los siguientes prefijos. Es buena opcion usar autoprefixer que nos ayuda a resolver ese problema agregando los prefijos a propiedades que lo necesiten y de esta manera no quebrarnos la cabeza.

Estas cositas magicas te ayudaran demasiado… creeme D: … te doy las gracias por leerme y tomar mis consejos, comenta y sigueme en mis perfiles. si necesitas ayuda, preguntame.

Anuncios

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s