Le site internet

But du site

• Fournir à HanditecAM le support de communication nécessaire à sa promotion.
• Permettre une transmission plus aisée des travaux effectués lors des PFE et PDM successifs.C’est pourquoi il comporte toutes les informations nécessaires sur l’action d’HanditecAM.
• Mettre les résultats de notre veille technologique à la portée de tous sous forme d’articles.

Utilisation du Wiki

Le Wiki est un « système ouvert d’édition » c'est-à-dire que tout le monde peut éditer n’importe quelle page. Alors qu'à première vu cela ressemble à une recette pour une anarchie complète, la vérité est que les sites employant ce système ont développé des communautés étonnamment complexes et riches pour la collaboration et la communication en ligne. Oui, il est possible que quelqu'un aille détruire l'ensemble d'une page, mais cela ne semble pas se produire souvent. Et ce système a des mécanismes intégrés pour reconstituer le contenu qui a été défiguré ou détruit.

Cette structure est tout indiquée pour supporter le site Web d’HanditecAM. En effet, n’importe lequel de ses membres où qu’il soit peut apporter sa pierre à l’édifice très simplement. Il est vrai que la puissance du Wiki est assez limitée en ce qui concerne le graphisme. Mais il est en parfaite adéquation avec le souci de simplicité et de clarté voulu par le groupe.

Voici les différentes possibilités d’édition :

• Edition de base

Les pages de ce site sont des pages Wiki, ce qui signifie que ces pages peuvent être créées et éditées par plusieurs auteurs. Pour ouvrir l’interface d’édition, appuyer sur Alt+E. Les règles de base pour l'édition de page sont assez simples : commencez chaque ligne sans espaces et mettez une ligne vide entre les paragraphes. La barre d’outils située au dessus de la zone de texte comporte plusieurs icônes permettant de mettre en forme très facilement le texte. Il suffit de sélectionner la partie du texte que l’on veut transformer et de cliquer sur l’icône de son choix pour que des balises de mise en forme soient automatiquement placées. Ces icônes sont :

• Pour éditer le menu

Sur la gauche de chaque page du Wiki se trouve un menu constitué des liens vers les différentes pages du site. Pour éditer ce menu, il faut appuyer sur Alt+M.

• Pour accéder au TODO

La page Todo est très pratique pour communiquer entre les membres d’HanditecAM sur ce qui doit être fait ou ce qui a été actualisé sur le site. Un mot de passe a été installé dessus. Ce mot de passe est camille.

• Pour restaurer une page

En cliquant sur le lien Historique d’une page, vous accéderez à la liste chronologique des modifications réalisées sur cette page. Il suffit de cliquer sur restaurer pour que la page redevienne celle de la modification correspondante. D’autres fonctions existent. Pour obtenir l’intégralité des possibilités du Wiki, connectez vous sur www.pmWiki.org.

Accessibilité du site

Le site d’HanditecAM devait avoir la possibilité d’être vu par le plus grand nombre qu’il soit voyant ou malvoyant, c’est pour cela que nous devions proposer des styles différents, c’est à dire la possibilité de changer la taille des caractères ainsi que la couleur de fond pour avoir un contraste important.

CSS

Cette fonctionnalité est possibilité grâce au CSS (Cascading Style Sheet), ce ne sont pas les pages html qui changent, mais uniquement les feuilles de style. Il nous a donc fallu apprendre comment créer ces feuilles de styles pour que le site apparaisse de façons différentes selon le choix de la personne qui le regarde.

Première étape : la mise en place du site sur un serveur local

