Guide du site
Structure du site
Le site est structuré en 7 sections principales :
- Le projet
Une introduction aux raisons qui ont donné naissance au projet Utility System ; - Les innovations
Les innovations et les caractéristiques fondamentales du système Utility ; - Les éléments
Une présentation des principaux éléments qui composent le système, chacun accompagné d'exemples photographiques de leur application à diverses cuisines Scavolini ; - Le choix et l'utilisation
Des conseils simples pour le choix et l'utilisation des éléments du système Utility ; - L'hôpital Niguarda
La réalisation des espaces cuisine pour la nouvelle Unità Spinale l'hôpital Niguarda Ca' Granda de Milan ; - L’entreprise Scavolini
Une présentation de l'entreprise Scavolini ; - L'engagement social de Scavolini
La sensibilité et l'engagement sur les questions propres à son territoire et aux thématiques sociales et culturelles.
Structure des pages
La structure-type des pages du site, identique pour les trois types documentaires qui seront illustrés ci-dessous, est la suivante :
En-tête
L'en-tête, qu'il est possible de passer grâce à la touche TAB, est composée des éléments suivants :
- logo de SCAVOLINI;
- section des liens de méta-navigation (page d'accueil, accessibilité, guide du site, personnalisation de l'affichage et carte du site).
Corps du document
la partie concernant le corps du document est essentiellement composée de deux sections :
- Section « vous vous trouvez dans : »
Cette section, dont le commencement est caractérisé par la mention « vous vous trouvez dans : » contient tous les éléments utiles pour contextualiser le document à l'intérieur du site et faciliter la navigation pour les utilisateurs ; elle aussi est composée de deux éléments :- Chemin - Constitué de la suite de tous les liens, séparés l'un de l'autre par le signe >, qui permettent à l'utilisateur de naviguer facilement dans le site (pour revenir en arrière dans la navigation ou pour retrouver des documents sur la même section que celui en cours de lecture) ;
- Titre du document - Constitué du nom de la section ou du document que l'utilisateur consulte ; du fait de l'importance de cet élément aux fins de la navigation sur le site et de l'indexation des contenus, il a été mis en œuvre en utilisant un tag H1.
- Section des contenus - La section destinée à regrouper tous les contenus documentaires du site.
Barre des menus
La barre des menus se situe à gauche de la section des contenus. Elle contient la liste des liens vers les 7 sections du site.
Pied de page
Sert à délimiter la fin des documents affichés ; la section du pied de page contient quatre éléments.
- lien « Haut de page » ;
- lien vers le site de l'entreprise Websolute srl chargée de la réalisation technique du site ;
- l'adresse mail à laquelle envoyer les questions, commentaires et suggestions concernant l'accessibilité et l'ergonomie.
- lien vers les validateurs du W3C concernant le XHTML, vers les CSS et le WAI-AAA.
Types de pages
Comme cela a déjà été indiqué, le site est essentiellement composé de trois pages type, en ce qui concerne la structure des pages à peine décrites ; elles diffèrent entre elles uniquement pour la section des contenus. La liste suivante reprend les descriptions des trois types de pages et les éléments de la section des contenus qui les caractérisent :
- Page d'accueil
La page d'accueil du site est divisée en trois sections qui présentent des contenus développés par la suite de manière plus approfondie dans les sections spécifiques du site :- Utility System
qui contient une introduction succincte au projet ; - L’entreprise SCAVOLINI
qui contient un texte court de présentation de la société Scavolini ; - L'engagement social de SCAVOLINI
qui contient un texte court de présentation des activités sociales et culturelles soutenues par l'entreprise.
- Utility System
- Pages de section
Les pages de chaque section sont des pages de texte ; la section des contenus est donc entièrement dédiée à la présentation de ces documents. Ces pages sont essentiellement constituées de textes accompagnés dans certains cas d'images (photos et dessins). - Pages de la section « les éléments »
C'est la seule section qui contient des sous-sections, chacune d'entre elles illustrant un élément du système Utility :- La première page sert de sommaire et inclut les liens qui conduisent aux sous-sections correspondantes ; ce type de lien est reconnaissable par sa position (juste derrière la section du chemin) et par le TITRE associé au lien, qui commence par les mots « Aller à la section... ».
- o Chaque sous-section est constituée d'une page de texte qui illustre un élément du système. Dans ces pages, la section des contenus est divisée en deux colonnes : la plus à gauche présente ces éléments via un texte descriptif et un exemple photographique d'une application à un modèle de cuisine ; la colonne de droite présente des liens qui permettent d'afficher des images de détails ; ce type de lien est également reconnaissance par sa position (justement dans la colonne de droite) et par le TITRE associé au lien, qui commence avec les mots « Afficher le détail... ».
Présentation des pages
Les pages du site, réalisées essentiellement sous forme de texte, sont présentées au moyen de feuilles de style. Avec les navigateurs qui ne prennent pas en charge les feuilles de style ou qui les prennent en charge de manière incomplète, les éléments de décoration (mis en œuvre comme des images de fond) ne sont pas visibles. Le contenu des pages reste lisible dans tous les cas, soit que le navigateur ne prenne pas en charge les feuilles de style soit que ces dernières soient désactivées. Le dimensionnement des caractères a été réalisé en utilisant des tailles relatives de caractères afin de permettre à l'utilisateur de sélectionner la taille préférée, en exploitant les fonctions appropriées des navigateurs graphiques. L'affichage peut également être personnalisé depuis la page appropriée accessible depuis le menu d'en-tête (à la fois en termes de contraste des couleurs texte-fond de page et pour la taille des caractères).
Accessibilité
Le site a été développé conformément aux principes d'accessibilité pour les personnes porteuses de handicap, en suivant en particulier les lignes directrices des WCAG 1.0 de la WAI ; les paragraphes suivants présentent certaines règles qui ont été appliquées.
Connexions (liens)
Toutes les connexions sont réalisées au moyen d'éléments de texte ; certains de ces éléments sont affichés par l'utilisation de feuilles de style, sous forme graphique ; les autres connexions sont reconnaissables par la mise en évidence qui apparaît lorsque la souris passe dessus. Tous les liens ont été dotés de l'attribut TITRE, qui contient une description significative de la destination de la connexion ; cette description, pour les liens qui conduisent hors du site, se termine par les mots « ...[lien vers un site externe] ».
Images
Toutes les images ont été dotées de l'attribut ALT, qui en décrit le contenu de manière synthétique ; l'introduction d'images purement décoratives a été évitée.
Pour les images plus complexes, l'attribut LONGDESC ou le D-LINK, lien descriptif, peuvent être présents. Ce dernier est réalisé avec un D majuscule situé juste derrière l'image à laquelle il se réfère. C'est une connexion vers un fichier dans lequel l'image est décrite de manière détaillée.
Tableaux
L'utilisation des tableaux a été limitée aux cas où ces éléments exercent la fonction pour laquelle ils ont été créés : la présentation de données sous forme structurée ; l'utilisation de tableaux comme instrument pour la définition de la structure de la page a donc été évitée. Quand des tableaux ont été utilisés, toutes les règles (SUMMARY, CAPTION, TH et définition du sens de lecture) permettant de rendre le contenu accessible aux personnes porteuses de handicap ont été appliquées.
Textes
Également aux fins d'offrir le meilleur support possible aux navigateurs à synthèse vocale, à l'intérieur de chaque page ont été définis :
- le langage principal du document ;
- le langage relatif à des termes étrangers spécifiques.
Un soin approprié a également été apporté pour indiquer, grâce à l'utilisation de tags appropriés, la signification des abréviations et des acronymes présents sur le site.
Conformité aux normes
Les pages du site, comme cela peut être aisément vérifié grâce à la présence d'un lien approprié, situé en bas à droite de la page, ont été élaborées conformément aux normes du langage XHTML 1.0 Strict.
La définition des attributs de style du site a été réalisée conformément aux spécifications CSS 2 ; la conformité de la feuille de style est vérifiable en utilisant le lien ci-dessous.
Dans la plupart des pages, on a essayé d'atteindre le niveau d'accessibilité AAA (priorité 3) des WCAG 1.0.