Prefijos CSS para Navegadores - Empezar con CSS3

Los prefijos CSS para navegadores son técnicamente llamados “Extensiones propietarias”, estas extensiones o prefijos son usados por los desarrolladores para probar propiedades que en teoría estarán disponibles en la próxima versión del estándar de CSS, aunque esto no siempre es así no deja de ser útil para familiarizarse con funciones nuevas que podrían ser implementadas. También permiten encontrar “bugs” que pueda haber en estas funcionalidades y así sean corregidos antes del lanzamiento de la nueva versión.

También hay que tener en cuenta que usar estos prefijos no daña en absoluto la validez de nuestra hoja de estilos, el problema que puede presentar es que al implementarlos se debe hacer para un conjunto de navegadores y por tanto se implementan varias veces las mismas propiedades, esto puede llevar a que el peso de nuestra hoja de estilos aumente un poco. Un ejemplo:

Como veis utilizamos la misma propiedad varias veces con sus respectivos prefijos para que funcione en todos los navegadores, la propiedad transition en particular ya es soportada por la mayoría de los navegadores actuales. También habéis visto que al repetir las propiedades varias veces aumenta el peso de nuestra hoja de estilos, esto no significa que no esté bien usarlos sino que hay que usarlos con cabeza para que no entorpezcan la carga de nuestra página.

Estas serían las extensiones propietarias o prefijos:

-khtml-	KDE e.V.	Konqueror
-moz-	Mozilla Foundation	Firefox, Flock, K-Meleon, Camino, Galeon y otros.
-ms-	Microsoft	Internet Explorer
-o-, -xv-	Opera Software	Opera
-wap-	Open Mobile Alliance	Opera Mini, Opera Mobile y otros.
-webkit-	Apple	Safari, Google Chrome y otros.

Una advertencia: aunque los diversos navegadores que incorporan el mismo motor puedan interpretar el prefijo correspondiente, eso no significa que soporten todas las propiedades existentes para tal prefijo. Por ejemplo, las versiones 2.0 y anteriores de Chrome no interpretan -webkit-border-radius como lo hacen Safari 3.1 y posteriores.

Fuente de esta tabla: 
http://digitalicon.es/blog/extensiones-propietarias-de-css/

Aún ofreciendo las ventajas mencionadas, los navegadores más viejos muchas veces no son capaces de interpretar todas las propiedades que se indican con estos prefijos, pero bueno, para eso estarán los próximos cursos sobre javascript para poder hacer cosas que sean compatibles en todos los navegadores, aunque como siempre en internet explorer habrá que realizar algún arreglo, apaño o como lo quiera llamar Microsoft, pero lo que si es cierto es que va siendo hora de que este navegador espabile, porque esta muy atrasado.

Volviendo al tema, la idea con la que nos tenemos que quedar es que las extensiones propietarias son un campo de pruebas, como cuando en un videojuego tienen un modo de prácticas antes de empezar con la partida para aprender como manejar al personaje, la diferencia es que aquí se manejan propiedades y no personajes, aún así el concepto es muy parecido. En el futuro muchas de esas propiedades las interpretarán los navegadores por si solos y debemos saber usarlas para entonces.

En algunos casos los desarrolladores pueden proponer propiedades que se implementen de forma “experimental” mediante el uso de estos prefijos, lo que ayuda a mejorar el lenguaje en base a las necesidades de los programadores que lo usan, obviamente esto no suele poder proponerlo cualquiera, generalmente son programadores muy cercanos al entorno de desarrollo del estandar.

Espero que la información os haya sido útil, os pido que me dejéis un comentario con vuestra opinión o en agradecimiento por la información y si tenéis amigos de esos a los que les mola este tema de la programación se lo podéis pasar por twitter, facebook... 

Sigueme en twitter: @Charlie_IF 

Más Sobre Programación:

 Empezar con HTML5:
 http://informaticayfinanzas.blogspot.com/2014/01/empezar-con-html5-etiqueta-header-nav-y.html

Formulario de Contacto en HTML5 y CSS3:
http://informaticayfinanzas.blogspot.com/2014/01/como-hacer-un-formulario-de-contacto.html