Los dispositivos móviles cada vez más populares, mayor es el malestar que se siente cuando se desplaza la mayoría de los sitios.Es por ello que, desde 2012, el webmaster se utilizó solución que hace que la visualización de los recursos en las pantallas de baja resolución más cómodo - diseño adaptable.
tendencia actual
Hoy en día, cerca de cinco millones de personas en el mundo utilizan los teléfonos móviles, con un tercio de ellos tienen teléfonos inteligentes.Por lo tanto, el tráfico de datos móvil se está convirtiendo cada vez más importante para los propietarios del sitio.Probablemente, esa fuente de visitantes en el tiempo no hará sino aumentar.
Bots reaccionó rápidamente a esta tendencia.Las grandes corporaciones "Yandex" y Google hicieron cambios significativos en sus sitios de algoritmos de clasificación en los resultados de búsqueda, teniendo en cuenta la disponibilidad de distribución y el diseño adaptativo.En pocas palabras, los recursos basados en la web que están optimizados para los teléfonos móviles, teléfonos inteligentes y tabletas, tendrán una ventaja sobre sus competidores.Definición
de diseño adaptativo
adaptativa diseño - un método de creación de una página web esqueleto, cambie automáticamente la ubicación de los bloques de acuerdo con la resolución de la pantalla del dispositivo en el que se ve.Es decir, este enfoque crea estilos específicos para una variedad de permisos.Este efecto se consigue escribiendo un problema especial CSS-faylov.Ranshe fue resuelto de manera algo diferente.Desarrolladores tuvieron que hacer mucho más "gestos", creando vёrstku y el diseño de la versión básica del sitio y hacer lo mismo para el móvil.Dependiendo de la pantalla del dispositivo en el que ver proyecto de Internet con la plataforma móvil existente, se ejecuta la versión apropiada del sitio.
Este enfoque es en muchos sentidos ya no se justifica, y la mayoría de los webmasters no se estableció sobre la creación de una versión móvil.Ahora en lugar de dicha orden llegó diseño adaptativo.Mediante la creación de un sitio marco usando esta tecnología, el web-master concentra todos sus esfuerzos en la creación de una versión del proyecto, y los visitantes pueden tener el mismo nivel de confort para visualizarla como un ordenador de pantalla grande y un teléfono móvil, smartphone o tablet.
Ventajas del diseño adaptativo
¿Qué ventajas tiene la disposición de adaptación de los sitios?Se señaló anteriormente que la ventaja es la correcta visualización de todos los bloques de la página en cualquier dispositivo.También es un aspecto positivo de este enfoque en la creación de una plantilla que puede llamarse el ritmo de ejecución de los cambios.¿Qué significa esto?
A la presencia en el lugar de los cambios de las dos plataformas vёrstku hechas a la necesidad de poner en práctica en la primera versión de la obra, y luego - en el móvil.Si los cambios en el código eran bastante sustancial, el proceso de hacer estos cambios en gran medida podría retrasarse.Cuando el trabajo imposición de adaptación en el sitio se realiza en un solo archivo.Los cambios realizados en el diseño de la página web serán igualmente pronto aparecerá en la versión de producción, y el móvil.
La desventaja de este enfoque algunos webmasters llama la complejidad de su implementación.Sin embargo, con el advenimiento de CSS 3 para crear una plantilla de diseño adaptativo era muy simple.Ni siquiera los webmasters más experimentados pueden hacer su sitio fácil de ver en un dispositivo móvil.Principios
y características de diseño adaptativo
¿Qué principios se encuentran en la base de diseño de adaptación en el diseño web?
- El uso del diseño de tipo "goma".
- cuadro «Caucho".
- Utilizar consultas de medios de comunicación (medios-consultas).
- La necesidad de pensar de los dispositivos móviles con el inicio de la distribución.
A partir de estos principios básicos de este método de crear una plantilla, siga las siguientes características de diseño adaptativo:
1. Diseño y creación del diseño del sitio, teniendo en cuenta el trabajo en todo el espectro de los permisos: de móvil a pantalla ancha muestra.
2. Posicionamiento utilizando tecnología Hojas de estilo en cascada con preguntas de los medios, que apareció en CSS 3.
3. Programación del lado de tanto el cliente y el servidor para la transmisión a dispositivos móviles de menor volumen y la resolución de la imagen.
aspecto importante, teniendo en cuenta que ha creado un diseño adaptable - matriz de resolución dispositivos electrónicos populares.Este enfoque en el diseño hará que la navegación web en cualquier pantalla es muy cómodo.Pero, ¿cómo saber cuáles deben incluir los estilos?
dónde empezar vёrstku diseño adaptativo?
mayoría de los sitios se hacen de manera que en las pantallas de los teléfonos inteligentes y las tabletas aparecen barras que no son tan convenientes para el surf desplazarse, y el diseño y el diseño de muchos proyectos de Internet simplemente "flotador".Los sitios web creados para aprender diseño web, contiene una gran variedad de dispositivos, resoluciones de pantalla, en virtud del cual los costos componen su sitio.
diseño adaptable, ejemplos de los cuales se puede encontrar muy a menudo, tiene muchas ventajas.Lo que hay que recordar en este enfoque para crear un diseño de página?
comenzó a trabajar en una plantilla, es importante periódicamente para comprobar lo bien que el contenido que se muestra y el diseño de los bloques en diferentes pantallas.Para ello, a veces basta con cambiar el ancho de la ventana del navegador.Estilos fichero preguntas de los medios y cambia la ubicación de los bloques, haciendo cambios significativos.Una buena herramienta para probar el diseño adaptativo plantilla puede ser sitios que imitan las pantallas de los dispositivos móviles de los diferentes modelos.Estos servicios permitirán una revisión detallada y evaluar cómo se ve en el diseño muestra una variedad de dispositivos móviles.
Aunque la tecnología del diseño adaptativo no es tan simple, su desarrollo dará sus frutos muy pronto.
