Quelles règles HTML5 doit-il suivre ?

Les règles que HTML5 doit suivre : 1. Faire bon usage des DIV pour la mise en page ; 2. Séparer les balises HTML et les feuilles de style CSS ; 3. Optimiser le code CSS ; 4. Optimiser les fichiers JS et les placer en bas de page ; 5, Faites bon usage des éléments de titre ; 6. Utilisez les balises HTML appropriées aux endroits appropriés. 7. Évitez d'abuser des balises div ;

L'environnement d'exploitation de ce tutoriel : système Windows 7, version HTML5, ordinateur Dell G3.

HTML a connu près de 20 ans de développement. Du HTML4 au XHTML, puis au HTML5, récemment très populaire, il a presque assisté au développement de l'ensemble de l'Internet. Cependant, même aujourd’hui, il existe de nombreux concepts et principes de base auxquels les développeurs doivent encore prêter une attention particulière. L'éditeur de formation Développement Web front-end vous présentera ces principes de développement HTML5 à suivre.

1. Faites bon usage des DIV pour la mise en page

Lors du développement d'une page Web, une chose à considérer est de distinguer l'objectif de la page. En incluant ces contenus dans les balises DIV, le code de la page apparaîtra net et bien indenté.

2. Séparez les balises HTML et les feuilles de style CSS

Une bonne page doit séparer les balises HTML et les feuilles de style CSS. C'est un principe que tout développeur Web doit connaître lorsqu'il entre en contact avec le développement Web. Cependant, jusqu’à aujourd’hui, de nombreux développeurs ne suivent pas strictement ce principe.

N’intégrez pas le code de la feuille de style dans les balises HTML. Les développeurs doivent prendre l'habitude de créer des fichiers séparés pour stocker les feuilles de style CSS. Cela permettra également aux autres développeurs de terminer plus facilement leur travail rapidement lors de la modification de votre code.

3. Optimiser le code CSS

De nos jours, il est très courant d'ajouter plusieurs fichiers CSS à un site Web. Cependant, lorsqu’un site Web contient trop de fichiers CSS, cela ralentira la vitesse de réponse du site Web. La solution consiste à rationaliser le code, à optimiser plusieurs fichiers CSS et à les fusionner en un seul fichier. Cette méthode peut améliorer considérablement la vitesse de chargement du site Web. De plus, il existe de nombreux outils pouvant être utilisés pour optimiser les fichiers CSS, tels que CSS Optimizer, Clean CSS, etc.

Pour CSS, nous avons également recommandé 10 excellents frameworks CSS que vous devriez connaître. Vous pouvez en apprendre davantage sur les types et les utilisations associées des frameworks CSS.

4. Optimisez les fichiers JS et placez-les en bas de la page

Comme CSS, il est également courant d'ajouter plusieurs fichiers JS à la page. Mais cela réduira également la vitesse de réponse du site Web. Pour cette raison, les développeurs doivent rationaliser et optimiser ces fichiers JS.

Mais une chose est différente du CSS : les navigateurs ne prennent généralement pas en charge le chargement parallèle. Cela signifie que lorsque le navigateur charge un fichier JS, il ne chargera plus d'autres contenus en même temps. Cela provoque un ralentissement de la vitesse de chargement des pages.

Une bonne solution est de mettre l'ordre de chargement des fichiers JS en dernier. Pour atteindre cet objectif, les développeurs peuvent placer le code JS au bas du document HTML, et un bon emplacement est à proximité de la balise .

5. Faites bon usage des éléments de titre

Span to h6 Ces éléments sont utilisés pour mettre en évidence le contenu clé de la page. Cela aide les utilisateurs à se concentrer davantage sur les parties importantes de la page. Pour les blogs, je (en référence à l'auteur de cet article) recommande d'utiliser des balises span pour mettre en évidence le titre du blog. Parce que le titre du blog constitue presque une partie importante de la page.

6. Utilisez les balises HTML appropriées au bon endroit

Les balises HTML sont la clé pour construire une structure de contenu standardisée. Par exemple, la balise

7. Évitez d'abuser des balises div

Tous les éléments de bloc ne doivent pas être créés à l'aide de la balise

. Par exemple, vous pouvez ajouter display:block aux attributs d'un élément en ligne pour l'afficher en tant qu'élément de bloc.

8. Les valeurs des attributs doivent être uniformément placées entre guillemets

Bien que certains attributs en HTML5 puissent être non cités, dans un souci de standardisation, des guillemets doivent être ajoutés à chaque attribut.

9. Évitez une ligne de code trop longue

La taille de la page est limitée Si le code est trop long, une barre de défilement sera ajoutée, ce qui réduira la lisibilité du code.

10. Ajoutez alt à la balise img

Après avoir ajouté alt à l'attribut image, lorsque l'image ne peut pas être affichée, le contenu de alt peut combler le vide dans l'image, et alt est également bon pour l'optimisation du référencement.

11. Lignes vides et indentations

Lorsque nous apprenions Java, le professeur nous a appris à ajouter des commentaires, des lignes vides et des indentations au code pour améliorer la lisibilité du code.

12. Balises fermées

La plupart des balises HTML apparaissent par paires. Si certaines balises ne sont pas fermées, des problèmes tels qu'un mauvais alignement du document se produiront. Même si certaines balises peuvent utiliser des balises uniques, il est préférable de les unifier en balises fermées, comme p. Et comme la méta, il est préférable de l’écrire sous la forme suivante : <meta charset="utf-8"/>.

Recommandations associées : "Tutoriel vidéo HTML"

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!