Introduction aux principes de conception HTML 5-Tutoriel H5-php.cn

Introduction aux principes de conception HTML 5

王林

Libérer： 2021-02-01 14:14:57

avant

2676 Les gens l'ont consulté

Introduction aux principes de conception HTML 5

Introduction :

HTML5 est une méthode de description de langage permettant de construire du contenu Web. HTML5 est la norme de nouvelle génération d'Internet et une méthode linguistique pour construire et présenter du contenu Internet. Elle est considérée comme l’une des technologies de base d’Internet. HTML a été créé en 1990 et HTML4 est devenu un standard Internet en 1997 et est largement utilisé dans le développement d'applications Internet.

En fait, html5 n'est pas directement formulé par w3c. La direction de w3c est xhtml2, pas html5. Lorsque xhtml2 était déconnecté de la réalité et ne pouvait pas être mis en pratique, le groupe de travail du w3c a orienté ses recherches vers html5. Pourquoi xhtml2 ne s’est-il jamais matérialisé ? Parce que cela viole un principe de conception, qui est la célèbre loi de Burstahl : soyez prudent lors de l'envoi et soyez ouvert lors de la réception. Une série de principes ont été suivis dans le processus de conception de HTML5, ce qui a permis de promouvoir rapidement le HTML5. Cet article présentera les 5 principes de conception suivis par html5

Éviter la complexité inutile

html4

<!DOCTYPE html PUBLIC "-//W3C/DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

Copier après la connexion

html5

<!DOCTYPE html>

Copier après la connexion

html4

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
　　html5
<meta charset="utf-8">

Copier après la connexion

Prend en charge le contenu existant

Pour les quatre morceaux de code suivants, seul le premier paragraphe est correct en xhtml alors qu'en html5, ils sont tous corrects

<img src="foo" alt="bar" />
<p class="foo">Hello world</p>
 
<img src="foo" alt="bar">
<p class="foo">Hello world
 
<IMG SRC="foo" ALT="bar">
<P CLASS="foo">Hello world</P>
 
<img src=foo alt=bar>
<p class=foo>Hello world</p>

Copier après la connexion

(Apprentissage partage de vidéos : Tutoriel vidéo html)

Résoudre des problèmes réels

En html4, même si deux éléments de niveau bloc ont la même adresse de lien, il faut aussi écrits séparément, car les éléments en ligne ne peuvent pas contenir d'éléments de niveau bloc

<h2><a href="/path/to/resource">Headline text</a></h2>
<p><a href="/path/to/resource">Paragraph text.</a></p>

Copier après la connexion

, et en HTML5, en raison de l'utilisation du modèle de contenu, les éléments 🎜> Modèle de contenu

html5 ajoute un certain nombre de nouveaux éléments, notamment : section, article, côté et navigation, qui représentent un nouveau modèle de contenu - le partitionnement du contenu. Les gens ont utilisé des divs pour organiser le contenu des pages dans le passé, mais comme d'autres éléments similaires, les divs eux-mêmes n'ont aucune sémantique. Mais section, article, aparté et navigation vous le disent clairement : cette section est comme un autre document dans le document. Tout contenu placé au sein de ces éléments peut avoir son propre résumé, son propre titre, son propre pied de page.

Dégradation douce

Lorsque le navigateur rencontre une valeur de type non reconnue, il interprétera la valeur du type comme texte

<a href="/path/to/resource">
    <h2>Headline text</h2>
    <p>Paragraph text.</p>
</a>

Copier après la connexion

Recommandations associées :

Tutoriel HTML5

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!

Php8, je viens aussi

Apprenez la mise en page d'un site Web en 30 minutes

Tutoriel vidéo Shangguan Oracle débutant à compétent

Votre première ligne de code UNI-APP

Flutter de zéro au lancement de l'application

Brother Lian Nouveau didacticiel vidéo Linux

Tutoriel vidéo AXURE 9 (convient à l'interface utilisateur interactive de conception de produits du chef de produit)

Tutoriel vidéo PS Zero Basic Proficiency

Tutoriel vidéo de 16 jours sur l'interface utilisateur pour vous aider à démarrer

Tutoriel vidéo sur les techniques PS et les techniques de découpage

Tutoriel vidéo sur la construction et le lancement de projets d'Alibaba Cloud Environment

Présentation des réseaux informatiques - Connaissances de base que les programmeurs doivent maîtriser

Tutoriel essentiel pour les programmeurs - Explication du protocole HTTP

Tutoriel vidéo Websocket

Introduction aux principes de conception HTML 5