Qué versión móvil. ¿Qué elegir: versión móvil o diseño adaptativo? Buscar tráfico móvil

Saludos a usted, queridos lectores, en este artículo, quiero hablar con usted sobre la versión móvil del sitio. O más bien, si la versión móvil necesita y cuáles son los profesionales de él.

¿Por qué decidí hacer un tema sobre versiones móviles de los sitios? ¡Todo es muy simple! Si comparas la asistencia de los sitios ahora e incluso dice incluso un año hace 2-3 años, había muchos usuarios que usaban teléfonos inteligentes y tabletas. ¡Y no hay tales usuarios! Por lo tanto, debe hacerse por su vida más conveniente, usted ve, la versión completa del sitio, para leer en el teléfono inteligente, no es muy amigable. Aquí hablaremos sobre esto, pero primero quiero explicar qué tipo de versión móvil del sitio.

Versión móvil del sitio. - Esta es una versión separada del sitio, que duplica el principal, pero es un corte, relativamente de escritorio y como regla general, la versión móvil se realiza en una columna, para un uso cómodo en teléfonos inteligentes sin escala. En la versión móvil, solo queda la funcionalidad más básica del sitio, y se limpia todo el menor. Por lo tanto, el usuario puede moverse fácilmente en el sitio, lea la información y reciba una respuesta a su pregunta completamente.

Como puede ver, todo es bastante simple, la versión móvil del sitio, este es un diseño especial, que será cómodo de ver en teléfonos inteligentes y tabletas. Pero estas son cosas comunes, ya que las versiones móviles del sitio aún pueden dividirse en varias opciones para su implementación, principalmente asignan 3 tipos diferentes de sitios móviles del sitio: diseño adaptativo, versión móvil separada, RESS. (Diseño sensible + lado del servidor). Consideremos cada realización por separado.

Diseño adaptativo

El diseño adaptativo, en este momento, es el más popular. Tiene muchas razones por las que hablaremos un poco más, y ahora le diré lo que es un diseño adaptativo y cuáles son sus características distintivas.

Diseño adaptativo - Esta es una de las opciones para implementar la versión móvil del sitio. La característica principal del diseño adaptativo es la ausencia de una versión separada del sitio, es decir, el diseño en sí se adapta al usuario, dada su resolución de pantalla. El diseño del diseño adaptativo se realiza gracias a CSS3, utilizando solicitudes de medios: consultas de medios. Lo más importante es que el diseño adaptativo se realiza por uno para todos los dispositivos, tanto para computadoras como para teléfonos y tabletas, es decir, no es un sitio separado.

Gracias a las solicitudes de medios, puede resolver varias tareas, que van desde la configuración de la página o el elemento, que terminan con la desconexión de elementos menos importantes para que no interfieran con la lectura del contenido en teléfonos inteligentes y tabletas. Además, para teléfonos y tabletas, puede hacer versiones diferentes, es decir, para tabletas, eliminar algunos de los bloques innecesarios, dejando lo más importante, y en el teléfono los cortan al mínimo para que no interfieran con la percepción de la percepción de contenido.

Para ser visualizado más para mostrar cómo se realiza el diseño adaptativo, le daré una pequeña pieza de código y explicaré su acción.

Pantalla @Media y (Min-Anchth: 360px) (DIV (Pantalla: Ninguna;)) Pantalla @Media y (Min-Anchth: 720px) (DIV (Pantalla: Bloque;)))

Este código dice que si la resolución del dispositivo 360px o más, entonces el bloque DIV no se mostrará si la resolución es de 720px o más, entonces el DIV mostrará cómo se mostrará el elemento de bloque. Y, por lo tanto, puede prescribir absolutamente cualquier propiedad a todos los elementos en varios permisos. Es decir, puede ser ancho, y altura, y visibilidad, y opción de posicionamiento, y en absoluto, al menos otra fuente. Pero lo más importante, cuando se utiliza las consultas de los medios, su diseño adaptativo debe tener diseño de goma. Y ahora veamos cuáles son los pros y las desventajas del diseño adaptativo del sitio.

Ventajas del diseño adaptativo, al implementar una versión móvil del sitio:

- Conveniencia y simplicidad de la creación.. El diseño adaptativo es bastante simple en el desarrollo, ya que varias versiones del sitio (escritorio (computado), tableta (opcional) y móvil) se devuelven a una tarifa. Tener un diseño listo para la página principal en HTML, debe escribir consultas de medios a menos permisos, es decir, para tabletas y teléfonos móviles.

- una dirección de un sitio. Con un diseño adaptativo, la versión móvil de su sitio tendrá la misma dirección que la versión completa del sitio, que en principio está muy bien. No necesita configurar las redirecciones, entre las diferentes versiones, y el usuario recuerde otra dirección del sitio, incluso si se le agrega simplemente m.

Desventajas del diseño adaptativo, al implementar una versión móvil del sitio:

. La carga larga está relacionada con el hecho de que el sitio es al menos que tenemos para dispositivos móviles, pero el diseño está adaptado al dispositivo, es decir, su teléfono inteligente debe cargar todos los archivos HTML y todos los CSS. Es decir, a pesar de que, el diseño más simplificado de la versión móvil, que pesa un kilobytes de lectura, debe simplificar todo, es decir, el peso total de la página será versión completa + móvil. Y si es una mala señal de la red móvil, entonces un sitio web de este tipo puede cargarse durante mucho tiempo, de acuerdo, no está bien para obligar al usuario a esperar.

- Complejidad de la edición.. La dificultad está en el hecho de que todas las versiones de su sitio están en un documento, es decir, tanto el escritorio como la tableta y el móvil. Por supuesto, si usted está bien versal en diseño, no tendrá ningún problema especial, pero sigue siendo una complejidad incrementada, en relación con una versión móvil separada.

- No hay elección de la versión del sitio.. El problema más importante del diseño adaptativo es que no tiene la oportunidad de elegir la transición a la versión de escritorio. Y resulta esta situación que si da la funcionalidad deseada del sitio, entonces el usuario móvil no podrá usarlo, solo si no comienza a subir al código fuente de la página. Pero nadie lo hará, pero solo va al competidor.

Como resultado, a pesar de todas las desventajas que tienen un diseño adaptativo, es un concepto muy popular de la implementación de la versión móvil del sitio, ya que el potencial de que tampoco es lo suficientemente malo como en un enfoque competente, algunos de los Se pueden evitar problemas.

Versión móvil separada del sitio.

Una versión móvil separada del sitio es quizás esta sea la implementación más antigua de un acceso conveniente al sitio, propietarios de teléfonos inteligentes. Ahora le diré más sobre la versión móvil del sitio.

