La nature d’une interface classique de site Web

Il est vrai que lorsque l’on surfe sur le Web, en dehors de quelques sites artistiques, aux interfaces et aux modes de navigation très personnels, comme Kinetic, Beetle, Jess and Russ, SpaceNeedle, Alquimia ou encore Make Your Money Matter, en dehors de ces quelques exemples (non exhaustifs), il n’y a rien qui distingue réellement un site d’un autre… tous semblent construits sur le même moule.

Nous allons approcher au cours de ce post, un mode d’analyse qui va nous permettre d’affiner notre regard, sur ces interfaces qui semblent à première vue identiques.

Présentation d’une interface classique de site Web

De manière générale, une grande partie des sites ‘non artistiques’ sont composés d’un bandeau de tête, de barres de menus et menus contextuels, d’un contenu plu-ri-média qui illustre la page en elle même (textes, images, animations…), d’annonceurs publicitaires sous forme de blocs statiques ou animés, d’un pied de page, etc… bref chaque site semble être construit à l’identique. [en cliquant dessus, l’image ci-contre propose une animation].

L’ensemble des informations, ou des images, changent de jour en jour, d’autres de visites en visites, ou parfois restent inchangées durant des mois….

Tout ceci bien sûr, répond étroitement aux besoins des objectifs du site… par exemple, un site d’informations journalistiques devra renouveler son contenu au rythme de l’actualité du monde, de même qu’un site marchand devra adapter les quantités disponibles d’un produit en fonction des stocks, ou les prix en fonction des promotions, alors qu’une page du site qui présente la charte qualité d’une entreprise, pourra ne pas modifier son contenu aussi fréquemment.

L’intégralité d’un site peut être élaboré sur un principe de maintenance, mais un seul et même site peut avoir besoin de diverses fréquences de mises à jour en fonction de ses rubriques.

Par exemple, la page d’accueil pourrait être actualisée de manière hebdomadaire en fonction de la stratégie de l’entreprise, la page reflétant les stocks options, elle, le sera en temps réel en fonction des fluctuations de la bourse, alors que la page présentant le trombinoscope des salariés sera, on l’espère, beaucoup plus statique dans le temps.

Chacun de ces besoins fait donc appel à des technologies ou des outils de mise en page différents et complémentaires. Cela nous permet de constater, que bien que le contenu visuel puisse sembler être identique d’un site à l’autre, les outils et les modes de construction, eux, peuvent être totalement divers. C’est en cela qu’on entend souvent parler de gestionnaires de contenu, de base de données, de javascript, d’interactivité, de langages serveur, d’AJAX etc… sans trop savoir où cela intervient et à quoi cela correspond… l’idée va être de repositionner l’ensemble des diverses familles de sites sur l’utilisation et l’interaction de ces technologies.

Donc, au travers de ces deux articles, voyons rapidement les principales familles ‘technologiques’ ainsi que les principales familles de ‘contenu’, bien sur, pour les sites les plus courant. Pour gérer tout cela et présenter ces divers types de contenu, nous employons des outils. Les outils coté client sont principalement des navigateurs (Firefox, Chromium, Edge, Opéra…), du coté serveur, nous avons généralement des serveurs web (Apache, IIS, ColdFusion…), des serveurs d’applications (PHP, ASP, JSP, CGI, PERL, CFML)… ainsi que des bases de données (MySQL, SQL Server, PostgreSQL…).

En résumé et de manière rapide, voire très réductrice , nous pourrions dire que coté client avec un navigateur on parle HTML, CSS, JavaScript, on parle alors d’Open Web Plateform, que coté serveur (entre serveur web et serveur d’application) on parle PHP, MySQL, directives .htaccess… et qu’entre les deux afin de pouvoir communiquer et échanger on parle HTTP, AJAX, Json, XML (ce sont les technologies serveurs).