1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
|
---
title: Apprendre à utiliser HTML pour résoudre des problèmes
slug: Learn/HTML/Howto
tags:
- CodingScripting
- HTML
translation_of: Learn/HTML/Howto
original_slug: Apprendre/HTML/Comment
---
<p>Une fois <a href="/fr/docs/Apprendre/Commencer_avec_le_web/Les_bases_HTML">les bases acquises</a>, il n'existe pas de voie idéale pour apprendre {{Glossary("HTML")}}. Vous pouvez ensuite progresser à votre rythme, en utilisant les balises qui vous sont utiles. HTML n'est qu'un ensemble de balises que vous pouvez utiliser pour structurer votre document et lui ajouter des fonctionnalités supplémentaires. Dans les articles suivants, nous travaillerons sur différents exemples illustrant comment utiliser HTML pour résoudre des problèmes fréquents qu'on rencontre lorsqu'on développe pour le Web. Si vous avez besoin d'explications détaillées sur une balise HTML donnée, n'hésitez pas à consulter <a href="/fr/docs/Web/HTML/Reference">notre référence HTML</a>.</p>
<h2 id="Cas_d'utilisation_fréquents">Cas d'utilisation fréquents</h2>
<p>HTML permet de résoudre de nombreux problèmes qui se posent lors de la conception de sites web. Il est très probable que vous rencontriez au moins l'un de ces scénarios :</p>
<h3 id="Structure_de_base">Structure de base</h3>
<p>En HTML, tout commence par la structure du document. Si vous débutez avec HTML, vous devriez démarrer avec :</p>
<ul>
<li><a href="/fr/docs/Apprendre/HTML/Comment/Cr%C3%A9er_un_document_HTML_simple">Comment créer un document HTML simple</a></li>
<li><a href="/fr/docs/Apprendre/HTML/Comment/D%C3%A9couper_une_page_web_en_sections_logiques">Comment diviser une page web en sections logiques</a></li>
<li><a href="/fr/docs/Apprendre/HTML/Comment/Mettre_en_place_une_hi%C3%A9rarchie_de_titres">Comment organiser une hiérarchie de titres</a></li>
</ul>
<h3 id="Sémantique_de_base_pour_le_texte">Sémantique de base pour le texte</h3>
<p>Le but de HTML est de fournir des informations sémantiques (c'est-à-dire sur le sens) d'un document et de ce qui le compose. HTML permettra donc de répondre à de nombreuses questions sur le sens du texte qu'on veut utiliser dans un document.</p>
<ul>
<li><a href="/fr/docs/Learn/HTML/Howto/Create_list_of_items_with_HTML">Comment créer une liste d'éléments en HTML</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Emphasize_content_or_indicate_that_text_is_important">Comment faire pour accentuer un contenu</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Emphasize_content_or_indicate_that_text_is_important">Comment indiquer qu'un texte est important</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Display_computer_code_with_HTML">Comment afficher du code informatique avec HTML</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Indicate_exponential_notation_with_HTML">Comment indiquer une notation exponentielle avec HTML</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Provide_contact_information_within_a_webpage">Comment fournir des informations de contact dans une page web</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Annotate_images_and_graphics">Comment annoter des images et des graphiques</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Mark_abbreviations_and_make_them_understandable">Comment marquer des abréviations et les rendre compréhensibles</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Add_citations_to_webpages">Comment ajouter des citations à une page web</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Define_terms_with_HTML">Comment définir des termes en HTML</a></li>
</ul>
<h3 id="Les_hyperliens">Les hyperliens</h3>
<p>Les {{Glossary("hyperlien", "hyperliens")}} rendent la navigation très simple sur le web, ils peuvent être utilisés de différentes façons :</p>
<ul>
<li><a href="/fr/docs/Learn/HTML/Howto/Create_a_hyperlink">Comment créer un hyperlien</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Create_list_of_items_with_HTML">Comment créer une table des matières en HTML</a></li>
</ul>
<h3 id="Images_et_multimédia">Images et multimédia</h3>
<ul>
<li><a href="/fr/docs/Learn/HTML/Howto/Add_images_to_a_webpage">Comment ajouter des images à une page web</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Add_audio_or_video_content_to_a_webpage">Comment ajouter une vidéo à une page web</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Add_audio_or_video_content_to_a_webpage">Comment ajouter un contenu audio à une page web</a></li>
</ul>
<h3 id="Script_et_mise_en_forme">Script et mise en forme</h3>
<p>HTML ne permet que de gérer la structure et le contenu d'un document. Pour régler les aspects de styles, on utilisera du {{glossary("CSS")}}, pour l'aspect interactif et script, on utilisera {{glossary("JavaScript")}}.</p>
<ul>
<li><a href="/fr/docs/Learn/HTML/Howto/Use_CSS_within_a_webpage">Comment utiliser CSS dans une page web</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Use_JavaScript_within_a_webpage">Comment utiliser JavaScript dans une page web</a></li>
</ul>
<h3 id="Intégrer_du_contenu">Intégrer du contenu</h3>
<ul>
<li><a href="/fr/docs/Learn/HTML/Howto/Embed_a_webpage_within_another_webpage">Comment intégrer une page web dans une autre page web</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Add_Flash_content_within_a_webpage">Comment ajouter du contenu Flash dans une page web</a></li>
</ul>
<h2 id="Problèmes_avancés_ou_rares">Problèmes avancés ou rares</h2>
<p>Au-delà des briques de bases qu'on peut assembler dans les exemples précédents, HTML reste très riche et offre des fonctionnalités avancées qui permettent de résoudre de nombreux problèmes complexes. Ces articles décrivent certains de ces problèmes, moins fréquents, et expliquent comment les résoudre :</p>
<h3 id="Les_formulaires">Les formulaires</h3>
<p>Les formulaires correspondent à une structure HTML complexe qui permet d'envoyer des données d'une page web vers un serveur web. Nous vous invitons à suivre <a href="/fr/docs/Web/Guide/HTML/Formulaires">le guide dédié aux formulaires</a>. Vous pouvez commencer ici :</p>
<ul>
<li><a href="/fr/docs/Web/Guide/HTML/Formulaires/Mon_premier_formulaire_HTML">Comment créer un formulaire web simple</a></li>
<li><a href="/fr/docs/Web/Guide/HTML/Formulaires/Comment_structurer_un_formulaire_HTML">Comment organiser un formulaire web</a></li>
</ul>
<h3 id="Les_informations_tabulaires">Les informations tabulaires</h3>
<p>Certaines informations doivent être organisées en tableaux, sur des colonnes et des lignes. Les tableaux sont une des structures HTML les plus complexes et s'avèrent particulièrement difficiles à maîtriser de A à Z :</p>
<ul>
<li><a href="/fr/docs/Learn/HTML/Howto/Create_a_data_spreadsheet">Comment créer un tableur où saisir de sdonnées</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Make_HTML_tables_accessible">Comment rendre accessibles les tableaux HTML</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Optimize_HTML_table_rendering">Comment optimiser le rendu d'un tableau HTML</a></li>
</ul>
<h3 id="La_représentation_de_données">La représentation de données</h3>
<ul>
<li><a href="/fr/docs/Learn/HTMLHowto/Represent_numeric_values_with_HTML">Comment représenter des valeurs numériques en HTML</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Associate_human_readable_content_with_arbitrary_computer_data_structures">Comment associer du contenu lisible avec des structures de données informatiques arbitraires</a></li>
</ul>
<h3 id="Interactivité">Interactivité</h3>
<ul>
<li><a href="/fr/docs/Learn/HTML/Howto/Create_collapsible_content_with_HTML">Comment créer du contenu dépliable/repliable avec HTML</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Add_context_menus_to_a_webpage">Comment ajouter des menus contextuels à une page web</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Create_dialog_boxes_with_HTML">Comment créer des boîtes de dialogue avec HTML</a></li>
</ul>
<h3 id="Sémantique_avancée_pour_les_éléments_textuels">Sémantique avancée pour les éléments textuels</h3>
<ul>
<li><a href="/fr/docs/Learn/HTML/Howto/Take_control_of_HTML_line_breaking">Comment contrôler le passage à la ligne en HTML</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Mark_text_insertion_and_deletion">Comment restituer des changements (du texte ajouté/retiré)</a></li>
</ul>
<h3 id="Images_et_multimédia_avancés">Images et multimédia avancés</h3>
<ul>
<li><a href="/fr/docs/Learn/HTML/Howto/Add_responsive_image_to_a_webpage">Comment ajouter une image adaptative (<em>responsive</em>) à une page web</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Add_vector_image_to_a_webpage">Comment ajouter une image vectorielle à une page web</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Add_a_hit_map_on_top_of_an_image">Comment ajouter une cartes de zones cliquables sur une image</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Create_dynamic_and_interactive_images">Comment créer des images dynamiques et interactives</a></li>
</ul>
<h3 id="L'internationalisation">L'internationalisation</h3>
<p>HTML n'est pas monolingue. Il existe des outils qui permettent de résoudre les problèmes fréquents qui se posent lorsqu'on internationalise du contenu.</p>
<ul>
<li><a href="/fr/docs/Learn/HTML/Howto/Add_multiple_languages_into_a_single_webpage">Comment ajouter plusieurs langages sur une seule page web</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Handle_Japanese_ruby_characters">Comment gérer les caractères japonais (ruby)</a></li>
<li><a href="/fr/docs/Learn/HTML/Howto/Display_time_and_date_with_HTML">Comment afficher des heures et des dates avec HTML</a></li>
</ul>
|
