Ahora más que nunca, las empresas se están centrando en crear experiencias de sitios web para móviles encantadores.

Después de todo, Google ha favorecido mucho a los sitios web compatibles con dispositivos móviles desde 2015, cuando actualizó su algoritmo de clasificación en abril de 2015 , y luego comenzó a indexando sitios móviles en marzo de 2018.

Y eso es crucial, ya que ha habido más consultas de búsqueda de Google en teléfonos inteligentes que en computadoras de escritorio y tabletas durante más de año ahora .

A partir de ahora, Google solo continuará elevando el nivel de lo que considera que es compatible con dispositivos móviles ( incluido el tiempo de carga de la página ) y reflejará eso en sus actualizaciones de algoritmo. Entonces, si no se ha centrado en mejorar su experiencia móvil es mejor que le dé prioridad ahora, o su clasificación de búsqueda realmente podría verse afectada. Además, HubSpot Research descubrió que la mitad de los consumidores de EE. UU. Se conectan a sus teléfonos más que a sus computadoras o tabletas .  Haga clic aquí para descargar un kit gratuito de 5 partes para ayudarlo a aumentar su audiencia móvil.

Para ayudar a inspirar cualquier cambio en el diseño de sitios web móviles que va a hacer, aquí hay una lista de 19

  • Los mejores sitios web para móviles
    1. Shutterfly
    2. Google Maps
    3. Typeform
    4. Etsy
    5. Adrian Zumbrunnen
    6. ] Evernote
    7. Huffington Post
    8. Express
    9. Nationwide Insurance
    10. Squaredo
    11. Zappos
    12. ABC
    13. ABC
    14. Piscis [19659] [E].

    1. Shutterfly

    Shutterfly es un servicio en línea que permite a los usuarios crear álbumes de fotos, tarjetas personalizadas y papelería, y más. Debido a que cada vez más personas toman fotos y luego acceden a ellas con sus teléfonos inteligentes, Shutterfly reconoció la necesidad de crear una excelente experiencia móvil para sus clientes, y la entregaron.

    Shutterfly logra dos objetivos clave en su sitio web móvil: [19659030] Es fácil para los usuarios encontrar información sobre sus ofertas.

  • Están vendiendo esa información a través de imágenes hermosas.
  • Cuando llegue a su sitio móvil, verá el último centro de promoción de Shutterfly, así como un gran botón de inicio de sesión para los miembros que regresan, ninguno de los cuales domina la experiencia del usuario.

     shutterfly-mobile-website

    Desplácese hacia abajo y los usuarios verán grandes botones que facilitan a los usuarios seleccionar rápidamente el tipo de producto en el que están interesados. Una vez que los usuarios hacen clic en una de esas opciones, son recibidos con fotos grandes que muestran lo que Shutterfly es capaz de navegar con facilidad. [19659002]  shutterfly-mobile-website-2

    2. Google Maps

    Todos tienen su aplicación favorita de mapas o direcciones. El mío es Google Maps, que utilizo ya sea para caminar, conducir, andar en bicicleta o tomar el transporte público. Lo especial de su sitio web móvil es que es prácticamente indistinguible de su aplicación móvil descargable.

    Las capturas de pantalla de abajo se toman de su sitio web móvil, pero si está familiarizado con la aplicación, notará que se ven exactamente lo mismo. La apariencia es idéntica, pero el sitio web móvil tiene la velocidad y la funcionalidad de la aplicación.

     google-maps-mobile-site-1.png "width =" 350 "title =" google -maps-mobile-site-1.png

     google-maps-mobile-site-2.png "width =" 350 "title =" google-maps-mobile-site-2.png

    3. Typeform

    Typeform es una empresa de tecnología con sede en Barcelona con una misión simple: "hacer que las formas sean impresionantes".

    Sin embargo, para los usuarios de dispositivos móviles, reconocieron que los componentes de diseño complejos, como el video y las animaciones, podrían afecta significativamente el tiempo de carga de la página entre otras dificultades. Es por eso que en realidad eliminaron muchos de ellos, lo que ordenó el sitio y simplificó la experiencia móvil general. El sitio web móvil es una versión más simple de su sitio web de escritorio, y aún está bellamente diseñado.

     typeform-mobile-website

    Tome nota de los botones grandes en su página de menú, perfecto para tocar con el dedo en un móvil pantalla.

     typeform-mobile-website-2

    4. Etsy

    Etsy es un sitio web de comercio electrónico donde las personas pueden comprar y vender artículos vintage o hechos a mano. La mayoría de los compradores que visitan el sitio web de Etsy están ahí para hacer una de dos cosas: o están buscando un artículo específico, o están buscando artículos en categorías que les interesan.

    El sitio web móvil está dirigido a ambos tipos de visitantes de el principio. Cuando accedes por primera vez a su sitio web móvil, te encuentras con una opción para buscar artículos, tiendas o categorías específicos.

     etsy-mobile-site-1.png "width =" 350 "title = "etsy-mobile-site-1.png

    Inmediatamente debajo de la barra de búsqueda se encuentran imágenes en miniatura de artículos de tendencias que muestran algunas de las cosas más populares que puede comprar en Etsy. Los usuarios móviles pueden ver estos elementos de tendencia en un formato de collage, y las imágenes son lo suficientemente grandes para que puedan tocarlos fácilmente con el dedo.

     etsy-mobile-site-2.png "width =" 350 "title = "etsy-mobile-site-2.png

    5. Adrian Zumbrunnen

    Este es el sitio web personal de Adrian Zumbrunnen, un diseñador de UX, escritor y orador. Cuando visite su sitio web, notará que hay algo muy particular: es un sitio web conversacional .

    Casi parece una conversación de mensaje de texto que normalmente tendría en su teléfono: – Incluyendo los puntos suspensivos para mostrar que está "escribiendo". Los usuarios reciben dos opciones de respuesta al final de cada intercambio, por lo que es como una experiencia de "elige tu propia aventura".

    Si bien la experiencia móvil y de escritorio son muy similares, el sitio web de escritorio se siente como si fuera hecho principalmente para dispositivos móviles – que podría ser la dirección en que irán los sitios en el futuro.

     adrian-zumbrunnen.gif "width =" 350 "title =" adrian-zumbrunnen.gif "style =" width: 350px

    Y si prefiere no participar en el intercambio de conversación, simplemente puede desplazarse hacia abajo para obtener más detalles.

     zumbrunnen-mobile-site.jpg "width =" 350 "title =" zumbrunnen-mobile-site.jpg "style =" width: 350px

    6. Elf on the Shelf

    Elf on the Shelf es, relativamente hablando, una tradición navideña bastante nueva basada en un libro para niños. Si no está familiarizado, la premisa básica es esta: el libro cuenta la historia de los elfos exploradores de Santa Claus, que son enviados por Papá Noel para vigilar a los niños en sus hogares de todo el mundo e informar a Papá Noel.

    Junto con el libro, los padres pueden comprar una figura de elfo, que colocarán sutilmente en algún lugar de su casa donde sus hijos puedan verla. Todas las noches antes de Navidad, los padres mueven al elfo a un lugar diferente de su casa para "demostrar" a sus hijos que los elfos exploradores son reales y que siempre los vigilan.

    Cuando llegas por primera vez al sitio web de Elf on the Shelf Verá que en realidad hay numerosos tipos de productos de Elf on the Shelf que puede comprar. Pero en lugar de obligar a los usuarios a desplazarse a través de cada producto individualmente, los diseñadores web empaquetan cada producto en un mosaico grande y atractivo que describe el objetivo del viaje de cada comprador, con el artículo destacado en la parte frontal.

    No está comprando su propio elfo o cachorro – estás adoptándolo . Es una experiencia verdaderamente enriquecedora en una pantalla tan pequeña.

     elf-on-the-shelf-mobile-website

    7. BuzzFeed

    BuzzFeed es una compañía de noticias conocida por su contenido viral y pruebas populares. También es una de mis fuentes favoritas de entretenimiento durante mi viaje hacia y desde el trabajo.

    ¿Y dónde crees que estoy revisando BuzzFeed durante mi viaje? Lo has adivinado: en mi teléfono. BuzzFeed sabe que muchos de sus visitantes visitan su sitio en dispositivos móviles, por lo que se preocuparon por crear una experiencia fluida para sus lectores en movimiento.

    Cuando llega al sitio web móvil de BuzzFeed, lo primero Verá algunas de las piezas de contenido más populares que se muestran en un formato de collage simple con imágenes grandes que son fáciles de tocar con el dedo.

     buzzfeed-mobile-site-1.png " width = "350" title = "buzzfeed-mobile-site-1.png

    Para usuarios interesados ​​en categorías específicas, hay un menú en el que se puede hacer clic en la esquina superior izquierda de la pantalla que muestra todos los mensajes.

     buzzfeed-mobile-site-2.png "width =" 350 "title =" buzzfeed-mobile-site-2.png

    8. Evernote

    Evernote es una aplicación que te permite almacenar notas, imágenes y artículos web y luego acceder a ellos en todos tus dispositivos. Debido a que los usuarios tienden a descargar la aplicación o acceder al sitio web en múltiples dispositivos, como computadoras de escritorio, teléfonos inteligentes y tabletas, es esencial que Evernote obtenga la experiencia móvil correcta.

    Si miras la página de inicio de Evernote en tu computadora de escritorio, Fíjate en lo limpio que está el diseño. Las declaraciones de valor son breves y al punto, y los gráficos se agregan al posicionamiento de la marca pero no abarrotan la página.

     evernote-mobile-website-2

    Cuando miras En el sitio web móvil de Evernote, se puede ver que han mantenido intactos su color paladar y su estilo general de marca. El sitio web móvil de la compañía es limpio, simple y no resta valor al valor de la aplicación. La ruta de conversión de Evernote es obvia a partir de la llamada a la acción centrada: "Regístrate de forma gratuita".

     evernote-mobile-website

    9. Huffington Post

    The Huffington Post es un conocido canal de noticias que informa desde todo, desde política y eventos actuales hasta entretenimiento y tecnología. Lo que hace que su sitio web móvil sea único es que en realidad modifican ligeramente los titulares de los usuarios móviles para que su contenido sea más fácil de escanear.

    Si comparas los sitios web de escritorio con los móviles, notarás que el sitio web móvil tiene menos palabras en el página principal. Los titulares son más cortos y mucho más fáciles de digerir: perfectos para alguien que hojee o lea en una pantalla pequeña.

     huffington-post-mobile-website

    Al igual que con BuzzFeed, encontrará un clic Menú en la esquina superior izquierda de la pantalla con una lista de todas las categorías de publicaciones.

     huffington-post-mobile-website-2

    10. Express

    Express es una tienda de ropa que atiende a hombres y mujeres jóvenes. Debido a que su audiencia a menudo visita su sitio web para buscar ropa, es importante que incluyan imágenes grandes y claras de su ropa, especialmente en dispositivos móviles, cuando los usuarios deberán tocar elementos en la pantalla con los dedos para hacer clic para información de compra.

    Express lleva su experiencia móvil un paso más allá que la mayoría de los sitios minoristas en línea. Si desliza el dedo de izquierda a derecha sobre una imagen que muestra una pieza de ropa, la imagen cambiará para que pueda ver la ropa en una vista diferente. En otras palabras, los usuarios no tienen que cargar otra página para ver varias imágenes del mismo artículo de ropa.

    Mire la imagen en la parte superior derecha en las siguientes dos imágenes para ver cómo cambia cuando se desliza a una. lado:

     express-mobile-website-design  express-mobile-website-design-2

    11. Nationwide Insurance

    Nationwide Insurance proporciona seguros y servicios financieros. Podría pensar que una compañía financiera tendría un sitio web realmente complicado, pero en Nationwide Insurance se queda con la simple experiencia del usuario.

    Cuando llegue al sitio móvil de Nationwide, verá dos pestañas en la parte superior que le permitirán identificar como uno de los dos tipos de usuarios para personalizar su experiencia: personal o de negocios. O, alternativamente, puede "Encontrar un agente" o "Encontrar un asesor financiero" para obtener más información sobre sus servicios.

    Aunque la limitación de la experiencia a estas dos opciones excluye las funciones más detalladas de Nationwide, hace mucho Experiencia más fácil para los visitantes que utilizan pantallas pequeñas. Esta es una gran técnica para guiar a los clientes potenciales en la dirección correcta si aún no son titulares de cuentas y visitan el sitio web por primera vez.

     nationwide-mobile-website

    12. Squaredot

    Squaredot es una agencia con sede en Dublín, Irlanda, que ayuda a los anunciantes a desarrollar sus estrategias de marketing entrante. Su sitio web para dispositivos móviles es colorido, simple y facilita la navegación.

    Lo que más me llama la atención son las combinaciones de colores visualmente agradables y la textura tridimensional en su página de inicio, así como los grandes puntos para hacer clic en el centro de en cada sección puede desplazarse a.

     squaredot-mobile-website

    Estos puntos son botones de llamada a la acción animados, y al tocar los que están debajo de la pantalla de inicio se abrirá una página emergente con más información sobre Squaredot enfoque de marketing.

     squaredot-mobile-website-2

    13. Zappos

    Zappos es un proveedor en línea de zapatos y ropa conocido por su excelente servicio al cliente. Su principal prioridad en dispositivos móviles es ayudar a los usuarios a buscar fácilmente los elementos que están buscando en su sitio web, por lo que han colocado una gran barra de búsqueda en la parte superior e inferior de su sitio web móvil para que sea más fácil para ellos.

    Así se ve la parte superior de su sitio móvil:

     zappos-mobile-site-1.png "width =" 350 "title =" zappos-mobile-site-1.png [19659041] 14. <a href= ABC

    ABC es una compañía de transmisión de televisión conocida por sus programas populares como "The Bachelorette", "The Rookie" y "General Hospital". Los usuarios que visitan el sitio web de escritorio de ABC son recibidos con estas opciones y más. Vea el programa de televisión de la red, vea a los ganadores más recientes de los premios Emmy, vea algunos de sus programas de televisión favoritos o incluso vea noticias de entretenimiento relacionadas con esos programas.

    Pero como casi todos los hogares de hoy en día son hogares con múltiples pantallas, ABC sabe que su experiencia en un dispositivo móvil debe ser simple y lista para ser vista.

    Cuando visite el sitio web de ABC en un dispositivo móvil, verá un fondo oscuro para una experiencia de teatro con azulejos para cada programa que pueda quiero transmitir Los usuarios pueden explorar estas opciones y hacer clic en cualquier programa que quieran según el género, el orden alfabético, lo que es popular y categorías similares que también encontrará en la plataforma de transmisión de su TV.

     abc-mobile-website

    15. Lean Labs

    Lean Labs es una agencia de marketing que crea soluciones web atractivas, receptivas y de alta conversión. (También se incluyeron en la exitosa serie de televisión de ABC Shark Tank .) La gente de allí hace un gran trabajo al brindar una experiencia fluida a sus usuarios móviles, especialmente con respecto a sus técnicas de diseño y el énfasis que ponen en su "fórmula 10x" – que es evidente para los visitantes a los pocos segundos de aterrizar en su sitio móvil.

    Observe cómo el sitio web móvil de Lean Labs utiliza escala, contraste y tipo de letra para distinguir ciertos elementos de su página. Incluso puede ver la foto sutil de un conjunto de montaña en el fondo del sitio web, obteniendo las alturas que su marca puede alcanzar como cliente de Lean Labs.

     lean-labs-mobile-website

    Y, como se explicó anteriormente, su fórmula "10x" es claramente visible y se divide en pasos sencillos para los usuarios móviles que se desplazan por la página de inicio, con iconos relevantes para emparejar .

     El sitio web móvil de Lean Labs con CTA circulares para conocer la fórmula 10x

    16. SAP

    SAP es una empresa de software empresarial que gestiona las operaciones comerciales y las relaciones con los clientes. El negocio mejora su experiencia móvil al condensar información, específicamente en un importante caso de estudio de video, que se puede reproducir desde la página de inicio en un dispositivo móvil.

     sap-mobile-website

    SAP también combina algunas de sus llamadas a la acción en controles deslizantes, mientras que su sitio web de escritorio tiene estos CTAs dispuestos horizontalmente. Esto ayuda a mantener las cosas simples para que los usuarios móviles no se sientan abrumados con mucha información a la vez, y también asegura que ninguno de los CTA sea demasiado pequeño para leer.

     Sitio web móvil de SAP con controles deslizantes de llamada a la acción

    17. KISSmetrics

    KISSmetrics proporciona software de análisis para empresas. En su página de inicio, hay mucha información que explica qué hace el software junto con un testimonio.

    Pero su sitio móvil se muestra de forma un poco diferente: en un dispositivo móvil, la información de su sitio se muestra en una lista con alternativas oscuras y módulos de luz. Esto facilita que los usuarios hojeen la página sin perderse en el texto.

     kissmetrics-mobile-website-2

    También hicieron el texto y los campos en sus formularios grandes y fáciles de leer:

     Sitio web móvil de KISSmetrics con grandes campos de formulario para que los usuarios inicien sesión

    18. idig Marketing

    idig Marketing es un proveedor de desarrollo y comunicaciones. Su sitio web móvil está diseñado de manera similar a su escritorio, pero me gustó especialmente la forma en que incorporaron los iconos del corazón interactivos en sus publicaciones del blog para que los usuarios puedan "Me gusta" en sus publicaciones.

    Esto imita el icono del corazón "Me gusta" en Instagram y Twitter, que es fácilmente reconocible para los usuarios móviles familiarizados con esas plataformas.

     idig-marketing-mobile-site-2.jpg "width =" 350 "title =" idig-marketing-mobile-site-2.jpg "style = "ancho: 350 px

    19. IndiaMART

    IndiaMART es el mercado B2B en línea más grande de la India, y su tienda móvil simple basada en categorías lo convierte en uno de los mejores sitios web móviles que hemos visto en la industria del comercio electrónico.

    Página de inicio móvil de la compañía coloca la barra de búsqueda en la parte superior para que siempre puedas retirarte a una búsqueda personalizada si la navegación ya no es suficiente para encontrar el elemento que estás buscando.

    Sin embargo, IndiaMART facilita la lectura de sus pasillos digitales clasificando cada elemento por tipo de elemento, y luego subtipos dentro de cada tipo de elemento: un movimiento de diseño inteligente para alentar a los usuarios a explorar más su sitio. En "Ropa y prendas de vestir", por ejemplo, tiene fichas fáciles de hacer clic para ver categorías de ropa más específicas, como ropa de caballero, vestidos de mujer e incluso trajes, saris y prendas similares nativas de la India.

     indiamart-mobile -website

    Debajo de los mosaicos de navegación de IndiaMART, la compañía tiene su propia sección de tendencias específicamente para mercancías a las que la gente presta atención, similar a una lista de noticias de tendencias en una plataforma de medios sociales. Cada categoría de tendencias tiene un botón de llamada a la acción para dispositivos móviles que permite a los usuarios obtener cotizaciones de precios para el producto que les interesa.

     indiamart-mobile-website-2

    ¿Desea más información sobre cómo optimizar su ¿Negocio para dispositivos móviles? Descargue el kit gratuito sobre marketing móvil a continuación.

     Nueva llamada a la acción



    Source link