C’est fait ! Bien sûr, ce n’est pas extraordinaire, ce n’est peut-être pas d’une grande originalité, mais c’est fait : Ralentir travaux a subi un (léger) lifting. Le site gagne même un logo dont je vous laisse deviner la signification. Il s’agrémente de quelques couleurs (oui, il y a du bleu). Les changements ne sont toutefois pas que d’ordre cosmétique, le code a été revu, quelques nouveautés font leur apparition. Et cette réfection m’a donné plein d’idées à exploiter dans un avenir proche.
HTML 5 et CSS 3
Tout d’abord Ralentir travaux est désormais en HTML 5. Pour cela, je n’ai pas dû changer grand-chose. Un doctype. Quelques balises nouvelles (header, section, footer, etc.). Un peu de CSS3. Rien de très complexe. Des effets d’ombre, des coins arrondis, des dégradés, quelques colonnes, etc. De ce point de vue, je ne suis pas allé aussi loin que je le désirais. Il faudra attendre la prochaine révision, quand j’aurais acquis des connaissances plus approfondies. Cependant, je recherche avant tout la simplicité. Celle que l’on trouve, par exemple, dans une application comme Instapaper pour iPad dont le succès me conforte dans mes choix esthétiques : un dépouillement qui ne laisse que l’essentiel, le texte. J’aurais quand même voulu procéder à quelques raffinements, quelque chose qui se rapproche de la mise en page d’un journal papier avec des colonnes, mais là encore ce sera pour la prochaine fois.
De toute façon, me replonger dans les techniques du web m’a remis le pied à l’étrier, m’a donné l’envie, et peut-être, dans quelque temps, la possibilité de faire mieux encore, quand j’en aurais appris davantage. À ce propos, j’ai quand même pu corriger quelques erreurs dans le code, des grossièretés de débutant, et je suis bien aise de m’en être débarrassé. Peut-être y en a-t-il d’autres… Et que de pages à corriger ! Ralentir travaux demandera un jour un travail à plein temps !
Comme mes capacités en JavaScript sont toujours aussi limitées, j’ai eu recours à Hype qui m’a bien aidé pour réaliser un «Slide» afin de présenter les grandes parties du site. Cela s’appelle Visite guidée.
J’oubliais ! En bas, de la page d’accueil, il y a une petite subtilité esthétique qui fait défiler le texte. Si l’idée et sa réalisation ne sont pas de moi, c’est quand même bien joli.
Quelques ajouts
Avant de procéder à quelques ajouts, j’ai supprimé la partie Voir, qui n’était plus mise à jour depuis longtemps. La menu n’affiche donc plus que quatre parties : l’actualité, les lettres, le blog (vous y êtes) et les liens. C’est évidemment dans la deuxième que se concentre l’essentiel du site accessible à partir de cette page.
J’ai essayé d’améliorer le référencement interne en ajoutant à chaque page (en fait, pas tout à fait, j’y travaille encore) une sélection de liens susceptibles d’intéresser le visiteur.
Mais la plus grande nouveauté est la possibilité de commenter chaque page. Dans un premier temps, je ne voulais ajouter cela que dans la partie Cours, mais emporté dans mon élan, je l’ai ajouté sur chacune des pages. Un bon millier (à la louche). Le but est de permettre la discussion, de demander une précision, de corriger une erreur, etc. Là encore, dans un avenir plus ou moins proche, j’aimerais permettre davantage d’interaction comme la possibilité de modifier, de personnaliser les pages.
Pour finir
Pour finir, je voudrais rendre à César ce qui est à César et remercier les auteurs de sites qui m’ont aidé, d’une façon ou d’une autre, dans la réalisation du mien.
J’ai toujours été inspiré par les designs minimalistes comme celui d’Apple. J’ai bien aimé également ce site très épuré. Pixeden m’a fourni de jolies images. Les générateurs en tout genre m’ont apporté une aide précieuse : Ultimate CSS Gradient Generator, Support du web pour les coins arrondis, CSS3 generator, Générateur de multi-colonnes en CSS3, CSS menumaker, un autre CSS3 Generator, CSSDeck, CCS 3.0 Maker, etc.
Et ensuite ?
Beaucoup de choses me font envie. Il m’a toujours semblé que je devais vraiment me mettre au JavaScript, mais aujourd’hui la priorité me semble devoir être accordée à l’apprentissage du CSS et de ses propriétés vraiment surprenantes. Parmi celles-ci, j’aimerais intégrer de pareilles transitions pour passer d’une page à l’autre. J’avais été très impressionné par Paperfold CSS. Il y aussi des animations rigolotes : Ring Menu, Dynamic Stack of Index Cards, CSS3 Rotating menu qui marche très mal avec Safari, CSS3 ordered list style qui ne marche qu’avec Firefox, etc.
Bref, pas mal de travail en perspective.