Maîtriser l’affichage d’une liste SharePoint pour en améliorer le design

Par Thomas Jourdin - Publié le Modifié le

Le design d’un site Sharepoint, tout comme celui d’un site web, est le reflet de l’entreprise qu’il représente.
Un design personnalisé et maîtrisé sera toujours un plus pour l’image de marque de l’entreprise, mais aussi pour l’utilisateur pour qui l’accès à l’information sera simplifié et l’expérience utilisateur améliorée. Nous parlerons notamment ici de liste SharePoint.

Affichage de liste SharePoint : cas d’usage

C’est dans le cadre de l’affichage d’une liste d’offres d’emplois que nous avons dû réfléchir à la mise en place d’un affichage de liste différent de ce que propose les modules OOTB de SharePoint Online.

Le but était d’offrir à l’utilisateur une vue simplifiée de l’ensemble des éléments et de lui permettre de consulter facilement le détail d’un élément. En plus de permettre à l’utilisateur de trouver les informations dont il avait besoin de façon claire et concise, il fallait aussi lui donner une expérience utilisateur agréable.

La solution technique pour maîtriser l’affichage de liste SharePoint

L’idée de base de cette solution était la suivante : maîtriser le code HTML d’affichage des éléments pour créer un design proche de celui d’un site web classique. Pour la mettre en place, nous avons choisi de nous baser sur le webpart « Requête de contenu ».

Mise en place de la solution :

  1. Insertion du webpart de « Requête de contenu » dans la page prévue à l’affichage des offres d’emplois
  2. Modification des fichiers ContentQueryMain.xsl et ItemStyle.xsl (Dans le dossier XSL Style Sheets) pour créer un nouveau modèle d’affichage mêlant Données XSL et balises HTML5
  3. Paramétrage du webpart « Requête de contenu » pour sélectionner la liste à afficher et les nouveaux templates d’affichage créés à l’étape précédente
  4. Mise en forme et animation des éléments HTML avec CSS3 et JavaScript

Le résultat obtenu

Les éléments de cette liste SharePoint ne sont plus affichés comme de simples lignes d’un tableau, mais selon un design plus fluide, proche des codes du web et à l’image de l’entreprise. L’accès à l’information et l’expérience utilisateur en ressortent grandement améliorés.

Comparaison [Avant / Après] entre les deux affichages de liste SharePoint

affichage-liste-sharepoint-standard
Affichage classique de la liste SharePoint et de ses éléments

 

affichage liste sharepoint design
Affichage personnalisé par un expert Cyrès

SharePoint est un outil puissant mais pouvant rebuter au premier abord à cause d’une expérience utilisateur qui n’est pas au niveau de ses fonctionnalités. Si les pages « modern expériences » tendent à corriger ce problème, elles ne sont pas encore assez développées pour être utilisées totalement dans un environnement de production. Pour offrir à vos utilisateurs une expérience optimale, la meilleure solution reste de designer et de personnaliser SharePoint.

 

Demandez un accès gratuit à notre plateforme de démo SharePoint Online   !

 

Taggué avec

Consultant Office 365

Page Linkedin Cyrès

Facebook

Twitter

05/03/2018 @ 14:40
Conteneurisation et Virtualisation : où se situe le point de bascule ? https://t.co/yYmhEjRKCq #container #virtualisation #cloud #docker
04/20/2018 @ 6:54
L’industrialisation du cloud au service de l’architecture Big Data : https://t.co/72qnB5wklZ
#bigdataarchitecture "bigdata https://t.co/lGauGOx1bg
cyresgroupe photo

Calendrier

mai 2018
LMMJVSD
« Avr  
 123456
78910111213
14151617181920
21222324252627
28293031