La Création Du Site

Nous avons fait le choix dès le départ de créer le site de A à Z, sans passer par une quelconque plateforme web, dans le but de nous confronter pleinement au xhtml et au css, ainsi qu'à tous les problèmes de compatibilité entre les navigateurs. Cela inclut le fait qu'il faut respecter les standards du W3C. La création du site s'est faite au fur et à mesure et n'a pas été une mince affaire ! Voici les différentes étapes en détail :

Définition de la charte graphique

Cette étape a consisté à choisir quelles couleurs et quelles images pouvaient permettre à notre mot d'être mis en valeur. Nous avons finalement choisi une image de fond représentant la nature et crée une bannière qui soit aussi en lien direct avec le concept d'environnement. La palette de couleurs choisie a été des tons verts et bleus. Puis, nous avons décidé de créer une transparence pour la bloc principal du site, celui qui était destiné à disposer tout le contenu. Enfin, grâce à notre connaissance d'html et de css (les feuilles de style en cascade), nous avons pu agencer le tout, pour créer un site qui nous paraissait représenterle mot "environnement". L'une des difficultés majeure a été de bien ajuster chaque bloc par rapport aux autres et surtout de les fixer, puis de faire en sorte que cette disposition soit compatible avec tous les navigateurs. Ainsi, concernant la transparence du bloc principal, il nous a fallu, dans le code css, ajouter une spécification pour Mozilla Firefox.

Il est également à noter que les bords arrondis de notre site ne sont pas pris en charge par Internet Explorer. Cela est du au fait que la manipulation utilisée, qui permet dans le css d'arrondir les bords d'un bloc de façon très rapide et sans passer par une étape graphique n'a toujours pas été validé par le W3C. De ce fait, Internet Explorer ne le prend pas en charge.

Définition et création du menu

Ensuite est venue l'étape de la création du menu. Il nous fallait tout d'abord définir quelles onglets nous allions créer dans notre menu. Pour ce faire, nous nous sommes inspirés du plan de travail. Il nous a paru logique de créer des onglets pour les scripts, les tableaux et les représentations graphiques, puisque ces trois catégories sont au coeur même du projet. L'onglet "Résultats" a été mis en place dans le but d'analyser les résultats et d'en tirer une conclusion. L'onglet "Etapes du projet" décrivant brièvement les trois étapes clés de notre travail nous a semblé primordial, afin de comprendre les tenants et les aboutissants de notre démarche. Finalement, les onglets "Remerciements" et "Liens" nous ont parus clôturer notre site en beauté. Nous avons utilisé du Javascript dans notre menu afin de créer un sous-menu ne s'affichant que lorsque l'utilisateur passe la souris sur les onglets divisés en sous-menus.

Liens des pages entre elles

Cette étape a consisté à relier entre elles toutes les pages html de notre site. Nous aurions pu tout aussi bien créer un modèle, mais étant donné le peu de pages traités nous n'en n'avons pas vu l'utilité. Cependant, nous avons opté pour l'utilisation d'un fichier css par page nous permettant ainsi de changer facilement l'aspect d'une page en particulier, si l'envie nous en prenait. Ainsi, nous nous laissons la liberté de ne pas travailler dans un contexte figé, mais de pouvoir modifier chaque page comme bon nous semble.

Intégration du contenu

Cette dernière étape consiste simplement à intégrer le contenu. C'est donc l'étape la plus facile dans la création du site, puisqu'une fois le site établi,il ne reste plus qu'à le remplir. Cependant, il a tout de même fallu créer les liens vers les scripts et faire en sorte que ces dernieres puissent être téléchargés, ce qui a nécessité quelques manipulations.

Problèmes rencontrés

Le problème de compatibilité entre les navigateurs a été le plus pénible, principalement en ce qui concerne Internet Explorer et les différentes versions de ce navigateur. De plus, l'usage des feuilles de style n'est pas une mince affaire et nécessite un niveau de connaissance avancé de ces dernières, afin de créer un site complet et performant.Nous nous sommes donc plongés dans l'études des feuilles de style et avons crée une feuille de style unique pour tout le site, afin de pouvoir modifier les styles du site beaucoup plus rapidement! Selon les directives du W3C,le xhtml ne doit constituer que le squelette du site, et le css tout son style. Donc, nous avons fait en sorte de laisser le moins de style possible dans le xhtml. Autre notion primordiale, le nom que l'on donne à nos id dans la feuille de style ! Ils doivent être clairs et précis, afin de pouvoir s'y retrouver à chaque utilisation. Enfin la création du menu n'a pas été évidente car nous y avons ajouté des éléments de javascript !