Una versión móvil separada del sitio es la versión del sitio al que los usuarios de teléfonos inteligentes y tabletas van a la principal. Tiene una dirección separada, como regla general, este prefijo al dominio principal M. o móvil. Una versión móvil separada es un sitio web separado utilizando la base de datos principal para mostrar el mismo contenido, pero un diseño completamente diferente optimizado para dispositivos móviles. Como regla general, las características más importantes del sitio se incluyen en la versión móvil, se eliminan los usuarios que no son necesarios por los dispositivos móviles.

Si toma un diseño adaptativo, entonces nos acudió con nuevas capacidades de CSS3, y una versión separada del sitio existía mucho antes de que aparezca el diseño adaptativo. A pesar de que esta decisión es la más antigua, no pierde su popularidad. Incluso muchos recursos populares utilizan una versión móvil separada del sitio, ya que tiene una serie de ventajas que no hay un diseño adaptativo. Las versiones móviles se pueden ver en los sitios como: M.YANDEX.RU; m.vk.com; M.OK.RU y muchos otros. Es decir, puedes ver que Yandex y los grandes sociales. Las redes en Runet usan versiones móviles y no cambian al diseño adaptativo.

Ventajas de una versión móvil separada del sitio:

- Velocidad rápida del trabajo.. La velocidad se explica por el hecho de que la plantilla está optimizada para dispositivos móviles y en una versión separada, no necesita cargar diferentes "basura". Cuando se utiliza una versión separada del sitio, puede lograr una descarga rápida, incluso en una conexión mala o en red 2G. Es solo una gran ventaja para los usuarios que vienen a usted desde dispositivos móviles.

- Conveniencia del usuario. Una versión separada del sitio está muy bien pensada para lograr un alto nivel de usabilidad. No tiene "funciones de basura", que simplemente no necesitan un usuario de teléfono inteligente y toda la información necesaria a poca distancia, lo cual es muy bueno.

- Fácil edición. Al editar el código, no necesita buscar algo en el código, usted antes de que sus ojos sean el código de una versión móvil en particular y trabajará específicamente con él, sin romper el trabajo de la versión de escritorio.

- La posibilidad de cambiar la versión de escritorio.. Lo más importante, si dice que el usuario necesita una funcionalidad completa de su sitio, puede ir a la versión de escritorio sin ningún problema y aprovechar todo lo que necesita allí.

Desventajas de una versión móvil separada del sitio:

- Trabajo excesivo en SEO.. El hecho es que el sitio está en subdominios y los motores de búsqueda lo encuentran como una copia del principal. Para resolver este problema, debe usar META TAGS REL \u003d "Alternative" y REL \u003d "Canónico". Luego, el robot de búsqueda verá que esta dirección alternativa para acceder a su sitio y no se aplicarán sanciones por contenido de duplicación.

— Posibles discrepancias. Si usa dos bases de datos diferentes, entonces los sitios no pueden duplicarse completamente, lo que afectará negativamente a SEO. Además, si olvida agregar una nueva página a una versión móvil, entonces en el sitio principal se mostrará, pero no hay una versión móvil. Pero este problema es fácilmente resuelto por una base de datos común.

Como puede ver este método de implementación de la versión móvil, ventajas y contras completamente diferentes, en esto, se utilizan ambos métodos.

RESS. Diseño sensible + lado del servidor)

Este es probablemente mi tipo favorito de versión móvil del sitio. Hasta cierto punto, combina tanto el diseño adaptativo como la versión móvil del sitio. Pero este método es más complejo en la implementación, ya que no hay un conocimiento de programación más alto y no todos pueden implementarlo. Ahora te diré lo que es.

RESS (Diseño sensible + Lado del servidor) es la implementación de la versión móvil en el sitio, definiendo el dispositivo desde el cual el usuario ingresó y de acuerdo con el tipo de dispositivo, inicie la plantilla deseada correspondiente al dispositivo. Como regla general, se implementa a través de la verificación del usuario del usuario del usuario.

Como ya entendió en este método, el dispositivo se determina y después de que se carga la plantilla requerida. Ahora intentaré el ejemplo del código para mostrar cómo se implementa el RESS.

$ User \u003d Bbrowser :: DetectDevice () if ($ Device \u003d\u003d device_type_mphone) ($ shablon \u003d \\ "mobile.php \\";) de la otra manera si ($ dispositivo \u003d\u003d device_type_tablet) ($ shablon \u003d \\ "tablet.php \\" ;) Else ($ shablon \u003d \\ "desktop.php \\";) incluye ($ shablon);

Aquí, en la versión más sencilla, la implementación del lado de diseño + servidor responde se ve así. Es decir, primero detectamos el dispositivo desde el que fuimos a nuestro sitio, y luego a través de las condiciones si, si bien cambiamos las opciones posibles si desde el teléfono, salimos de Mobile.php, si desde la tableta, luego la tableta. PHP, si no es otro, luego muestra el escritorio.php. Como puede ver todo, simplemente hay varias opciones para una plantilla, para varios dispositivos y luego se muestra la deseada.

Ventajas del diseño sensible + Lado del servidor (RESS):

— Ahorro significativo de tráfico. Como en la versión móvil, el diseño se crea específicamente para un tipo de dispositivo en particular y no hay un código en exceso que pase el tráfico y disminuya la descarga. Puedes obtener una página muy pequeña de las páginas.

— Una dirección. Es conveniente que el usuario no sea necesario para ir a los subdominios, y utiliza el sitio en el dominio principal, como en el diseño adaptativo. Pero al mismo tiempo se excluyen los contras del diseño adaptativo.

— Posibilidad de cambiar entre versiones.. Cuando se utiliza el lado del servidor de diseño +, puede cambiar entre versiones entre las versiones, agregando el botón de conmutación al lugar prominente, siempre puede encender el escritorio o el diseño móvil.

Desventajas del diseño sensible + servidor (RESS):

— Dificultad muy alta en las ventas.. Cuando simplemente las solicitudes de medios son suficientes para prescribir para el diseño adaptativo, entonces no es tan simple, aquí necesita un algoritmo completo para definir dispositivos, emitiendo las versiones necesarias de diseño y cambio entre los diseños.

— El dispositivo no está definido. Hay casos en que el teléfono puede simplemente no decidir y se le dará una versión de escritorio, hasta ahora que este algoritmo aún no se ha llevado al ideal.

Al final, quiero decir que este es mi método favorito de implementar la versión móvil del sitio, pero es muy complejo y requiere mucho tiempo, pero si lo haces, lo costará. Pero no vale la pena poner la cruz y en las otras realizaciones, porque si se acerca al tema de la implementación de los precios (si usted mismo no conoce la programación), entonces el diseño adaptable será el más barato, y realiza perfectamente sus funciones y la mayoría La gente se está inclinando hacia ella. Qué método de implementación de la versión móvil del sitio para elegir, para resolverlo. Este es un trato puramente de tu gusto. Y ahora finalmente le diré por qué necesita una versión móvil del sitio.

¿Por qué necesitas una versión móvil del sitio?

