Introducción HTML

Esta entrada no está completada

HTML es el Lenguaje de marcado estándar para crear páginas web.

¿Qué es HTML?
HTML significa Idioma de Markup de Hyper Text
HTML es el idioma de marcado estándar para crear páginas web
HTML describe la estructura de una página web
HTML consiste en una serie de elementos.
Los elementos HTML le indican al navegador cómo mostrar el contenido
Los elementos HTML etiqueta las piezas de contenido, como "Esto es un encabezado", "Este es un párrafo", "Este es un enlace", etc.

A continuación veamos un esquema de las etiquetas que pueden ir dentro de otras y la jerarquía que se espera para ser analizada por los navegadores web. Algunos elementos podrán tener sus mismos elementos dentro eso lo puedo explicar después.

html

head

title

base

link

style

Raíz principal

Elemento	Descripción
< htnl > < / htnl >	El elemento HTML html representa la raíz (elemento de nivel superior) de un documento HTML, por lo que también se lo conoce como elemento raíz. Todos los demás elementos deben ser descendientes de este elemento.

Metadatos del documento

Los metadatos contienen información sobre la página. Esto incluye información sobre estilos, scripts y datos para ayudar al software (motores de búsqueda, navegadores, etc.) a utilizar y representar la página. Los metadatos para estilos y scripts se pueden definir en la página o enlazar a otro archivo que tenga la información.

Elemento	Descripción
< base / >	El elemento HTML <{base}> especifica la URL base para usar para todas las URL relativas en un documento. Solo puede haber un elemento <{base}> en un documento.
< head > < / head >	El elemento HTML <{Head}> contiene información legible por la máquina (metadatos) sobre el documento, como su título, scripts y hojas de estilo.
< link / >	El elemento HTML de enlace <{link}> especifica las relaciones entre el documento actual y un recurso externo. Este elemento se usa más comúnmente para enlazar a CSS, pero también se usa para establecer iconos de sitios (ambos iconos de estilo "FAVICON" e iconos para la pantalla de inicio y las aplicaciones en dispositivos móviles) entre otras cosas.
< meta / >	El elemento HTML <{meta}> representa metadatos que no pueden ser representados por otros elementos etarelacionados HTML, como base, enlace, script, estilo o título.
< style > < / style >	El elemento HTML <{style}> contiene información de estilo para un documento, o parte de un documento. Contiene CSS, que se aplica a los contenidos del documento que contiene el elemento <{style}>.
< title > < / title >	El elemento <{title}> HTML define el título del documento que se muestra en la barra de título de un navegador o en la pestaña de una página. Solo contiene texto; Las etiquetas dentro del elemento son ignoradas.

Raíz de seccionamiento

Elemento	Descripción
< address > < / address >	El elemento HTML <{address}> indica que el HTML adjunto proporciona información de contacto para una persona o personas, o para una organización.
< article > < / article >	El elemento HTML <{Artículo}> representa una composición autocontenida en un documento, página, aplicación o sitio, que pretende ser de forma independiente distribuible o reutilizable (por ejemplo, en la sindicación). Los ejemplos incluyen: una publicación en el foro, un artículo de revista o periódico, o una entrada de blog, una tarjeta de producto, un comentario enviado por el usuario, un widget o gadget interactivo o cualquier otro elemento independiente de contenido.
< aside > < / aside >	El elemento HTML <{aside}> representa una parte de un documento cuyo contenido solo está relacionado indirectamente con el contenido principal del documento. Los astivos se presentan con frecuencia como barras laterales o cajas de llamada.
< footer > < / footer >	El elemento HTML <{footer}> representa un pie de página para su contenido de seccionamiento más cercano o el elemento raíz de seccionamiento. Un <{footer}> generalmente contiene información sobre el autor de la sección, datos de derechos de autor o enlaces a documentos relacionados.
< header > < / header >	El elemento HTML header representa el contenido de introducción, típicamente un grupo de ayudas introductorias o de navegación. Puede contener algunos elementos de encabezado, pero también un logotipo, un formulario de búsqueda, un nombre de autor y otros elementos.
< h1 > < / h1 > < h2 > < / h2 > < h3 > < / h3 > < h4 > < / h4 > < h5 > < / h5 > < h6 > < / h6 >	Los elementos HTML <{h1}> a <{h6}> representan seis niveles de encabezados de sección. <{h1}> es el nivel de sección más alto y <{h6}> es el más bajo. Estos son elementos muy importantes, ya que generan un árbol en la estatura del sitio web y de ellos demente la jerarquía a mostrar. Verifica la validación de w3c y verás
< main > < / main >	El elemento HTML main representa el contenido dominante del cuerpo de un documento. El área de contenido principal consiste en contenido que está directamente relacionado o se expande sobre el tema central de un documento, o la funcionalidad central de una aplicación.
< nav > < / nav >	El elemento nav HTML representa una sección de una página cuyo propósito es proporcionar enlaces de navegación, ya sea dentro del documento actual o en otros documentos. Los ejemplos comunes de secciones de navegación son menús, tablas de contenidos e índices.
< section > < / section >	El elemento section HTML representa una sección independiente genérica de un documento, que no tiene un elemento semántico más específico para representarlo. Las secciones siempre deben tener un encabezado, con muy pocas excepciones.