Pour la mise en place de ces feuilles de styles, il faut pouvoir afficher notre site sur un serveur local d’un ordinateur, ce la permet de faire des modifications et ainsi avoir la possibilité de voir le résultat directement. Cette technique est obligatoire car le Wiki proposé par pmwiki.org est dans le langage PHP. Il nous a donc fallu installer Easy PHP (http://www.easyphp.org) dans le but d’avoir un serveur apache sur l’ordinateur.

Une fois le serveur mis en route il faut installer le site pmwiki dans le dossier C:\Program Files\EasyPHP1-7\www . On a alors la possibilité de voir le site pmwiki à l’adresse du local host 127.0.0.1 dans la barre d’adresse. Il faut ensuite changer les pages dans le répertoire wiki.d et mettre celle du site voulu. Laurent Penou, administrateur du suite nous a transmis ces fichiers. Il nous était maintenant possible d’afficher le site d’HanditecAM sur le serveur local. Il faut ensuite télécharger le skin leanskin pour que le site en local apparaissent car sur le réseau Internet. Le dossier leanskin contient différent fichier avec les extension suivante : Leanskin.tmpl : le fichier template indique l’aspect général du site barre du haut, colonne du menu mais aussi la fenêtre principale au centre Leanskin.css : la feuille de style qui décris toutes les caractéristiques taille de police, couleur de police, couleur de fond…

Deuxième étape : Description du fichier CSS du skin

Toutes les caractéristiques du site sont donc dans le fichier css qui est un fichier texte, il a donc fallu chercher ce que ces caractéristiques représentaient. Le moyen le plus simple est la modification, ligne après ligne, on modifie certaines caractéristiques pour savoir sur quoi elle influe. Par exemple, sizefont correspond à la taille de la police mais de quel partie du site : le menu, les liens, la fenêtre d’édition…

Une fois cette étape passée, nous avions le fichier css commenté, il ne nous suffisait de changer les caractéristiques que nous voulions pour avoir le style voulu.

Troisième étape : Modification et création des nouveaux skins

Notre but était de permettre une vision facile aux malvoyants, il nous fallait donc changer la taille des polices et la couleur des polices ainsi que la couleur de fond pour avoir du contraste. A chaque style correspond un dossier skin. Nous avons crée deux skin différents, un avec des caractères très gros avec enlèvement de la colonne du menu, et un avec des caractères plus petit mais grossi par rapport au skin de base mais cette fois nous avons garder la colonne du menu.

Il ne suffisait plus que d’insérer une nouvelle page sur le site sur son accessibilité avec le choix des skins que l’on voulait mettre en place. Cette fonction était possible grâce à {$Name}?setskin=moyencaract ce qui crée un lien, quand on clique sur ce lien la feuille de style change instantanément.

Vocale

Parce que la plupart des handicapés on en encore des capacités auditives, nous avons décidé d’ajouter à l’écrit, la parole. Le moyen le plus simple était de s’enregistrer pendant la lecture des pages Internet, à hautes voix, grâce au logiciel Audacity qui permet directement d’enregistrer sous format mp3. Pour lire ces enregistrements il nous a fallu ajouter un lecteur, avec l’aide de Laurent Penou, nous avons pu ajouter un lecteur conçu pour les wiki et d’utilisation très simple. Pour entendre la page il suffit de cliquer sur le lien prévu à cet effet.

Couleur du site

L’aspect général du site est lié au Wiki, plusieurs développeurs ont créés différents skins pour les pages Internet en wiki. Nous avons choisi de mettre pour notre site une présentation simple sans trop de fioritures. Nous avons donc pris nommé Leanskin qui est très sobre, mais avec des couleurs assez ternes (blanc, gris). Nous avons donc décider de changer ces couleurs grâce à la modification du fichier CSS de la même façon que nous avions changé la taille de la police. Le plus dur est de trouver des couleurs qui vont ensemble et plaisent. Un logiciel développé au labo NTC permet d’avoir différentes palettes de couleur qui vont bien ensemble. Nous avons donc testé les différentes combinaisons, puis nous les avons proposé à M. Camille Mathieu qui ne trouvait que ces couleurs étaient trop vives. Nous avons donc trouvé grâce à M. Meurville une palette de couleur pastel. En jouant sur la luminescence de la couleur jaune nous avons trouvé un arrangement qui plait à M. Mathieu.

Voici une ce que ce la donne :

<< I.PACKAGES | RapportDuPFE | III.Les relations avec l’extérieur >>