Esta pregunta surge de muchos webmasters, ¿por qué hacer una versión móvil del sitio? Y todo es realmente muy simple, esto se hace para maximizar la audiencia en su segmento. Para tiendas en línea y varios negocios, generalmente pienso que se requiere la versión móvil! Para varios blogs y foros, es deseable.

Pero si considera las últimas noticias: Yandex ahora se mostrará en los problemas móviles por encima de los sitios que están adaptados a dispositivos móviles. Para ser considerado una movilidad, debe: no tener un desplazamiento horizontal y no debe ser Java y componentes de flash en la página, ya que los dispositivos móviles no pueden jugarlos. Aquí hay un ejemplo de Yandex, ya que la página Mobiliprient debería verse.

Como puede ver, el contenido debe entrar en una columna, debe ser conveniente en la lectura y todos los elementos deben tener un tamaño suficiente para que pueda presionar con el dedo. En consecuencia, ahora, sin tener una versión móvil, puede olvidarse de una parte significativa del tráfico a su sitio, porque Yandex lo llevará (pero es para dispositivos móviles), para dispositivos de escritorio, el ranking seguirá siendo el mismo.

Pero en general, si tiene una versión móvil del sitio, no importa la adaptación es un diseño, o una versión móvil separada, o en general, el lado del servidor de diseño +, será una enorme ventaja, porque no es la esencia de su implementación, lo principal: versión del sitio de movilidad. Desde sus sólidas ventajas: los usuarios de pozos, más asistencia, más señales del motor de búsqueda, más ingresos de la publicidad. Basado en las últimas noticias, mi opinión: ¡Se requiere la creación de una versión móvil!

Tengo todo en esto, espero que no esté mucho cansado de ti con mi larga publicación, le deseo éxito en la promoción.

¿Por qué necesita una versión móvil o sitio de diseño adaptativo?
Si la generación joven de empresarios no causa dudas de esta pregunta, entonces la otra parte piensa, por qué gastar dinero para ello.

Lo que se debe a la necesidad de la presencia de versiones para dispositivos móviles.

De acuerdo con los últimos datos, ¡el número de usuarios de Internet que usa dispositivos móviles para el año aumentó en un 90%! De los 80 millones de usuarios de Internet en todo el mundo, 50 millones de dispositivos móviles. En el segmento ruso, los números de tráfico móviles 25% y llegan al 40% en algunos temas.

El problema principal es que los sitios anteriores se realizaron inicialmente con la orientación sobre la resolución de los monitores de las computadoras, y cómo resultó ser un diseño tradicional para dispositivos móviles no es del todo adecuado, ya que las dimensiones de la pantalla del teléfono inteligente difieren de la diagonal de El monitor, que se debe a la inconsistencia de los gráficos y el diseño. No es absolutamente conveniente usar tales sitios de los teléfonos: texto largo, pequeño e ilegible, navegación incómoda, desplazamiento horizontal, flash y scripts de Java no funcionan. La mayoría de los visitantes están molestando a tales sitios, e inmediatamente los dejan sin cometer acciones dirigidas.

Otra razón por la que debería pensar en el desarrollo de una versión móvil: esta es la presencia de una búsqueda móvil, y si su sitio no tiene una versión móvil, entonces no cae allí. Nos informa por Google y Yandex en sus apelaciones y recomendaciones, y esto es comprensible, ya que la búsqueda de escritorio se observa un tipo de situación estable, los motores de búsqueda apresuraron su mirada al creciente mercado del mercado de búsqueda móvil. Todo esto nos impulsó a desarrollar una versión móvil gratuita para su sitio.

El propósito de los motores de búsqueda es proporcionar a las personas información relevante y útil. Los motores de búsqueda y los desarrolladores de sitios intentan esforzarse por garantizar que los visitantes de cualquier dispositivo vean de manera simple y conveniente el sitio después de cambiar de resultados de búsqueda.

Los estudios recientes muestran que aquellos que usan teléfonos inteligentes y otros dispositivos de acceso a Internet móviles se devuelven a menudo a sitios que tienen una versión móvil, así como los usuarios más a menudo realizan compras en Internet, lo que acordará muy importante. Y dado que los motores de búsqueda son seguidos por todo esto e intentan mejorar la calidad de los resultados de búsqueda, la visualización conveniente del sitio de dichos dispositivos se ha convertido en un factor que afecta la promoción del sitio web.

Soluciones de tráfico móvil

Hay 3 tecnologías para crear una versión móvil:

1. Versión móvil como un sitio separado para dispositivos móviles en el subdominio;
2. Diseño adaptativo;
3. Aplicaciones móviles para iOS, Android, Windows Phone.

Con las aplicaciones móviles, todo está claro: se desarrollan para sistemas operativos móviles, y los visitantes del sitio al ingresar al dispositivo móvil reciben una oferta para descargar, por ejemplo, como Kinopoisk.ru.

El desarrollo de dicha aplicación es la versión móvil proporcional y, a veces, más caros.
Además, muchas soluciones, esta es una interfaz reflexiva, y cualquier "chips", cuenta personal, etc.

El MINUS es el hecho de que el usuario debe fomentar e instalar la solicitud, que es un costo separado de los gastos, o un párrafo en la estrategia de marketing.
Dichas solicitudes deben mantenerse y actualizarse, protegerse contra la piratería, etc. ¿Cuál es el mismo valor de dinero?

Ahora analizaremos las diferencias en la versión móvil desde el diseño adaptativo.

Diseño adaptativo

El diseño adaptativo significa que debido a ciertos estilos del código, su sitio se adapta automáticamente al tamaño del dispositivo en el que está abierto, ya sea un monitor de PC, teléfono inteligente, tableta. Anteriormente, escribimos sobre esto en varios artículos "Cómo hacer una versión móvil del sitio" y "Uso de la etiqueta MetaPort META". Al desarrollar un sitio, los vértices conforman el sitio no bajo un tamaño determinado, por ejemplo, 800x480 px, y creará las páginas del sitio de los elementos que se ajustan automáticamente al ancho de la pantalla. Los bloques simplemente cambian su ubicación, y algunos no están mostrados en los teléfonos inteligentes. Esta opción es más adecuada para tarjetas de visita simples o blogs.

Ventajas del diseño adaptativo:

• Visualización competente de las páginas del sitio y todos sus elementos en cualquier dispositivo adaptando los estilos a los navegadores móviles;
• Cumple con los requisitos de Google para obtener mayor comodidad de visualización en dispositivos móviles;
• Conveniencia en el desarrollo, el costo es más bajo que la creación de una versión móvil;
• Una URL de la versión habitual del sitio y con un diseño adaptativo, de modo que no necesitará redirigir a los usuarios, así como, los visitantes no necesitarán memorizar una dirección separada del subdominio.
• La belleza del sitio original, que, y todo lo mismo, hermoso diseño se puede salvar y es importante.

Desventajas del diseño adaptativo:

