Architecture de l'information pour WordPress

Post on 17-Jan-2017

3.765 views 0 download

Transcript of Architecture de l'information pour WordPress

Architecturede l’information

pour

2

L'architecture de l'information(AI) est l'art d'exprimer unmodèle ou un conceptd'information utilisé dans desactivités exigeant des détailsexplicites dans des systèmescomplexes.

3

Mark A Coleman

4

Organiser vos contenus

5

Organiser vos contenuspour que l’utilisateur trouve cequ’il cherche

6

Organiser vos contenuspour que l’utilisateur trouve ceque voudriez qu’il trouve

7

Organiser vos contenuspour que vous puissiez créer etclasser vos contenusefficacement

8

Organiser vos contenuspour que vos contenus soientpérennes et évolutifs

9

Les symptômessouvent on se lance rapidement dans :• une arborescence• la définition des onglets de navigation,

du fil d’Ariane…

Tout est simple… au début

12

Et puis…

• On découvre des défauts de conceptionau moment de la saisie

• On a du mal à choisir les modes denavigation ou ils ne fonctionnent pas

• On est bloqué au moment d’ajouterune rubrique

13

WordPress offre un cadre riche etefficace à l’architecture del’information.

L’idée est d’en tirer le maximum.

14

Systèmes de navigation

Classer les contenus

Structurer les contenus

15

Systèmes de navigation

Classer les contenus

Structurer les contenus

Structurer voscontenus

16

17

Le plus souvent, le format estdéfini par les champs quidécrivent le contenu

• Titre• Extrait• Texte• Auteur• Image à la une

Je suis un article

18

Le plus souvent, le format estdéfini par les champs quidécrivent le contenu

• Titre• Extrait• Texte• Auteur• Image à la une

Champs par défaut

19

? ?

?

Image à la une

Texte

Titre

Extrait

20

?

?

Image à la une

• La taille peut êtreintégrée au texte

• Elle peut être dansun champ à part

• Elle peut être dans2 champs(longueur etlargeur)

21

?

?

Image à la une

En créant 2 champs,on se donne lapossibilité de laisserl’utilisateur affichertoutes les tablesd’une certainelargeur (parexemple).

22

Dans WordPress, on utilise leschamps personnalisés pourajouter des champs à un typecontenu

23

On peut ajouter des champspersonnalisés :• à la main• avec une extension maison• en utilisant des extensions spécialisées

comme Advanced Custom Fields

24

CléValeur

25

Advanced Custom Fields

26

27

{Bonus} N’ajoutez pas vos champspersonnalisés avec un thème.

Vos contenus doivent êtreindépendants de l’apparence dusite. Vous me remercierez à laprochaine refonte ;-)

28

{Bonus} N’abusez pas des champspersonnalisés, ils alourdissent lasaisie. Si c’est juste une questiond’affichage, basez-vous sur uncode HTML bien structuré etéventuellement des shortcodes.

Identifier voscontenus

29

30

Faire la liste de chaque type decontenu• Article d’actualité• Fiche métier• Fiche beauté• Recette de cuisine• 10 conseils santé• Tutoriel• Biographie auteur• Conférence• Offre d’emploi

31

{Bonus} contenu = article.

Une offre d’emploi est uncontenu. C’est aussi le cas desfiches produits, de la bio d’unconférencier…

32

Bien identifier un type decontenu

• Article d’actualité politique• Article d’actualité culturelle• Article d’actualité économique

Un type de contenu sedistingue par son format

33

Par défaut, WordPress met àdisposition 2 types de contenus :les articles et les pages.

Les articles s’empilent par ordre depublication.

34

Par défaut, WordPress met àdisposition 2 types de contenus :les articles et les pages.

Les pages sont liées les unes aux autres etforment une arborescence.

35

Les articles et les pages sont unhéritage des débuts deWordPress.

Articles de blog et pages statiquescomme la page à propos.

36

Les articles et les pages sont unhéritage des débuts deWordPress.

Aucun problème pour les utiliser telsquels. Mais vous pouvez aussi décider deles détourner.

37

Les articles et les pages peuventêtre étendus avec des champspersonnalisés.

38

On peut ajouter d’autres types decontenus

Les types de contenupersonnalisés.

39

Les types de contenupersonnalisés peuvent eux aussiêtre étendus avec des champspersonnalisés.

On peut donc avoir un format de contenupour chaque type de contenupersonnalisé.

40

Ex. de type de contenu personnalisé

