Stiftung Ökologie & Landbau

SÖL (Stiftung Ökologie und Landbau) est une importante institution dans le monde Bio. Revelate fut appelé à refaire le design de leur site principal (www.soel.de, un des plus importants du secteur.) Par la suite nous avons lance un site séparé pour Gut Hohenberg, leur ferme de recherche scientifique et éducationnelle.

Le site original souffrait de divers problèmes:

• Une structure en cadres, créant des problèmes avec les moteurs de recherches, les favoris et les écrans de petite taille.
• Un manque de clarté dans la structure de navigation, rendant difficile l'appréciation du volume de contenu (plus de 1000 documents), et encore plus difficile la recherche.
• Une esthétique peu aboutie

Design

Afin de mettre au point l'ergonomie, les cadres furent retires et les améliorations suivantes effectuées:

• Indexes de haut niveau complets, avec explications des sous catégories
• Une barre de navigation hiérarchique pour indication la position de chaque page en relation a la hiérarchie du site
• Fonction de recherche plus poussée
• Une section a l’intention des nouveaux visiteurs.
• Une homepage plus claire (voir la section "homepage")

Visuellement le design fut base sur celui d'un journal, afin de refléter l'activité principale de SÖL comme fournisseur d'informations. Il était également important de le rendre plus clair et léger. Sur les pages clefs, nous avons introduit divers éléments visuels afin d'améliorer l'appréciation au premier coup d’œil et l'esthétique.

Homepage

La homepage de soel.de est principalement constituée de nouvelles, ce qui a toujours été fort populaire auprès des visiteurs. Toutefois, la home ne fonctionnait pas comme point d'accès au reste du site, et ne représentait pas clairement l'organisation aux nouveaux visiteurs.

Une partie du problème était que tous les éléments avaient le même aspect visuel, sans hiérarchie qui permettrait de guider l’œil et comprendre les possibilités sans avoir besoin de lire chaque lien.

La solution consista en représentant chaque élément sous une forme cohérente. Par exemple le lien vers l'importante base de données d'adresses et maintenant un formulaire de recherche complet, qui a pour avantages d'attirer l'attention tout en étant une manière pratique d'accéder a la base de données depuis la homepage.

En maintenant les nouvelles très haut sur la page, nous nous sommes assures que nos améliorations ne furent pas réalisées aux dépends des visiteurs réguliers.

Implémentation

Nous souhaitions déranger le moins possible la méthode de travail des rédacteurs du site, qui étaient habitués à travailler des pages simples avec Macromedia Dreamweaver.

Toutefois il était nécessaire de séparer la présentation et le contenu, ainsi qu'une manière d'effectuer des changements répercutés sur toutes les pages du site (typiquement affectant à la barre de navigation.)

Nous savions d'avance que lorsque la structure entière de navigation est placée sur chaque par via des 'Server Side Includes', les rédacteurs pouvaient facilement errer avec Dreamweaver et brisaient occasionnellement la mise en page du document sur lequel ils travaillaient.

Par ailleurs il était clair qu'une solution complète de gestion de contenu (CMS) n'était pas appropriée:

• Coûteux a l'achat et l'implémentation
• Impliquerait l'import de tous les documents dans le format du CMS
• Les adresses seraient différentes, créant un chaos de liens brises. Elles seraient également du format plutôt cryptique du CMS, rendant leur communication offline (par exemple par téléphone) quasi-impossible
• La flexibilité de Dreamweaver serait absente
• Les rédacteurs étaient déjà familiers avec Dreamweaver.

Afin de résoudre ce problème nous avons développé un logiciel en PHP qui permet d'ajouter les éléments de navigation autour des pages HTML, de manière dynamique.

Considérez cette adresse:

www.soel.de/projekte/internet.html

Bien que d'apparence normale, la section "/projekte/" n'est pas en fait un dossier, mais pointe vers un programme écrit en PHP. La partie "/internet.html" indique que le programme doit allez chercher la page "internet.html", qui se trouve dans un dossier complètement distinct.

Le logiciel doit ensuite identifier et re-écrire les liens des images et les autres pages HTML, pour les harmoniser avec la nouvelle position de la page. Finalement, la page est emballée avec les éléments globaux (navigation, pied de page, etc.) et livrée a l'utilisateur.

Tout ceci est un dur labeur pour le serveur, donc une fois calculée, la page complète est stockée dans une cache qui est mise a jour automatiquement lorsqu'un changement est effectue sur une page. Cette précaution résulte en une performance seulement légèrement moindre qu'une page HTML standard, et un ordre de grandeur plus rapide qu'une solution avec base de données.

Le plus important est que ce système fut particulièrement bien reçu par les rédacteurs pour une raison simple: Ils n'ont du se préoccuper de rien. Ni changer leur manière de travailler, ni passer de longues heures à corriger des liens briser ou autres problèmes généralement associés a un changement aussi radical.

Ils se sont simplement couchés un soir avec un site de bon contenu mais de design médiocre. Le lendemain, le même contenu était présent, mais avec un design excellent.

Gut Hohenberg

Gut Hohenberg est la ferme de recherche scientifique et activités pédagogiques de SÖL.

Au vu de son importance croissante au sein de l'organisation et son public plus large, il était clair qu'il y'avait un besoin pour un site séparé.

Pour rester cohérents, le design de base de soel.de fut utilise, amis avec un système de navigation plus approprie a un petit site. En termes de look, le design représenté l'aspect ludique de la ferme et fait grand usage de photographies.

L'implémentation est la même que soel.de, permettant que le site soit régulièrement mis à jour depuis la ferme même. Une fonctionnalité supplémentaire est la rotation aléatoire de photos et illustrations.