Utilisation du contrôle de remplissage pour le bloc Groupe dans l'éditeur WordPress.
Ajuster le remplissage sur un bloc de groupe.

Quand Gutenberg 9.0 a atterri plus tôt cette semaine, il est venu avec une expérience contrôle de remplissage pour le bloc Groupe. La plupart des utilisateurs ne le verront que si leur thème a choisi de prendre en charge la fonctionnalité à l’aide de experimental-custom-spacing drapeau.

Ce n’était pas le premier que nous ayons vu de l’option de remplissage sur un bloc. Gutenberg 8.3 l’a introduit pour le bloc Cover. Depuis, rien n’a changé avec l’implémentation.

Le problème avec l’option d’espacement / remplissage personnalisé est qu’elle crée un style en ligne qui ne s’ajuste pas en fonction de la conception du thème. Heureusement, la fonctionnalité est encore expérimentale. Cela signifie que nous avons le temps de réévaluer son fonctionnement.

À moins que nous ne supprimions toute illusion restante selon laquelle les thèmes joueront un aspect important du futur de WordPress et que la conception frontale deviendra pleinement ancrée dans le noyau, les auteurs de thèmes ont besoin d’un certain niveau de contrôle. Et, même si les thèmes suivent le même chemin que le dinosaure, les numéros de remplissage personnalisés au niveau du bloc créeront des problèmes de cohérence de conception sur la route. L’utilisation de 100 pixels de remplissage peut avoir du sens dans la conception actuelle d’un site, mais 96 pixels peut avoir du sens dans une conception future. Lorsqu’un utilisateur ajoute des dizaines ou des centaines de blocs avec un rembourrage personnalisé aujourd’hui, cela fera des ravages sur l’espacement et le rythme de demain.

En plus de cela, l’utilisateur moyen a peu de notions de règles de conception. Avoir un système standardisé d’espacement donnerait aux auteurs de thèmes le contrôle de la sortie tout en donnant aux utilisateurs finaux la possibilité de personnaliser l’apparence.

J’ai soutenu que WordPress a besoin d’une sorte de cadre de conception. Par exemple, Tailwind CSS a des classes de remplissage spécifiques. Il en va de même pour Bootstrap et presque tous les autres frameworks CSS. La communauté du développement Web est dans cette voie. C’est une voie bien tracée, et WordPress n’innove pas en utilisant des styles en ligne.

Si la plate-forme WordPress veut mettre ce type de pouvoir entre les mains de ses utilisateurs, elle devrait le faire d’une manière qui permette aux concepteurs de faire leur travail et de ne pas pousser les utilisateurs vers une soupe semi-permanente de style en ligne dans leur contenu.

Avant Gutenberg, j’aurais été entièrement contre l’idée que WordPress introduise toute sorte de CSS ou de cadre de conception. Cependant, la plate-forme évolue constamment pour devenir un outil de conception basé sur l’interface utilisateur plutôt qu’un simple moyen de gérer le contenu. Les utilisateurs disposeront d’options liées à la conception à l’échelle mondiale, jusqu’aux blocs individuels. Les utilisateurs doivent absolument avoir la possibilité d’ajuster le rembourrage d’un bloc dans un tel système. Ils ne devraient pas avoir besoin d’une compréhension de CSS pour ce faire. Au lieu de cela, dans la plupart des cas d’utilisation, les utilisateurs devraient être en mesure d’ajuster le remplissage en fonction du fait qu’ils souhaitent un espacement plus grand ou plus petit, et non des valeurs CSS spécifiques.

Je propose un ensemble complet de classes de rembourrage standardisées. Il en irait de même pour les marges ou d’autres options liées à la conception plus tard. Gutenberg / WordPress devrait créer un ensemble de valeurs par défaut pour ces classes, que les auteurs de thèmes pourraient remplacer en fonction de leur conception.

Ce n’est pas un nouveau concept. Dave Smith, développeur pour Automattic, a présenté un patch en 2019 qui utilisait des sélecteurs nommés pour l’espacement sur le bloc Groupe. Il a donné le raisonnement suivant pour choisir cette approche par rapport aux valeurs absolues:

Imaginez que vous êtes un concepteur de thèmes. Vous créez votre CSS avec un espacement parfait pour la conception. Vous voulez vous assurer que cela est cohérent dans tout votre thème, même si la mise en page est créée par l’utilisateur final dans l’éditeur de blocs.

Avec l’approche que j’ai adoptée ici, lorsqu’une taille est sélectionnée, seules les classes sont ajoutées au bloc dans le DOM. Cela permet au créateur de thème de fournir des tailles personnalisées en CSS adaptées à son thème. S’ils choisissent de ne pas le faire, des valeurs par défaut raisonnables sont fournies.

Avec l’approche des pixels, nous verrouillons les utilisateurs du bloc dans des valeurs absolues et leur demandons de prendre de nombreuses décisions qu’ils préféreraient probablement ne pas avoir à prendre. Cela pourrait également conduire à une expérience visuelle incohérente.

Ce navire a déjà navigué et coulé avec des couleurs et des tailles de police personnalisées. Gutenberg a eu l’occasion de standardiser les noms de classe pour ces options, mais a laissé le soin aux auteurs de thèmes. Par conséquent, il n’existe pas de norme sur le marché des thèmes, ce qui signifie que le choix de la taille de police “grande” ou de la couleur de texte “bleue” fournie par le thème ne se répercutera probablement pas sur le thème suivant de l’utilisateur. Maintenant, nous sommes sur le point de proposer beaucoup plus d’options liées à la conception alors que WordPress se dirige vers l’édition complète du site. Il est temps de considérer certaines normes sur les noms de classe liés à la conception et de fournir un cadre que tous les thèmes peuvent utiliser.

Gutenberg pourrait encore fournir un Douane option de remplissage comme pour les couleurs et les tailles de police. Les utilisateurs qui choisissent d’emprunter cette voie feraient un choix explicite de travailler en dehors de la norme. Mais n’allons pas dans cette voie qui consiste à permettre aux utilisateurs de définir des valeurs d’espacement absolues comme option par défaut.


Source link