Une refonte pour faire la part belle aux visuels

La com­pag­nie artis­tique La Cham­bre aux échos voulait refon­dre son site Word­Press un peu vieil­lis­sant pour :

  • un design qui val­orise enfin les mag­nifiques pho­togra­phies des spectacles,
  • gér­er facile­ment le mul­ti­lin­guisme sur ce site entière­ment bilingue,
  • val­oris­er les dif­férents spec­ta­cles et créa­tions sans se pos­er de ques­tions quant à la mise en page des informations.

Un multisite WordPress et des contenus sur mesure

Multilinguisme

Nous avions plusieurs con­traintes pour le multilinguisme : 

  • avoir un sous domaine dédié pour la tra­duc­tion en anglais (https://​en​.cham​breaux​e​chos​.org),
  • pou­voir utilis­er ACF Pro, l’ex­ten­sion qui nous per­met de créer des types d’in­for­ma­tions spé­ci­fiques à cer­tains contenus,
  • être gra­tu­it.

Nous avons donc décidé de met­tre en place un mul­ti­site où la cor­re­spon­dance page à page entre les deux langues est gérées grâce à deux extensions :

  • Mul­ti­site Lan­guage Switch­er (rela­tion entre les pages dans les dif­férentes langues),
  • Msls­Menu (ges­tion du menu de langue).

Cette organ­i­sa­tion oblige à gér­er les visuels sur les bib­lio­thèques de médias de cha­cun des sites mais la con­trainte a été jugée accept­able par l’équipe client au vu de ses atouts.

Organisation sur mesure pour les Créations

Les pages de Créa­tions sont com­posées d’élé­ments spé­ci­fiques pour met­tre en valeur les infor­ma­tions de référence :

  • une caté­gorie indi­quant le statut de la créa­tion (pro­jet, en cours de créa­tion, créa­tion ou créa­tion mondiale) ;
  • des champs par­ti­c­uliers pour affich­er :
    • un sous-titre,
    • l’an­née de création,
    • la durée,
    • si des représen­ta­tions sont en cours ou à venir.
  • la pos­si­bil­ité de met­tre les dif­férentes créa­tions en rela­tion pour sug­gér­er en bas de page d’autres spectacles ;
  • des com­po­si­tions de con­tenus créés spé­ciale­ment pour faciliter la mise en page : 
    • d’un menu contextuel,
    • des infor­ma­tions sur l’équipe créa­tive ou les interprètes,
    • du doc­u­ment à télécharger,
    • des événe­ments liés…

Ces élé­ments étant sor­ti du texte rédac­tion­nel de la page, il devient pos­si­ble de les utilis­er facile­ment et surtout de les plac­er comme voulu par le designer : 

  • sur la Créa­tion, la caté­gorie et la durée sont placés avec le titre dans un cadre alors que le sous titre est situé plus bas sous le visuel de bandeau,
  • sur les listes de créa­tions, sont affichées l’an­née, le sous-titre et la caté­gorie en plus du titre. 

Un bloc de con­tenu Word­Press créé pour le site de la Cham­bre aux échos per­met d’af­fich­er la liste des Créa­tions sur n’im­porte quelle page.

Événements : des contenus courts et utilisés de manière ponctuelle

Les événe­ments sont util­isés de deux façons :

  • en liste sous la liste des créations,
  • sur des pages indi­vidu­elles pour le détail de chaque événement.

Cha­cun a des champs spé­ci­aux pour lui associer :

  • une vignette,
  • un sous-titre,
  • une année d’organisation,
  • une /​des catégories.

A par­tir de ce type de con­tenu, nous avons créé un bloc per­me­t­tant d’af­fich­er la liste des événe­ments — sélec­tion­née par caté­gorie si besoin — sur n’im­porte quelle page. 

C’est ain­si que l’on peut avoir les deux listes de Créa­tion et d’événe­ments sur la même page.

Un thème personnalisé qui ne ressemble à aucun autre

Afin de lim­iter le tra­vail de créa­tion, le choix a été fait de par­tir d’un thème très sim­ple et pro­posant des mis­es en page val­orisant les visuels. 

Le directeur artis­tique s’est appuyé sur les élé­ments disponibles dans le thème sélec­tion­né pour con­cevoir les maque­ttes des pages types (accueil, Créa­tion) et des con­tenus édi­to­ri­aux plus clas­siques. Les couleurs du logo, une sobriété voulue ain­si que la val­ori­sa­tion des visuels et des Créa­tions ont com­plété la liste des principes à suivre.

Cela nous a per­mis de met­tre en place un thème unique sans pour autant être une créa­tion entière­ment sur mesure. 

Les mis­es en page spé­ci­fiques de la maque­tte ont été trans­for­mées en com­po­si­tions Guten­berg (l’édi­teur natif de Word­Press) ont été conçues pour faciliter la créa­tion des con­tenus et leur admin­is­tra­tion. Les rédac­teurs peu­vent ain­si met­tre en place des textes de type événe­ment liés à la Créa­tion, liste des équipes, mise en valeur du dossier pdf de la créa­tion, etc. en se con­tentant d’ap­pel­er le bloc Guten­berg voulu dans l’in­ter­face d’édi­tion et de se gliss­er dans le mod­èle sans avoir à se préoc­cu­per du ren­du final.

Com­po­si­tion pour la présen­ta­tion de l’équipe créative.

Le petit plus

Nos directeurs artis­tiques ne peu­vent pas s’empêcher de se pencher sur les détails : le logo a été “légère­ment” revu pour lui apporter plus d’équili­bre et surtout ren­dre la mar­que plus lis­i­ble et donc plus visible.

Le logo orig­i­nal vs le logo une fois repris : le nom de la com­pag­nie est plus lis­i­ble et la sépa­ra­tion de la forme et du texte per­met d’avoir une ver­sion plus sim­ple et facile­ment iden­ti­fi­able pour le fav­i­con comme pour des util­i­sa­tions ponctuelles diverses.