Uno de los mejores chistes sobre ser desarrollador web es que pasas el 20% de tu tiempo codificando. Y el otro 80% busca en Internet soluciones a los problemas con los que te encuentras. Tampoco es terriblemente falso, aunque un poco hiperbólico. Gracias a herramientas como Can I Use, ese tiempo de búsqueda se puede reducir considerablemente.
Suscríbete a nuestro canal de Youtube
Con esta herramienta , la cuestión de si una tecnología en particular en su sitio web es o no compatible con navegadores específicos se presenta en un gráfico simple y fácil de leer que puede ayudarlo a tomar decisiones de diseño y desarrollo más fácilmente. Construido y mantenido principalmente por Alexis Deveria y diseñado por Lennart Schoors , CanIUse es un proyecto de código abierto al que cualquiera puede contribuir con un esfuerzo tan pequeño como aportar información a la base de datos.
Usar la herramienta es simple. Con una simple búsqueda de una propiedad, parámetro o función, caniuse.com le dirá con precisión qué navegadores y versiones admiten esa tecnología. CanIUse también te permite conocer variantes de la propiedad que estás buscando. De esa manera, sabrá qué tipos de consultas de medios, por ejemplo, son compatibles con qué navegadores.
Y en qué medida. Las tablas de compatibilidad también indican no sólo si el navegador soporta o no la tecnología, sino también hasta qué punto, en el caso de que exista compatibilidad parcial en determinadas versiones.
¿Por qué debería usar CanIUse?
Bueno, para empezar, debe usarlo si desea brindar a sus clientes, clientes y visitantes la mejor experiencia posible. Cuando intente decidir si debe usar efectos de desplazamiento, transparencias, clics de jquery o incluso cambio automático de modo oscuro.
Si construyes un sitio web con todas las campanas y silbatos que se te ocurran, creando un hermoso diseño que es más arte que una aplicación, entonces has hecho algo increíble. Pero si su grupo demográfico principal todavía usa Internet Explorer 6 ( estremecimiento ), entonces no solo se desperdiciará su tiempo de diseño y desarrollo, sino que su sitio web se romperá fundamentalmente. Es posible que los visitantes ni siquiera puedan funcionar en sus niveles más básicos.
Es cierto que la mayoría (pero no todos desafortunadamente) de sus visitantes usarán algo mucho más moderno que IE6. Sin embargo, la cantidad de navegadores diferentes en uso es enorme. Tablet, móvil y escritorio en diferentes versiones. Y bueno, vale la pena echarle un vistazo si su próximo sitio (o incluso su sitio existente) está sirviendo a los mejores intereses de su audiencia).
Cómo usar CanIUse
El flujo de trabajo para el sitio web es absurdamente sencillo, y la interfaz de usuario es tan fácil de leer como parece.
Echando un vistazo a la captura de pantalla anterior, puede ingresar cualquier tecnología que desee en el campo de búsqueda. Hemos encontrado los mejores resultados para usar la sintaxis específica que usa en su código. No es un término semántico, legible por humanos. Como en (1) , prefiere el esquema de color en lugar del cambio de modo oscuro CSS.
La descripción que da CanIUse (2) también hace que si estás investigando una tecnología, veas exactamente qué es y qué hace y cómo interactúa con el DOM .
Una de las partes más útiles de CanIUse es la pestaña Notas (3) en la parte inferior de cualquier entrada en particular. No es información técnica per se, es más un recordatorio de que puede haber algunas consideraciones que no puede ver en un gráfico de versión en color.
Cuando pasas el cursor sobre una versión particular del navegador (utilicemos el infame Internet Explorer 6 como ejemplo), aparece una ventana emergente (4) con mucha información. El uso global total de esa versión, si los desarrolladores todavía la admiten y la capacidad de probar la tecnología mediante la simulación BrowserStack . Eso último es importante. Ver cómo se procesan las funciones no compatibles puede mostrarle formas de solucionarlo.
Y, a veces, la pestaña Notas (5) también le mostrará que un tipo particular de función ha quedado obsoleta. En el ejemplo anterior, la consulta @media ha quedado obsoleta. Porque hay una consulta de modo oscuro/modo claro que funciona por sí sola.
Cómo encontrar qué navegadores usa tu audiencia
Con todo eso en mente, puede ver qué navegadores son compatibles con cualquier tecnología que desee utilizar. Pero, ¿cómo se aplica eso necesariamente a sus usuarios? Puede usar Google Analytics para investigar qué navegador y sistema operativo (SO) usan sus visitantes para asegurarse de que sea lo más compatible posible.
Primero, navegue a la sección Audiencia de la barra lateral izquierda. Luego expanda Tecnología y haga clic en Navegador y sistema operativo .
Como puede ver el desglose de los usuarios y los navegadores que utilizan para acceder a su sitio. En estos días, casi todos los sitios van a tener Chrome y Safari en la parte superior. Chrome porque es el estándar entre los usuarios de escritorio (y predeterminado en los dispositivos Android). Y Safari porque los iPhones lo usan por defecto. (Así como MacOS).
Hacer clic en un navegador (3) puede permitirle ver qué versión (versiones puntuales literales) de los navegadores se está utilizando. Si nota, hay muchas diferencias en las versiones a continuación. Desde 12.x hasta 604.x. Esa es una gran brecha. Indica que hay una diferencia en el uso del sistema operativo. Así que haga clic en Otro (4 ) y desplácese por el menú desplegable. Busque el sistema operativo .
Ordenar por sistema operativo ahora. Ahora verá cuánto de ese tráfico es móvil y cuánto es de escritorio.
Con esa información en la mano, puede volver a Caniuse.com y asegurarse de que cualquier tecnología en su sitio funcione como debería para el porcentaje más alto de sus usuarios.
Terminando con CanIUse
Así que la próxima vez que estés mirando Divi y una de nuestras nuevas funciones o leyendo un tutorial de css y encuentres algo nuevo con lo que jugar, echa un vistazo a caniuse.com . Algunos navegadores pueden tardar un tiempo en reconocer alguna tecnología. Pero si la mayoría de su audiencia proviene de navegadores que admiten funciones nuevas y divertidas, Can I Use absolutamente puede decirle si puede usarlo.
¿Cuál cree que es el mejor uso para Can I Use ?
Imagen destacada del artículo por fatmawati achmad zaenuri / shutterstock.com