Dans la phase de conception il est important de déterminer le nombre et le type de gabarits à concevoir, en général le nombre de gabarits peut s’élever entre 10 et 15.
1 – Page d’accueil (home page principale ou de rubrique)
Cette page est l’une des plus importantes car elle doit accueillir et accompagner l’utilisateur. Elle doit être efficace et présenter clairement les objectifs, la raison d’être du site et les principaux contenus à jour, blocs de rebonds, etc.
2 – Page structurée
Ce type de mise en page permet de hiérarchiser l’information en fonction des besoins des utilisateurs et des objectifs du site. Ce format est de nos jours le plus répandu pour les pages d’accueil et de rubrique.
3 – Page en mosaïque
Les pages en mosaïque présentent l’ensemble des sous-rubriques de façon exhaustive, avec ou sans mise en avant de rubriques principales. La page présente l’ensemble des contenus disponibles.
4 – Pages de listes
Les pages de listes orientent les utilisateurs parmi un choix de sous-rubriques mais aussi pour présenter le panorama des contenus présents au sein d’une même rubrique. Selon la nature du site et des contenus, les listes pourront se présenter de façon plus ou moins visuelle et informative.
5 – Liste en vignettes
Une liste sous forme de vignettes facilite la reconnaissance visuelle d’images, logos ou pictogrammes. Ce type de liste est adapté aux utilisateurs qui ne recherchent pas quelque chose par son nom (texte), mais plutôt par son apparence (visuelle). Ils cherchent de l’inspiration, des idées. On trouve ce type de liste sur les sites e-commerce.
6 – Liste fluide
Cette approche permet de facilement intégrer des listes en responsive web design, en ajustant le nombre de colonnes affichées côte à côte selon le support de consultation (exemple, sur ordinateur, la liste sera présentée en 4 colonnes, sur 2 colonnes sur tablette, et sur une seule colonne sur mobile). Les listes fluides sont fortement influencées par le réseau social Pinterest. Cela permet d’être plus flexible et de mélanger de façon homogène des entrées avec ou sans visuel, avec ou sans description, avec un titre plus ou moins long…
7 – Liste sous forme de tableau
Les tableaux sont souvent une contrainte en responsive design. En effet, si la quantité d’informations dans chaque entrée de liste est dense, si le nombre de colonnes et de longueur des contenus est trop important, le tableau ne sera pas lisible en responsive design.
Cette approche est jugée moins attractive que les listes classiques. Pour faciliter la lecture d’un tableau, le format des cellules dépend de leur contenu. Un texte, libellé doit être aligné à gauche pour faciliter la lecture à l’écran. Des informations normées, de longueur fixe, comme les dates, numéros clients, numéros de téléphones doivent être centrées.
8 – Page historique / timeline
La page Timeline (navigation horizontale et /ou verticale) peut être utilisée pour guider les utilisateurs parmi des contenus de type institutionnel de sous-rubrique niveau 1 puis de découvrir des contenus en profondeur de site (N-3). Selon la nature du site et des contenus, les dates pourront se présenter de façon plus ou moins visuelle et informative.
9 – Page formulaire
Il est important de définir si le formulaire est simple, complexe, long, court, en étapes.
