Cómo asegurarse de que su sitio se vea bien en todos los dispositivos

Hace solo 10 años, los webmasters no tenían que preocuparse por crear varias versiones de un sitio web para verlo en diferentes plataformas. El consumidor usaba computadoras de escritorio o portátiles en el hogar o la oficina para buscar productos, reservar vacaciones y leer las últimas noticias. Las pantallas, aunque de diferentes tamaños, presentaban información para los consumidores en los mismos patrones de diseño, y había una sensación de previsibilidad que facilitaba un poco el trabajo.

Hoy en día, los consumidores acceden a la web desde computadoras de escritorio, portátiles, teléfonos inteligentes, tabletas, lectores electrónicos y consolas de juegos. Estos dispositivos usan varias velocidades de conexión, vienen en numerosos tamaños de pantalla, diferentes resoluciones y ofrecen velocidades de procesamiento que van desde la tortuga hasta la liebre en términos de tiempo de reacción. Con los consumidores navegando por su página en una gran cantidad de dispositivos diferentes, ¿cómo puede asegurarse de que su sitio se vea bien sin importar qué dispositivo usen para interactuar con su marca?

En esta publicación, discutiremos los factores que debe tener en cuenta y ofreceremos algunos consejos útiles para guiarlo a través de la optimización de su página web para verla en múltiples dispositivos.

Cómo ver su sitio en diferentes dispositivos

Si es como la mayoría de los estadounidenses, probablemente tenga un teléfono inteligente o una tableta, o ambos. Sin embargo, es poco probable que tenga estos dispositivos equipados con todos los diferentes tamaños de pantalla, procesadores y sistemas operativos que existen actualmente en el mercado. Afortunadamente, la buena gente de HubSpot creó una herramienta que te permite ver tu sitio web en varios dispositivos sin tener que probarlo en cada dispositivo. Su Device Lab se lanzó en 2013 y le permite simplemente ingresar la URL de su sitio.

Device Lab no solo le mostrará cómo se ve su página en diferentes dispositivos y sistemas operativos, sino que también generará informes rápidos sobre el porcentaje de visitantes móviles de las distintas plataformas. Verá informes para iPhone 4/4S, iPhone 5 y iPhone 6/6 Plus, así como para dispositivos Samsung Galaxy S3/S4/S5 y las tabletas más populares de la actualidad.

Cómo crear un sitio optimizado para dispositivos móviles

Device Lab lo ayudará a ver su sitio web en varias plataformas. Verá si su página se corta en las tabletas o si requiere demasiada acción de zoom y desplazamiento por parte de los visitantes, pero no le indicará cómo realizar los cambios necesarios para desarrollar una plataforma compatible con dispositivos móviles. Desea asegurarse de que sus consumidores encuentren un sitio web atractivo que sea fácil de usar, independientemente del dispositivo desde el que accedan a su sitio.

Entrepreneur ofrece algunos puntos de partida básicos para los webmasters que buscan crear un sitio que se vea bien en cualquier dispositivo. Para empezar, debe tomarse el tiempo para revisar su sitio actual y asegurarse de que coincida con el usuario web de hoy. Más de mil millones de personas usan teléfonos inteligentes en todo el mundo y muchos los usan como punto de acceso principal a Internet.

Comience por simplificar el diseño general de su sitio. Debe considerar diseños de página más simples y tamaños de fuente más grandes para tiempos de carga más rápidos y una visualización más fácil en dispositivos móviles. El antiguo término periodístico "above the fold" es importante en el diseño web moderno. Si sus espectadores tienen que desplazarse hacia abajo en la página en un dispositivo móvil, se darán por vencidos rápidamente a favor de un sitio bien diseñado. Asegúrese de que su información crítica esté en la mitad superior de la página (lo que significa que no tiene que desplazarse para encontrarla) y use botones grandes que se puedan tocar. Marcar a tope es cosa del pasado, pero los dedos gordos conducen a presionar botones accidentalmente en los teléfonos inteligentes a diario.

Si no quieres perder el tiempo adaptando tu sitio web actual, también tienes la opción de crear un sitio móvil. El desarrollo de un sitio móvil para su negocio establece un sitio web paralelo que existe separado pero conectado a su sitio web tradicional. Los procesadores determinan si los visitantes provienen o no de computadoras de escritorio/computadoras portátiles o teléfonos inteligentes/tabletas, y los redirigen a su sitio móvil inmediatamente cuando ingresan su URL.

Sin embargo, hay compensaciones que vienen con un sitio móvil. Al construir un sitio móvil que use una segunda URL, en particular el subdominio .m, su visibilidad en los motores de búsqueda se verá afectada. Google y Bing no se encuentran en el subdominio .m y presionan a los webmasters para que usen una URL en aras de una mayor visibilidad y optimización de motores de búsqueda.

Dicho esto, su presupuesto puede obligarlo a crear un sitio móvil independiente en lugar de reconstruir su sitio principal. Un sitio móvil que es menos visible es mejor que perderse por completo la audiencia móvil. Solo asegúrese de vincular su sitio móvil a su sitio principal y podrá cerrar parte de la brecha.

La mejor opción

Por supuesto, siempre puede hacer una inversión significativa en su negocio y reconstruir un sitio que funcione en cualquier dispositivo en cualquier momento. A través de un diseño adaptable y receptivo, puede crear un sitio web que se muestre correctamente cada vez que los visitantes hagan clic en su página, independientemente del dispositivo que estén utilizando. He aquí una breve introducción a ambos conceptos:

• Diseño adaptativo: las grandes empresas invierten mucho en diseño adaptativo. Un sitio web adaptable detecta e identifica el dispositivo de cada usuario en segundos y genera una página adaptada a las capacidades de ese dispositivo específico.
• Diseño receptivo: al utilizar la tecnología de hojas de estilo en cascada (CSS), el diseño receptivo crea una versión única de su sitio web que se ajusta automáticamente para mostrarse correctamente en la mayoría de los dispositivos, con la excepción de los teléfonos celulares más antiguos. Los diseños receptivos son lo suficientemente flexibles para garantizar que su sitio se vea bien sin importar el tamaño de la pantalla o la velocidad del procesador en un dispositivo.

Hay inconvenientes en estos enfoques. El diseño adaptativo representa el pináculo del diseño de sitios web en la actualidad, pero es increíblemente costoso de implementar y mantener. El diseño receptivo es más asequible, pero no al nivel del diseño adaptativo. Aún así, en comparación con otras opciones, la capacidad de respuesta está muy por encima de la construcción de un sitio móvil simple.

Cuando considere un rediseño web, tenga en cuenta los factores que hemos mencionado en esta publicación. No importa cuál sea su presupuesto, debe reservar fondos para diseñar un sitio web que sea visible y fácil de usar en cualquier dispositivo. Hoy son los teléfonos inteligentes, las tabletas y un número creciente de televisores inteligentes. Mañana, los consumidores pueden estar viendo su página en la cocina en las puertas del refrigerador o en el baño en los espejos. Prepare su sitio web hoy para los desafíos.