Un gran reto para los diseñadores, anunciantes y creativos, es hacer que un sitio web se pueda ver en la mayor cantidad de navegadores posible.
Para ello se ha acuñado el término de web compatible, que significa que está se ve igual o por lo menos muy similar en los navegadores más reconocidos, como Explorer, Chrome, Firefox, Opera, Safari y Mozilla.
Pero además, hay que tener en cuenta que ahora se han sumado los navegadores para dispositivos móviles, que tienen otros requerimientos y posibilidades, dado el reducido tamaño de las pantallas donde se visualizan y para completar el panorama ahora han llegado las denominadas tabletas y los televisores con conexión a Internet. Todos ellos tienen resoluciones de pantalla con distintos valores.
Igualmente los navegadores que funcionan bajo sistemas operativos distintos, pueden producir limitaciones en sus funcionalidades, como bloqueo de las ventanas emergentes, limitaciones en la aplicación de JavaScript, denegación en la descarga de archivos o inconvenientes en la visualización de animaciones Flash.
De hecho uno de los principales problemas que afrontan los diseñadores e ingenieros, es que no todos los navegadores interpretan los código HTML y CSS de la misma manera, entre ellos existen pequeñas diferencias que hacen variar el resultado del sitio web o que imposibilitan su funcionamiento, en el peor de los casos.
Es por eso que a la hora de diseñar una página web empresarial no sólo es importante el nombre, la audiencia o la imagen, sino la funcionalidad, que finalmente es el aspecto más duro que califican los usuarios.
El sitio web de de una empresa o negocio en línea, requiere cuidar muchos más aspectos para brindar el mejor servicio al cliente.
Recomendaciones
Antes que nada es importante saber que para la correcta implementación de estas sugerencias, se debe tener un conocimiento adecuado del CSS, que en realidad debe ser obligatorio para cualquiera que quiera diseñar sitios web.
Procedimiento:
- Primero se debe definir la regla CSS general, que se aplicará a cualquier navegador.
- Luego se deben aplicar las excepciones (hacks), en el orden de «más general>más particular».
- Y como tercer paso recordar que impera la ley de la cascada, con lo que según se van posponiendo una tras otra, se van sobreescribiendo las directivas preexistentes.
Ahora sí veamos algunos tips:
Validación de códigos
Esto se hace en base a los estándares del W3C. Consiste en escanear la web en busca de errores de programación para una vez detectados corregirlos. Además proporciona un resumen del error, por lo que aprenderá a no volver a hacer lo mismo.
El W3C corresponde a un consorcio internacional (World Wide Consortium) quien establece los estándares y reglas que deberán aplicarse para la correcta visualización de cada página publicada.
Validar el código CSS hará que sea más fácil conseguir que el sitio se vea igual en los distintos navegadores ya que tendrá un código más limpio y sin errores.
Para validar tu CSS lo mejor es usar las herramientas disponibles, el validador de CSS del W3C es la mejor opción para ello, ya que esta entidad es la que se encarga de crear los estándares de la web.
Resetear
Muchos de los valores como títulos, márgenes, sangrías, son iguales en algunos navegadores o pero en otros no, y eso es lo que crea la mayor tasa de errores a la hora de conseguir que el sitio web se vea igual en los diferentes navegadores, ya que por mucho estilo que le de, el valor predeterminado sigue contando
Para mejorar esto se debe resetear la hoja de estilos, ya que por defecto todos los elementos HTML tienen unos atributos CSS predeterminados. Así, los márgenes, espacios y tamaños de fuente de títulos (entre otros) pueden tener diferentes propiedades por defecto de un navegador a otro y provocar que se vean diferentes.
Al resetear el CSS se puede empezar desde el principio a dar el formato que se desea, controlando el aspecto de cada elemento. Para resetear el CSS se escribe un código CSS al principio de la hoja de estilos, y después todo lo que vaya creando. El código Eric Meyer es una de las formas más conocidas para este proceso.
Uso de etiquetas
Como algunos navegadores o cortafuegos pudieran bloquear la visualización de imágenes y animaciones, se deben utilizar siempre los textos alternativos (etiquetas ALT o similares), para que por lo menos se sepa que es lo que no se está visualizando y proponer algún tipo de acceso a ese material. Además, esto favorece la indexación por parte de los motores de búsqueda.
Soporte
Se debe siempre tratar de usar las mejores prácticas en CSS y las que estén mejor soportadas ya que de esta forma se minimiza el riesgo de incompatibilidad entre navegadores.
Diseñar para el navegador más completo
Sin duda alguna que Google Chrome es uno de los navegadores más completos en cuanto a respetar los estándares web. Precisamente por eso se debe tratar de diseñar para este tipo de navegador pues lo demás casi siempre tienden a seguir los estandares del más avanzado.
Al diseñar para Chrome se está minimizando el uso de reglas indebidas, además de que el código será más limpio, más estándar y más universal.
A pesar de que el panorama es cada día más complejo por la cantidad de navegadores, dispositivos y sistemas operativos, atendiendo estas simples recomendaciones es posible desarrollar una página web apta para todos los navegadores y con un porcentaje muy alto de éxito entre los usuarios.
Por Periodista Digital, Ricardo Rodríguez
Equipo Mipagina.net
