Site internet des Papeteries de Vizille · 1.4.1. Front-office ... Gestion en back-office..... 11 3. TYPES DE CONTENUS ... 3.1.2. Attributs

SPECIFICATIONS FONCTIONNELLES DETAILLEES

VICAT

Site internet des Papeteries de Vizille

RÉFÉRENCE : 2011_OA110029 | VERSION : v01.01 | 18/05/2012

PC 2.3.1 – Toute reproduction interdite sauf autorisation - 2 / 25


VICAT – Site internet des Papeteries de Vizille

RÉFÉRENCE : 2011_OA110029 VERSION : v01.01 DATE : 18/05/2012

LES INTERLOCUTEURS DU PROJET

OPEN WIDE

Sandrine Bouvier

Tél : +33 4 26 68 29 04

Mail : [email protected]

VICAT

Claude Gellet

Tél :


REZO ZERO

Julien Blanchet

Tél : +33 972280434


SUIVI DU DOCUMENT

ETAT DU LIVRABLE

En cours de validation

SUIVI DES EVOLUTIONS

REV. DATE OBJET DE L’EVOLUTION AUTEURS

01.01 18/05/12 Initialisation S. BOUVIER

mailto:[email protected]







SOMMAIRE

1. CONTEXTE......................................................................................................................... 6

1.1. A propos de ce document ................................................................................................. 6

1.2. Nature du projet ................................................................................................................. 6

1.3. Environnement technique ................................................................................................. 6

1.4. Accès au site ..................................................................................................................... 6

1.4.1. Front-office ....................................................................................................................................... 6

1.4.1.1. Français ........................................................................................................................... 7

1.4.1.2. Anglais ............................................................................................................................. 7

1.4.2. Back-office ........................................................................................................................................ 7

2. INTERFACES ..................................................................................................................... 8

2.1. Contraintes graphiques et accessibilité ........................................................................... 8

2.1.1. Résolution ........................................................................................................................................ 8

2.1.2. Navigateurs cibles ............................................................................................................................. 8

2.2. Zoning ................................................................................................................................ 8

2.2.1. Header ............................................................................................................................................. 8

2.2.1.1. Photos d’entête ................................................................................................................. 8

2.2.1.2. Bandeau ........................................................................................................................... 8

2.2.1.3. Menu principal .................................................................................................................. 9

2.2.2. Fil d’Ariane ..................................................................................................................................... 10

2.2.3. Footer ............................................................................................................................................. 10

2.2.4. Layout des pages ........................................................................................................................... 10

2.2.4.1. Types de gabarits possibles ............................................................................................ 10

2.2.4.2. Gestion en back-office..................................................................................................... 11

3. TYPES DE CONTENUS .....................................................................................................12

3.1. Site ....................................................................................................................................12

3.1.1. Général .......................................................................................................................................... 12

3.1.2. Attributs .......................................................................................................................................... 12

3.1.3. Vues du type de contenu < Site > .................................................................................................... 12

3.1.3.1. Vue full ........................................................................................................................... 13

3.2. Actualité ............................................................................................................................13

3.2.1. Général .......................................................................................................................................... 13

3.2.2. Attributs .......................................................................................................................................... 13

3.2.3. Vues du type de contenu < Actualité > ............................................................................................. 14

3.2.3.1. Vue bandeau .................................................................................................................. 14

3.2.3.2. Vue search ..................................................................................................................... 14





3.3. Page type ..........................................................................................................................14

3.3.1. Général .......................................................................................................................................... 14

3.3.2. Attributs .......................................................................................................................................... 14

3.3.3. Vues du type de contenu < Page type > ........................................................................................... 15

3.3.3.1. Vue full ........................................................................................................................... 16

3.3.3.2. Vue gamme .................................................................................................................... 16

3.4. Article ................................................................................................................................16

3.4.1. Général .......................................................................................................................................... 17

3.4.2. Attributs .......................................................................................................................................... 17

3.4.3. Vues du type de contenu < Article >................................................................................................. 17

3.4.3.1. Vue full ........................................................................................................................... 18

3.4.3.2. Vue produit ..................................................................................................................... 18

3.4.3.3. Vue search ..................................................................................................................... 19

3.5. Image ................................................................................................................................19

3.5.1. Général .......................................................................................................................................... 19

3.5.2. Attributs .......................................................................................................................................... 19

