Les recours disparus du web

[Attention, cet article est optimisé pour Netscape]

Dans mon article sur les environnements de travail, j’ai caricaturé les ancêtres qui ont connu les débuts d’Internet en les tournant à la dérision. Suite à ça, une grande remise en question a été faite: qui suis-je, moi, jeune développeur en culottes courtes, pour me moquer ainsi de la vieille génération et de leurs méthodes archaïques ? D’où me permettrais-je de critiquer les recours d’antan qui ont constitué les prémices du web et qui ont façonné l’image des sites que l’on connait aujourd’hui ?

J’ai eu tort, je le reconnais. Je me dois de comprendre les origines. Et pourquoi se contenter de s’en inspirer alors qu’on pourrait simplement les utiliser à nouveau ? Je pense que 8bitstudio pourrait se démarquer par un radical retour aux sources.

Allez, c’est décidé. Je monte au grenier dépoussiérer le Powerbook entre la Gameboy et les pogs, ouvrir Nescape et Dreamweaver, et c’est parti !

Marquee et blink

<marquee> et <blink>, en voilà des balises efficaces ! Rappelez-vous; ça leur permettait de respectivement faire défiler et clignoter du texte. Un moyen simple et rapide pour rendre les sites moins statiques. Pourquoi se casser la tête à faire du motion design ?! C’est pour les cakes ! Regardez-moi ça si c’est pas beau:

FELICITATIONS !! VOUS ÊTES LE 999.999ème VISITEUR DE 8BITSTUDIO. CLIQUEZ POUR RECEVOIR VOTRE CADEAU

Flash

Tant qu’on parle d’interaction design, pourquoi a-t-on laissé mourir Flash ? Avec cette technologie de pointe, les possibilités étaient infinies, garantissant des animations fluides couplées à des performances époustouflantes !

Layout table

Moi, je comprends plus rien aujourd’hui pour la mise en page. La grille bootstrap, les flexbox, les grids system CSS natifs… Tout ça pour quoi ? Avoir notre site « responsive » ?

Jadis on se prenait pas le chou: le site était 800×600, design en <table> et c’était réglé ! On mettait un gros tableau sur toute la page et on avait nos row et nos col-x. Pour la navigation, dans un petit <frameset>.

Design images

Ça me gonfle toutes ces propriétés CSS. Il y en a partout ! Et que je te mets du border-radius par-ci, et que je te mets du linear-gradient par-là. Et bonjour les comptabilités entre navigateurs, hein. Parce que mettre à jour son tasker pour lancer l’auto-prefixer pour rendre compatible sur tous les browsers le petit ombrage sur le titre principal, c’est bien joli, mais c’était quand même plus simple avant.

Quatre petites images de bords arrondis pour les boutons, un joli pattern répété en background, un spacer.gif… On faisait du design avec des images et ça allait très bien ! Et si vraiment on avait pas trop le temps, un peu d’image mapping: ajout de zones cliquables directement sur la maquette. J’adore !

Bannières et gifs

Parlons un peu de digital marketing. Qu’est-ce que c’est que cette invention encore ? C’est pas optimal ces trucs de Pixel Facebook et pubs Instagram. Je vais vous montrer, moi, comment on génère du clic:

Kits graphiques

C’était un peu un mix entre un thème WordPress et un Framework: on récupérait tous les fichiers pour avoir un joli site template tout fait et on avait plus qu’à changer quelques contenus. Voici pour le plaisir de vos yeux quelques sites qui en liste encore.
http://www.kitgraphique.com/
http://www.kits-graphiques-deluxe.com/
http://www.kitsgratuits.com/
http://www.kitgraphiques.net/

Snippets js

Les sites sont tellement mous ces temps. Pourquoi on n’utilise plus ces petits bouts de code JS à la mode ? Où sont passés la trainée arc-en-ciel derrière le curseur, la neige qui tombe en background, le compteur de visite, le livre d’or… Pour redécouvrir ces merveilles, jetez un oeil par ici:
http://www.yaldex.com/
http://javascript-fx.com/mouse_trail/index.html

Bonus

Malgré mes recherches approfondies, je dois me rendre à l’évidence: si je veux être efficace en matière de développement et de design, je dois me tourner auprès des meilleurs. Heureusement, nous avons un expert dans l’agence qui a vécu cette époque. Voici, pour vous, ses premiers sites (nous passons par le site webarchive):

https://web.archive.org/web/20020803013351/http://www.etudiants.ch:80/
https://web.archive.org/web/20020603100409/http://www.thermalp.ch:80/

J’ai peur que dans ce cas, l’élève ne puisse dépasser le maître.