La structure de base d'un site optimisé pour les smartphones
Si le Web, nous sommes habitués à nous faire plaisir avec une combinaison infinie de mise en page et l'espace, la conception de pages Web pour les téléphones intelligents nous passons en revue nos ambitions créatives, ou au moins de redimensionner la taille limitée des écrans destinées à être visualisées sur notre travail.
Remarque: la résolution vidéo varie, bien sûr, selon le modèle, la plupart des smartphones de nouvelle génération dispose d'un écran avec une largeur allant d'un minimum de 240 à un maximum de 480 pixels. La résolution la plus commune peut compter, en mode portrait, sur une largeur de 320 pixels.
Oubliez la disposition des colonnes, puis deux, trois ou quatre! De mon point de vue de la seule solution possible pour assurer la facilité d'utilisation au contenu, est la conception de la colonne unique, où tout le contenu est organisé le long d'une cascade ordre vertical (c'est à dire, l'un sous l'autre). Lorsque vous créez une page Web, souvenez-vous toujours, la chose la plus importante est d'assurer la convivialité et la bonne, d'autant plus lorsque l'affichage est limité à un smartphone, la simplicité est toujours la meilleure voie à suivre.
Comme vous pouvez le voir, notre structure est très simple et consiste d'abord de trois parties:
- En-tête: c'est la partie supérieure de la page et est conçu pour accueillir le logo du site et éventuellement quelques autres éléments du premier étage;
- Le corps de la page: il est conçu pour accueillir la partie centrale de la teneur réelle des pages de notre site Web;
- Pied de page: Ceci est la partie finale, au fond, où il est habituel de mettre tous les crédits, les références juridiques, les mentions de copyright, contacts, etc.
Le menu de navigation
La partie centrale de la page, à leur tour, seront utilisés à la maison d'autres domaines (qui varient en fonction de vos besoins).Un élément essentiel, bien sûr, est le menu de navigation à travers laquelle l'accès d'autres pages / zones du site. Si elles sont peu nombreuses (première solution) peut directement créer une barre d'outils avec des liens nécessaires, autrement - pour des raisons d'espace - il est préférable d'ajouter un bouton unique qui, lorsqu'on clique dessus, affiche une liste de toutes les pages / régions disponible (deuxième solution).
Le contenu
En outre, et surtout, pour le contenu que vous devez garder à l'esprit le petit écran de votre smartphone. Encore une fois, donc, la simplicité et la linéarité sont, à mon avis, le meilleur choix.
Éviter d'inutiles fioritures graphiques est une bonne règle de la conception web et il est encore plus dans le développement de pages Web pour les appareils mobiles et pour les questions liées à la petite taille de l'écran et pour des raisons liées à la bande passante disponible (ainsi que d'avoir un coût, La bande passante 3G n'est pas toujours rapide, donc il est préférable de se concentrer sur ce qui est essentiel).
Même pour le contenu, par conséquent, proposer une cascade où les éléments de présentation de diverses (texte, images, vidéo) dans un succèdent:
Dans la prochaine leçon nous verrons comment construire le code HTML sur notre site de départ, bien sûr, par le <head> (titre, les balises meta et CSS).
- <<Leçon précédente
- Index de l'aide
- Leçon suivante>>
 |
Front Page (ebook)
Créer des pages Web sans connaître le HTML. À seulement 25 €. |
 |
MySQL (Cours)
Gestion des bases de données open-source. A partir de 39 €. |
 |
OpenOffice (ebook)
Le logiciel open-source pour la gestion du travail de bureau. À seulement 25 €. |