Conception web
Bac à sable
Des esquisses, des exercices de style (en cascade), des tests.
-
Cave de la Pierre - Commande
Test de formulaire de commande de vins pour le site d'une cave, avec diverses fonctions JavaScript pour calculer le total ou valider automatiquement les entrées de l'utilisateur.
Pour l'heure cette page n'a pas été testée en dehors de Firefox 2 et son fonctionnement (en particulier le code JavaScript) n'est pas garanti sur les autres navigateurs.
-
Cave de la Pierre - Admin
Un test de console d'administration liée au formulaire de l'entrée précédente, et qui permet de modifier les produits existant (prix, nom, etc), d'en ajouter ou d'en supprimer.
C'est encore un "work in progress" : le bouton du formulaire ne fait que retourner l'ensemble des valeurs, mais ne modifie pas réellement les données.
Ici encore, cette page n'a pas été testée en dehors de Firefox 2 et son fonctionnement n'est pas garanti sur les autres navigateurs.
-
Tables vs. CSS
Ceci n'est pas un site ou une page web, mais une comparaison édifiante. Dans le cadre d'un travail effectué pour Horus sur un site dont je tairai le nom, j'ai comparé les codes sources respectifs de deux versions du site : la première (en rouge) réalisée suivant la "bonne vieille méthode" des tables imbriquées servant à définir la présentation de la page; la deuxième (en bleu) que j'ai réalisé moi-même en CSS pur.
La résultat est spectaculaire : en plus de reposer sur un code effroyablement compliqué, très difficile à entretenir, non conforme aux standards du HTML, et sémantiquement aberrant, la version en tables représente un fichier dix fois plus volumineux que la version CSS, qui repose sur un code relativement simple, très souple, conforme aux standards et sémantiquement correct.
L'ironie, c'est que la version en tables utilise également un fichier CSS à diverses fins de présentation, et que ce fichier (qui n'est pas pris en compte sur l'image ci-contre) est presque aussi volumineux que le fichier CSS de l'autre version.
-
CSS Zen Garden : Nuages
Lancé en 2001, le site CSS Zen Garden se veut une démonstration des possibilités offertes, en matière de présentation et de design, par l'emploi des feuilles de style (CSS) dans une page web. Le principe est simple : chacun peut y aller de sa contribution et proposer au créateur du site sa propre variation visuelle, mais sur un contenu prédéfini et rigoureusement invariable. Autrement dit, le document HTML (XHTML pour être plus précis) reste toujours rigoureusement le même; seul le contenu de la feuille de style (et des images qui y sont éventuellement associées) change.
La créativité des gens n'en est pas bridée pour autant, et les nombreuses contributions retenues pour figurer sur le site explorent des style graphiques variés et contrastés.
"Nuages" est donc ma version du "Jardin Zen des CSS". Je l'ai soumise au site officiel qui ne l'a pas sélectionnée, en raison d'un bug (que je n'avais pas remarqué à l'époque) qui rendait une partie des liens inaccessibles. Ce bug a été corrigé dans la version actuelle. Le site officiel liste néanmoins ma contribution dans les catégories 2 Column, Black & White et... Special Effects. ^^
A noter que cette version offre une présentation légèrement différente si vous utilisez Internet Explorer 6 --une subtilité rendue nécessaire pour pallier à quelques faiblesses de ce navigateur concernant le positionnement des images d'arrière-plan.
-
Critiques Cinéma
Une série de petites critiques de films, postées sur le site cine.ch. A l'époque il s'agissait surtout d'expérimenter une façon (nouvelle pour moi) de présenter une page web : en utilisant des tableaux imbriqués et des images pour structurer et encadrer le texte.
Ce genre de pratique est aujourd'hui banni (à juste titre) et je ne présente ce site que pour des raisons nostalgiques et éventuellement esthétiques ;-).
-
"Golden" - Test de mise en page
Un simple test de présentation (le contenu n'a aucune importance, c'est juste pour remplir).
Ici encore, utilisation abusive des tables pour réaliser la mise en page...