Le Dimanche 3 avril 2016 à Guadalajara
CC-BY-SA

Il y a un an aujourd'hui, à Hong-Kong, je commençais la migration du présent site de Drupal 7 à Drupal 8.

Au départ, ça ne devait n'être qu'une bête conversion, comme celle de Drupal 6 à 7, et ne prendre que quelques heures de travail. Mais j'y ai vu la possibilité de repenser entièrement le site, de le moderniser radicalement après 10 ans de quasi-immobilisme (car il n'y a pas de raison que les cordonniers soient toujours les plus mal chaussés).

Et puis, il y a quelques minutes, ému, mes doigts tremblotant sur le clavier, j'ai fait le grand saut :

$ git tag "v3.0.0"
$ git show v3.0.0
commit 05440c62ed102923c2f1d841383e2e2c7418a4bc
Author: Pierre <pierre.dureau.me>
Date:   Sun Apr 3 22:18:16 2016 -0500

J'ai donc l'immense plaisir de vous présenter mon site perso en version 3.0, publié le dimanche 3 avril 2016 à 22:40, heure de Guadalajara. Qu'en pensez-vous ?

Le site a été conçu avec quelques solides convictions en tête. Attention, après la ligne, ça devient un peu technique. Prêts ?


Minimum Viable Product

Pourquoi ? Je ne suis pas ultra-fan des méthodes agiles, mais certains concepts agiles m'ont beaucoup apporté. Notamment, le salvateur "always be shippable" (voir aussi le billet de Dries).

Comment ? La version précédente avait quatre fonctionnalités : accueil, carnet, voisinage et contact. La présente version n'a que la page d'accueil et le carnet, pour commencer. Les autres arriveront bientôt, quand je serai plus à l'aise avec certaines implémentations.

Aller plus loin ? Géolocalisation des billets, recherche avancée, agrégateur pour le voisinage… La réorganisation technique va faciliter la mise en œuvre de ces évolutions.

REST/Hypermedia

Pourquoi ? Parceque c'est du Web ! Et que je me prétend architecte...

Comment ? Les trois formats suivants ont été favorisés : XHTML, Atom (qui remplace le RSS que je n'ai jamais beaucoup aimé) et SVG. Que du XML, que du costaud, que de l'hypermédia, que du bon. Pas de JSON, non.

Et puis, bien sûr, HTTP GET pour les actions sûres et idempotentes et HTTP POST pour les autres.

Aller plus loin ? Il n'y a pas encore de mécanisme de négociation de contenu, car Drupal ne le gère pas nativement ("because browsers suck"). Et puis, il reste de quoi s'amuser du côté d'AtomPub.

Linked Data

Pourquoi ? C'est le grand rêve du Web, celui qu'on a longtemps appelé "sémantique" et qu'on a voulu rendre intelligent. Moi, je continue à y croire, surtout que des petits usages concrets bien sympas sont apparus les dernières années, chez Facebook, Twitter ou Google.

Comment ? Le site a d'abord été conçu comme un grand graph RDF, puis implémenté avec le système d'entités de Drupal. C'était une manière très agréable de travailler, seulement contraint par la sémantique des propriétés RDF d'une part, et par la reprise des URL du site existant d'autre part.

Au sein de chaque page, ce graphe est matérialisé dans des annotations RDFa, avec à chaque fois :

  • la propriété du vocabulaire schema.org car c'est devenu la norme,
  • la propriété des bons vieux vocabulaires "legacy" (DC, SIOC, SKOS…) car je suis un grand sentimental.

Aller plus loin ? Mon graphe n'est pas vraiment connecté au web of data, il y a pourtant des données intéressantes à lier pour améliorer l'expérience de mes visiteurs. Par exemple, les localisations des billets avec les donnéees de wikipedia ou celles d'openstreetmap.

Uncomplicated Web

Pourquoi ? Le Web est bloated. Il devient inutilement compliqué, lent et lourd. Des initiatives comme AMP montrent qu'il y a un réel besoin de revenir à plus de simplicité et légèreté.

Comment ? En gros, le site est quasi-conforme avec cette excellente liste d'erlehmann. Les formats choisis, en plus d'être hypermédias, sont déclaratifs et peu capables.

Le site ne contient presque pas de JS, vous pouvez le désactiver sans être pénalisé et il y en aura sûrement de moins en moins. Il n'y a pas de cookies non plus pour les anonymes, sauf Piwik.

Aller plus loin ? Je réfléchis à des moyens de rendre les pages plus légères. Car mon obstination à ne pas utiliser de CURIEs ainsi que les nouvelles illustrations HD (avec un grain 2,6 fois plus fin que les anciennes), ont annulé la plupart des optimisations faites par ailleurs.

Material Design

Pourquoi ? Me méfiant du "design pour le design" et un peu fatigué par toutes ces années à collaborer avec des agences de com', j'ai été séduit par la présentation du Material Design par Mathias Duarte en juin 2014. Design as a visual language. Oui !

Comment ? Je me suis principalement inspiré des sections Material is the metaphor et Bold, graphic, intentional, et j'ai repris la police Roboto et une partie de la palette de couleurs. J'éspère ainsi que mon site est plus clair, agréable et joli, quel que soit le support de navigation.

Le tout en responsive design évidemment, ce n'est plus un débat en 2016, (presque) sans breakpoints s'il vous plaît. Et puis, plus de menu global. Parceque c'est bon de se faire plaisir.

Aller plus loin ? Il me manque la partie Motion provides meaning. Il faut que je me plonge dans les transitions et animations CSS.

Commentaires

Cool ! J'ai donc l'immense…

syb

Profile picture for user syb
Lundi 4 avril 2016 - 13:19

Cool ! J'ai donc l'immense honneur d'être le premier à laisser un commentaire sur le 3.0.

Syb, groupie 3.0

lolo

Profile picture for user lolo
Lundi 4 avril 2016 - 21:03

Syb, groupie 3.0

Lolo, jalouse 3.0

syb

Profile picture for user syb
Lundi 4 avril 2016 - 21:04

Lolo, jalouse 3.0

"réflexions philosophico…

lolo

Profile picture for user lolo
Lundi 4 avril 2016 - 21:04

"réflexions philosophico-techniques" <3
Hâte :D

Ne vous disputez pas les…

pierre

Profile picture for user pierre
Mardi 5 avril 2016 - 01:27

Ne vous disputez pas les enfants, je vous aime tous les deux.

@Lolo: Le billet a été mis à…

pierre

Profile picture for user pierre
Mardi 5 avril 2016 - 04:05

@Lolo: Le billet a été mis à jour avec tout le blabla philo-tech, pour ton plus grand plaisir.

Coucou! Top la nouvelle…

Ariel

A
Jeudi 7 avril 2016 - 08:58

Coucou! Top la nouvelle version je trouve, sympa le nouvel habillage... et pour les spec tehniques; c'est sûrement du très bon boulot.. ;-)

Merci pour les félicitations…

pierre

Profile picture for user pierre
Dimanche 10 avril 2016 - 06:16

Merci pour les félicitations. D'ailleurs, j’attends tes créations Web avec curiosité et un peu d'impatience...

"Ariel", c'est ton nouveau pseudo ou une faute de frappe ?

J'avoue tu m'as perdu sur la…

pididi

Profile picture for user pididi
Mercredi 13 avril 2016 - 17:30

J'avoue tu m'as perdu sur la partie technique... Mais le look de ce nouveau blog est très beau!

This is AWESOME!! Sorry for…

Wanyi

W
Mercredi 20 avril 2016 - 20:12

This is AWESOME!! Sorry for my very late congratulations and sharing of my excitement of your new website... it is a one-of-a-kind unique down-to-earth Pierre website :)

