Identifier les besoins
Lors de réunions préparatoire, il faut évidemment identifier le besoin auquel répondra le site. Typiquement, notre site est un portfolio de graphiste.
On aura besoin de :
– définir les compétences de celui-ci,
– de montrer l’activité récente,
– de montrer des productions liées aux différents champs de compétence,
– permettre le contact via un formulaire,
– renvoyer vers les réseaux sociaux
Le design du site doit être en accord avec les choix esthétiques que défend notre graphiste. Ici un design simple, voire minimal, mais orienté sur le contenu et élégant.
Identifier la structure
Un site possède toujours une page d’entrée, qui est en général la page la plus complexe à construire, puisqu’elle contiendra - en plus d’un header et d’un footer - différents contenus piochés dans la base de donnée.
Typiquement : la baseline du site, quelques productions récentes mises en avant, un certain nombre de contenus liés à des catégories précises.
A partir de cette page, le menu et les différents éléments de cette page vont pointer vers des contenus spécifiques, typiquement des pages, des posts et des catégories.
Préparer les wireframes de ces différentes page sera donc la première mission.
Voici une mise en page assez simple.
On commence par une vue du template affichant un article :
Puis on réfléchit aux autres gabarits principaux : le template des catégories et la page d’entrée du site.
(L’idée ici est de proposer un premier cas d’intégration et de développement, il n’y a rien de compliqué à réaliser en Wordpress donc)
Identifier les templates
Ce site étant simple, il va demander le développement des templates de base de Wordpress que sont
– home.php : le template de la page d’entrée
– single.php : le template des articles (post)
– page.php : le template des page (typiquement une page "a propos"
– archive.php : le template par catégorie
On doit alors répondre à quelques question spécifique au web :
sur les écrans larges, comment se disposent les contenus ?
– occupent-ils tous l’espace de la page de gauche à droite ?
– limitent-ils leur taille en se centrant dans la page ?
– limitent-ils leur taille en restant sur la gauche ?
Quelques détails graphiques ou spécificité de navigation peuvent alors être pensés. Typiquement :
– un choix radical de typo ou de couleur,
– une disposition de la navigation particulière (dans l’espace, dans la manière dont elle apparait (survol, clic, etc)
– un accès aux infos particulier (au hasard, muet, ou au contraire par saturation)
– un méthode d’affichage des images (très grandes, très petites, colorisées, avec un effet d’apparition/disparition, etc)
Trop de détails nuisent à la lisibilité et rendent le site brouillon, voire compliqué à maintenir dans le temps. Tout le monde n’a pas le temps de redévelopper un site tous les 6 mois, faites des choix qui peuvent tenir un an ou deux au moins. Évitez les trucs à la mode, ils seront démodés rapidement.