3.5.3. Vues du type de contenu < Image >................................................................................................. 19

3.5.3.1. Vue full ........................................................................................................................... 20

3.6. File ....................................................................................................................................20

3.6.1. Général .......................................................................................................................................... 20

3.6.2. Attributs .......................................................................................................................................... 20

3.6.3. Vues du type de contenu < File >..................................................................................................... 21

3.6.3.1. Vue embed ..................................................................................................................... 21

3.7. Slideshow .........................................................................................................................21

3.7.1. Général .......................................................................................................................................... 21

3.7.2. Attributs .......................................................................................................................................... 21

3.7.3. Vues du type de contenu < Slideshow > .......................................................................................... 21

3.7.3.1. Vue full ........................................................................................................................... 21

3.8. Gamme produit .................................................................................................................22

3.8.1. Général .......................................................................................................................................... 22

3.8.2. Attributs .......................................................................................................................................... 22

3.8.3. Vues du type de contenu < Gamme > .............................................................................................. 22

3.8.3.1. Vue full ........................................................................................................................... 23

3.9. Formulaire de contact ......................................................................................................23

3.9.1. Général .......................................................................................................................................... 23

3.9.2. Attributs .......................................................................................................................................... 23

3.9.3. Vues du type de contenu < Gamme > .............................................................................................. 24

3.9.3.1. Vue full ........................................................................................................................... 24

4. FONCTIONNALITES .........................................................................................................25





4.1. Multilinguisme ..................................................................................................................25

4.2. Moteur de recherche ........................................................................................................25

4.3. Géolocalisation .................................................................................................................25

.





1. CONTEXTE

1.1. A propos de ce document

Ce document de spécifications fonctionnelles détaillées a pour but de définir ce que va réaliser Open Wide et donc ce qu’est en droit d’attendre la société Vicat.

Ce document ne vise pas à décrire les solutions techniques développées mais bien à définir de façon exhaustive les fonctionnalités et comportements du projet « Vicat – Création du site internet des Papeteries de Vizille» pour ses utilisateurs adhérents et non adhérents.

Ce document, tant qu’il n’est pas validé officiellement par la société Vicat, conserve un statut « en cours de vali-dation », c’est-à-dire qu’il est susceptible de faire l’objet d’ajouts, de suppressions et de précisions en fonction des échanges entre la société Vicat et Open Wide.

Chaque modification (ou groupe de modifications) apportée(s) au présent document implique une nouvelle ver-sion. Le suivi des évolutions de versions est notifié dans le tableau prévu à cet effet en page 2.

Une fois validé, le document est immuable. Toutefois des modifications peuvent être apportées mais sont alors tributaires de l’accord explicite des partis au projet.

1.2. Nature du projet

Ce projet concerne la réalisation du site internet des Papeteries de Vizille (PdV), filiale du groupe Vicat située au cœur des Alpes dans la région grenobloise, et aujourd’hui l’une des grandes intervenantes sur le marché B to B des papiers spéciaux. Les Papeteries de Vizille sont organisées en deux activités :

L’activité papiers spéciaux

Le Papeteries de Vizille produisent et commercialisent des papiers spéciaux tels que du papier bouffant, du papier de sécurité, des ingraissables et d’autres papiers spécialisés destinés essentiellement à des impri-meurs et des transformateurs.

L’activité sacs grande et moyenne contenances

Les Papeteries de Vizille produisent et commercialisent des sacs (120 références) destinés aux marchés in-dustriels tels que le BTP, la chimie et l’agroalimentaire

1.3. Environnement technique

Le site des Papeteries de Vizille sera développé grâce au CMS eZ Publish (système de gestion de contenu) et hébergé sur la plateforme eZ Publish multi-sites contenant à ce jour l’ensemble des sites du groupe Vicat déve-loppés par Open Wide :

Groupe Vicat

Creavicat

Ciment et Architecture

National Cement

Vpi

1.4. Accès au site

Trois siteaccess seront créés pour accéder au site et à son administration.

1.4.1. Front-office





1.4.1.1. Français

Description Front-office en français

URL d’accès à définir

Designs à définir

Langue fre-FR

1.4.1.2. Anglais

Description Front-office en anglais

URL d’accès à définir

Designs à définir

Langue eng-GB

1.4.2. Back-office

Description Back-office eZ Publish par défaut

URL d’accès http://adminfr.vicat.com/

Designs à définir

Langue fre-FR