Contenido del texto

Use elementos de contenido de texto HTML para organizar bloques o secciones del contenido colocado entre la abertura "cuerpo" y las etiquetas de "cuerpo" de cierre. Importante para la accesibilidad y SEO, estos elementos identifican el propósito o la estructura de ese contenido.

Elemento	Descripción
< blockquote > < / blockquote >	El elemento HTML <{blockquote}> indica que el texto adjunto es una cotización extendida. Por lo general, esto se representa visualmente por sangría (consulte las Notas sobre cómo cambiarla). Se puede administrar una URL para la fuente de la cotización utilizando el atributo Cite, mientras que se puede administrar una representación de texto de la fuente utilizando el elemento CITE.
< dd > < / dd >	El elemento HTML <{dd}> proporciona la descripción, la definición o el valor para el término anterior (dt) en una lista de descripción (dl).
< div > < / div >	El elemento HTML <{div}> es el contenedor genérico para el contenido de flujo. No tiene efecto en el contenido o el diseño hasta que se establezca de alguna manera utilizando CSS (por ejemplo, el estilo que se aplique directamente a él, o algún tipo de modelo de diseño como FlexBox se aplique a su elemento padre).
< dl > < / dl >	El elemento HTML <{dl}> representa una lista de descripción. El elemento encierra una lista de grupos de términos (especificados utilizando el elemento DT) y descripciones (proporcionadas por los elementos DD). Los usos comunes para este elemento deben implementar un glosario o para mostrar metadatos (una lista de pares de valor clave).
< dt > < / dt >	El elemento HTML <{dt}> especifica un término en una descripción o lista de definición, y como tal se debe usar dentro de un elemento DL. Por lo general, es seguido por un elemento DD; Sin embargo, varios elementos <{dt}> en una fila indican varios términos que están definidos por el elemento DD inmediato siguiente.
< figcaption > < / figcaption >	El elemento HTML figcaption representa una leyenda o leyenda que describe el resto de los contenidos de su elemento Figura Padres.
< figure > < / figure >	El elemento <{figure}> HTML representa contenido autónomo, potencialmente con un título opcional, que se especifica utilizando el elemento FIGCAPTION. La figura, su título y sus contenidos se hace referencia como una sola unidad.
< hr > < / hr >	El elemento HTML <{hr}> representa una ruptura temática entre los elementos de nivel de párrafo: por ejemplo, un cambio de escena en una historia, o un cambio de tema dentro de una sección. xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
< li > < / li >	El elemento HTML <{li}> se usa para representar un elemento en una lista. Debe estar contenido en un elemento principal: una lista ordenada (OL), una lista desordenada (UL) o un menú (menú). En los menús y las listas desordenadas, los elementos de la lista generalmente se muestran utilizando puntos de bala. En las listas ordenadas, generalmente se muestran con un contador ascendente a la izquierda, como un número o letra.
< ol > < / ol >	El elemento <{ol}> HTML representa una lista ordenada de elementos, generalmente prestados como una lista numerada.
< p > < / p >	El elemento <{p}> HTML representa un párrafo. Los párrafos generalmente se representan en medios visuales como bloques de texto separados de bloques adyacentes por líneas en blanco y / o sangría de primera línea, pero los párrafos HTML pueden ser cualquier agrupación estructural de contenido relacionado, como imágenes o campos de formulario.
< pre > < / pre >	El elemento <{pre}> html representa el texto preformateado que se presenta exactamente como se escribe en el archivo HTML. El texto se presta típicamente utilizando una fuente no proporcional, o "monoespaced, espacios en blanco dentro de este elemento se muestra como se escribe.
< ul > < / ul >	El elemento <{ul}> HTML representa una lista desordenada de elementos, generalmente hechos como una lista de viñetas.