• El peso de las páginas del sitio, porque el diseño adaptativo no hace posible reemplazar los elementos pesados \u200b\u200bde DEXTE ligeros, debido a esto, el sitio se carga durante mucho tiempo desde dispositivos móviles. Lo que es muy crítico, por lo que la velocidad de descarga debe optimizarse;
• En caso de problemas en el diseño adaptativo, el visitante del sitio no tiene la capacidad de ir a la versión habitual del sitio;
• El diseño adaptativo implica el procesamiento de todas las páginas del sitio, que puede ser incómodo si su negocio depende completamente del sitio y de su trabajo.

Versión móvil del sitio.

La versión móvil implica el desarrollo de la versión del sitio en el subdominio, por ejemplo, m.vk.com, que se redirige al visitante en el caso de usar un dispositivo móvil. Como regla general, esta versión se crea en pantallas móviles con un ancho de menos de 620px. Dicha tecnología le permite crear una mini versión del sitio con la información más importante que no está sobrecargada con contenido y elementos de diseño diferentes, y lo más importante, con grandes elementos de navegación. Adecuado para sitios simples y para tiendas en línea, diversos servicios: correo, noticias, red social.

Las ventajas de la versión móvil:

• Conveniente para el usuario, porque se simplifica enormemente en comparación con la versión habitual. La versión móvil proporciona la información de mayor prioridad, así como le permite realizar un pedido / compra con un mínimo de acción.
• Haga fácilmente cambios significativos, ya que es una versión separada y no es necesario realizar cambios en el sitio principal;
• Carga rápida de páginas, ya que todos los elementos necesarios tienen un peso menor.
• Es posible cambiar a la versión completa del sitio, en el caso de problemas móviles;

• Cumple con los requisitos de Google para una fácil visualización en dispositivos móviles.

Desventajas de la versión móvil:

• El costo del desarrollo, el desarrollo de la versión móvil es comparable a la creación de una solicitud;
• Costo de servicio, es necesario mantener la versión de la versión para diferentes dispositivos;
• Desde la parte de la información, los archivos y las capacidades del sitio tendrán que abandonar.

Como vio, ambas opciones tienen sus ventajas y desventajas, decidimos combinar lo mejor de ambas versiones. Como resultado, una versión móvil con elementos de diseño adaptativo, puede habilitar materiales del sitio principal, y se adaptará a dispositivos móviles, y creará secciones separadas disponibles solo para dispositivos móviles. Todo esto le permite configurar la versión móvil de la manera más flexible posible.

Versión móvil como regalo!

Los desarrolladores de Nubex cuidan a sus clientes y la calidad de los sitios realizados, por lo que hemos preparado una actualización completamente gratuita, gracias a la que apareció la versión móvil en cualquier persona que use nuestro diseñador de sitios. Si por alguna razón no lo necesita, puede apagarlo con un clic del mouse. Además, su configuración es absolutamente simple e intuitiva, puede configurar una versión móvil en 5-10 minutos.

Tomamos en cuenta los requisitos de los motores de búsqueda al crear una versión móvil:

• Diseño de sitio dinámico, el área de visualización debe adaptarse automáticamente al tamaño de las pantallas para que el usuario pueda evitar el desplazamiento horizontal de la página y cambiar la escala.
• Cambio automático de tamaño de fuente, para aumentar la legibilidad del texto.
• Diseño conveniente de elementos interactivos (botones, etc.), ubicada a una cierta distancia entre sí, de modo que cuando se presiona el área requerida
• Diseño adaptativo: todo debería trabajar y reflexionar sobre la tecnología de los dispositivos móviles modernos.

También tuvimos en cuenta:

• menú principal enrollado (Despliegue convenientemente y guarda lugar);
• carro, búsqueda de sitios;
• exhibición conveniente de fotos, álbumes, deslizadores y productos;
• para tiendas en línea, una forma conveniente en línea, orden desde el teléfono;
• puede habilitar o deshabilitar independientemente la visualización de diferentes bloques y secciones.

Complete la versión móvil del Sitio usted mismo, o comuníquese con nuestro servicio de atención al cliente para mejorar la calidad de su recurso web.

Con el comienzo de la era del auge de los dispositivos móviles, los desarrolladores fueron antes de elegir: para mantener las versiones móviles de sus sitios junto con "Full-Groedged", o los sitios deben adaptarse e independientemente a diferentes tamaños de pantallas?

Actualmente, al crear versiones móviles de sitios, hay 3 formas principales de construirlas:

• Diseño adaptativo;
• Versión móvil separada del sitio;
• RESS (diseño sensible + lado del servidor).

Cada método tiene sus ventajas y desventajas que intentaré describir en detalle.

Diseño adaptativo

Las consultas de medios CSS3 se usan comúnmente para implementar un diseño adaptativo. Dependiendo del tamaño de la pantalla, el usuario verá una imagen diferente:

PANTALLA @MEDIA y (MAX-ANCHO: 1600PX) (Div.For-Ejemplo (ancho: 1500px;)) Pantalla @Media y (Max-Ancho: 1280PX) (Div.For-Ejemplo (Ancho: 1100px;)) @media Pantalla y (max-ancho: 1024px) (Div.For-Ejemplo (Ancho: 980px;))

Ventajas del diseño adaptativo.

• Facilidad de desarrollo - Con un diseño adaptativo, toda la estructura del sitio se ajusta automáticamente a varios anchos de la pantalla. Para obtener un producto de trabajo, no es necesario escribir todo, desde cero, solo para corregir CSS y HTML ... teniendo en cuenta la presencia de marcos como Bootstrap, tal desarrollo no es muy complejo con la implementación estándar. Además, el apoyo a dicho producto será una tarea relativamente simple.
• Una URL - Nos elimina de redirecciones innecesarias, y necesitaba memorizar la dirección de la versión móvil (incluso si es solo una m.). Además, la presencia de una sola dirección afectará la promoción del sitio, ya que los motores de búsqueda serán "más convenientes" para trabajar.

Desventajas de diseño adaptativo.

• Diferentes tareas - Las tareas típicas de los usuarios "móviles" de los sitios grandes generalmente difieren de las tareas de los usuarios de PC. Si usted es un cliente bancario, lo más probable es que sea más probable en la versión móvil del sitio, estará interesado en una gama de información muy limitada: direcciones de los departamentos, cajeros automáticos, etc.
  En general, con un diseño adaptativo, el enfoque más común es hacer una copia del sitio habitual, para implementar las necesidades de todos los grupos de la audiencia objetivo en el diseño. Pero entonces puedes olvidarse de la usabilidad. Las secciones menores necesitadas por el cinco por ciento de los visitantes crearán inconvenientes para la mayoría de los clientes.
