Comment définissez-vous les styles de typographie dans vos conceptions?
Lors de la définition d'un guide de style , lequel des éléments suivants est le plus courant lors de la dénomination des composants de disposition?
- Indiquer les niveaux H spécifiques à utiliser (c'est-à-dire H1, H2, etc.)
- Créez votre propre ensemble de conventions de dénomination (par exemple, "Titre de niveau supérieur", "Sous-titre", "Corps du texte")?
Si vous utilisez la première option, il semble que vous rencontriez des cas où ces règles ne correspondent pas. Par exemple, sur une page H1 est bonne, mais sur une autre page, elle doit être modifiée pour bien tenir dans la page.
Essentiellement, dans quelle mesure un guide de style devrait-il être spécifique?
Pour des raisons de référencement et d'accessibilité, il est recommandé d'utiliser <h*> éléments le cas échéant. J'utilise habituellement <h1> pour le titre du site, <h2> pour le titre de la page et <h3> pour les sections. Vous pouvez cependant jouer avec et modifier les styles de chacun selon vos besoins (par exemple, mon <h1> et <h2> les styles sont souvent presque équivalents.
Oui, j'utilise toujours les balises H sur mon HTML. Je comprends que le H1 sur la page d'accueil peut parfois être différent de celui des sous-pages. Chaque fois que certaines sous-pages nécessitent un style H1 différent, je donne à ces balises H1 une classe (par exemple h1.détails {...}) ou je fais dépendre l'ajustement H1 de la classe maître (par exemple .details h1 {...})
Il est important de conserver une balise H1 sur une page en raison des objectifs de référencement.
Par exemple. La taille de police de base est 16px H1 - 2em; H1.détails - 1.5em; H2 - 1.5em; H3 - 1.125em etc.
Cependant, ce n'est que mon approche. J'espère que ça aide.
Le standard Web HTML ne définit pas le style de <hx> éléments, sauf s'il existe un document séparé quelque part pour ce dont je ne me souviens pas. Cela fait si longtemps que je ne m'en souviens pas, mais les fournisseurs de navigateurs ont à peu près mis en place un CSS convenu pour ces éléments. Un tel style est inséré avec CSS, pas HTML.
Le HTML est la structure d'une page, pas son style, sa mise en page ou sa conception. Si le contenu n'est pas l'en-tête principal d'une page, il ne doit pas s'agir d'un <h1>. Les autres éléments sont des en-têtes de niveau inférieur pour leurs sections et la réflexion sur la façon de les structurer ne diffère pas de la description d'un document de cours que l'on peut avoir écrit à l'école.
Lorsque vous entrez dans le style des éléments, comme dans la couleur, la police, le placement, etc., cela n'a rien à voir avec la structure HTML.
Les concepteurs gardent généralement la mise en page cohérente en ce qui concerne l'espacement, les tailles de titre et la couleur, etc. Bien qu'il soit possible d'avoir un style différent sur deux pages différentes. Je voudrais suggérer les choses suivantes tout en faisant des directives de style:
Le nom de la classe doit être fonctionnel et non aléatoire ou ne pas être défini avec la propriété à l'intérieur
Utilisez toujours H1 pour l'en-tête de page, H2 pour la section, H3 pour la sous-section, etc. Assurez-vous d'utiliser H1-H6 dans une séquence pour un meilleur référencement et une meilleure accessibilité. Et, il ne devrait pas y avoir plus de 1 H1 par page
Maintenant, si vous voulez deux styles ou plus pour H1. Créez des classes de taille comme: les classes petites, moyennes, grandes, extra-larges et couleurs peuvent être nommées comme texte primaire, texte secondaire, etc. De cette façon, vous aurez plus de contrôle sur la cascade et moins d'utilisation de l'attribut! Important rendra le fichier propre et léger.
Vous pouvez vous référer à la convention de dénomination du framework Bootstrap pour l'inspiration).