La présentation est en train de télécharger. S'il vous plaît, attendez

La présentation est en train de télécharger. S'il vous plaît, attendez

Webdesign ~ Les bonnes pratiques ~. Définition Organisation dun site Architecture générale Organisation des pages (arborescence / navitation) Remarques.

Présentations similaires


Présentation au sujet: "Webdesign ~ Les bonnes pratiques ~. Définition Organisation dun site Architecture générale Organisation des pages (arborescence / navitation) Remarques."— Transcription de la présentation:

1 Webdesign ~ Les bonnes pratiques ~

2 Définition Organisation dun site Architecture générale Organisation des pages (arborescence / navitation) Remarques Ne pas chercher loriginalité Simplifier au maximum la navigation Introduction

3 Textes Police Usuelle (reconnue par tous les ordinateurs) Assez grande pour être lisible Textes Fond clair, lettre foncées (noir / gris foncé et blanc) Ne pas souligner (pour les liens) Paragraphes Largeur : 10 – 15 cm (trop long ou trop court sur une ligne = non lisible) I. Eléments de base

4 Contenus Images A utiliser (au moins une image par article) ! qualité minimale… Pour attirer lœil, aiguiser la curiosité Vidéos Peuvent être publiées seules Utiliser les supports connus YouTube et Dailymotion pour les vidéos Flickr pour les images I. Eléments de base

5 Couleurs (1/3) Ne pas multiplier les couleurs ! Importance de la charte graphique Les utiliser de façon logique Liens / titres Outils Couleurs : Complémentaires : Associations « en direct » : Contrastes : Tester : I. Eléments de base

6 Couleurs (2/3) I. Eléments de base

7 Couleurs (3/3) I. Eléments de base

8 Présentation dune page (1/3) Toujours la même présentation Bandeau (image avec logo, catégories) Barre(s) latérale(s) (une ou deux, avec les widgets ) Pied de page (entrées transversales) Exception possible pour la page daccueil Mais elle doit reprendre le design général II. Organisation dune page

9 Présentation dune page (2/3) Balayage Linternaute sarrête sur les éléments qui attirent lœil (images, titres) Ne lit pas un long texte Importance des titres (pertinents / précis) Utilisation dimages / schémas Paragraphes à puces II. Organisation dune page

10 Présentation dune page (3/3) Eye tracking Comment linternaute lit une page II. Organisation dune page

11 Gadgets et widgets Bien les sélectionner, surabondance nuisible A garder : Barres de recherche Boutons réseaux sociaux A oublier : Compteurs Animations II. Organisation dune page

12 Arborescence Règle des trois clics Pas plus de trois clics pour arriver quelque part Plus considérée comme une règle absolue Limiter les choix Eviter la surabondance de liens Trop de choix nuit à la lisibilité Menus déroulant qui font apparaître les sous- catégories Orienter le choix de linternaute, pas le complexifier Linternaute doit avoir limpression de sy retrouver facilement ! III. Organisation du site

13 Catégories ou pages ? Catégories Regroupe des articles appelés à se renouveler Date de publication importante De type blogs : rangés par date, mise à jour régulière, sous-catégories possibles Exemples : Actualités, Editoriaux… Pages Indépendantes Changent peu Souvent entrées transversales III. Organisation du site

14 Catégories et pages Importance des titres Pages : les incontournables A propos (linternaute doit savoir qui fait ce site, son but) Horaires (pour une paroisse, un sanctuaire…) Venir III. Organisation du site

15 Référencement Important dès le Webdesign ! Ecriture dURL Avec les titres des articles Lier les articles entre eux Lier à dautres sites III. Organisation du site


Télécharger ppt "Webdesign ~ Les bonnes pratiques ~. Définition Organisation dun site Architecture générale Organisation des pages (arborescence / navitation) Remarques."

Présentations similaires


Annonces Google