seccion lenguaje de enmaquetado:html
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Título de la página</title>
</head>
<body>
<h1>Encabezado principal</h1>
<p>Este es un párrafo.</p>
<img src='img/html.png'>
<span> hola mundo </span>
<ul>
<li> item1 </li>
<li> item2 </li>
<li> item3 </li>
</ul>
</body>
<script>
</html>
Esta es la base principal del HTML básico. Como tal, este lenguaje de maquetado es de los principales encargados de darle la forma visible a una página en su composición. Este consta de diferentes tipos de etiquetas que juegan un papel fundamental a la hora de establecer cada parte superficial de cada vista web que es creada con él. Muchas de estas serán vistas con su explicación detallada de lo que hace cada una a continuación:
etiqueta:
<head> Una de las principales que empieza el encabezado de cada vista. Esta encargada de llevar todas las conexiones hacia otros archivos.
etiqueta:
<script> La etiqueta script, como dice su nombre, está encargada de conectar a archivos hechos con JavaScript. Esta solo es empleada cuando se requiere lógica de este lenguaje para funcionar en ciertos componentes. Su ubicación siempre será antes del cierre de la etiqueta body.
etiqueta:
<body> Body es de las más importantes, ya que es prácticamente todo el cuerpo de la vista en general, teniendo la función de llevar la mayoría del contenido visto en ella, como lo son títulos, párrafos, cartas entre otros componentes.
etiqueta:
<div> Esta etiqueta es una de las importantes del HTML. Su principal función es contener cualquier otro componente o elemento dentro de sí misma. Es útil para separar cada parte del código HTML por bloques, del cual deriva su nombre.
etiqueta:
<h1> Una de las tantas otras etiquetas que alberga div. Esta tiene la función de crear títulos en cualquier vista. Esta incluso tiene derivados más pequeños como lo son: h2, h3, h4, h5.
etiqueta:
<p> La etiqueta p por su parte no establece títulos representativos. En su lugar dictamina todos los párrafos (p) de texto informativos existentes dentro de un HTML, siempre yendo después de un h1.
etiqueta:
<img> Esta etiqueta se encarga de entrelazar una imagen con el HTML y hacer que esta sea visible desde la interfaz visible en el navegador.
etiqueta:
<span> Nos permite seleccionar una parte específica de un texto para poder permitirnos darle una personalización única de CSS a esa misma.
etiqueta:
<ul> Esta etiqueta se puede usar para crear una lista sin un orden secuencial en específico.
etiqueta:
<ol> Y para esta mención especial, la etiqueta ol cumple exactamente la misma función de enlistar elementos, pero a diferencia de ul, esta una vez usada en el navegador se les dará un orden de secuencia a los elementos o ítems que se encuentren en su interior.
etiqueta:
<li> En su caso, la etiqueta li o ítem enmarca todos los ítems que puede tener una lista en general, así como lo es ul.
Muchas de estas etiquetas forman las partes importantes de una vista, como ya se mencionó, pero también es necesario conocer desde qué fuentes es más fácil su obtención. Estas reciben el nombre de frameworks; en este caso para front-end (parte visual) entre los más conocidos están Bootstrap, Semantic UI, Bulma y Foundation.
Para el caso de index.html que suele trabajar con JavaScript es más factible usar Bootstrap. Este framework nos permite obtener una diversa cantidad de componentes en HTML como lo son cartas, formularios completos, navbar para menús de navegación, botones con diferentes paletas de colores, inputs de texto en diferentes tipos, entre otros que nos pueden ayudar mucho a la hora de preparar una página de presentación excelente.
si empezaste leyendo esta guia te feleicito vas por el camino necesario para ir adentrandote en el camino de la programacion si tu deseo te impulsa te invito al leer la s demas secciones sera de muy buena utilidad.