MaisonSystèmes d'exploitationQue sont les balises et attributs HTML, validateur W3C. Structure et règles d'écriture des balises. Référence des balises HTML
Que sont les balises et attributs HTML, validateur W3C. Structure et règles d'écriture des balises. Référence des balises HTML
Nous avons examiné un exemple de création d'une page simple où des commentaires étaient donnés sur certaines balises html, car il me semble qu'il vaut mieux d'abord montrer quelque chose avec un exemple puis passer à une description plus détaillée. C'est pourquoi la création d'une page a été abordée dans la deuxième leçon, et plus en détail dans la troisième.
Vous trouverez donc ci-dessous des descriptions des balises HTML courantes utilisées sur presque toutes les pages du site. Croyez-moi, ils sont déjà suffisamment nombreux pour écrire un site Web entier.
Liste des balises HTML 1. Balise HTML (pour les paragraphes) - affiche un paragraphe de texte (autorise les attributs de style, de classe et d'identifiant). La balise la plus courante, car le texte y est le plus souvent placé (cependant, c'est pour cela qu'elle a été créée).
Par exemple, le code html :
Texte du paragraphe numéro un
Et ceci est un autre paragraphe
Texte du paragraphe numéro un
Et ceci est un autre paragraphe
Vous pouvez également ajouter un paramètre de style à la balise :
Ces différentes valeurs peuvent être utilisées pour modifier l’apparence de la police. Vous pouvez en savoir plus sur ces paramètres dans une leçon séparée : les styles en HTML et la propriété de police CSS.
Vous pouvez également spécifier les attributs CLASS et ID. Par exemple:
2. Balise HTML et (en gras)
Et - deux balises qui permettent de mettre la police en gras. Il n'y a aucune différence entre ces balises.
Donnons un exemple. Code HTML:
vignette
Convertit ce qui suit sur la page :
vignette
Vous pouvez également spécifier les attributs CLASS et ID (comme dans le cas de Note
Ces balises ont peu d’impact sur le classement des documents dans les moteurs de recherche, mieux vaut donc ne pas les utiliser sans but.
3. Balise HTML (créer des italiques)
- police italique (autorise les paramètres de style, de classe et d'identifiant)
Par exemple, le code html :
texte en italique
Convertit ce qui suit sur la page :
4. Balise HTML (texte souligné)
- police soulignée (autorise les paramètres de style, de classe et d'identifiant)
,..., - balises d'en-tête à l'intérieur du contenu (autorise le paramètre style, classe, id). De plus, plus le nombre est petit, plus le poids et la taille (par défaut) du texte enfermé dans ces balises sont importants.
Par exemple, le code html :
Rubrique h1
La balise est utilisée pour le titre de la page (ainsi que le titre)
Ces balises doivent être utilisées uniquement aux fins prévues, c'est-à-dire seulement lorsque l'article a besoin d'un titre. Cela est dû au fait que les balises,..., ont une grande influence sur les moteurs de recherche. Si vous les utilisez correctement, les chances d’arriver en tête des résultats de recherche sont très élevées.
7. Balise HTML (alignement)
- aligne le contenu au centre.
Par exemple, le code html :
Ce texte sera au centre
Convertit ce qui suit sur la page :
Ce texte sera au centre
Note
- pour le texte
... - pour tout (par exemple, une image)
8. Balise HTML (texte en indice)
- affiche la police d'indice.
Par exemple, le code html :
Texte brut, texte interlinéaire
Convertit ce qui suit sur la page :
Texte brut, texte interlinéaire
9. Balise HTML (texte en exposant)
- affiche la police en exposant.
Par exemple, le code html :
Texte brut, texte en exposant
Convertit ce qui suit sur la page :
Texte brut, texte en exposant
10. Balise HTML,
, - affiche une police d'un pixel plus grande/plus petite que la taille actuelle (autorisée par le paramètre style, class, id).
Par exemple, le code html :
Police normale, cette police est un pixel plus grande
Convertit ce qui suit sur la page :
Police normale, cette police est un pixel plus grande
11. Balise HTML
(création de listes)
Affiche une liste (accepte les paramètres de style, de classe et d'identifiant). Chaque nouvel élément est écrit entre
Et
.
Par exemple, le code html :
Liste:
premier élément de la liste
deuxième élément de la liste
Convertit ce qui suit sur la page :
Liste:
premier élément de la liste
deuxième élément de la liste
12. Balise HTML
(création de tableaux)
- crée un tableau (autorise le style, paramètre de classe). Chaque nouvelle ligne est créée par des balises
, et la colonne
.
Par exemple, le code html :
1 ligne 1 élément
1ère ligne 2ème élément
2 lignes 1 élément
2 lignes 2 éléments
Convertit ce qui suit sur la page :
Toutes les fonctionnalités des balises
13. Balise HTML (saut de ligne)
- le passage à la ligne suivante est une seule balise.
Par exemple, le code html :
Ligne 1 2 lignes 3ème ligne Et ce texte sera sur la 3ème ligne, puisqu'il n'y a pas eu de transition
Convertit ce qui suit sur la page :
1 ligne 2 lignes 3ème ligne Et ce texte sera sur la 3ème ligne, puisqu'il n'y a pas eu de transition
14. Balise HTML (ligne horizontale)
- trace une ligne, représente une seule balise (autorise le style, le paramètre de classe).
Par exemple, le code html :
Du texte au-dessus de la ligne et ce texte sera en dessous de la ligne
Convertit ce qui suit sur la page :
Du texte au-dessus de la ligne et ce texte sera en dessous de la ligne
Toutes les fonctionnalités des balises sera abordé dans une leçon séparée : .
16. Balise HTML (formatage du texte)
- pour formater le texte, changer de style, etc. (autorise le style de paramètre, la classe, l'identifiant). Son poids aux yeux des moteurs de recherche est absent, vous pouvez donc l’utiliser autant que vous le souhaitez.
Par exemple, le code html :
Ce texte est vert et sa taille est de 15 pixels
Convertit ce qui suit sur la page :
Note
Une balise similaire est .
17. Balise HTML (création de formulaire)
- créer un formulaire sur la page (autorise le style, paramètre de classe).
Par exemple, saisir un identifiant et un mot de passe, des boutons, n'importe quel formulaire d'inscription - ce sont tous des formulaires.
18. Balise HTML (création de blocs)
- utilisé pour créer des blocs sur la page (autorise le style, paramètre de classe). Auparavant, les tableaux étaient principalement utilisés pour baliser les pages. Une fois le tag apparu, la tâche est devenue plus facile. Presque tous les sites Web contiennent des blocs comme alternative pratique aux tableaux.
Dans la vie de chaque rédacteur, il arrive une étape de familiarisation avec les balises HTML. Cela se produit généralement spontanément et ressemble à une demande du client de « préparer le texte pour la publication ». Cela signifie que dans l'article, vous devez mettre en évidence les titres, les paragraphes, les endroits importants et les listes, mais pas avec les capacités de Word, mais avec un code de langage HTML spécial. Les balises pour un rédacteur vous y aideront. La liste requise pour le travail est généralement petite, mais elle suffit pour formater le texte selon les exigences standard. Qu'est-ce qui est inclus dans les balises html nécessaires à un rédacteur publicitaire ? (Si vous êtes trop paresseux pour lire, faites défiler vers le bas - il existe une infographie thématique simple et claire sur les balises html !)
Le rédacteur pose des questions traditionnelles. Et ils commencent tous par la formulation « quelle balise est utilisée pour spécifier » :
titre;
paragraphe;
vignette;
italique;
liste à puces/sans étiquette/
Tout cela ajoute du piquant à la tâche technique et stimule l'acquisition de nouvelles connaissances. La situation empire lorsqu'il s'agit d'utiliser une balise de texte en gras pour augmenter l'attractivité de la clé dans le PS. Mais tout cela peut être résolu très simplement, ce dont nous allons parler maintenant.
Balises pour créer des titres
Les balises permettant de créer des titres sont représentées par les éléments h1-h6. Ils ont reçu leur lettre de l'anglais Header (heading). Pour définir le type d'en-tête requis et souligner son importance pour le PS, utilisez le code suivant :
Titre h1 Titre h2 Titre h3 Titre h4 Titre h5 Titre h6
Sur le site Web, cela ressemblera à ceci.
Titre h1 Titre h2 Titre h3 Titre h4 Titre h5 Titre h6
Le cap h1 a le plus de signification - et de visibilité -. Il est utilisé comme titre d’un article et n’est utilisé qu’une seule fois. Pour les sous-titres du texte, h2 et h3 sont recommandés. Ils aident à souligner l'importance du matériel considéré et à diviser l'article en niveaux d'information.
Les en-têtes h4-h6 ne sont pratiquement pas utilisés, mais ils sont demandés pour mettre en évidence des blocs logiques et des fragments importants.
Pour les gros articles, il est préférable d'utiliser les rubriques h1-h3, pour les petits articles - h1 et h2.
Listes : à puces et sans étiquette
Un bon texte structuré comporte toujours une, voire plusieurs listes. Selon leur apparence, les listes sont :
marqués - ils sont numérotés ;
non marqué – les éléments sont mis en évidence par des symboles.
Mais toutes les conceptions Word ne sont pas adaptées aux publications sur le site, il vaut donc la peine d'apprendre à formater correctement les listes dans les balises HTML. La balise de liste à puces ressemble à ceci :
Marquez une liste non balisée comme ceci :
De plus, chaque élément de la liste possède son propre cadre HTML :
Il s'avère que pour mettre en évidence une liste à puces dans le texte à l'aide de code html, vous devrez combiner les deux types d'éléments utilisés. Il ressemblera à ceci:
Élément de liste
Élément de liste
Élément de liste
Élément de liste
Pour une liste non marquée, c'est similaire :
Élément de liste
Élément de liste
Élément de liste
Élément de liste
Nous avons trié les listes. Nous pouvons passer à autre chose.
Balises d'emphase du texte : gras et italique
Lorsque vous déterminez quelle balise vous permet de formater correctement le texte, vous rencontrez presque immédiatement deux options de code pour chaque cas. Cela provoque une confusion parmi les non-programmeurs et la question : de quelle balise le client a-t-il exactement besoin ?
Tout est très simple ! Les balises offrent des options de formatage physique et logique. Les premiers sont nécessaires aux utilisateurs, les seconds aux moteurs de recherche. Les « moteurs de recherche », voyant le code HTML qui leur convient, prennent en compte la zone sélectionnée et utilisent les informations reçues lors du classement, donc mettre en évidence le texte à l'aide d'un formatage logique ne sera pas une erreur.
L’utilisation de balises html permet de plaire aux moteurs de recherche et de mettre visuellement en valeur le texte pour l’utilisateur. Quoi de plus prioritaire, décidez vous-même :
Mise en surbrillance d'une phrase en gras pour PS et les utilisateurs Mise en surbrillance d'une phrase en gras pour les utilisateurs Phrases en italique pour PS et les utilisateursMettre une phrase en italique pour les utilisateurs
J'ai un article volumineux et très controversé sur le thème des balises en gras, qui s'appelle.
Si soudain l'un des programmeurs se penche sur le sujet, alors je m'empresse de noter une fois de plus que la critique s'adresse aux rédacteurs : comment mettre des balises, ce qu'elles sont et ce qu'il est important de prendre en compte lors du choix. Et enfin, un autre code HTML populaire nécessaire pour mettre en évidence les paragraphes. Ce
La balise d'ouverture est placée avant le début du paragraphe et la balise de fermeture est placée à la fin. Si un paragraphe se termine par une liste, alors est placé après toutes les balises utilisées pour la liste.
Eh bien, quelques infographies thématiques simples à la fin :
Lorsque la discussion sur le sujet a commencé dans les commentaires, le Club des rédacteurs à succès a donné des commentaires intéressants sur l'infographie et l'article. Voici une capture d'écran de l'opinion d'un participant faisant autorité à la discussion.
Lire : 3 365
En HTML, tout ce que vous écrivez dans un document HTML sera affiché sur l'écran du navigateur sous forme de texte solide, c'est-à-dire que le navigateur ignore les sauts de ligne et que plusieurs espaces que vous tapez dans une rangée sont remplacés par un.
Les balises sont des commandes de contrôle inventées pour formater du texte, c'est-à-dire les balises indiquent au navigateur exactement comment afficher la partie de texte incluse dans les balises. Pour créer une balise, vous saisissez du code HTML entre les crochets angulaires, destiné uniquement aux navigateurs. Les visiteurs du site ne voient pas les balises.
Comme indiqué ci-dessus, toutes les balises commencent par un crochet angulaire.< и заканчиваются угловой скобкой >. Le crochet angulaire ouvrant est suivi du nom de la balise (commande).
Par exemple, une balise est destinée à mettre en valeur du texte ; les navigateurs affichent ce texte en italique. Lorsque le navigateur rencontre cette balise, il passe au formatage du texte suivant la balise en italique.
Regardons un exemple :
Ce texte est normal. Ce texte est en italique.
La balise est appelée balise de début ou d'ouverture, ce qui signifie que le navigateur a inclus une commande spécifique (dans ce cas, en l'écrivant en italique). La plupart des balises ont une paire sous la forme d'une balise de fermeture qui désactive la commande.
La balise de fermeture ressemble à la balise de début, mais commence par une barre oblique. Ainsi, la balise de fin pour l'italique est .
Regardons un exemple :
Ce texte est normal. Attention! Italique. C'est encore une fois une police normale.
Comme vous l'avez peut-être remarqué, le navigateur analyse séquentiellement le document HTML à la recherche de commandes (balises) et applique ou désactive diverses options de formatage du texte. Le navigateur affiche du texte formaté (tout ce qui n'est pas une balise) dans sa fenêtre.
Le processus d'insertion de balises dans du texte brut et non formaté est appelé balisage dans un document HTML, et les balises sont appelées caractères de balisage. Lors de l'écriture des tags, la casse des lettres n'est pas prise en compte ; un tag peut être écrit aussi bien en minuscules qu'en majuscules, mais il est tout de même recommandé d'utiliser des majuscules.
Vous trouverez ci-dessous des exemples de balises HTML de base, avec une explication de leur utilisation, ainsi que des exemples de la manière dont elles peuvent être utilisées dans un document HTML.
Rubriques
Il existe une balise spéciale pour spécifier les titres en HTML. Il existe 6 niveaux de titres en HTML, allant de ceux pour les annonces les plus importantes à ceux pour les moins importantes.
Bonjour, chers lecteurs du site blog ! Dans le dernier article, nous avons compris ce qu'est un type de document et comment les navigateurs déterminent la langue utilisée à l'aide de . L’étiquette a été prise en compte, mais pas le concept (terme) lui-même. Dans cet article, je vais vous expliquer ce qu'est une balise, pourquoi elle est nécessaire et quels types de balises il existe. Comme je l'ai dit dans le dernier article de cette section, nous allons créer une page de fichier, que nous expérimenterons, en fonction des connaissances que nous avons acquises. Mais c'est à la fin de l'article, mais pour l'instant regardons la balise HTML.
Qu'est-ce qu'une balise HTML, types de balises HTML, exemples d'écriture de balise HTML - traduite de la balise anglaise - pour marquer les caractères entre crochets et qui sont des éléments du langage de balisage hypertexte (HTML). Les symboles ne peuvent être qu'en anglais (tout Internet est construit dessus). L'étiquette ressemble à
Il s'agit d'une balise permettant de mettre le texte en gras. Les balises ont trois types :
La balise d'ouverture est la balise qui vient au début. Dans l'exemple présenté ci-dessus, la balise est la balise d'ouverture et se place devant le texte qui doit être mis en surbrillance.
La balise de fermeture est la balise qui vient à la fin. Une caractéristique distinctive est la barre oblique « / » devant les caractères entre crochets angulaires. Regardons à nouveau l'exemple évoqué ci-dessus. La balise est une balise de fermeture et vient après le texte, qui doit être surligné en gras
Les balises simples sont des balises qui n'ont pas de balise de fermeture. Un exemple serait Voici un exemple de balise d'ouverture et de fermeture :
L'ensemble du design, y compris le texte, ressemblera à ceci :
Ce texte sera mis en évidence en gras
Et voici à quoi ressemblera ce texte lorsque le navigateur le traitera et nous le fournira : Ce texte sera mis en évidence en gras. Il existe également des balises de conteneur, mais il ne s'agit que d'un nom généralisé pour les balises d'ouverture et de fermeture. Comme je l'ai écrit ci-dessus, en plus des balises de conteneur, il existe également des balises simples. La différence est que ces balises n'ont pas besoin d'être fermées. L’exemple le plus clair et le plus courant est la balise newline.
Fondamentalement, les balises simples sont utilisées pour insérer un élément, tel qu'une image ou un tableau.
Que sont les attributs, les règles d'écriture et pourquoi sont-ils nécessaires ? En plus des balises, il existe également des soi-disant attributs. Plus précisément, pas d'ailleurs, mais dans des balises. À l'aide d'attributs, vous pouvez définir des paramètres supplémentaires pour une balise. Chaque balise a ses propres attributs, et dans cette rubrique, nous expérimenterons la balise qui, sans attributs, ne fait en réalité rien de significatif.
La police est une balise conteneur utilisée pour formater le texte. En utilisant cette balise, vous pouvez mettre le texte en gras, modifier la taille et la distance entre les lignes - en général, tout ce que vous pouvez faire avec le texte. Regardons un exemple avec la taille du texte. Tout d’abord, entourons le texte dans une balise Font.
Texte
Parlons maintenant un peu des règles d'écriture des attributs. Les attributs sont toujours écrits dans la balise d'ouverture et après les caractères de la balise elle-même. Vous pouvez écrire plusieurs attributs dans une seule balise dans n'importe quel ordre. Vous pouvez trouver les attributs sur le site Web du validateur W3C (dont je parlerai ci-dessous). Voici donc un exemple de balise font avec un attribut size :
Texte
Cet attribut dans la balise font modifie la taille du texte inclus dans les balises. Si vous ouvrez le code source de la page, vous verrez que l'endroit où se trouve le gros mot « Texte » ressemble à
Texte
Vous avez déjà vu comment les attributs sont écrits. Ils sont écrits exactement de la même manière dans les autres balises : nous écrivons d'abord l'attribut lui-même (dans ce cas, la taille), puis nous mettons « = » et mettons le paramètre d'attribut entre guillemets doubles. Vous pouvez trouver tous les paramètres d’attribut sur le même site Web du World Wide Web Consortium.
Qu'est-ce qu'un validateur W3C, règles d'écriture et liste de balises Comme je l'ai écrit, il existe un grand nombre de balises. Mais où peut-on tous les trouver ? A cet effet, il existe un validateur W3C W3C - World Wide Web Consortium, ou en russe - World Wide Web Consortium. Pas tout à fait clair, non ? C'est ici que sont développés les standards du Web - (les langages de balisage hypertexte sont leur idée originale). À la tête de l'ensemble du consortium se trouve Tim Berners-Lee, connu grâce à l'article précédent, le créateur du HTML. Le site Web de cette organisation est w3.org. Je vous préviens, le site est entièrement en anglais, ayez donc un dictionnaire ou un traducteur dans votre navigateur. À propos, la note Google pour ce site est de 9 et 37 000 (c'est beaucoup, si quelqu'un ne le sait pas).
Revenons au sujet de l'article. Nous sommes intéressés par les standards du langage HNTML 4.01. Suivez le lien Spécification HTML 4.01, après quoi nous voyons l'onglet éléments en haut, cliquez dessus. Ici, la page avec toutes les balises s'ouvre. Ces balises ont été développées et adoptées comme norme par le consortium. Encore une fois, tout est en anglais. Immédiatement après les mots « Index des éléments », nous voyons une légende (la signification des lettres dans les colonnes) :
Et immédiatement après la légende il y a un tableau des balises elles-mêmes :
Dans la première colonne - Nom - le nom de la balise elle-même - ce qui doit être entre crochets (< и >).
La deuxième colonne - Start Tag - la présence d'une balise d'ouverture. Dans cette colonne, vous pouvez voir la lettre « O », qui signifie « Facultatif » et traduite de l'anglais - Facultatif. Cette lettre est présente uniquement en face des balises , , et et signifie que vous pouvez mettre une balise d'ouverture, ou ce n'est pas obligatoire – le navigateur fera tout lui-même.
La troisième colonne - End Tag - la présence d'une balise de fermeture. En face de cette étiquette, vous pouvez voir à la fois la lettre « O » et la lettre « F ». Le sens du premier n’a pas changé. La deuxième lettre - « F » - littéralement « interdit » en anglais - signifie qu'il est interdit de mettre une balise fermante, elle n'existe tout simplement pas. Par exemple, il n'y a pas de balise, car il n'y a rien à cacher dedans.
Le quatrième - Vide - signifie que la balise est unique (vide). Toutes les balises qui ont la lettre « E » devant elles dans cette colonne ont également la lettre « F » dans la colonne précédente. Après tout, les balises simples n’ont pas de balises de fermeture. Un exemple est la même balise .
La cinquième colonne est Depr. ou Obsolète - de l'anglais « non recommandé ». Si cette colonne contient la lettre « D » (qui signifie exactement la même chose), cela signifie que cette balise n'est pas recommandée pour une utilisation en HTML. En regardant un peu vers l'avenir, les feuilles de style en cascade (CSS) sont aujourd'hui utilisées pour concevoir à la fois le texte et l'apparence de l'ensemble du site Web et du document HTML. En bref et simplement, un fichier est créé dans lequel sont écrits tous les paramètres de texte pouvant être appelés par certains attributs de balise. Cette fonction n'est donc utilisée que sur les sites Web, car CSS n'est pas applicable lors de l'envoi de nouvelles par mail ou RSS. Et ici, ces mêmes balises viennent à la rescousse. Soit dit en passant, la plupart de ces balises concernent la conception du texte (et sont un exemple)
La sixième colonne - DTD - peut contenir soit la lettre "L" soit "F". Le premier - "L" - Loose DTD - signifie que la balise en face de laquelle apparaît cette lettre ne peut être utilisée que dans un type de document transitionnel (- Transitional, dont j'ai parlé dans l'article précédent). La seconde - «F» - Frameset DTD - signifie que la balise ne peut être utilisée que dans un document de type FRAMESET ( - Frameset). Si la lettre est manquante, alors l'étiquette peut être utilisée dans tous types de documents.
Et la dernière, septième colonne - Description - une brève description de la balise, toujours en anglais
Les attributs sont contenus sur la même page de la spécification HTML 4.01, mais dans l'onglet « attributs ». Il existe bien plus d’attributs que de balises. Et encore une fois, je vais tout noter point par point.
La première colonne est Nom - comme dans le cas des balises, le nom de l'attribut. Tout est en anglais, mais avec des connaissances de base, vous pouvez deviner à quoi sert tel ou tel attribut.
La deuxième colonne - Éléments associés - est une liste de toutes les balises qui utilisent n'importe quel attribut. Toutes les balises ont des liens, vous pouvez donc accéder immédiatement aux informations sur la balise.
La troisième colonne - Type - contient toutes les valeurs possibles pour un attribut particulier. Par exemple, en face de l'attribut size que nous avons sélectionné dans la balise Font se trouve la valeur CDATA. Nous y reviendrons plus tard, mais en bref, il s'agit d'un ensemble spécial d'options de taille (dans ce cas). Après tout, vous pouvez écrire à la fois des pixels et des pourcentages
La quatrième colonne - Par défaut - indique si l'attribut est requis dans une balise particulière. Par exemple, dans la balise Img, l'attribut src est requis, car il indique la source à partir de laquelle prendre l'image.
Les colonnes 6, 7 et 8 signifient la même chose que dans le cas des balises.
Tout ce qui précède s'applique uniquement à la version HTML 4.01. Nous parlerons de HTML 5 dans un autre article, et nous aborderons également le XHTML. Et maintenant, comme je l'ai promis, nous allons créer une page en HTML, que nous allons expérimenter.
Création d'un fichier au format html - Document HTML
Tout d'abord, voyons ce qu'est un document HTML. Et il s'agit en fait d'un fichier au format HTML. Et toutes les pages Internet sont des documents HTML. Par exemple, lorsque vous accédez à un site Web, dans la barre d'adresse à la fin, vous pouvez voir « .html » ou « .htm » après l'adresse. C'est le fichier que nous allons créer avec cette extension. En général, si vous souhaitez expérimenter sur un site Web et non sur une page, il est préférable de créer un serveur local - Denver (sur lequel je veux écrire).
Considérant que je n’ai même pas parlé des balises présentes sur chaque page, nous allons simplement créer un fichier avec n’importe quel nom et extension .html. Il est possible (et préférable) d'utiliser Notepad++, car cet éditeur de texte utilise la surbrillance du code, ce qui est très pratique lors de l'édition de code et vous pouvez enregistrer des fichiers dans une variété de formats. Il existe également des programmes dans lesquels, lorsque vous tapez un code, le résultat apparaît immédiatement sous forme traitée.
Il suffit donc d'ouvrir Notepad++ et d'enregistrer un fichier avec du texte arbitraire (peut être vide), mais au format .html. Pour ce faire, comme d'habitude, cliquez sur l'étiquette du fichier, puis « enregistrer sous » et recherchez « Fichier HyperText Markup Language (extensions de fichier) » parmi la grande liste d'extensions. C'est tout, en fait. Nous ajouterons les premières lignes à ce fichier dans le prochain article de la section « Créer un site Web à partir de zéro »
HTML est un langage de balisage hypertexte. Il est basé sur ce qu'on appelle des balises. Les balises sont des éléments wrapper qui spécifient le format et les propriétés des éléments de la page Web. Nous avons compilé pour vous une référence à jour des balises HTML sur une seule page.
Il existe au total plus d’une centaine d’éléments de balisage. Chacun possède un certain nombre d’attributs et sa propre syntaxe. La référence des balises HTML vous aidera à trouver rapidement l'élément dont vous avez besoin.
Liste des balises HTML
Le tableau ci-dessous présente une liste de balises HTML5 avec une brève description en russe.
Balise Brève description
Un commentaire.
Définit le type de document.
Lien, hyperlien, ancre.
Définit le texte comme une abréviation.
Coordonnées de l'auteur ou du propriétaire du document.
Définit une zone sur une image cliquable
Article
Contenu mis à part (le contenu n'est pas le contenu principal de la page)
Vous permet d'insérer un fichier audio en cours de lecture.
Texte en gras.
Spécifie l'URL de base ou l'attribut cible pour les liens relatifs dans le document.
Un domaine où l’écriture d’un texte peut prendre une direction différente.
Définit la direction d’écriture du texte. Contrairement à la direction, la direction physique est indiquée
Citation.
Spécifie la zone du corps du document.
Saut de ligne.
Bouton cliquable
Utilisé pour dessiner des graphiques à l'aide de scripts
Signature du tableau.
Note de bas de page au titre du document.
Utilisé pour insérer du code informatique sous forme de texte.
Spécifie les caractéristiques des colonnes du tableau.
Définit un groupe d'une ou plusieurs colonnes de tableau à formater.
Utilisé pour définir des options prédéfinies parmi lesquelles choisir lorsque vous tapez dans un champ de texte
Définit la description d'un terme à partir d'une balise dans une liste de termes
Texte qui a été supprimé dans la nouvelle version du document.
Définit des informations supplémentaires que l'utilisateur peut afficher ou masquer
Indique que le contenu est un terme.
Définit une boîte de dialogue ou un élément interactif
Un élément de bloc est l'un des principaux éléments de mise en page.
Définit une liste de définitions
Nom du terme dans la liste des définitions
texte surligné pour sa signification (généralement texte en italique).
Conteneur pour application externe
Groupe d'éléments liés dans un formulaire
Titre de l'élément
Définit un groupe autonome de plusieurs éléments (par exemple, une image avec une légende)
bas de page
Définit un formulaire de saisie utilisateur
-
En-têtes HTML de différents niveaux : , , , , , .
Spécifie la zone d'en-tête du document.
Bloc d'en-tête
La ligne horizontale est un séparateur thématique.
Élément racine. Indique au navigateur que le document donné est un document HTML.
Texte en italique.
Définit un cadre en ligne
Image, image.
Champ de saisie
Texte qui a été ajouté à la nouvelle version du document.
Texte saisi à partir du clavier ou noms des boutons du clavier. Généralement en police monospace.
Libellé du champ de saisie. Indique la liaison d'un élément (généralement du texte) à un champ de saisie.
En-tête d'élément
Élément de liste
Définit une liaison de ressource externe (le plus souvent une liaison de feuille de style CSS)
Contenu principal
Conteneur pour . Définit une carte personnalisée sur une image
Texte sélectionné (généralement en utilisant la surbrillance de l'arrière-plan).
Conteneur pour une liste d'éléments de menu
Définit les éléments que l'utilisateur peut appeler à partir du menu contextuel
Utilisé pour définir les métadonnées du document.
Compteur de valeurs dans une plage donnée
Conteneur pour les éléments de navigation
Contenu alternatif pour les utilisateurs ayant désactivé les scripts
Définit un objet intégré
Définit une liste numérotée
Définit un groupe d'options associées dans une liste déroulante. Donne le nom au groupe
Paramètre (option de choix) dans la liste déroulante
Résultat du calcul
Paragraphe.
Définit les options pour les objets intégrés
Conteneur pour plusieurs images
Texte préformaté.
Barre de progression
Citation dans le texte.
Texte alternatif si le navigateur ne prend pas en charge le .
Annotation pour le contenu de la balise.
Conteneur pour les symboles et leur décodage (principalement pour les symboles d'Asie de l'Est, les hiéroglyphes).
Texte barré.
Texte résultant d'un programme informatique (généralement en police monospace).
Définit un script ou une connexion de script à partir d'une ressource externe.
Chapitre
Définit une liste déroulante
Texte dans une taille de police plus petite.
Définit une ressource pour , et .
Élément en ligne.
Texte mis en valeur par son sens. Généralement affiché en gras.
Définit un conteneur pour définir les styles de document
Affiche le texte sous forme d'indice.
Se diriger à l'intérieur d'une balise
Affiche le texte en exposant.
Définit une table.
Définit une zone de contenu dans un tableau.
Cellule dans le tableau
.
Champ de saisie multiligne
Définit un groupe de lignes en bas d'un tableau
- bas de page. Plus de détails
Un endroit où un saut de ligne est autorisé.
Balises HTML héritées
Comment remplacer la balise HTML obsolète ? Dans la plupart des cas, les feuilles de style en cascade CSS feront l'affaire. Il existe également des alternatives aux balises non utilisées dans la nouvelle spécification HTML. Le tableau ci-dessous présente les balises HTML obsolètes avec des options pour les remplacer.
Balise Brève description
Acronyme. Utilisez plutôt une balise
Applet intégré. Utilisez ou à la place.
Spécifie la couleur, la taille et la famille de polices de tout le texte du document. Utilisez-le à la place
Texte plus grand. Utilisez-le à la place
Texte centré. Utilisez-le à la place
Liste des répertoires. Utiliser
au lieu de lui
Spécifie la couleur, la taille et la famille de la police. Utilisez-le à la place
Cadre à l'intérieur. Utilisez-le à la place
Définit un jeu de cadres. Pour ajouter plusieurs cadres en ligne, utilisez plusieurs éléments
Texte alternatif si les frames ne sont pas pris en charge