El "peso" de los sitios sigue siendo un obstáculo grave para los usuarios de teléfonos móviles. Esto significa que algunos sitios de escritorio típicos son elementos activos, incluidas las tarjetas, los rodillos, las calculadoras de crédito y el menú integrados con la animación en los sitios móviles deben reemplazarse con alternativas más ligeras. ¿Puede el diseño adaptativo darnos tal oportunidad? En una implementación popular, el usuario con una pantalla pequeña debe cargar la página por completo para ver solo una parte de ella. Por ejemplo, si la versión de escritorio del diseño del principal pesa 200 kb, y el móvil, otros 50 kb, deberá descargar 250 kb para ver. Por supuesto, puede usar la compresión del código de la página, pero seguirá las solicitudes innecesarias al servidor.
• Desesperanza - Una de las ventajas indiscutibles de la versión móvil: si no le gusta, se puede desactivar, vaya a un dominio regular. Los sitios con diseño adaptativo no dan esta opción simple, sino importante. Si el diseño adaptado es incómodo, se admite o si oculta un elemento de navegación importante, escribe: no puede hacer nada para verlo de nuevo. Tendremos que correr para buscar el escritorio o el sitio de la competencia. Puede idear "muletas" para evitar esta restricción (usar cookies y conectar diferentes hojas de estilo). Pero este enfoque complica el desarrollo.

En general, la idea de desarrollar una versión móvil en el diseño adaptativo es bastante popular, a pesar de las minuses anteriores. En particular, este concepto está totalmente respaldado por gigantes como, por ejemplo, Google.

Versión móvil separada del sitio.

Para hacer que un sitio sea conveniente para los usuarios móviles a menudo crea también las versiones separadas de los sitios: usuario especialmente orientado a un teléfono inteligente / tableta. La práctica más común es la redirección de los usuarios móviles a un subdominio especial (M.Example.com, Mobile.example.com, etc.). Probablemente, en el 99% de los casos, la versión móvil es una versión básica recortada, solo con ese funcional, que, según los desarrolladores, será requerido y útil para los usuarios de dispositivos móviles y tabletas.

Las ventajas de la versión móvil.

• Facilidad de cambio - Dado que el sitio existe, de facto, por separado de la versión básica, las ediciones asociadas únicamente con la versión móvil son significativamente más fáciles, ya que la versión móvil con mayor frecuencia no proporciona funcional excesiva e innecesaria.
• Fácil usuario -la versión móvil generalmente se simplifica en gran medida en comparación con la versión de escritorio, por lo que el usuario no tendrá que ir muy lejos para la información que necesitan.
• Velocidad -debido a la misma simplificación del sitio, la versión móvil se carga más rápido. Esto es esencial para los usuarios que aún caminan a través de GPRS o débiles 3G.
• Elecciónla mayoría de las veces, en la versión móvil, hay una oportunidad para cambiar a la versión principal del sitio.

Desventajas de la versión móvil.

• Varias direcciones -
• Desventaja para el usuario -para la versión de escritorio y de la versión móvil. Diferentes direcciones. Para algunos, puede ser ventajas, para otros, un factor extremadamente irritable cuando es conveniente ver el sitio, debe memorizar otra dirección. También hay problemas con los motores de búsqueda: para evitar contenido duplicado, los especialistas de SEO deben usar meta-tags rel \u003d "alternative" y rel \u003d "canónico". Además, cuando el usuario de Búsqueda de Google móvil hace clic en el exilio en los resultados, se caerá en la versión de escritorio o se redirige a Mobile. Pero si la versión móvil de esta página no existe, recibirá un mensaje de error.
• Límite - Crear un sitio móvil separado significa deshacerse del mantenimiento y la funcionalidad. Además, puede tener dos conjuntos diferentes de contenido que pueden afectar negativamente la imagen de información general.

En general, la creación de versiones móviles de los sitios se justifica bastante bien, en particular, para grandes proyectos. Como ejemplo, Amazon usa una versión especial y móvil del sitio.

RESS.

Google en sí, aunque apoya el uso de los webmasters de diseño adaptativo, pero el otro sistema utiliza en sus productos. Si va, por ejemplo, a la página principal en diferentes usuarios de usuarios, puede ver diferentes HTML para varios dispositivos. RESS - Diseño sensible + Lado del servidor. Ejemplo de implementación, bosquejado "en la rodilla":

$ Ds \u003d directory_separator; Requerir_once (DirName (__ file__). $ DS. "Bibliotecas". $ Ds. "Browser.php"); $ Dispositivo \u003d bbrowser :: detectdevice (); If ($ dispositivo \u003d\u003d device_type_mphone) ($ tmpl \u003d "template.m.php";) de la otra manera si ($ dispositivo \u003d\u003d device_type_tablet) ($ tmpl \u003d "template.t.php";) otra cosa ($ tmpl \u003d "plantilla .php ";) incluye (DirName (__ File__). $ DS." Plantillas ". $ DS. $ TMPL);

PROS RESS.

De hecho, el método puede incluir las ventajas de una versión móvil y adaptable separadas de los sitios, dependiendo de la implementación. De lo que sucederá NUEVO:

• Minimización del tráfico -JavaScript innecesario se puede eliminar de HTML, que libera la CPU, la memoria y el caché en el dispositivo móvil. También puede ser especialmente optimizado por HTML y CSS.
• Es posible usar la orientación.por ejemplo, para los dispositivos Android ofrecen descargar la aplicación de GooglePlay, y para Apple, con iTunes. Para cada dispositivo, puede hacer su propio diseño.

CONSIONES RESS.

• Dificultad en el desarrollo -un método similar requerirá la configuración adecuada del servidor y el trabajo de un número mayor de programadores. También deberá hacer varias opciones de diseño diferentes.
• Mecanismo de definición del dispositivo -desafortunadamente, incluso en nuestro tiempo aún no se ha llevado a la perfección. Historias con la forma en que el teléfono raro de alguien no determinó como un dispositivo móvil, aparece bastante a menudo.

En general, RESS es la mejor de las tres opciones propuestas, pero requiere mucho trabajo en desarrollo.

Resumen

En mi vista personal: la versión perfecta que valdría la pena usar todo, no. La mejor opción para mí es RESS. Sin embargo, esta es una de las opciones raras porque requiere grandes esfuerzos para implementar. En general, las 3 opciones tienen sus pros y sus contras, y dependiendo de la esencia y la dirección del sitio.

Vea cómo se ve el sitio en un dispositivo móvil, la forma más fácil está en su teléfono. Además, la captura de pantalla de un dispositivo tan real será la visualización más precisa del sitio en dispositivos móviles, en lugar del uso de cualquier emulador.

Si necesita verificar la versión móvil del sitio en línea en su computadora, los emuladores de dispositivos móviles vienen al rescate. Los más precisos son fondos para los desarrolladores de sistemas operativos móviles, los más populares de los cuales son Android Studio y Apple Xcode. En estos conjuntos, hay los emuladores más completos de varios dispositivos y la verificación de la versión móvil del sitio se cerrarán con mayor precisión del dispositivo móvil real. Sin embargo, para establecer fondos para los desarrolladores en una computadora regular, tomará mucho tiempo, experiencia y conocimiento para celebrar software.

