{"id":208418,"date":"2023-08-25T07:30:00","date_gmt":"2023-08-25T07:30:00","guid":{"rendered":"https:\/\/datascientest.com\/?p=208418"},"modified":"2023-11-09T13:34:52","modified_gmt":"2023-11-09T13:34:52","slug":"html5-tout-savoir","status":"publish","type":"post","link":"https:\/\/datascientest.com\/html5-tout-savoir","title":{"rendered":"HTML5 : Qu&rsquo;est-ce que c&rsquo;est ? Guide complet"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"208418\" class=\"elementor elementor-208418\" data-elementor-post-type=\"post\">\n\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-2a97177 e-flex e-con-boxed e-con\" data-id=\"2a97177\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;boxed&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-89b0d0a elementor-widget elementor-widget-heading\" data-id=\"89b0d0a\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<style>\/*! elementor - v3.15.0 - 02-08-2023 *\/\n.elementor-heading-title{padding:0;margin:0;line-height:1}.elementor-widget-heading .elementor-heading-title[class*=elementor-size-]>a{color:inherit;font-size:inherit;line-height:inherit}.elementor-widget-heading .elementor-heading-title.elementor-size-small{font-size:15px}.elementor-widget-heading .elementor-heading-title.elementor-size-medium{font-size:19px}.elementor-widget-heading .elementor-heading-title.elementor-size-large{font-size:29px}.elementor-widget-heading .elementor-heading-title.elementor-size-xl{font-size:39px}.elementor-widget-heading .elementor-heading-title.elementor-size-xxl{font-size:59px}<\/style><h2 class=\"elementor-heading-title elementor-size-default\">Le d\u00e9veloppement web est en perp\u00e9tuelle \u00e9volution. Du fait, HTML5 occupe une place pr\u00e9pond\u00e9rante en tant que langage fondamental et incontournable. Depuis son introduction officielle le 28 octobre 2014, HTML5 a r\u00e9volutionn\u00e9 la fa\u00e7on dont les sites Web sont cr\u00e9\u00e9s et offre une multitude de fonctionnalit\u00e9s avanc\u00e9es qui am\u00e9liorent l\u2019exp\u00e9rience utilisateur.<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-d29c931 e-flex e-con-boxed e-con\" data-id=\"d29c931\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;boxed&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-dd7299f elementor-widget elementor-widget-heading\" data-id=\"dd7299f\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">L\u2019\u00e9volution des balises de base dans HTML5<\/h3>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-083e3d8 elementor-widget elementor-widget-text-editor\" data-id=\"083e3d8\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<style>\/*! elementor - v3.15.0 - 02-08-2023 *\/\n.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:#69727d;color:#fff}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap{color:#69727d;border:3px solid;background-color:transparent}.elementor-widget-text-editor:not(.elementor-drop-cap-view-default) .elementor-drop-cap{margin-top:8px}.elementor-widget-text-editor:not(.elementor-drop-cap-view-default) .elementor-drop-cap-letter{width:1em;height:1em}.elementor-widget-text-editor .elementor-drop-cap{float:left;text-align:center;line-height:1;font-size:50px}.elementor-widget-text-editor .elementor-drop-cap-letter{display:inline-block}<\/style>\t\t\t\t<p><span style=\"font-weight: 400;\">HTML5 a fait \u00e9voluer drastiquement les balises de base d\u2019un document HTML. Ces <strong>balises s\u00e9mantiques<\/strong> fournissent une structure plus claire et significative au contenu d\u2019une page web, am\u00e9liorant par cons\u00e9quent l\u2019accessibilit\u00e9, l\u2019indexation par les moteurs de recherche et la compr\u00e9hension globale du document.<\/span><\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0646042 elementor-widget elementor-widget-html\" data-id=\"0646042\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<style type=\"text\/css\">\r\n.tg  {border-collapse:collapse;border-spacing:0;}\r\n.tg td{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;\r\n  overflow:hidden;padding:10px 5px;word-break:normal;}\r\n.tg th{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;\r\n  font-weight:normal;overflow:hidden;padding:10px 5px;word-break:normal;}\r\n.tg .tg-ww7x{background-color:#c0c0c0;font-family:\"Trebuchet MS\", Helvetica, sans-serif !important;font-size:16px;font-weight:bold;\r\n  text-align:left;vertical-align:top}\r\n.tg .tg-dxbu{font-family:\"Trebuchet MS\", Helvetica, sans-serif !important;font-size:16px;text-align:left;vertical-align:top}\r\n.tg .tg-m63y{background-color:#EFEFEF;font-family:\"Trebuchet MS\", Helvetica, sans-serif !important;font-size:16px;text-align:left;\r\n  vertical-align:top}\r\n<\/style>\r\n<table class=\"tg\" style=\"undefined;table-layout: fixed; width: 800px\">\r\n<colgroup>\r\n<col style=\"width: 200px\">\r\n<col style=\"width: 600px\">\r\n<\/colgroup>\r\n<thead>\r\n  <tr>\r\n    <th class=\"tg-ww7x\"><p><\/p>&lt;header&gt; :<\/p><p>balisage de l\u2019en-t\u00eate<\/p><\/th>\r\n    <th class=\"tg-dxbu\">Cette nouvelle balise permet de d\u00e9finir l\u2019en-t\u00eate d\u2019un document. Il est g\u00e9n\u00e9ralement utilis\u00e9 pour inclure le titre, le logo, la navigation principale, et d\u2019autres informations. Cette balise permet aux moteurs de recherche et aux navigateurs de mieux comprendre la structure de la page et d\u2019am\u00e9liorer l\u2019accessibilit\u00e9.<\/th>\r\n  <\/tr>\r\n<\/thead>\r\n<tbody>\r\n  <tr>\r\n    <td class=\"tg-ww7x\"><p>&lt;nav&gt; :<\/p><p><\/p>navigation<\/p><\/td>\r\n    <td class=\"tg-m63y\"><span style=\"font-style:normal;text-decoration:none;color:#000;background-color:transparent\">Cet \u00e9l\u00e9ment est utilis\u00e9 pour encapsuler la navigation principale d\u2019un document, en regroupant des menus, des listes de liens ou des barres de navigation. Cela facilite la distinction de la navigation des autres \u00e9l\u00e9ments de la page<\/span><\/td>\r\n  <\/tr>\r\n  <tr>\r\n    <td class=\"tg-ww7x\"><p>&lt;section&gt; :<\/p><p>la division s\u00e9mantique<\/p><\/td>\r\n    <td class=\"tg-m63y\"><span style=\"font-style:normal;text-decoration:none;color:#000;background-color:transparent\">Il permet de diviser une page web en sections th\u00e9matiques ou en groupes de contenus. Cela facilite l\u2019organisation logique du contenu et rend la structure plus claire pour les d\u00e9veloppeurs et les lecteurs assist\u00e9s par des technologies d\u2019assistance.<\/span><\/td>\r\n  <\/tr>\r\n  <tr>\r\n    <td class=\"tg-ww7x\"><p>&lt;article&gt; :<\/p><p>du contenu ind\u00e9pendant<\/p><\/td>\r\n    <td class=\"tg-m63y\"><span style=\"font-style:normal;text-decoration:none;color:#000;background-color:transparent\">Il est utilis\u00e9 pour encapsuler du contenu ind\u00e9pendant et autonome. Cela peut inclure des articles de blog, des actualit\u00e9s, commentaires, etc.<\/span><\/td>\r\n  <\/tr>\r\n  <tr>\r\n    <td class=\"tg-ww7x\"><p>&lt;footer&gt; :<\/p><p>le pied de page<\/p><\/td>\r\n    <td class=\"tg-m63y\"><span style=\"font-style:normal;text-decoration:none;color:#000;background-color:transparent\">Ce nouvel \u00e9l\u00e9ment est utilis\u00e9 pour d\u00e9finir le pied de page d\u2019un document ou d\u2019une section. Il contient g\u00e9n\u00e9ralement des informations telles que les coordonn\u00e9es, les liens de contacts, les droits d\u2019auteur, les cr\u00e9dits, etc.<\/span><\/td>\r\n  <\/tr>\r\n<\/tbody>\r\n<\/table>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-b92bb97 e-con-full e-flex e-con\" data-id=\"b92bb97\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;full&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9eedad0 elementor-widget elementor-widget-heading\" data-id=\"9eedad0\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">\u00c0 quoi servent les formulaires ?<\/h3>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1540338 elementor-widget elementor-widget-text-editor\" data-id=\"1540338\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p><span style=\"font-weight: 400;\">Ils sont un \u00e9l\u00e9ment essentiel de nombreux sites web. Ils permettent aux utilisateurs d&rsquo;interagir avec de nombreux \u00e9l\u00e9ments et de soumettre des informations.<\/span><\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5e29591 elementor-widget elementor-widget-html\" data-id=\"5e29591\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<style type=\"text\/css\">\r\n.tg  {border-collapse:collapse;border-spacing:0;}\r\n.tg td{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;\r\n  overflow:hidden;padding:10px 5px;word-break:normal;}\r\n.tg th{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;\r\n  font-weight:normal;overflow:hidden;padding:10px 5px;word-break:normal;}\r\n.tg .tg-b6bf{background-color:#D9D9D9;font-family:\"Trebuchet MS\", Helvetica, sans-serif !important;font-size:16px;font-weight:bold;\r\n  text-align:left;vertical-align:top}\r\n.tg .tg-m63y{background-color:#EFEFEF;font-family:\"Trebuchet MS\", Helvetica, sans-serif !important;font-size:16px;text-align:left;\r\n  vertical-align:top}\r\n<\/style>\r\n<table class=\"tg\" style=\"undefined;table-layout: fixed; width: 800px\">\r\n<colgroup>\r\n<col style=\"width: 200px\">\r\n<col style=\"width: 600px\">\r\n<\/colgroup>\r\n<thead>\r\n  <tr>\r\n    <th class=\"tg-b6bf\"><span style=\"font-weight:700;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">Types d\u2019entr\u00e9es<\/span><\/th>\r\n    <th class=\"tg-m63y\"><span style=\"font-weight:400;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">De nouveaux types d\u2019entr\u00e9es ont \u00e9t\u00e9 impl\u00e9ment\u00e9s (\u2018<\/span><span style=\"font-weight:700;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">email<\/span><span style=\"font-weight:400;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">\u2019, \u2018<\/span><span style=\"font-weight:700;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">url<\/span><span style=\"font-weight:400;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">\u2019, \u2018<\/span><span style=\"font-weight:700;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">number<\/span><span style=\"font-weight:400;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">\u2019, etc) permettant aux navigateurs de valider automatiquement les donn\u00e9es saisies et de fournir un message adapt\u00e9 si les informations sont incorrectes.<\/span><\/th>\r\n  <\/tr>\r\n<\/thead>\r\n<tbody>\r\n  <tr>\r\n    <td class=\"tg-b6bf\"><span style=\"font-weight:700;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">Attributs de validation<\/span><\/td>\r\n    <td class=\"tg-m63y\"><span style=\"font-weight:400;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">HTML5 a introduit de nouveaux attributs de validation permettant de contraindre les donn\u00e9es saisies par l\u2019utilisateur. Par exemple, l\u2019attribut \u2018<\/span><span style=\"font-weight:700;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">required<\/span><span style=\"font-weight:400;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">\u2019 indique que le champ est obligatoire pour l\u2019envoi du formulaire.<\/span><\/td>\r\n  <\/tr>\r\n  <tr>\r\n    <td class=\"tg-b6bf\"><span style=\"font-weight:700;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">Validation c\u00f4t\u00e9 client<\/span><\/td>\r\n    <td class=\"tg-m63y\"><span style=\"font-weight:400;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">Auparavant, la validation impliquait le plus souvent l\u2019utilisation de Javascript, mais avec HTML, les navigateurs modernes peuvent valider automatiquement les formulaires.<\/span><\/td>\r\n  <\/tr>\r\n  <tr>\r\n    <td class=\"tg-b6bf\"><span style=\"font-weight:700;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">Saisie automatique<\/span><\/td>\r\n    <td class=\"tg-m63y\"><span style=\"font-weight:400;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">HTML5 peut permettre \u00e0 l\u2019utilisateur de remplir des formulaires par rapport aux informations pr\u00e9c\u00e9demment saisies.<\/span><\/td>\r\n  <\/tr>\r\n  <tr>\r\n    <td class=\"tg-b6bf\"><span style=\"font-weight:700;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">Contr\u00f4les des formulaires<\/span><\/td>\r\n    <td class=\"tg-m63y\"><span style=\"font-weight:400;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">Les formulaires am\u00e9liorent \u00e0 pr\u00e9sent l\u2019exp\u00e9rience utilisateur gr\u00e2ce \u00e0 de nouveaux contr\u00f4les, comme \u2018<\/span><span style=\"font-weight:700;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">datalist<\/span><span style=\"font-weight:400;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">\u2019 qui permet de proposer des suggestions automatiques pendant la saisie.<\/span><\/td>\r\n  <\/tr>\r\n<\/tbody>\r\n<\/table>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-9409a30 elementor-align-center button-principale elementor-widget elementor-widget-button\" data-id=\"9409a30\" data-element_type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"elementor-button-wrapper\">\n\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm elementor-animation-grow\" href=\"https:\/\/datascientest.com\/formations-data\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-text\">Apprendre \u00e0 utiliser HTML5<\/span>\n\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-cc41113 e-flex e-con-boxed e-con\" data-id=\"cc41113\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;boxed&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-92c1900 elementor-widget elementor-widget-heading\" data-id=\"92c1900\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">HTML5 et les medias<\/h3>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0efcd30 elementor-widget elementor-widget-text-editor\" data-id=\"0efcd30\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p><span style=\"font-weight: 400;\">Des <strong>\u00e9volutions significatives<\/strong> ont \u00e9t\u00e9 apport\u00e9es en mati\u00e8re d\u2019int\u00e9gration et de manipulation de m\u00e9dias dans les sites web.<\/span><\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-88f9ea7 elementor-widget elementor-widget-html\" data-id=\"88f9ea7\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<style type=\"text\/css\">\r\n.tg  {border-collapse:collapse;border-spacing:0;}\r\n.tg td{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;\r\n  overflow:hidden;padding:10px 5px;word-break:normal;}\r\n.tg th{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;\r\n  font-weight:normal;overflow:hidden;padding:10px 5px;word-break:normal;}\r\n.tg .tg-b6bf{background-color:#D9D9D9;font-family:\"Trebuchet MS\", Helvetica, sans-serif !important;font-size:16px;font-weight:bold;\r\n  text-align:left;vertical-align:top}\r\n.tg .tg-m63y{background-color:#EFEFEF;font-family:\"Trebuchet MS\", Helvetica, sans-serif !important;font-size:16px;text-align:left;\r\n  vertical-align:top}\r\n<\/style>\r\n<table class=\"tg\" style=\"undefined;table-layout: fixed; width: 800px\">\r\n<colgroup>\r\n<col style=\"width: 200px\">\r\n<col style=\"width: 600px\">\r\n<\/colgroup>\r\n<thead>\r\n  <tr>\r\n    <th class=\"tg-b6bf\"><span style=\"font-weight:700;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">Int\u00e9gration de vid\u00e9os<\/span><\/th>\r\n    <th class=\"tg-m63y\"><span style=\"font-weight:400;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">HTML5 introduit l\u2019\u00e9l\u00e9ment <\/span><span style=\"font-weight:700;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">&lt;video&gt;<\/span><span style=\"font-weight:400;font-style:normal;text-decoration:none;color:#000;background-color:transparent\"> qui permet d\u2019int\u00e9grer des vid\u00e9os directement dans les pages web sans avoir besoin de plugins externes tels que Flash.<\/span><\/th>\r\n  <\/tr>\r\n<\/thead>\r\n<tbody>\r\n  <tr>\r\n    <td class=\"tg-b6bf\"><span style=\"font-weight:700;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">Int\u00e9gration d\u2019audio<\/span><\/td>\r\n    <td class=\"tg-m63y\"><span style=\"font-weight:400;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">Similaire \u00e0 l\u2019\u00e9l\u00e9ment pr\u00e9c\u00e9dent, <\/span><span style=\"font-weight:700;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">&lt;audio&gt;<\/span><span style=\"font-weight:400;font-style:normal;text-decoration:none;color:#000;background-color:transparent\"> permet d\u2019int\u00e9grer directement des pistes sonores dans les pages web.<\/span><\/td>\r\n  <\/tr>\r\n  <tr>\r\n    <td class=\"tg-b6bf\"><span style=\"font-weight:700;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">Cr\u00e9ation de graphiques<\/span><\/td>\r\n    <td class=\"tg-m63y\"><span style=\"font-weight:400;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">L\u2019\u00e9l\u00e9ment <\/span><span style=\"font-weight:700;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">&lt;canvas&gt;<\/span><span style=\"font-weight:400;font-style:normal;text-decoration:none;color:#000;background-color:transparent\"> permet la manipulation de graphiques, d\u2019animation et de rendus dynamiques en utilisant Javascript.<\/span><\/td>\r\n  <\/tr>\r\n<\/tbody>\r\n<\/table>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-9a3b54c elementor-widget elementor-widget-text-editor\" data-id=\"9a3b54c\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p><span style=\"font-weight: 400;\">D\u2019autres fonctionnalit\u00e9s comme l\u2019API m\u00e9dia et l\u2019\u00e9l\u00e9ment <\/span><b>&lt;track&gt;<\/b><span style=\"font-weight: 400;\"> permettent \u00e9galement une gestion plus riches concernant les m\u00e9dias int\u00e9gr\u00e9s aux sites web.<\/span><\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-f64d0d6 e-flex e-con-boxed e-con\" data-id=\"f64d0d6\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;boxed&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e9ef03c elementor-widget elementor-widget-heading\" data-id=\"e9ef03c\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Autres fonctionnalit\u00e9s avanc\u00e9es<\/h3>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-83c5f6e elementor-widget elementor-widget-text-editor\" data-id=\"83c5f6e\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p><span style=\"font-weight: 400;\">Outre les am\u00e9liorations que nous venons d\u2019\u00e9voquer, HTML5 propose \u00e9galement des fonctionnalit\u00e9s int\u00e9ressantes :<\/span><\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-bb3af03 elementor-widget elementor-widget-html\" data-id=\"bb3af03\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<style type=\"text\/css\">\r\n.tg  {border-collapse:collapse;border-spacing:0;}\r\n.tg td{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;\r\n  overflow:hidden;padding:10px 5px;word-break:normal;}\r\n.tg th{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;\r\n  font-weight:normal;overflow:hidden;padding:10px 5px;word-break:normal;}\r\n.tg .tg-b6bf{background-color:#D9D9D9;font-family:\"Trebuchet MS\", Helvetica, sans-serif !important;font-size:16px;font-weight:bold;\r\n  text-align:left;vertical-align:top}\r\n.tg .tg-m63y{background-color:#EFEFEF;font-family:\"Trebuchet MS\", Helvetica, sans-serif !important;font-size:16px;text-align:left;\r\n  vertical-align:top}\r\n<\/style>\r\n<table class=\"tg\" style=\"undefined;table-layout: fixed; width: 800px\">\r\n<colgroup>\r\n<col style=\"width: 200px\">\r\n<col style=\"width: 600px\">\r\n<\/colgroup>\r\n<thead>\r\n  <tr>\r\n    <th class=\"tg-b6bf\"><span style=\"font-weight:700;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">Stockage local<\/span><\/th>\r\n    <th class=\"tg-m63y\"><span style=\"font-weight:400;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">HTML5 introduit des API de stockage local qui permettent aux sites web de stocker des donn\u00e9es localement sur le navigateur de l\u2019utilisateur. Cela offre une alternative aux cookies pour le stockage de donn\u00e9es persistantes.<\/span><\/th>\r\n  <\/tr>\r\n<\/thead>\r\n<tbody>\r\n  <tr>\r\n    <td class=\"tg-b6bf\"><span style=\"font-weight:700;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">Connectivit\u00e9<\/span><\/td>\r\n    <td class=\"tg-m63y\"><span style=\"font-weight:400;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">L\u2019API WebSocket est une fonctionnalit\u00e9 qui permet une communication bidirectionnelle en temps r\u00e9el entre le client et le serveur. Contrairement aux appels HTTP traditionnels, cela ouvre la voie \u00e0 des applications web en temps r\u00e9el comme des salons de tchat, des dashboards, des jeux multijoueurs, etc.<\/span><\/td>\r\n  <\/tr>\r\n  <tr>\r\n    <td class=\"tg-b6bf\"><span style=\"font-weight:700;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">G\u00e9olocalisation<\/span><\/td>\r\n    <td class=\"tg-m63y\"><span style=\"font-weight:400;font-style:normal;text-decoration:none;color:#000;background-color:transparent\">L\u2019API Geolocation permet aux sites web d\u2019acc\u00e9der \u00e0 la position g\u00e9ographique de l\u2019utilisateur via le navigateur.<\/span><\/td>\r\n  <\/tr>\r\n<\/tbody>\r\n<\/table>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-5995d40 e-flex e-con-boxed e-con\" data-id=\"5995d40\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;boxed&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2e8a5e0 elementor-widget elementor-widget-heading\" data-id=\"2e8a5e0\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Conclusion<\/h3>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-77a7c22 elementor-widget elementor-widget-text-editor\" data-id=\"77a7c22\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p><span style=\"font-weight: 400;\">HTML5 a r\u00e9volutionn\u00e9 la fa\u00e7on dont les sites web sont aujourd\u2019hui con\u00e7us. Les sites web modernes sont maintenant beaucoup plus dynamiques et esth\u00e9tiques, ce qui \u00e9tait auparavant impossible avec les anciennes moutures de HTML.<\/span><\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1f791d6 elementor-align-center button-principale elementor-widget elementor-widget-button\" data-id=\"1f791d6\" data-element_type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"elementor-button-wrapper\">\n\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm elementor-animation-grow\" href=\"https:\/\/datascientest.com\/formations-data\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-text\">Commencer une formation sur HTML5<\/span>\n\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-c60bec0 e-flex e-con-boxed e-con\" data-id=\"c60bec0\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;boxed&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-60030fb elementor-widget elementor-widget-html\" data-id=\"60030fb\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<script type=\"application\/ld+json\">\r\n{\r\n  \"@context\": \"https:\/\/schema.org\",\r\n  \"@type\": \"FAQPage\",\r\n  \"mainEntity\": [{\r\n    \"@type\": \"Question\",\r\n    \"name\": \"L\u2019\u00e9volution des balises de base dans HTML5\",\r\n    \"acceptedAnswer\": {\r\n      \"@type\": \"Answer\",\r\n      \"text\": \"HTML5 a fait \u00e9voluer drastiquement les balises de base d\u2019un document HTML. Ces balises s\u00e9mantiques fournissent une structure plus claire et significative au contenu d\u2019une page web, am\u00e9liorant par cons\u00e9quent l\u2019accessibilit\u00e9, l\u2019indexation par les moteurs de recherche et la compr\u00e9hension globale du document.\"\r\n    }\r\n  },{\r\n    \"@type\": \"Question\",\r\n    \"name\": \"\u00c0 quoi servent les formulaires ?\",\r\n    \"acceptedAnswer\": {\r\n      \"@type\": \"Answer\",\r\n      \"text\": \"Ils sont un \u00e9l\u00e9ment essentiel de nombreux sites web. Ils permettent aux utilisateurs d'interagir avec de nombreux \u00e9l\u00e9ments et de soumettre des informations.\"\r\n    }\r\n  }]\r\n}\r\n<\/script>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Le d\u00e9veloppement web est en perp\u00e9tuelle \u00e9volution. Du fait, HTML5 occupe une place pr\u00e9pond\u00e9rante en tant que langage fondamental et incontournable. Depuis son introduction officielle le 28 octobre 2014, HTML5 a r\u00e9volutionn\u00e9 la fa\u00e7on dont les sites Web sont cr\u00e9\u00e9s et offre une multitude de fonctionnalit\u00e9s avanc\u00e9es qui am\u00e9liorent l\u2019exp\u00e9rience utilisateur. L\u2019\u00e9volution des balises de [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":208420,"comment_status":"open","ping_status":"open","sticky":false,"template":"elementor_theme","format":"standard","meta":{"content-type":"","inline_featured_image":false},"categories":[2494],"tags":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v21.7 (Yoast SEO v21.7) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>HTML5 : Qu&#039;est-ce que c&#039;est ? Guide complet<\/title>\n<meta name=\"description\" content=\"Petit tour d&#039;horizon sur HTML5, un outil incontournable pour le d\u00e9veloppement web. Les d\u00e9tails dans cet article.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/datascientest.com\/html5-tout-savoir\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"HTML5 : Qu&#039;est-ce que c&#039;est ? Guide complet\" \/>\n<meta property=\"og:url\" content=\"https:\/\/datascientest.com\/html5-tout-savoir\" \/>\n<meta property=\"og:site_name\" content=\"Formation Data Science | DataScientest.com\" \/>\n<meta property=\"article:published_time\" content=\"2023-08-25T07:30:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-11-09T13:34:52+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/datascientest.com\/wp-content\/uploads\/2023\/07\/Illu_BLOG__HTML_5.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1024\" \/>\n\t<meta property=\"og:image:height\" content=\"562\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Margalith Mamou\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"Margalith Mamou\" \/>\n\t<meta name=\"twitter:label2\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/datascientest.com\/html5-tout-savoir\",\"url\":\"https:\/\/datascientest.com\/html5-tout-savoir\",\"name\":\"HTML5 : Qu'est-ce que c'est ? Guide complet\",\"isPartOf\":{\"@id\":\"https:\/\/datascientest.com\/#website\"},\"datePublished\":\"2023-08-25T07:30:00+00:00\",\"dateModified\":\"2023-11-09T13:34:52+00:00\",\"author\":{\"@id\":\"https:\/\/datascientest.com\/#\/schema\/person\/1c2cce73f7edd34162d45b93c92adb00\"},\"description\":\"Petit tour d'horizon sur HTML5, un outil incontournable pour le d\u00e9veloppement web. Les d\u00e9tails dans cet article.\",\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/datascientest.com\/html5-tout-savoir\"]}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/datascientest.com\/#website\",\"url\":\"https:\/\/datascientest.com\/\",\"name\":\"Formation Data Science | DataScientest.com\",\"description\":\"Leader de la formation en Data Science\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/datascientest.com\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/datascientest.com\/#\/schema\/person\/1c2cce73f7edd34162d45b93c92adb00\",\"name\":\"Margalith Mamou\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/datascientest.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/datascientest.com\/wp-content\/uploads\/2023\/11\/Margalith.jpg\",\"contentUrl\":\"https:\/\/datascientest.com\/wp-content\/uploads\/2023\/11\/Margalith.jpg\",\"caption\":\"Margalith Mamou\"},\"description\":\"Margalith Mamou est Product Manager chez DataScientest, apr\u00e8s avoir occup\u00e9 le poste de Chef de projet Web pendant plus d'un an au sein de la m\u00eame entreprise. Auparavant, elle a \u00e9t\u00e9 D\u00e9veloppeur web pendant pr\u00e8s de 3 ans. Margalith est dipl\u00f4m\u00e9e du Digital College et de l'Institut F2I, avec une sp\u00e9cialisation en gestion du Web et design digital marketing.\",\"sameAs\":[\"https:\/\/www.linkedin.com\/in\/margalith-mamou-a2869919b\/\",\"user\"],\"url\":\"https:\/\/datascientest.com\/author\/margalith\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"HTML5 : Qu'est-ce que c'est ? Guide complet","description":"Petit tour d'horizon sur HTML5, un outil incontournable pour le d\u00e9veloppement web. Les d\u00e9tails dans cet article.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/datascientest.com\/html5-tout-savoir","og_locale":"fr_FR","og_type":"article","og_title":"HTML5 : Qu'est-ce que c'est ? Guide complet","og_url":"https:\/\/datascientest.com\/html5-tout-savoir","og_site_name":"Formation Data Science | DataScientest.com","article_published_time":"2023-08-25T07:30:00+00:00","article_modified_time":"2023-11-09T13:34:52+00:00","og_image":[{"width":1024,"height":562,"url":"https:\/\/datascientest.com\/wp-content\/uploads\/2023\/07\/Illu_BLOG__HTML_5.png","type":"image\/png"}],"author":"Margalith Mamou","twitter_card":"summary_large_image","twitter_misc":{"\u00c9crit par":"Margalith Mamou","Dur\u00e9e de lecture estim\u00e9e":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/datascientest.com\/html5-tout-savoir","url":"https:\/\/datascientest.com\/html5-tout-savoir","name":"HTML5 : Qu'est-ce que c'est ? Guide complet","isPartOf":{"@id":"https:\/\/datascientest.com\/#website"},"datePublished":"2023-08-25T07:30:00+00:00","dateModified":"2023-11-09T13:34:52+00:00","author":{"@id":"https:\/\/datascientest.com\/#\/schema\/person\/1c2cce73f7edd34162d45b93c92adb00"},"description":"Petit tour d'horizon sur HTML5, un outil incontournable pour le d\u00e9veloppement web. Les d\u00e9tails dans cet article.","inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/datascientest.com\/html5-tout-savoir"]}]},{"@type":"WebSite","@id":"https:\/\/datascientest.com\/#website","url":"https:\/\/datascientest.com\/","name":"Formation Data Science | DataScientest.com","description":"Leader de la formation en Data Science","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/datascientest.com\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"fr-FR"},{"@type":"Person","@id":"https:\/\/datascientest.com\/#\/schema\/person\/1c2cce73f7edd34162d45b93c92adb00","name":"Margalith Mamou","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/datascientest.com\/#\/schema\/person\/image\/","url":"https:\/\/datascientest.com\/wp-content\/uploads\/2023\/11\/Margalith.jpg","contentUrl":"https:\/\/datascientest.com\/wp-content\/uploads\/2023\/11\/Margalith.jpg","caption":"Margalith Mamou"},"description":"Margalith Mamou est Product Manager chez DataScientest, apr\u00e8s avoir occup\u00e9 le poste de Chef de projet Web pendant plus d'un an au sein de la m\u00eame entreprise. Auparavant, elle a \u00e9t\u00e9 D\u00e9veloppeur web pendant pr\u00e8s de 3 ans. Margalith est dipl\u00f4m\u00e9e du Digital College et de l'Institut F2I, avec une sp\u00e9cialisation en gestion du Web et design digital marketing.","sameAs":["https:\/\/www.linkedin.com\/in\/margalith-mamou-a2869919b\/","user"],"url":"https:\/\/datascientest.com\/author\/margalith"}]}},"_links":{"self":[{"href":"https:\/\/datascientest.com\/wp-json\/wp\/v2\/posts\/208418"}],"collection":[{"href":"https:\/\/datascientest.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/datascientest.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/datascientest.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/datascientest.com\/wp-json\/wp\/v2\/comments?post=208418"}],"version-history":[{"count":0,"href":"https:\/\/datascientest.com\/wp-json\/wp\/v2\/posts\/208418\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/datascientest.com\/wp-json\/wp\/v2\/media\/208420"}],"wp:attachment":[{"href":"https:\/\/datascientest.com\/wp-json\/wp\/v2\/media?parent=208418"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/datascientest.com\/wp-json\/wp\/v2\/categories?post=208418"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/datascientest.com\/wp-json\/wp\/v2\/tags?post=208418"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}