2. INTERFACES

2.1. Contraintes graphiques et accessibilité

2.1.1. Résolution

Le site Internet des Papeteries de Vizille sera réalisé afin d'être consulté sur :

un écran d'ordinateur avec une résolution de 1024 / 768 px ou plus

un écran d'appareil mobile avec une résolution de 200 / 250 px ou plus

Le site sera conçu sur la base d'une largeur fixe, à déterminer par le prestataire graphique d'après la résolution cible indiquée précédemment, et sera centré dans la fenêtre du navigateur.

Le design graphique sera appliqué grâce à plusieurs feuilles de styles CSS :

CSS screen pour les écrans

CSS print pour l'impression des pages

CSS handheld pour la consultation sur appareils mobiles

2.1.2. Navigateurs cibles

D'après l’usage en vigueur, le site sera compatible avec les navigateurs modernes Internet Explorer 8 et 9, Mozilla Firefox 3 et 4, Chrome 11 et Opéra. De ce fait, et en fonction des besoins de la maquette graphique, des propriétés CSS 3 pourront être utilisées. Si tel est le cas, un internaute utilisant un navigateur plus ancien n'offrant pas un support de CSS 3 ne bénéficiera pas de ces éléments de mise en forme.

2.2. Zoning

2.2.1. Header

2.2.1.1. Photos d’entête

Les 2 grandes photos du header sont administrables et changent selon les rubriques.

2.2.1.2. Bandeau

Le bandeau en dessous du header contient des infos relatives à la rubrique en cours.

Home

Affichage du type de contenu « slideshow » (cf rubrique dédiée)





Pages internes avec sous-rubriques

Fil d’Ariane des 2 premiers niveaux de l’arborescence

Texte de présentation de la rubrique administrable en BO

Pages internes non arborescentes

Titre cliquable de la page consultée

Texte de présentation de la page administrable en BO

Page Développement durable

Même comportement que les pages internes non arborescentes

Background spécial : #e0dcd3 au lieu du noir.

2.2.1.3. Menu principal





Page consultée : état « courant »

Texte item niveau 1 affiché en vert sur image de fond flèche verte avec le curseur flèche noir accolé au bandeau.

Si existant, sous-menu déployé et item de la page consultée en vert souligné. Le sous-menu s’affiche à cheval sur le trait de séparation entre la zone de contenu et le header.

Dans le cas où la page consultée est Développement durable, le curseur flèche accolé au bandeau est gris.

Déplacement du curseur sur la page : état « survol » :

Le menu de la page consultée conserve son style courant et les sous-menus disparaissent.

Texte item niveau 1 affiché en noir sur image de fond flèche verte avec le curseur flèche du bandeau ac-colé.

Si existant, sous-menu déployé avec item survolé affiché en vert souligné

Lorsque la rubrique contient des sous-pages, le clic sur l’item du menu principal renvoie automatique-ment sur la 1

ère sous-page de la rubrique.

2.2.2. Fil d’Ariane

Affichage de l’arborescence complète de la page depuis le niveau 1 jusqu’à la page consultée.

Dernier item affiché dans un style différent

2.2.3. Footer

Un menu de pied administrable en back-office

Un menu de bas de page qui rappelle les rubriques du menu principal et les sous-pages associées lors-qu’elles existent.

2.2.4. Layout des pages

2.2.4.1. Types de gabarits possibles

Nom Description Exemple d’application

Gabarit 35/65

2 colonnes – occupation de la page en proportions 35% gauche -65% droite

Home Activité Papier

Gabarit 50/50

2 colonnes – occupation de la page en proportions 50% - 50%

Les papeteries de Vizille Développement durable Les partenaires Contact

Gabarit 100 1 colonne – occupation de la page en 100% Les services Recherche

Le découpage des maquettes laisse apparaitre un gabarit supplémentaire 55 / 45 (Les papeteries de Vizille) qui sera transformé en 50 / 50 lors de l’intégration.





2.2.4.2. Gestion en back-office

Le choix de la mise en page se fera depuis le back-office selon le principe suivant :

Création de la page (classe « page type ») correspondant au gabarit souhaité

Ajout des éléments arborescents à afficher dans chacune des colonnes gauche et droite

Page gabarit 50-50

Colonne gauche

Elément 1

Elément 2

Colonne droite

Elément 1

Elément 2

Elem 1

Elem 2

Elem 1