Semántica de texto en línea

Use el texto en línea HTML semántico para definir el significado, la estructura o el estilo de una palabra, línea o cualquier pieza de texto arbitraria.

Elemento	Descripción
< a > < / a >	El elemento HTML <{a}> (o elemento de anclaje), con su atributo HREF, crea un hipervínculo a páginas web, archivos, direcciones de correo electrónico, ubicaciones en la misma página, o cualquier otra cosa que pueda dirigirse una URL.
< abbr > < / abbr >	El elemento HTML <{abbr}> representa una abreviatura o acrónimo; El atributo de título opcional puede proporcionar una expansión o descripción para la abreviatura. Si está presente, el título debe contener esta descripción completa y nada más.
< b > < / b >	El elemento HTML <{b}> se usa para atraer la atención del lector a los contenidos del elemento, que de otro modo no se les otorga especial importancia. Esto se conocía anteriormente como el elemento en negrita, y la mayoría de los navegadores aún dibujan el texto en negrita. Sin embargo, no debe usar <{b}> para el texto de estilo; En su lugar, debe usar la propiedad de peso-peso CSS para crear texto en negrita, o el elemento <{strong}> para indicar que el texto es de especial importancia.
< bdi > < / bdi >	El elemento HTML <{bdi}> le dice al algoritmo bidireccional del navegador para tratar el texto que contiene de forma aislada de su texto circundante. Es particularmente útil cuando un sitio web inserta dinámicamente un poco de texto y no sabe la dirección de la dirección del texto que se está insertando.
< bdo > < / bdo >	Lorem ipsum dolor sit amet consectetur adipisicing elit. Nobis eos sunt ipsum aperiam El elemento HTML <{bdo}> anula la dirección actual del texto, de modo que el texto dentro se representa en una dirección diferente.
< br / >	El elemento HTML <{br}> produce una línea de interrupción en el texto (retorno de carro). Es útil para escribir un poema o una dirección, donde la división de líneas es significativa.
< cite > < / cite >	El elemento HTML <{cite}> se usa para describir una referencia a un trabajo creativo citado, y debe incluir el título de ese trabajo. La referencia puede estar en una forma abreviada de acuerdo con las convenciones apropiadas de contexto relacionadas con los metadatos de citación.
< code > < / code >	El elemento <{code}> HTML muestra su contenido de estilo en una moda destinada a indicar que el texto es un breve fragmento del código de computadora. De forma predeterminada, el texto de contenido se muestra utilizando la fuente MonoSpace predeterminada del Agente de usuario.
< data > < / data >	El elemento HTML <{data}> une a un pedazo de contenido dado con una traducción legible por máquina. Si el contenido es relacionado con la hora o la fecha, se debe utilizar el elemento de tiempo.
< dnf > < / dnf >	El elemento HTML <{dnf}> se usa para indicar el término que se está definiendo dentro del contexto de una frase u oración de definición. El elemento <{P}>, el emparejamiento <{DT}> / <{DD}>, o el elemento de la sección, que es el ancestro más cercano de la {dfn} se considera la definición del término.
< em > < / em >	El elemento HTML <{em}> HTML marca el énfasis de estrés. El elemento <{em}> puede ser anidado, con cada nivel de anidación que indica un mayor grado de énfasis.
< i > < / i >	El elemento <{i}> HTML representa una gama de texto que se desactiva del texto normal por alguna razón, como texto idiomático, términos técnicos, designaciones taxonómicas, entre otros. Históricamente, estos se han presentado utilizando el tipo en cursiva, que es la fuente original de la denominación <{i}> de este elemento.
< kdb > < / kdb >	El elemento HTML <{kdb}> representa un lapso de texto en línea que denota la entrada de usuario textual de un teclado, entrada de voz o cualquier otro dispositivo de entrada de texto. Por convención, el agente de usuario incidentes de representar el contenido de un elemento <{kdb}> utilizando su fuente monoespacial predeterminada, aunque esto no es obligatorio por el estándar HTML.
< mark > < / mark >	El elemento <{mark}> html representa el texto que está marcado o resaltado para fines de referencia o notación, debido a la relevancia o importancia del pasaje marcado en el contexto del adjunto.
< q > < / q >	El elemento HTML <{q}> indica que el texto adjunto es una cotización en línea corta. La mayoría de los navegadores modernos implementan esto rodeando el texto en comillas. Este elemento está destinado a las cotizaciones cortas que no requieren roturas de párrafos; Para las cotizaciones largas usan el elemento Blockquote.
< rp > < / rp >	El elemento HTML <{rp}> se usa para proporcionar paréntesis de retroceso para los navegadores que no admiten la visualización de anotaciones de rubí utilizando el elemento Ruby. Un elemento <{rp}> debe encerrar cada uno de los paréntesis de apertura y cierre que envuelven el elemento RT que contiene el texto de la anotación.
< rt > < / rt >	El elemento HTML <{rt}> especifica el componente de texto de rubí de una anotación de rubí, que se utiliza para proporcionar información de pronunciación, traducción o transliteración para la tipografía oriental de Asia. El elemento <{rt}> siempre debe estar contenido dentro de un elemento de rubí "<{ruby}>".
< ruby > < / ruby >	El elemento HTML {ruby} representa a las pequeñas anotaciones que se representan anteriormente, a continuación, o junto al texto base, generalmente se usan para mostrar la pronunciación de los caracteres del este de Asia. También se puede utilizar para anotar otros tipos de texto, pero este uso es menos común.
< s > < / s >	El elemento <{s}> HTML hace texto con un estricto, o una línea a través de ella. Use el elemento <{s}> para representar cosas que ya no son relevantes o que ya no son precisas. Sin embargo, <{s}> no es apropiado cuando se indica las ediciones de documentos; Para eso, use los elementos <{del}> Y <{ins}>, según corresponda.
< samp > < / samp >	El elemento <{samp}> HTML se usa para encerrar texto en línea que representa la salida de muestra (o citada) de un programa de computadora. Sus contenidos se prestan generalmente utilizando la fuente monoespaced por defecto del navegador (como la consola de mensajería o Lucida).
< smal > < / smal >	El elemento HTML <{smal}> representa comentarios laterales y letra pequeña, como copyright y texto legal, independientemente de su presentación de estilo. De forma predeterminada, hace que el texto sea dentro de un tamaño de fuente más pequeño, como desde pequeño a x-pequeño.
< span > < / span >	El elemento HTML <{span}> es un contenedor en línea genérico para el contenido de frases, que no representa nada inherentemente. Se puede utilizar para agrupar elementos para fines de estilo (utilizando los atributos de clase o ID), o porque comparten valores de atributos, como Lang. Debe usarse solo cuando ningún otro elemento semántico sea apropiado. <{span}> es muy parecido a un elemento <{div}>, pero DIV es un elemento de nivel de bloque, mientras que un <{span}>es un elemento en línea.
< strong > < / strong >	El <{strong}> Elemento HTML indica que sus contenidos tienen una gran importancia, seriedad o urgencia. Los navegadores suelen rendir los contenidos en negrita.
< sub > < / sub >	El elemento HTML <{sub}> especifica el texto en línea que debe mostrarse como subíndice para razones únicamente tipográficas. Los suscriptores se prestan típicamente con una línea de base baja con un texto más pequeño.
< sup > < / sup >	El elemento HTML <{sup}> especifica el texto en línea que se va a mostrar como SuperScript para razones únicamente tipográficas. Los sobrescripciones generalmente se representan con una línea de base elevada usando un texto más pequeño.
< time > < / time >	El elemento HTML <{time}> representa un período específico en el tiempo. Puede incluir el atributo DateTime para traducir las fechas en el formato legible por máquina, lo que permite mejores resultados de los motores de búsqueda o características personalizadas, como recordatorios.
< u > < / u >	El elemento HTML <{u}> representa un lapso de texto en línea que debe prestarse de una manera que indique que tiene una anotación no textual. Esto se representa de forma predeterminada como un simple subrayado sólido, pero puede alterarse utilizando CSS.
< var > < / var >	El elemento <{var}> html representa el nombre de una variable en una expresión matemática o un contexto de programación. Por lo general, se presenta utilizando una versión en cursiva del tipo de tipografía actual, aunque ese comportamiento depende del navegador.
< wbr > < / wbr >	El elemento HTML <{wbr}> representa una posibilidad de ruptura de palabras: una posición dentro del texto donde el navegador puede romper opcionalmente una línea, aunque sus reglas de línea de salida no crearían un descanso en ese lugar.

