Les appareils mobiles de plus en plus populaires, plus l'inconfort ressenti lorsque vous faites défiler la plupart des sites.Voilà pourquoi, depuis 2012, le webmaster a été utilisé solution qui facilite la vision des ressources sur les écrans à faible résolution plus confortable - mise en page adaptative.
tendance actuelle
Aujourd'hui, environ cinq milliards de personnes dans le monde utilisent les téléphones mobiles, avec un tiers d'entre eux ont smartphones.Par conséquent, le trafic de données mobile est de plus en plus important pour les propriétaires de sites.Probablement, une telle source de visiteurs au fil du temps ne fera qu'augmenter.
Moteurs de recherche a rapidement réagi à cette tendance.Les grandes sociétés "Yandex" et Google a apporté des changements importants dans ses sites de algorithmes de classement dans les résultats de recherche, en tenant compte de la disponibilité de la mise en page et la conception adaptative.Autrement dit, les ressources basées sur le Web qui sont optimisés pour les téléphones mobiles, smartphones et tablettes, auront un avantage sur leurs concurrents.Définition
d'affichage adaptable
Adaptive mise en page - une méthode de création d'une page Web squelette, changer automatiquement l'emplacement des blocs conformément à la résolution de l'écran de l'appareil sur lequel il est affiché.Cela dit, cette approche a créé des styles spécifiques pour une variété de permissions.Cet effet est obtenu en écrivant un problème particulier CSS-faylov.Ranshe a été résolu peu différemment.Les développeurs devaient faire beaucoup plus "gestes", créant vёrstku et de concevoir la version de base du site et de faire la même chose pour le mobile.Selon l'écran de l'appareil sur lequel pour afficher projet Internet avec la plate-forme mobile existant, exécute la version appropriée du site.
Cette approche est à bien des égards plus justifiée, et la plupart des webmasters n'a pas mis sur la création d'une version mobile.Maintenant remplacer un tel ordre est venu affichage adaptable.En créant un site de cadre à l'aide de cette technologie, le web-master concentre tous ses efforts sur la création d'une version du projet, et les visiteurs peuvent avoir le même niveau de confort pour le voir comme un ordinateur grand écran et d'un téléphone mobile, smartphone ou tablette.
Avantages de mise en page adaptative
Quels avantages présente la mise en page adaptative des sites?Il a été noté précédemment que l'avantage est l'affichage correct de tous les blocs de la page sur tout périphérique.Il est également un aspect positif de cette approche dans la création d'un modèle peut être appelé le taux de mise en œuvre des changements.Qu'est-ce que cela signifie?
Au présence sur le site des changements des deux plates-formes faites à la nécessité de mettre en oeuvre dans la première version de l'œuvre, et ensuite - dans le mobile.Si des changements dans le code ont été très importantes, le processus de fabrication de ces changements pourrait grandement retardé.Lorsque le travail d'imposition adaptative sur le site est effectuée dans un seul fichier.Les modifications apportées à la présentation de la page Web seront également bientôt apparaître dans la version de production, et mobile.
L'inconvénient de cette approche certains webmasters appelé la complexité de sa mise en œuvre.Mais avec l'avènement de CSS 3 pour créer un modèle de mise en page adaptative était très simple.Pas même les webmasters les plus expérimentés peuvent rendre votre site facile à voir sur un appareil mobile.
et les caractéristiques de mise en page adaptative
Quels principes sont à la base de la mise en page adaptative dans la conception web?
- L'utilisation de "caoutchouc" type de mise en page.
- image «en caoutchouc».
- Utilisation de requêtes de médias (presse-requêtes).
- La nécessité de penser des appareils mobiles avec le lancement de la mise en page.
De ces principes de base de cette méthode de création d'un modèle de suivre les caractéristiques suivantes de mise en page adaptative:
1. Conception et création de la conception du site, en tenant compte des travaux sur l'ensemble du spectre de permis: de mobile à écran large.
2. Positionnement utilisant Cascading Style Sheets technologie avec les requêtes des médias, qui figuraient dans CSS 3.
3. Programmation sur le côté à la fois le client et le serveur pour la transmission vers des appareils mobiles de plus petit volume et la résolution d'image.
aspect important, compte tenu de qui a créé une mise en page adaptative - matrice de résolution des appareils électroniques populaires.Une telle approche dans la conception fera la navigation Web sur un écran est très confortable.Mais comment savez-vous quels sont ceux qui devraient inclure les styles?
où commencer vёrstku affichage adaptable?
La plupart des sites sont faits de telle sorte que sur les écrans des smartphones et tablettes semblent barres qui ne sont pas aussi pratique pour le surf défiler, et la conception et la présentation de plusieurs projets Internet tout simplement "float".Les sites créés pour l'apprentissage de conception de sites Web, contient une variété de différents dispositifs, les résolutions d'écran, en vertu de laquelle les coûts composent votre site.
Adaptive disposition, dont des exemples peuvent être trouvés assez souvent, présente de nombreux avantages.Ce qu'il faut retenir de cette approche pour créer une mise en page?
a commencé à travailler sur un modèle, il est important de tester périodiquement la façon dont le contenu affiché et l'agencement des blocs sur différents écrans.Pour ce faire, parfois simplement changer la largeur de la fenêtre du navigateur.Styles de fichier est questions des médias et modifie l'emplacement des blocs, apporter des changements significatifs.Un bon outil pour tester la mise en page adaptative modèle peut être des sites qui imitent les écrans des appareils mobiles de différents modèles.Ces services permettront un examen détaillé et d'évaluer à quoi il ressemble dans la conception affiche une variété de dispositifs mobiles.
Bien que la technologie de l'aménagement adaptatif est pas si simple, son développement portera ses fruits très bientôt.