41

42

{Bonus} Lorsque vous ajoutez untype de contenu personnalisé,WordPress crée tous les écransd’administration nécessairesautomatiquement \o/.

43

Comment faire ?

• Une liste de tous les types de contenuprécisant comment le réaliser dansWordPress

• Pour chaque type de contenu, la listede ses champs (avec éventuellementses contraintes)

44

Comment faire ?

• Une ou plusieurs extensions en charged’ajouter les types de contenuspersonnalisés et les champspersonnalisés

Classer vos contenus

45

46

On utilise des taxonomies

47

Mark A Coleman

48

On utilise des taxonomies desplans de classement.

Par défaut, WordPress fournit lestaxonomies Catégories et Étiquettes pourles articles.

49

On utilise des taxonomies desplans de classement.

Les Catégories forment une arborescenceet les Étiquettes sont des mots-clés.

50

Les taxonomies par défautde WordPress

51

L’écran d’administrationdes catégories

52

A l’origine,

Catégories = navigation principale

Étiquettes = navigation secondaireaccessible depuis les articles

53

{Bonus} Taxonomie = navigation

Un système de navigation peutcombiner plusieurs taxonomies.

54

Systèmes de navigation

Taxonomies

Types de contenu

55

C’est à vous de décider du rôleque jouera chaque taxonomie.

56

Pour chaque élément d’unetaxonomie, vous pouvez afficherles contenus qui lui sontrattachés.

Ex. Afficher les contenus de la CatégorieActualité.

57

On peut ajouter des taxonomiespersonnalisées• Métiers• Pays• Matériaux• Familles d’animaux• Âges• Villes• Peintures• Types de cuisine• Tailles de bateaux

58

Ex. de taxonomie personnalisée

59

Les taxonomies peuvent êtrepartagées entre plusieurs typesde contenu.

Ex. les Catégories peuvent être partagéesentre les Articles et les Événements.

60

Partager une taxonomie

61

Les taxonomies sont desformidables outils pourregrouper les contenus quel quesoient leur types.

62

Ça permet d’avoir des listesmélangeant plusieurs types decontenu.

Ex. On pourra afficher les Articles et lesÉvénements pour une Catégorie donnée.

63

{Bonus} Lorsque vous ajoutez unetaxonomie personnalisée,WordPress crée tous les écransd’administration nécessairesautomatiquement \o/.

64

Comment faire ?

• Listez les taxonomies disponibles pourchaque type de contenu

• Définissez comment chaque système denavigation exploite vos taxonomies etvos types de contenu.

Quelques pièges

65

66

• Évitez les recouvrements entre leschamps personnalisés, les types decontenu et les taxonomies.

67

• Ne confondez pas taxonomie etnavigation.

Une navigation peut exploiter plusieurstaxonomies et avoir des libellésdifférents.

68

• Ne confondez pas taxonomie etnavigation.

Les navigations sont destinées auxutilisateurs. Les taxonomies servent àorganiser vos contenus de manièrepérenne.

69

• Prenez l’habitude d’avoir unetaxonomie principale sans multi-indexation – pratique pour l’analyticsnotamment.

70

• Chaque élément d’une taxonomie doitêtre utile.

Évitez les redondances et les élémentsauxquels aucun contenu n’est rattaché –essentiel pour le SEO !

71

Il est courant que certainesparties de contenu soientpartagées par plusieurscontenus.

Ex. la définition d’un mot, l’étape d’unerecette de cuisine…

72

• Évitez de répéter un même contenu àplusieurs endroits

Vous pouvez imbriquer vos contenus oules lier les uns aux autres (ex. en utilisantun shortcode).

Aller plus loin

73

74

Les évolutions de WordPress

• Ex. Depuis WordPress 4.4 on peutajouter des champs personnalisés pourles taxonomies \o/.

>>> 16:30 Taxonomy Term Meta par Matt Perry

75

Les méthodes pour :

• créer des systèmes de navigationefficaces

• hiérarchiser ces moyens de navigation

• trouver les termes que vontcomprendre vos utilisateurs

76

77

Le suivi statistique de l’audienceet de la production de contenupour vérifier :

• que l’organisation des contenus est bienexploitée

• que les systèmes de navigationremplissent leur rôle

78

Benjamin LUPUDirecteur digital Jeune Afrique

@benjaminlupu

Mobile (WP-AppKit)AnalyticsUXDéveloppementUXMarketingProjets

79

Mark A ColemanMerci