Elem 2

Colonne gauche Colonne droite





3. TYPES DE CONTENUS

3.1. Site

3.1.1. Général

Nom Site

Identifiant site

Conteneur Oui

Disponibilité par défaut Non

Modèle de nom d’objet <name>

3.1.2. Attributs

Nom du champ Identifiant Datatype Flags

Nom name Ligne de texte Requis Non interrogeable Traduisible

Surtitre gauche surtitre_gauche Ligne de texte Requis Non interrogeable Traduisible

Titre gauche titre_gauche Ligne de texte Requis Non interrogeable Traduisible

Image gauche image_gauche Image Requis Non interrogeable Traduisible

Surtitre droit surtitre_droit Ligne de texte Requis Non interrogeable Traduisible

Titre droit titre_droit Ligne de texte Requis Non interrogeable Traduisible

Image droite image_droit Image Requis Non interrogeable Traduisible

Actualités news Relation d’objets Requis Non interrogeable Traduisible

3.1.3. Vues du type de contenu < Site >





Full Surtitre gauche, titre gauche, image gauche, surtitre droit, titre droit, image droite, actualités

3.1.3.1. Vue full

3.2. Actualité

3.2.1. Général

Nom Actualité

Identifiant news

Conteneur Oui

Disponibilité par défaut Oui

Modèle de nom d’objet <titre>

3.2.2. Attributs


Titre titre Ligne de texte Requis Interrogeable Traduisible

Description description Bloc XML Requis Interrogeable Traduisible

Surtitre gauche

Titre gauche

Image gauche

Surtitre droit

Titre droit

Image gauche

Image droite

Objet lié actualité

Objet lié actualité





3.2.3. Vues du type de contenu < Actualité >

Bandeau Titre, description

Search Titre, description

3.2.3.1. Vue bandeau

La vue bandeau est affichée dans le bandeau de la home, intégrée dans le slider des actualités.

3.2.3.2. Vue search

La vue search affiche le contenu de l’actualité.

En l’absence d’une vue détaillée pour les actualités, les résultats de recherche sur ce type de contenu feront remonter la description dans son intégralité. Aucun lien « voir le détail » ne sera disponible.

3.3. Page type

3.3.1. Général

Nom Page type

Identifiant page_type

Conteneur Oui


Modèle de nom d’objet <short_name>

3.3.2. Attributs

Titre

Description






Nom name Ligne de texte Requis Interrogeable Traduisible

Nom court short_name Ligne de texte Requis Interrogeable Traduisible

Illustration gamme illustration_gamme Image Non requis Non interrogeable Traduisible


Gabarit gabarit Sélection [35-65, 50-50, 100]

Requis Non interrogeable Traduisible

Surtitre gauche surtitre_gauche Ligne de texte Requis Non interrogeable Traduisible

Titre gauche titre_gauche Ligne de texte Requis Non interrogeable Traduisible

Image gauche image_gauche Image Requis Non interrogeable Traduisible

Surtitre droit surtitre_droit Ligne de texte Requis Non interrogeable Traduisible

Titre droit titre_droit Ligne de texte Requis Non interrogeable Traduisible

Image droite image_droit Image Requis Non interrogeable Traduisible

3.3.3. Vues du type de contenu < Page type >

Full Nom, description, surtitre gauche, titre gauche, image gauche, surtitre droit, titre droit, image droite

Gamme Nom court, illustration gamme

En l’absence des informations de description et titres / surtitres / images gauche et droite, ce sont les données de l’objet parent qui seront affichées.





3.3.3.1. Vue full

Dans le cas de la page Développement durable, les titres h1 possèdent un style spécifique : trait inférieur vert au lieu du noir habituel.

3.3.3.2. Vue gamme

La vue gamme de l’objet page type est utilisée dans la page Activité papier exclusivement.

3.4. Article

Description

Nom

Gabarit

Illustration gamme

Titre court





3.4.1. Général

Nom Article

Identifiant article

Conteneur Oui



3.4.2. Attributs




Images images Relation d’objets avec des images

Non requis Non interrogeable Traduisible

Fichiers fichiers Relation d’objets avec des files

Non requis Non interrogeable Traduisible

3.4.3. Vues du type de contenu < Article >

Full Titre, description, images

Produit Titre, description, image 1, documentation

Search Titre, contenu, image 1





3.4.3.1. Vue full