Formas sencillas de comprobar la versión móvil del sitio.

En contraste con el método más complejo de verificar el sitio en dispositivos móviles discutidos en el párrafo anterior, la forma más fácil es reducir el ancho de la ventana del navegador a una columna estrecha. Si su sitio se adapta a un ancho de este tipo, entonces la versión móvil de su sitio se realiza con tecnología de diseño adaptable.

Sin embargo, este método no funciona si la versión móvil del sitio se realiza utilizando un diseño separado. En este caso, el servidor en el que se encuentra el sitio requiere una indicación clara de que el visitante vino del dispositivo móvil. Este servidor de datos recibe de la cadena del agente de usuario, es obligatorio solicitado desde su navegador que haya visitado el sitio. Por lo tanto, para ver cómo se ve el sitio en dispositivos móviles, debe "engañar" al servidor y proporcionarlo con la cadena del agente de usuario desde el teléfono, y no de la computadora.

La segunda es la opción de dificultad para verificar la versión móvil del sitio a través de la computadora, es la instalación de un navegador especial. Por ejemplo, Emulador de Opera Mobile Classic. Sus versiones existen para Windows, Mac y Linux. Desafortunadamente, este desarrollo se basa en el antiguo motor de Presto que se utiliza para la versión 12 del navegador de la Ópera, y en realidad no mostrará cómo se muestra el sitio en un moderno navegador móvil. C 2013, el navegador de la Ópera trabaja en el motor de software de parpadeo, así que verifique que el sitio móvil sea mejor para gastar en un navegador moderno. Puede ser tanto ópera como Cromo. Trabajar en el mismo motor de parpadeo basado en WebKit utilizado en Apple Safari.

Debe habilitar el modo de desarrollador especial en los navegadores especificados (F12 en Chrome o Ctrl + Shift + i en Opera) y cambiar al modo móvil móvil:

Después de eso, puede ver fácilmente cómo se ve el sitio en el dispositivo móvil.

Si la evaluación personal visual para verificar el sitio móvil no es suficiente para usted, hay programas especiales que pueden analizar el sitio desde el punto de vista del dispositivo móvil y para emitir no solo una evaluación cuantitativa de la movilidad del sitio, sino También proporcione recomendaciones para mejorar la visibilidad del sitio en los teléfonos inteligentes. En nuestro sitio, solo hay un servicio que se basa en la tecnología. Google Mobile Friendly. . Solo puede conducir la dirección de su sitio a una línea especial y haga clic en el botón "Verificar". El robot irá a la dirección especificada, tomará una imagen de la página en el formato del dispositivo móvil y le dará conclusión sobre la calidad de su sitio móvil.
Por ejemplo, eso.

Todos aquellos que no son perezosos se les dice sobre la movilidad: desde pequeñas agencias de marketing hasta Yandex y Google Giants.

En este artículo, diremos por qué la versión móvil del sitio causa tal emoción, qué requisitos para ello y si es necesario para usted.

Y inmediatamente abriré un gran secreto, después de su introducción, comenzamos a recibir más órdenes. Todo. El resto es más lejos.

¿Para qué? ¿Para qué? ¿Para qué?

Puede diseñar de manera diferente el tema de la necesidad de adaptar el sitio para dispositivos móviles.

Pero a nivel mundial hay dos buenas razones a favor de crear una versión móvil del sitio: personalizado y técnico.

Permitámonos con más detalle en cada uno. Al mismo tiempo, como de costumbre, brevemente y en el caso. Deja de agua detrás de la puerta.

Conveniencia para los usuarios

En 2016, los analistas de Statcounter notaron por primera vez que la proporción del tráfico móvil excedió la fracción del escritorio: 51.3% contra 48.7.

Esto significa que en promedio, cualquier sitio en Internet desde el teléfono se visite con más frecuencia que desde una computadora.

En Rusia, la imagen es aproximadamente la misma: la proporción de teléfonos inteligentes es más alta que la proporción de computadoras y otros dispositivos. Esto se dice por la empresa de investigación GFK RUS:

Estadísticas

Cada año, el separador está creciendo cada vez más, por ejemplo, en 2018 el crecimiento fue del 20%. Además, los analistas dicen que este no es el límite.

Esta alineación definitivamente debería hacer que piense: ¿Cómo se ve su sitio en la pantalla de teléfonos inteligentes?

Y lo más probable es que la respuesta sea mala. Cuando abre el sitio habitual no adaptado desde el teléfono móvil, la vista se convierte en la misión: debe escalar las páginas, apuntar en enlaces menores, espere una descarga larga.

Agregue a esto toda la prisa y un montón de factores de distracción, porque el teléfono no es lo mismo que la computadora cuando el visitante está completamente enfocado en el monitor.

Los usuarios no buscarán la sección deseada y comprenderán la interfaz: el sitio conveniente del competidor siempre está abierto en la siguiente pestaña.

Preferencias de motores de búsqueda

Google y Yandex se trenzarán para versiones móviles durante mucho tiempo. El primero para esto lanzó un algoritmo especial de índice de primer índice móvil, que aprecia la conveniencia de un sitio móvil y, según esto, determina su posición en la búsqueda.

El segundo algoritmo salió más tarde, pero es lo más importante en el mismo nivel. Llamado - "Vladivostok".

Hay causas indirectas que afectan la situación de la versión móvil en la búsqueda. Además de otros factores, los motores de búsqueda tienen en cuenta las características de comportamiento.

Se trata de cuánto tiempo pasan sus visitantes en el sitio, cuántas páginas se abren, cómo hace clic activamente en los botones y los interruptores.

Si el usuario va desde un teléfono móvil a un sitio de escritorio ordinario, no se quedará allí durante mucho tiempo.

Y, por lo tanto, las características de comportamiento se deteriorarán. Como resultado, usted está en las últimas páginas deshabitadas de Yandex y Google.

¿No te hemos convencido previamente? Luego, compruebe si su versión móvil necesita usted, o más bien, los visitantes de los dispositivos ingresan a su sitio.

Puede hacerlo en Google Analytics en el informe "Audiencia -\u003e Dispositivos móviles -\u003e Descripción general". Si tiene, vaya a "Informes -\u003e Tecnología -\u003e Dispositivos".

Analítica

Si ve que los teléfonos inteligentes son más del 15%, entonces para usted es una campana alarmante, solo necesita optimizar el sitio para móvil. Por lo tanto, entendemos qué métodos lo hacen en absoluto.

Importante. Esta situación no se observa en absoluto. Y en algunas áreas, el uso de la versión móvil está prohibida, sin importar lo extraño que suene.

tipos de versiones móviles

La mayoría de los sitios y tiendas en línea que conoció, use uno de los tres enfoques: diseño adaptativo, sitio móvil separado y pantalla dinámica.

Como de costumbre, para tomar la decisión correcta, debe repelirse de sus tareas y capacidades.

1. Diseño adaptativo.

Técnicamente, este es un sitio, pero la estructura de las páginas se ajusta para el tamaño del dispositivo.

En la versión simplificada, se ve así: para computadoras, abra todos los elementos del menú y construyen productos en tres columnas.

Para tabletas, solo mostramos la canasta, y los productos se colocan en dos columnas; Smartphones: oculte todo en el botón MENÚ, las mercancías tienen una para cada cadena.

Diseño adaptativo

El principal más de tal adaptabilidad del sitio es ese móvil, y la versión de escritorio es el mismo sitio.

Por lo tanto, cualquier cambio es suficiente para hacer una vez, después de lo cual la adaptación del sitio para todas las pantallas automáticamente será automáticamente.

Puede estar agregando un artículo, cambiando la clasificación, un nuevo color de los botones. Otras ventajas de Adaptive:

• Barato y simplemente: ser desarrollado relativamente y económico, incluso puede introducir adaptación a un sitio existente;
• Una dirección de una página es conveniente para los usuarios y correctamente en términos técnicos (menos envoltivos con optimización de motores de búsqueda);
• Así que recomienda Google. En la página del desarrollador hay una recomendación formal para usar un diseño adaptativo. No hay argumentos específicos allí, pero este es Google mismo.

También están disponibles las desventajas de la distribución adaptativa. Aunque en relación con otras opciones son bastante invisibles. Pero aún así, como ya se dijo, son:

• El sitio con gran funcionalidad es difícil de adaptarse para los teléfonos móviles. Será o inconveniente, o tendrá que sacrificar algunas posibilidades;
• Carga lenta. ¿Recuerdas, dijimos que el mismo sitio está cargado para computadoras y para computadoras?

  Estas son imágenes pesadas y menús largos, y el resto de la información. Para resolver el problema, algunos desarrolladores usan la compresión de las páginas, pero también requieren solicitudes adicionales al servidor y, por lo tanto, el tiempo;

• Es imposible cambiar a la versión completa. El usuario no podrá cambiar a la versión de escritorio para usar todas las posibilidades, porque el sitio en sí decide qué versión para mostrarle.

Sin embargo, el diseño adaptativo es la versión más popular de la versión móvil en Internet.

Utiliza muchos motores, diseñadores y sin embargo, tenemos en algunos.

2. Versión móvil separada

En este caso, tendrá dos sitios diferentes: todos tienen su propia dirección, diseño y capacidades. Esta es la respuesta a la pregunta: "¿Cuál es la diferencia entre la versión móvil del sitio de Adaptive?".

El sitio en sí determina el tamaño de la pantalla del visitante y decide que se mostrará la versión móvil del Sitio o Desktop.

La mayoría de las veces, es la versión móvil que comienza en referencia con la letra M (traducida como "móvil").

Versión móvil separada

Este enfoque es conveniente porque no depende de la versión de escritorio en absoluto. Puede enfocarte completamente en la comodidad de los usuarios móviles, dejar solo las funciones más básicas y tener en cuenta todas las pequeñas cosas en la usabilidad.

El diseño de la versión móvil será muy diferente del escritorio. Definitivamente, usted puede mantener al visitante disperso, que probablemente empuje en el autobús o mira al teléfono inteligente hasta que vea la cabeza.

Todos los botones y los interruptores se pueden hacer enormes para llegar a ellos para obtener un dedo.

También hay otros argumentos para crear una versión móvil del sitio por separado: la velocidad de descarga rápida, en una versión separada, las imágenes de la calidad promedio y en general, la página se corta a elementos de base.

Y también es posible ir a la versión completa del sitio si el visitante decide que no hay suficientes funciones móviles.

La justicia por el bien de la versión individual del sitio para dispositivos móviles hay desventajas:

• Diferentes direcciones del sitio en teléfonos móviles y escritorio. Esto puede crear problemas con los motores de búsqueda SEO, consulte dos sitios diferentes con el mismo contenido.

  Y posiciones más bajas para la duplicación. Para sobrevivir el problema, tendrá que conectar recursos adicionales;

• Es inconveniente sentarse con la tableta, se rompe en toda la pantalla.

  Y para la versión de escritorio, la pantalla de la tableta no será lo suficientemente más grande. Resulta que el visitante entra en un callejón sin salida;

• Cuesta más. Aunque la versión móvil y la funcionalidad limitada, pero aún así, considere que este es un sitio nuevo que debe crearse desde cero.

  Por lo tanto, para desarrollar una versión móvil del sitio, ponga un presupuesto con anticipación;

• Tiempo adicional para gestionar. Hay dos sitios, mantengan el trabajo y siguen a la relevancia y allá, y aquí.

Como puedes ver, te preocupa mucho. Pero muchas tiendas en línea grandes eligen este método, ya que cada acción incorrecta puede suspirar al cliente de hacer una compra.

Si tiene las mismas ventas "peligrosas", significa que debe prestar atención al desarrollo de los sitios de comercio electrónico.

Tienda en línea del sitio web

3. Pantalla dinámica (RESS)

Y el tercer método es la simbiosis de las dos opciones anteriores. Primero, el sitio define el dispositivo de visitante y, dependiendo del tamaño de la pantalla, se abre una versión de escritorio, móvil o tableta.

Es decir, solo la opción está cargada, que es adecuada para un dispositivo específico. Las computadoras son grandes y voluminosas, y los teléfonos inteligentes son limitados, pero ligeros. El enfoque reduce el tiempo de apertura.

La principal desventaja de RESS es larga y cara. Desarrolle un espectáculo dinámico: es como crear varios sitios diferentes desde cero.

Sí, la tecnología no es perfecta. RESS es una herramienta relativamente joven, por lo que puede suceder que el dispositivo se determine incorrectamente o no se determine en absoluto.

Google puede atribuirse a los trabajadores prominentes que usan RESS. En general, como se señaló, la tecnología no está capturada, y si tiene un presupuesto limitado o el tiempo de presentación, es mejor no arriesgarse. Y preste atención a las dos opciones anteriores.

También hay un concepto como un diseño de goma. Algunos creen que esta es una variante del sitio móvil, pero no lo es.

Importante. El diseño de goma es solo cuando el sitio también se muestra cuidadosamente en el teléfono, como en una PC. Además, completamente sin cambios.

Criterio idealidad

Ya hemos dicho que el usuario está más enfocado en la computadora sobre lo que ve en la pantalla.

Por su atención, prácticamente nada compite. Si el negocio es adecuado para un teléfono inteligente, tareas paralelas, carretera, alertas, llamadas que rodean. Esto es necesario para tener en cuenta en primer lugar al desarrollar.

Por lo tanto, independientemente del enfoque que haya elegido, debe adherirse a ciertas reglas del sitio para dispositivos móviles. Aquí están los más importantes de ellos:

1. Texto oscuro grande sobre un fondo claro. Todos los textos están mejor hechos por la fuente clásica - negro en un sustrato blanco.
2. Formas cortas. Deje una solicitud, haga una cita, haga una compra, que el usuario no se pretende que ingrese, debe solicitar un mínimo de datos que sea suficiente para el primer contacto.

   Las formas largas tienen miedo en principio de qué hablar de visitantes móviles.

3. Grandes elementos clikleables. El visitante no debe ser dirigido y atrapar los botones y los interruptores. Todos los elementos interactivos son mejores para hacer grandes, intentándose en ellos.

   Apple y Microsoft aconsejan esforzarse por tamaños 44 por 44 píxeles. El umbral mínimo es 24x24, pero es como último recurso.

4. Velocidad de descarga del sitio. No hay estándares específicos, pero siempre debes esforzarte por el ideal.

   Hay un patrón tan general, cada segundo que va a cargar la página reduce proporcionalmente la conversión en las ventas.

   Puede verificar la versión móvil del sitio en la velocidad de descarga en servicios especiales, sobre ellos un poco más bajo.

5. El tipo de formulario especificado. Al elaborar una tarea técnica, debe especificar que cuando se llene el teléfono, solo se debe mostrar el teclado digital.

   Lo mismo para contraseñas, correo electrónico y otros campos. Si desarrolla un sitio usted mismo, no sea perezoso para establecer cada forma del tipo apropiado.

6. Contactos de clickables. Como en el caso de los formularios, los datos de contacto también tienen un tipo especial de referencia.

   Haga clic en el teléfono: el conjunto de números se abre, en el correo - el programa de correo. Los usuarios definitivamente ascendrán a través de los contactos.

7. Información en una columna. No hay rollos horizontales y fotos en varias columnas en una pantalla.

   Incluso las empanadas, las insignias, tienen una pantalla más frecuente para esto. El texto en una columna es más conveniente para leer, y en las fotos grandes será posible ver todos los detalles.

Lifehak. Si simplemente necesita información completa sobre el cliente (para la entrega, por ejemplo), luego rompe el proceso de llenar la solicitud durante varios pasos.

En el primer paso, haga el nombre y el número, y la dirección y los detalles están a continuación. Incluso si el usuario es perezoso y no llenará el formulario hasta el final, tendrá contactos para ayudarlo.

Forma de captura

Revisar la movilidad

El mejor experto que le dirá, ya sea que tenga un sitio conveniente es un visitante. Pase una pequeña prueba de su versión móvil por el método de "pensamientos en rumor".

Elija entre el medio ambiente de la que sea mejor adecuada para obtener una descripción de su comprador potencial: por edad, profesión, intereses.

Pídale a un voluntario que haga un pedido, déjelo pasar por la forma completa del comprador. Simplemente no interfiera y no lo correge.

Deja que todo sea lo más realista posible, no se sentará junto a cada visitantes y explicará dónde presionar.

Cualquier dificultad y confusión, su experimento debe comentar en voz alta.

Y continúas jugando un espía: analice las acciones y marque silenciosamente la nota en el cuaderno. Solo puedes ayudar en el caso extremo, si el voluntario cayó bastante en un punto muerto.

Inspección técnica

Cuando se asegura de todos los artículos en nuestros lugares, y la interfaz es clara y predecible, vaya al lado técnico.

Omita el sitio a través de diferentes servicios para cobrar errores y comentarios. Puedes arreglarte, no, usted sabrá qué escribir en el programador de TK.

Consola de búsqueda de Google. - Servicio oficial de Google. Mostrará cómo se ve el sitio en la pantalla de tamaño mediano del teléfono inteligente y dará recomendaciones de mejora.

¿Recuerdas, hablamos sobre el algoritmo de índice de primer índice? El servicio se basa en su trabajo, así que no descuide este artículo.

Consola de búsqueda de Google.

YANDEX WEBMASTER- Servicio similar desde Yandex. Antes de verificar aquí, debe agregar un sitio al panel de WebMaster y confirme los derechos a él (descargue un archivo archivado pequeño).

Solo entonces puede usar el servicio al ir a "Herramientas -\u003e Comprobar las páginas móviles". La cosa también es útil, con recomendaciones y comentarios.

YANDEX WEBMASTER

Cheque desde la búsqueda de Bing. Sí, sí, tal motor de búsqueda también está ahí. Déjalos disfrutar de muy pocas personas, pero ahora no eres necesario.

El servicio puede ver los errores a los que los dos anteriores no prestarán atención. Bueno, como dicen, no será peor.

Cheque desde Bing Búsqueda

Inspección visual

Después de los controles técnicos, vaya a la visual. Por supuesto, puede revisar el sitio y desde su teléfono, pero sus visitantes tienen diferentes dispositivos de las insignias de pantalla panorámica a los teléfonos inteligentes presupuestarios.

Para realizar un seguimiento de todos, use los servicios para mostrar el sitio en diferentes pantallas. Aquí hay algunos de ellos:

responsinator.com - Muestra todos los dispositivos populares a la vez en una página. En total, son diez de ellos: Pixel 2 (y en general Android), iPhones y iPads.

Responsinator.com.

iloveadaptive.com: puede seleccionar qué plataformas se muestran inmediatamente, sin agitar diferentes dispositivos.

Desde bollos adicionales: en la esquina superior derecha hay indicadores básicos de la velocidad de carga de la página.

iloveadaptive.com.

quirkTools.com: solo se muestra un dispositivo al mismo tiempo, pero qué opción es. Todas las pantallas están rotas por grupos: teléfonos inteligentes modernos, teléfonos con botones, computadoras y televisores.

Desde arriba, una línea cómoda con un tamaño de pantalla en píxeles y funciones adicionales para rotación y desplazamiento.

quirktools.com

En los servicios, hay un enganche, no importa cuánto los haya probado, no se pasarán a la pantalla completa.

Debido a las diferentes plataformas, tecnologías y enfoques para el desarrollo, la imagen en el servicio y en el teléfono real puede diferir: un píxele más, un píxel menos.

En general, no afecta en gran medida a la calidad de la movilidad, pero es mejor tener en cuenta.

Por cierto. Puede encontrar exactamente qué pantalla visite visitantes en la misma métrica. Las estadísticas están en "Informes estándar -\u003e Technologies -\u003e Permisos de pantalla".

Brevemente sobre lo principal

Por lo tanto, si asume la versión móvil, primero selecciona una forma adecuada y luego asegúrese de que el desarrollador no se disperse.

Pero antes de todo esto lo hace bien. Después de todo, una cosa para que todo esté bien mostrado, y otra cosa para vender todo. Y para esto, solo la parte técnica es pequeña.

Y lo mismo, es una pena que pensaste en la versión móvil solo ahora. Tiempos, cuando dijeron que fue muy relevante ya aprobado, y llegó la revolución móvil.

Ahora, la adaptación del sitio para teléfonos inteligentes es la función predeterminada. Nuestro asesoramiento experto para usted - Dobls Doubs, y adelante.