Imagen y multimedia

HTML admite varios recursos multimedia, como imágenes, audio y video.

Elemento	Descripción
< area / >	El elemento HTML <{area}> define un área dentro de un mapa de imágenes que tiene áreas de acceso predefinido. Un mapa de imagen permite que las áreas geométricas en una imagen se asocien con el hipervínculo.
< audio > < / audio >	El elemento HTML <{audio}> se usa para incrustar el contenido de sonido en los documentos. Puede contener una o más fuentes de audio, representadas utilizando el atributo SRC o el elemento de origen: el navegador elegirá el más adecuado. También puede ser el destino para los medios transmitidos, utilizando un MediaStream.
< img / >	El elemento HTML <{img}> incorpora una imagen en el documento.
< map > < / map >	El elemento <{map}> HTML se usa con elementos de área para definir un mapa de imagen (un área de enlace, se puede hacer clic).
< track / >	El elemento <{track}> HTML se utiliza como un niño de los elementos de medios, audio y video. Le permite especificar las pistas de texto cronometradas (o los datos basados en el tiempo), por ejemplo, para manejar automáticamente los subtítulos. Las pistas están formateadas en formato webvtt (archivos .vtt) - Pistas de texto de video web.
< video > < / video >	El elemento <{video}> HTML incrusta a un reproductor multimedia que admite la reproducción de video en el documento. También puede usar <{video}> para contenido de audio, pero el elemento de audio puede proporcionar una experiencia de usuario más apropiada.

Contenido incrustado

Además del contenido multimedia normal, HTML puede incluir una variedad de otro contenido, incluso si no siempre es fácil interactuar con él.

Elemento	Descripción
< embed / >	El elemento HTML <{embed}> incorpora contenido externo en el punto especificado en el documento. Este contenido es proporcionado por una aplicación externa u otra fuente de contenido interactivo, como un complemento del navegador.
< iframe > < / iframe >	El elemento HTML <{iframe}> representa un contexto de navegación anidados, incrustando otra página HTML en la actual.
< object > < / object >	El elemento HTML <{object}> representa un recurso externo, que se puede tratar como una imagen, un contexto de navegación anidados, o un recurso para ser manejado por un complemento.
< picture > < / picture >	El elemento HTML <{picture}> contiene cero o más elementos de origen y un elemento img para ofrecer versiones alternativas de una imagen para diferentes escenarios de pantalla/dispositivo.
< portal > < / portal >	El elemento HTML del portal permite la incrustación de otra página HTML en la actual con el fin de permitir una navegación más fluida en nuevas páginas.
< source />	El elemento HTML de <{source}> especifica múltiples recursos de medios para la imagen, el elemento de audio o el elemento de video. Es un elemento vacío, lo que significa que no tiene contenido y no tiene una etiqueta de cierre. Se suele utilizar para ofrecer el mismo contenido multimedia en varios formatos de archivo con el fin de proporcionar compatibilidad con una amplia gama de navegadores dada su diferente compatibilidad con formatos de archivo de imagen y formatos de archivo multimedia.

Tutorías Online

Buscar este blog