10 years! Well done!!

Happy and safe travels ;)

Thanks you Wanyi. …

pierre

Profile picture for user pierre
Vendredi 22 avril 2016 - 22:22

Thanks you Wanyi.

It is never too late for congratulations. I take them!

Super boulot ! J'espère que…

Paul

P
camicas.me
Dimanche 19 juin 2016 - 16:03

Super boulot ! J'espère que tu n'as pas eu trop de difficultés à trouver des modules D8 viables :) Le rendu est au rendez-vous, j'aime bien l'ergonomie en wide screen (à par la homepage qui n'est optimisée que pour mobile de mon point de vue), et je ne peux qu'être sensible à la touche material design. C'est mainstream avec ce qu'il faut de hors-norme. Bref, c'est réussi ;)

Merci Paul pour ce petit…

pierre

Profile picture for user pierre
Lundi 20 juin 2016 - 04:41

Merci Paul pour ce petit retour.

Je n'ai pas eu de soucis pour les modules Drupal 8. Il y en a seulement deux qui ne sont pas encore prêts (mais ce sont des fonctionnalités backoffice, alors ce n'est pas très grave) :

  • linkchecker
  • unique_field

Et il y a deux alternatives qui me font encore hésiter aujourd'hui :

  • file_entity VS media_entity
  • Pour le cache : memcache_storage VS redis

Sinon, Drupal 8, c'est que du bonheur. Le développement (avec les API plugins et services), la maintenance (l'orienté-objet isole bien les composants et réduit les effets de bord des modifications) et le déploiement (avec la config API) sont beaucoup plus faciles et solides qu'avant. La promesse est tenue : l'aisance fonctionnelle de Drupal avec l'architecture sérieuse de Symfony2.

Sympa ton site, aussi. C'est du custom single page avec bootstrap ?

its me blippi Do you…

Anna

A
google.com
Vendredi 26 avril 2024 - 20:03

its me blippi Do you remember B L I P P I.

I've been deep down…

Ladonnarab

L
Jeudi 26 septembre 2024 - 01:45

I've been deep down impressed with CBD gummies and like thc gummies online. They're not at worst tasty but also incredibly nearby as a replacement for getting a everyday dosage of CBD. I friendship how cautious they are, making them fully realized for when I'm on the go. I've as an individual noticed they steal me rest and sleep better, specially after a stressful day. The steadfast dosage in each gummy also takes the guesswork out of pocket of managing how much CBD I'm consuming. If you're point of view of trying CBD, gummies are a great option—equitable be positive to buy off from a trusted tag repayment for the best results!

Le contenu de ce champ sera maintenu privé et ne sera pas affiché publiquement.
À propos des formats de texte

HTML simple

  • Les adresses de pages web et les adresses courriel se transforment en liens automatiquement.
  • Les lignes et les paragraphes vont à la ligne automatiquement.