¿Cuáles son los conceptos básicos de HTML?

Publicado: 2023-09-25

HTML (lenguaje de marcado de hipertexto) es un elemento fundamental del diseño web en el condado de Orange. Es un lenguaje de marcado que se utiliza para crear la estructura y el contenido de una página web y es la base de todos los sitios web. ¡Probablemente todos los diseñadores web se han encontrado con HTML en sus carreras!

HTML es el lenguaje estándar utilizado para crear páginas web estáticas, que son páginas que no cambian sin la edición manual del código HTML, lo que significa que los usuarios no pueden modificarlo.

los-conceptos-básicos-de-los-lenguajes-de-codificación-HTML-en-diseño-web-condado-de-orange-pinterest

Los conceptos básicos de HTML

HTML es un conjunto de elementos o etiquetas, y cada elemento representa un componente específico de la página web. Suena simple, ¿no? ¡Eso es porque lo es! Estos documentos HTML se crean utilizando un editor de texto y se guardan con la extensión .html. Un documento HTML básico debe tener los siguientes elementos para que funcione correctamente:

La declaración <!DOCTYPE>

La declaración <!DOCTYPE> sirve como acto de apertura para su documento HTML, preparando el escenario al informar al navegador sobre la versión específica de HTML que está utilizando. Piense en ello como una introducción amigable que dice: "¡Oye, navegador, vamos a bailar al ritmo de HTML5!". HTML5 es la estrella actual del espectáculo en el mundo del desarrollo web y aporta una gran cantidad de características y mejoras interesantes. Entonces, cuando incluyes esta declaración, básicamente le estás diciendo al navegador que se prepare para una experiencia HTML moderna y repleta de funciones. Es su forma de asegurarse de que su contenido web se presente correctamente y aproveche todas las excelentes capacidades de HTML5.

<!DOCTYPE html>

El elemento <HTML>

Piense en el elemento <html> como el gran jefe de su documento HTML. Es el jefe, el mandamás y el que mantiene todo en orden. Al igual que un jefe gestiona una empresa, el elemento <html> gestiona toda su página web. Es el punto de partida y el contenedor de todos los demás elementos que utilizará para crear su contenido web.

Dentro de este elemento <html>, encontrará el plano de su página web, incluidos los elementos <head> y <body>. El elemento <head> contiene información importante sobre su documento, como el título, metaetiquetas y enlaces a recursos externos. Mientras tanto, el elemento <body> contiene todo el contenido visible que ven los usuarios cuando visitan su sitio web.

Entonces, en pocas palabras, el elemento <html> es el panorama general, el comandante en jefe y el organizador final de su documento HTML. Garantiza que todo funcione sin problemas y que su página web esté estructurada y presentada correctamente a su audiencia.

El elemento <Cabeza>

El elemento <head> es como el cerebro de su documento y contiene información importante como el título, metaetiquetas y enlaces a elementos sofisticados como hojas de estilo y scripts. Por lo tanto, si bien el elemento <head> puede no ser visible en su página web, juega un papel vital para garantizar que su sitio se vea genial, funcione bien y se comunique de manera efectiva tanto con los usuarios como con los motores de búsqueda. Es como el centro de comando que ayuda a que su página web funcione de la mejor manera.

El elemento <Título>

El elemento <title> especifica el título del documento, que aparece en la barra de título del navegador. No es sólo un requisito técnico sino también una poderosa herramienta de comunicación. Elaborar un título claro, conciso y relevante es esencial para garantizar que su página web sea fácilmente reconocible, accesible y atractiva tanto para los usuarios como para los motores de búsqueda.

El elemento <Cuerpo>

El elemento <body> contiene todo el contenido de la página web, como texto, imágenes, vídeos y otros elementos. Es como el escenario principal de un teatro: es donde ocurre toda la acción en su documento HTML. Es uno de los componentes fundamentales de cualquier página web y su función es bastante sencilla pero esencial: contiene todo el contenido visible que los usuarios ven cuando visitan un sitio web.

Elementos HTML

Los elementos HTML están encerrados entre etiquetas de apertura y cierre, rodeados por corchetes angulares. La etiqueta de apertura comienza con el nombre del elemento, seguido de cualquier atributo en forma de pares nombre-valor. La etiqueta de cierre es exactamente la misma que la etiqueta de apertura, pero tiene una barra diagonal (/) antes del nombre del elemento como una especie de comentario de cierre.

Por ejemplo, el siguiente código crea una página HTML simple:

<!DOCTYPE html>

<html>

<cabeza>

<title>Mi primera página HTML</title>

</cabeza>

<cuerpo>

<h1>Bienvenido a mi sitio web</h1>

<p>Esta es mi primera página HTML.</p>

</cuerpo>

</html>

Aquí, el elemento <html> es el elemento raíz y contiene los elementos <head> y <body>. El elemento <head> contiene el elemento <title>, que especifica el título del documento. El elemento <body> contiene el contenido de la página, que incluye un encabezado y un párrafo. En un documento HTML típico, primero debe comenzar con el elemento más grande (en este caso, HTML) y luego ir a las partes más pequeñas a medida que crea la página (por ejemplo, encabezado, título, cuerpo, etc.).

Atributos HTML

Los atributos HTML brindan información adicional sobre un elemento y se incluyen en la etiqueta de apertura. En cierto modo actúan como un descriptor. Los atributos más comunes incluyen los siguientes:

El atributo de identificación

El atributo id identifica un elemento y en JavaScript y CSS manipula el elemento.

El atributo de clase

El atributo de clase agrupa elementos, lo que permite diseñarlos con CSS.

El atributo de estilo

El atributo de estilo es una característica HTML ingeniosa que le permite aplicar estilos directamente a un elemento individual, allí mismo en el código HTML. Es como darle un cambio de imagen a ese elemento en particular, especificando cosas como colores, fuentes y espacios sin tener que crear una hoja de estilo separada. Esto puede resultar útil cuando desea realizar un cambio rápido y único en la apariencia de un elemento sin afectar el resto de los estilos de su sitio web. Por lo tanto, es su herramienta de referencia para agregar un toque de singularidad a elementos específicos de su diseño web.

El atributo Href

El atributo href se utiliza en enlaces para especificar la URL de la página de destino.

Conclusión

HTML es la base del diseño web y es esencial para crear una página web bien estructurada. ¡Son los primeros pasos hacia un sitio web completo! Por lo tanto, comprender los conceptos básicos de HTML es esencial para cualquiera que quiera crear un sitio web. HTML es un lenguaje de marcado que comprende elementos, atributos y contenido. Cada elemento representa un componente específico de la página web y los atributos proporcionan información adicional sobre un elemento. Con HTML, puede crear un sitio web estructurado, visualmente atractivo e interactivo.

Vea el artículo relacionado aquí: https://www.drivetrafficmedia.com/the- Different-coding-languages-of-web-design/