Maison > interface Web > Questions et réponses frontales > Quelle est la différence entre H5 et HTML

Quelle est la différence entre H5 et HTML

醉折花枝作酒筹
Libérer: 2023-01-06 11:16:48
original
10508 Les gens l'ont consulté

La différence entre h5 et HTML est la suivante : 1. En termes de déclaration de type de document, HTML a une longue section de code difficile à retenir, tandis que HTML5 n'a qu'une simple déclaration, ce qui est pratique pour les gens. rappelez-vous : 2. En termes de sémantique structurelle, HTML4.0 n'a pas de balises qui reflètent la sémantique structurelle, mais HTML5 présente de grands avantages en termes de sémantique.

Quelle est la différence entre H5 et HTML

L'environnement d'exploitation de ce tutoriel : système Windows7, version html&&HTML5, ordinateur Dell G3.

html5 est un langage de balisage hypertexte nommé pour la première fois par WHATWG (Web Hypertext Application Technology Working Group), puis combiné avec le xhtml2.0 (standard) du W3C pour produire la dernière génération de langage de balisage hypertexte. Cela peut être simplement compris comme : HTML 5 ≈ HTML4.0+CSS3+JS+API.

1. Dans la déclaration de type de document

html :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
< html  xmlns = "http://www.w3.org/1999/xhtml" >
Copier après la connexion

html5 :

<!DOCTYPE html>
Copier après la connexion

Cela ressort de la comparaison entre les deux : dans la déclaration du document Sur le site Web, le code HTML est long, et il est difficile de se souvenir de ce code. Je suppose que beaucoup de gens le génèrent directement avec des outils, n'est-ce pas ? Mais HTML5 est différent. Il ne contient que des déclarations simples, qui sont également plus faciles à retenir et plus simples.

2. En termes de sémantique structurelle

html4.0 : Il n'y a pas de balises qui reflètent la sémantique structurelle. Nous les nommons généralement ainsi

< divid = "header" ></ div >
Copier après la connexion

signifie l'en-tête de. le site Internet.

html5 : Il présente de grands avantages en termes de sémantique. Fournit de nouvelles balises HTML5, telles que :

< header > 、< nav >、< article >、< aside >、< footer >..
Copier après la connexion

3. Nouvelles fonctionnalités puissantes de HTML5

(1) Fonction de dessin puissante

Il peut y avoir des animations ou des images, dans HTML5, cela peut être réalisé grâce à la puissante fonction de peinture et à JS. Mais cela ne fonctionne pas en HTML4.0.

En HTML5, il y a deux choses qui peuvent être dessinées. Voyons de quelles choses il s'agit.

1. Balise Canvas

Canvas dessine des graphiques 2D via JavaScript Canvas restitue pixel par pixel.

Dans Canvas, une fois le graphique dessiné, il ne recevra plus l'attention du navigateur. Si sa position change, la scène entière doit être redessinée, y compris tous les objets qui auraient pu être recouverts par des graphiques.

2.SVG

SVG est un langage qui utilise XML pour décrire les graphiques 2D. SVG est basé sur XML, ce qui signifie que chaque élément du DOM SVG est disponible. Vous pouvez attacher un gestionnaire d'événements JavaScript à un élément. En SVG, chaque forme dessinée est traitée comme un objet. Si les propriétés d'un objet SVG changent, le navigateur peut automatiquement reproduire le graphique.

Par rapport à d'autres formats d'image (tels que JPEG et GIF), les avantages de l'utilisation de SVG sont :

(1) Les images SVG peuvent être créées et modifiées via un éditeur de texte

(2) Les images SVG peuvent être recherchées, indexées, scriptées ou compressées

(3) SVG est évolutif

(4) Les images SVG peuvent être en haute résolution à n'importe quelle résolution Imprimer avec une haute résolution qualité

(5) Le SVG peut être agrandi sans perdre la qualité de l'image

Ensuite, les deux peuvent être utilisés pour le dessin, voyons quelle est la différence entre eux Différences :

Canvas

1. Dépend de la résolution

2. Ne prend pas en charge les gestionnaires d'événements

3. Faibles capacités de rendu de texte

4. au format .png ou .jpg

5. Idéal pour les jeux à forte intensité d'images où de nombreux objets seront fréquemment redessinés

SVG

1. >

2. Prend en charge les gestionnaires d'événements

3. Idéal pour les applications avec de grandes zones de rendu (telles que Google Maps)

4. Une complexité élevée ralentira la vitesse de rendu (toute application). qui utilise excessivement le DOM n'est pas rapide)

5. Ne convient pas aux applications de jeux

(2) Nouvelle balise vidéo

Peut-être en html4.0, si on veut l'insérer. une vidéo, nous devons également citer une longue section de code. Mais dans le cas de HTML5. Nous n'avons besoin de l'utiliser que pour une balise vidéo.

 < videosrc = "视频地址" ></ video >//详细属性可以见下图
Copier après la connexion
4. Avantages

Premier : faites gagner du temps aux programmeurs lors de l'écriture du code.

Deuxième : je pense que la chose la plus importante est l'optimisation du référencement.

Que nous nommions nous-mêmes le module de page Web, il existe toujours une telle balise. Parce que le but ultime de la création d’un site Web n’est qu’un seul : gagner de l’argent. Si vous souhaitez réaliser des bénéfices, vous ne pouvez améliorer le classement de votre site Web que grâce à la technologie d'optimisation du référencement, afin que votre site Web ait de la valeur, et c'est précisément ce point que répond html5. Pourquoi tu dis ça ? Parce que les balises qu’il a définies sont plus propices à l’optimisation et que les robots peuvent vous identifier.

Apprentissage recommandé :

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal