Share
Le HTML est au cœur du Web. Parfois, dans le but de rendre les choses plus belles en utilisant CSS, nous l’oublions. Si vous avez déjà utilisé Sass (ou un compilateur CSS en général), vous avez probablement vu les styles de votre site se briser à cause d'une erreur de compilation. Mais avant de vous dépêcher de corriger l'erreur que vous venez de créer, profitez-en pour analyser et améliorer le cœur de votre site: le code HTML.
"L'échec est simplement l'occasion de recommencer, cette fois plus intelligemment." - Henry Ford
Normalement, je ne suis pas du genre cliché de motivation. Cependant, transformer un échec en une opportunité de succès peut être vrai lorsque vous utilisez Sass (ou n’importe quel compilateur CSS). Ours avec moi et je vais expliquer.
Si vous avez écrit CSS en utilisant Sass, vous avez sans doute vu une erreur de compilation. Dans la ligne de commande, cela ressemble à quelque chose comme ceci:
Erreur de syntaxe: CSS non valide après ".module": attendu "", était ""
Parfois, vous risquez de ne pas détecter cette erreur en ligne de commande. Cependant, vous remarquerez certainement l'erreur lorsque vous basculez vers le navigateur, car tout semble cassé.!
Votre première réaction pourrait être de revenir instantanément à votre éditeur de texte, de corriger l'erreur de syntaxe que vous venez d'introduire et de regarder le retour à la normale. Mais attendez une seconde! Cela pourrait être l’un de ces moments «transformer l’échec en opportunité».
Sass Break peut être une excellente occasion de voir votre site nu, complètement déshabillé. Pas de style, juste du HTML pur et non contaminé, l'essence même du Web. Vous voyez, lorsque le navigateur fait une demande, il récupère généralement un seul .html fichier-pur hyptertext-et c'est tout. Tout le reste (CSS et Javascript) est une amélioration. Comme Jeremy Keith déclare,
«Chaque ligne de CSS que vous écrivez est une suggestion. Vous ne dictez pas comment le code HTML doit être rendu; vous suggérez comment le code HTML devrait être rendu. Je trouve que c'est une idée très libératrice et stimulante. "
Les règles de style CSS sont quelques-unes des premières améliorations que vous avez apportées à un document HTML. suggestions, ne pas commandes, pour savoir à quoi la page devrait ressembler. Voir ces styles rompus peut être une occasion d'arrêter et d'analyser le cœur de votre page Web, le HTML, et de l'améliorer si besoin est. Le HTML est un format à long terme qui existe depuis assez longtemps. Non seulement le premier site Web fonctionne toujours, mais il est également réactif!
Comme Ian Yates a dit,
"Tous les sites Web sont réactifs par défaut, jusqu'à ce que nous commencions à ajouter des styles et à les supprimer."
Lorsque vous regardez le code HTML pur de votre page, posez-vous des questions telles que:
Accentsconagua
J'ai une idée: que diriez-vous de tester cela sur votre propre page Web existante en ce moment? Allez sur votre site, ouvrez les outils de développement, trouvez le .css classer votre site utilise, et supprimer toutes les règles de style.
Pointe: Alternativement, des extensions telles que le plugin Web Developer pour Chrome vous permettront de changer facilement de style CSS.
Regarde ça! Sur mon propre site, j'ai trouvé des améliorations à apporter. Il existe quelques éléments HTML non essentiels sans JavaScript. Je devrais supprimer ceux-ci afin qu'ils ne soient pas initialement présents dans le DOM et les ajouter plus tard avec JavaScript comme améliorations. De plus, certains composants de la liste pourraient être peaufinés et unifiés en sémantique. Mais ce n'est pas à propos de moi, revenons à parler de votre site Internet.
Parcourez votre page «nue» et essayez de lire le contenu. Est-ce que ça fait du sens? Les choses qui devraient être des en-têtes sont-elles marquées comme des en-têtes? Est-ce que les choses devraient être des listes de listes? Sinon, réévaluez votre balisage. Le HTML est ce qui constitue votre site Web à son niveau le plus élémentaire. Justin Jackson en a un bon exemple. Une fois que vous avez un bon HTML sémantique pour commencer, vous pouvez être assuré que même si rien d'autre ne se charge sur votre page sauf le HTML, les utilisateurs peuvent toujours lire et comprendre votre message (ainsi que les moteurs de recherche)..
Le contenu accessible universellement est un locataire principal du Web et constitue toujours un excellent point de départ. Parlant en 2004 de cette approche sémantique accessible de la conception Web, Jeffery Veen a déclaré:,
«[Je fournis] à mes clients des solutions beaucoup moins complexes à mettre en œuvre, plus faciles à gérer, moins onéreuses à servir, moins de services à supporter, plusieurs navigateurs et appareils, beaucoup mieux à la loterie des moteurs de recherche et sont accessibles à tous… tout le monde… utilisant le Web aujourd'hui. Et essayez de discuter avec la valeur commerciale de cela. Et c'est pourquoi je me fiche de l'accessibilité. Parce que lorsque la conception Web est pratiquée de manière artisanale et non comme une consolation, l'accessibilité est gratuite. ”
Ainsi, la prochaine fois que vous modifierez le code CSS de votre site avec Sass et que vous ferez une erreur de compilation, profitez-en pour examiner le contenu et la structure réels de votre site: le HTML. Ce pourrait être un de ces moments où un échec finit par se prêter à une véritable opportunité d'enrichissement qui aurait autrement été manquée.