Toutes les images des contenus de type Article seront gérées dans le champ images via une relation d’objets avec les contenus images. Ainsi, lorsqu’ils seront affichés dans les pages éditoriales du type « L’entreprise > Les papeteries de Vizille », les contenus de type Article possèderont toujours la mise en page suivante :

3.4.3.2. Vue produit

Sans documentation

Avec documentation

TITRE

IMAGE 1 IMAGE 2

IMAGE 3 IMAGE …

IMAGE n

DESCRIPTION

Titre

Image

Description

Titre

Description

Image 1





3.4.3.3. Vue search

La vue search propose un lien « Voir la page » qui renvoie vers la Page type à laquelle l’Article est rattaché et qui contient d’autres Articles.

3.5. Image

3.5.1. Général

Nom Image

Identifiant image

Conteneur Non



3.5.2. Attributs



Lien url URL Non requis Interrogeable Traduisible

Image image Image Requis Non interrogeable Non traduisible

3.5.3. Vues du type de contenu < Image >

Fichiers

Titre

Image 1





Full Titre, lien, image

3.5.3.1. Vue full

Etat normal

A l’état normal, un contenu de type image est surmonté d’un coin vert dans l’angle inférieur droit.

Etat survol

Le coin de l’angle inférieur droit devient noir au survol.

3.6. File

3.6.1. Général

Nom File

Identifiant file

Conteneur Oui



3.6.2. Attributs




File file Fichier Requis





Non interrogeable Traduisible

3.6.3. Vues du type de contenu < File >

Embed Nom, file

3.6.3.1. Vue embed

Le clic sur le libellé déclenche le téléchargement du fichier associé.

3.7. Slideshow

3.7.1. Général

Nom Slideshow

Identifiant slideshow

Conteneur Oui



3.7.2. Attributs


Nom name Ligne de texte Requis Non interrogeable Traduisible

Actualités News Relation d’objets avec des images

Requis Non interrogeable Non traduisible

3.7.3. Vues du type de contenu < Slideshow >

Full Nom, actualités

3.7.3.1. Vue full

Affichage des actualités 2 par 2 dans un slider avec défilement automatique toutes les 30 sec.





Défilement manuel possible en cliquant sur les points dans le coin haut droit du slider.

Texte riche et titres non cliquables

3.8. Gamme produit

3.8.1. Général

Nom Gamme

Identifiant gamme

Conteneur Oui



3.8.2. Attributs




Gammes Gammes Relation d’objets avec des pages types

Requis Non interrogeable Traduisible

3.8.3. Vues du type de contenu < Gamme >

Full Nom, description, articles





3.8.3.1. Vue full

3.9. Formulaire de contact

3.9.1. Général

Nom Formulaire de contact

Identifiant feedback_form

Conteneur Non


Modèle de nom d’objet <short_title>

3.9.2. Attributs


Titre du formulaire short_title Ligne de texte Requis Interrogeable Traduisible

Nom name

Ligne de texte Requis Collecteur d’information

Email courriel Courriel Requis Collecteur d’information

Message message Bloc XML Requis Collecteur d’information

Destinataire recipient Ligne de texte Requis

Nom

Description

Gamme





3.9.3. Vues du type de contenu < Gamme >

Full Titre du formulaire, nom, email, message

3.9.3.1. Vue full





4. FONCTIONNALITES

4.1. Multilinguisme

Le site sera accessible en anglais et en français et un bouton dans le header permettra de passer d’un langage à l’autre.

4.2. Moteur de recherche

Un bouton « rechercher » situé dans le menu principal permettra d’effectuer une recherche simple, basée sur le fonctionnement standard de l’extension eZ Publish ezfind.

Les résultats seront présentés sous forme de liste avec une pagination tous les 10 éléments.

4.3. Géolocalisation

Une carte permettra de géolocaliser le lieu où se trouve le site des Papeteries de Vizille.

Pour ce faire, eZ Publish propose nativement l'extension ezgmaplocation qui fournit le datatype ezgmaploca-tion. Ce datatype permet de géolocaliser une adresse grâce à Google Maps.

Une clé Google Maps spécifique au site des Papeteries de Vizille sera générée et renseignée dans le paramètre GmapsKey du fichier site.ini

Documents

Site internet des Papeteries de Vizille · 1.4.1. Front-office ... Gestion en back-office..... 11 3. TYPES DE CONTENUS ... 3.1.2. Attributs