{"id":4582,"date":"2025-03-04T08:58:26","date_gmt":"2025-03-04T07:58:26","guid":{"rendered":"https:\/\/sutilweb.eu\/?page_id=4582"},"modified":"2025-03-04T08:58:26","modified_gmt":"2025-03-04T07:58:26","slug":"04-la-etiqueta-html-y-doctype","status":"publish","type":"page","link":"https:\/\/sutilweb.eu\/index.php\/lenguajes\/html5\/html5-practico\/04-la-etiqueta-html-y-doctype\/","title":{"rendered":"04. La etiqueta html y !DOCTYPE"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">La etiqueta &lt;html&gt;<\/h2>\n\n\n\n<p>Esta etiqueta es la que se va a encargar directamente de tener tanto la&nbsp;<strong>cabecera<\/strong>&nbsp;como el&nbsp;<strong>cuerpo<\/strong>&nbsp;de nuestro documento. Adicionalmente y desde&nbsp;<strong>HTML5,<\/strong>&nbsp;que es la versi\u00f3n desde el a\u00f1o 2009 hubo toda una estrategia de marketing incluida por la&nbsp;<strong>W3C,<\/strong>&nbsp;es muy importante especificar el atributo del idioma para el cual nosotros vamos a escribir el contenido dentro del documento&nbsp;<strong>HTML.<\/strong><\/p>\n\n\n\n<p><strong>Ejm<\/strong><\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">&lt;html lang=\"es\"&gt;<\/pre>\n\n\n\n<p>Podemos ser espec\u00edficos, porque dentro de un idioma hay ciertas palabras que no se entienden en todos los pa\u00edses, por ejm, con el idioma espa\u00f1ol hay ciertas palabras que se usan en ciertos pa\u00edses pero en otros no, por ejm, si tuvi\u00e9semos que especificar el idioma espa\u00f1ol pero desde M\u00e9xico, se eligir\u00eda el idioma y el dominio en may\u00fasculas que tiene el pa\u00eds, de la siguiente manera.<\/p>\n\n\n\n<p><strong>Ejm<\/strong><\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">&lt;html lang=\"es-MX\"&gt;<\/pre>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p><strong>Nota:<\/strong>&nbsp;Esto es s\u00f3lo recomendable cuando el contexto del contenido es muy particular.<\/p>\n<\/blockquote>\n\n\n\n<h2 class=\"wp-block-heading\">La etiqueta &lt;!DOCTYPE&gt;<\/h2>\n\n\n\n<p>Antes de la revoluci\u00f3n que trajo&nbsp;<strong>HTML5<\/strong>&nbsp;existi\u00f3&nbsp;<strong>HTML1, HTML2, HTML3, HTML4,<\/strong>&nbsp;una mezcla de&nbsp;<strong>HTML4<\/strong>&nbsp;y&nbsp;<strong>XML<\/strong>&nbsp;denominada&nbsp;<strong>XHTML,<\/strong>&nbsp;y en cada una de estas versiones, hab\u00eda diferentes tipos de documentos, por lo que este&nbsp;<strong><em>&lt;!DOCYTPE&gt;<\/em><\/strong>&nbsp;se volv\u00eda complicado de escribir a la hora de crear documentos&nbsp;<strong>HTML,<\/strong>&nbsp;se escrib\u00eda&nbsp;<strong>html<\/strong>&nbsp;y despu\u00e9s una URL hacia la especificaci\u00f3n del tipo de documento, por ejm, en la versi\u00f3n 1 de&nbsp;<strong>HTML<\/strong>&nbsp;ten\u00edamos documentos en&nbsp;<strong>modo estricto,<\/strong>&nbsp;en&nbsp;<strong>modo tradicional,<\/strong>&nbsp;en&nbsp;<strong>soporte para frames\u2026<\/strong><\/p>\n\n\n\n<p>Dependiendo del tipo de documento que est\u00e1bamos redactando, algunas etiquetas eran soportadas y otras no, o el comportamiento o visualizaci\u00f3n de las mismas se modificaba. Este era uno de los problemas que los desarrolladores ten\u00edan cuando comenzaban a escribir en esta \u00e9poca.<\/p>\n\n\n\n<p>Gracias a&nbsp;<strong>HTML5,<\/strong>&nbsp;el consorcio de la&nbsp;<strong>W3C<\/strong>&nbsp;decidi\u00f3 lanzar un s\u00f3lo tipo de documento, y cre\u00f3 la etiqueta siguiente.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">&lt;!DOCTYPE html&gt;<\/pre>\n","protected":false},"excerpt":{"rendered":"<p>La etiqueta &lt;html&gt; Esta etiqueta es la que se va a encargar directamente de tener tanto la&nbsp;cabecera&nbsp;como el&nbsp;cuerpo&nbsp;de nuestro documento. [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":89,"menu_order":3,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_uag_custom_page_level_css":"","site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-4582","page","type-page","status-publish","hentry"],"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false},"uagb_author_info":{"display_name":"Sutil Web","author_link":"https:\/\/sutilweb.eu\/index.php\/author\/sutilweb\/"},"uagb_comment_info":0,"uagb_excerpt":"La etiqueta &lt;html&gt; Esta etiqueta es la que se va a encargar directamente de tener tanto la&nbsp;cabecera&nbsp;como el&nbsp;cuerpo&nbsp;de nuestro documento. [&hellip;]","_links":{"self":[{"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/pages\/4582","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/comments?post=4582"}],"version-history":[{"count":1,"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/pages\/4582\/revisions"}],"predecessor-version":[{"id":4583,"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/pages\/4582\/revisions\/4583"}],"up":[{"embeddable":true,"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/pages\/89"}],"wp:attachment":[{"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/media?parent=4582"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}