2. 1. Architecture
■ Importance de l’arborescence
– Ranger les éléments par thématiques
– Assurer une ergonomie
– Faciliter la navigation
■ Définir titres / sous titres / menu / header / footer
■ Définir les mots clés pour le référencement
■ Organisation des informations
www.julietonna.fr
3. 2. Organisation visuelle
■ Etablir de gros blocs identifiables
■ Limiter la surcharge visuelle et les distractions
– L’animation complique la mémorisation
– Mettre les informations essentielles
■ Définir une charte graphiqueclaire et cohérente avec l’activité de l’entreprise
– Logo
– Typographie
– Palette de couleurs
– Style et thématique du site
www.julietonna.fr
4. 3. Cohérence
■ Garder des repères tout au long de la navigation sur le site
– Barres de navigation
– Menu
– Contact doit être facilement accessible
■ Utiliser un vocabulaire qui n’est pas trop spécifique
– Mots clés de l’activité
– Langage simple et compréhensible par tous
■ Ergonomie ne doit pas brider la créativité
– Adapter ses visuels au domaine d’activité
– Rester créatif et original pour se démarquer
■ Homogénéité au niveau du design sur tous les supports
www.julietonna.fr
5. 4. Crédibilité
■ Importance du contenu : s’inspirer d’autres sites (concurrents ou non)
– Arborescence, organisation des informations
■ Se fier aux différents expériences utilisateurs générale disponible sur Internet
■ S’inspirer des concurrents
– Ne pas copier, juste s’inspirer
– Veille concurrentielle
– S’informer sur les stratégies employés, les tons et thématiques mises en avant
■ A ne pas oublier : on préfère ce que l’on connaît !
– Pas d’incohérence
– Suivre les conventions, ce qui se fait sur le marché (ex : flat design, site responsive…)
www.julietonna.fr
6. 5. Information
■ Information ponctuelle et contextuelle sur l’entreprise
– Les services qu’elle propose
– Son activité
– Ses compétences
– Les anciens clients (témoignages)
■ Accessible à tout moment à l’internaute
– Faciliter l’accès à l’information
– Encore une fois : bien organiser l’information
– Faire appel à un concepteur / rédacteur web?
www.julietonna.fr
7. 6. Compréhension
■ Choix du vocabulaireet des symboles : importance pour le référencement
– Utilisation de mots clés
– Se renseigner sur les balises
– Rester attentif sur les indicateurs de Google Analytics
■ Préférer les verbes aux adjectifs
– Simplifier les phrases
– Le message doit être clair
■ Les icônes ne suffisent pas, bien choisir ses mots
– Pas trop d’icônes (même si cela se fait beaucoup)
– Mettre des mots sur les activités pour plus de compréhension
www.julietonna.fr
8. 7. Assistance
■ Guider l’internaute explicitement tout au long de la navigation
– Avec des mots et pas des symboles
■ Guider l’internaute implicitement
– Organisation visuelle (flèches, bannières, menu…)
– Formats adaptés au site
– Comportement des objets (animations, site responsive?)
■ Fonctionnalités qui aident le visiteur
– FAQ
– Nous trouver / plan
– Contact
www.julietonna.fr
9. 8. Rapidité
■ Faciliter les clics et les interactions
– Trouver l’information rapidement
■ Loi de Fitts
– Ne pas recourir à la mémoire
– Ne pas demander à l’utilisateur de faire des choses plusieurs fois (redondance)
– Mettre des raccourcis pour aller plus vite (icônes, liens cliquables, photos
montages…)
www.julietonna.fr
10. 9. Liberté
■ On ne doit pas lui imposer des choses
– Exemple : inscription sur le site pour accéder aux contenus
– Inscription à la newsletter qui serait facultatif
■ Respecter les contrôles utilisateurs de base
– Selon les services proposés
■ L’internautedoit être actif
– Ne pas imposer des publicités
– Ne pas imposer des vidéos sans pouvoir les fermer
www.julietonna.fr
11. 10. Accessibilité et satisfaction
■ Accessibilité physique, visuelle et technologique
– Toutes les informations doivent être accessibles sur le site
– Représente l’image de l’entreprise sur Internet
■ Référencement
– Importance des mots clés
– Résultats Google
■ Satisfaction de l’internaute
– Micro-fonctionnalités sur mesure qui démarquent le site
– Attribuer une importance à l’esthétique et l’expérience utilisateur globale >
mémorisable et expérience positive
www.julietonna.fr
12. 11. Tendances 2016
■ Flat design
■ Couleurs franches
– Gris, blanc
– Grilles structurées
■ Images en vidéos en plein écran pour l’accueil
■ Importance de la typographie et des pictogrammes
■ Descriptifs, services, informations, témoignages sur une page
■ Internaute actif : au centre de l’expérience
13. 11. Tendances 2016
■ Site responsive : s’adapter à tous les écrans
– Ordinateurs de bureau / portables
– Smartphones
– Tablettes
– TV connectée
■ Menus cachés / coulissants / transparents
■ Textes pensés pour le web
– Hiérarchisation des informations
– Ne dire que l’essentiel
14. 11. Tendances 2016
■ Pieds de page clairs et fonctionnels
– Contact, SAV, FAQ, réseaux sociaux…
■ Infographies : design géométrique, dynamique, animations...
■ Typographie: un site = une police de caractère (sans serif)
– Quelques typographies tendances :
– Proxima Nova, Droid Serif, FF DIN, FF Mark, Helvetica Neue, Open Sans, Avenir,
Montserrat, Lato
■ Images en haute résolution
