domingo, 3 de enero de 2021

👨‍💻 HTML básico para dummies, paso a paso. Capítulo sobre definición. sintaxis y documento html.

⏩ Snippet: ⏪
Un compendio de conceptos y definiciones para lecciones introductorias al HTML.

    ✅ Aclaratoria: Este post es de iniciación al HTML. HTMLCompila los conceptos iniciales necesarios y fundamentales para ir entrando en este terreno, eso sí, ¡paso a paso!. De manera que para un experto, no aportará gran cosa, fuera de un útil refrescamiento.

    ✅ Para su redacción se extrajeron algunos textos de los videos que se anexan al pié de página, como también de las páginas web y tutoriales allí citados.

    ✅ Comenzando con la definición de HTML, haciendo una disección de los elementos que en diferentes textos, videos y tutoriales se han enfatizado como constitutivos de una definición, lo cual me sirvió para poder formular los elementos constitutivos, recurrentes y por tanto indispensables en una definición.

Recomiendo revisar primeramente el resumen,(clic acá) para tener una idea general, porque el desarrolo es muy extenso.


    ✅ Puntualizando: con una redacción que da la primacía a la sencillez y no mezquina con la presentación de los detalles necesarios para dejar bien fundamentados los conceptos acá desarrollados. Esto es así, entre otras razones, porque como autor de este post, acá archivo mis notas sobre este tema, del cual conozco lo mínimo, por ser escritor autodidacta de blogs, y era hora de conocer la ANATOMÍA de ese alucinante mundo en el que me inicié desde 2010 con total desconocimiento (y por así decirlo, a tono con la jerga actual, uno más del club de dummies en HTML), andando a tientas y tropiezos, consultando Google y preguntándole a otros.

    ✅ Así que, personas en condición semejante a la expuesta, hallarán gran utilidad en este y demás temas de este blog, que son mi tarea para ser mejor escritor. Vale decir, que procuro además ilustrar todos mis post, con imágenes amenas (e incluso gifs, como en este post) que aporten cierto nivel de relax argumentativo. ¡Disculpen los expertos, y si no se sienten a gusto, no me incomoda, incluso quedan excusados!.

    ✅ Aclaratoria necesaria, ¿qué se entiende por dummies?. Ese concepto nació con Michael Mac McCarthy quien escribió un libro con suficiente información para principiantes (que en inglés son denominados DUMMIES). Aún cuando traducido al español vendría a ser algo así como tonto, en realidad, no se usa de forma despectiva, porque ese término expone textos, guías o documentos para lectores nuevos, entiéndase, principiantes o inexpertos en el tema. Para terminar, es actualmente famosa la serie de libros para dummies, con temáticas muy variadas, desde cocina, idiomas, PNL, coaching, y no son libros para tontos, sino publicaciones desarrolladas con el lenguaje que cualquier inexperto pueda asimilar, y, de lo cual yo doy fe, porque tengo varios libros de esa colección, ..¡excelentes todos!.

Los    pasos    iniciales

    ✅ ¿Qué es HTML?. HTMLHTML es es el acrónimo de Hypertext Markup Language. Su traducción al español es "Lenguaje Etiquetado de Hipertexto". Probablemente no es la traducción exacta pero es muy significativa.

    ✅ Hypertext Markup Language es un método de comunicación con un navegador web para decirle cómo mostrar el contenido.

    ✅ ¿Qué significa HTML?. Primeramente, hay que resaltar que es un LENGUAJE.

    ✅ ¿De qué tipo?. HTML es un lenguaje de marcado que nos permite crear estructuras.

    ✅ ¿Qué no es HTML?. HTML no es un lenguaje de programación.

    ✅ ¿Cómo funciona?. HTML: (1) nos permite crear estructuras de nuestros sitios web y por tanto,(2) es una forma un tanto peculiar de dar formato a los textos e imágenes que pretendemos ver por medio de un navegador.

    ✅ Los códigos HTML son el lenguaje universal que se utiliza para crear y dar formato a los sitios web. Funcionan en cualquier sistema operativo (Windows, Mac, Linux, etc.) y con cualquier navegador (Chrome, Explorer o Mozilla).

    ✅ Aunque no se trata de un lenguaje de programación muy sofisticado, saber manejar HTML te permite insertar otros códigos más potentes, como los de Javascript,

«Tratamiento hermeneútico de la definición».

    ✅ Si algo he aprendido de la Escuela Dominical en la Iglesia Evangélica, es la importancia del análisis hermeneútico de los textos, y se ha convertido en parte de mi metodología de estudio, o sea, extraer los términos claves en un párrafo para su posterior detalle por separado. En tal sentido, veo importante explicar los elementos constitutivos del acrónimo de HTML, que lo hago a continuacióm.

   📖 ¿Por qué Hipertexto (Hypertext)?. La explicación es la que comparto en las líneas siguientes.

    ✅ Navegar en Internet es como navegar en el océano, si no llevamos una buena brújula o si no sabemos el lugar al que queremos ir, es casi seguro que nos perderemos en este océano digital.

    ✅ Al seguir un vínculo, lo hacemos para aumentar una información, ver una imagen o reproducir un sonido o video. Esta capacidad de ir uniendo páginas con otras páginas es lo que le da a Internet su dinamismo.

    ✅ Como todos sabemos la información es la esencia de Internet, o mejor dicho, la transferencia de esa información. En sí, el concepto del Hipertexto fue uno de los mas importantes detonantes de lo que ahora llamamos World Wide Web que podría ser definido llanamente como un conjunto cuasiinfinito de vínculos.

    ✅ Una definición mas general que podríamos dar de Hipertexto es la siguiente:

    ✅ "Es la organización no lineal de las unidades de información interconectadas entre si"

    ✅ Si quisiéramos ser puristas, podríamos decir que el hipertexto solo se refiere a texto y al hablar de vínculos a objetos multimedia podríamos hablar de hipermedia. En fin, que cada quien escoja la suya.

    ✅ Una nota final, el término hipertexto fue usado por primera vez por Ted Nelson, inventor de Xanadu, un antecesor del Web.

    📖 ¿Por qué Etiquetado (Markup)?. La explicación es la que comparto en las línes siguientes.

    ✅ Imaginemos esta escena: estamos sentados frente a nuestra computadora escribiendo un documento en nuestro procesador de texto favorito. Conforme vamos escribiendo vamos decidiendo el tamaño de las letras de los títulos y del texto normal, también definimos colores, tipos de letras o creamos tablas o incluso insertamos un dibujo a grafica.

    ✅ Ahora imaginemos esta escena: Vamos en el transporte colectivo tratando de escribir ese mismo documento y nuestro procesador de texto es papel y lápiz. Así que, si queremos indicar la forma en que se verá el documento, tendremos que anotar las características de ese titulo o de esa imagen que debe ir aquí y centrada. La mejor forma seria inventar una forma de escribir esas características... a ver que les parece esta:

    ✅ Estas, en si, son etiquetas utilizadas en HTML para indicar en dónde van las cosas y cuáles son sus características.

    ✅ Así que las etiquetas representan cadenas de caracteres especiales que se insertan en el documento para indicarle a nuestro navegador cómo se vera o imprimirá una página en particular.

   📖 ¿Por qué Lenguaje (Language)?. La explicación es la que comparto en las línes siguientes.

    ✅ En si HTML no es un lenguaje de programación; es solo un Lenguaje Etiquetado de Hipertexto. Ya lo habíamos anticipado antes.

    ✅ Sin embargo se pueden encontrar algunas analogías como por ejemplo decir que las etiquetas son palabras reservadas, etc. Es mejor tomar a HTML como un formato que como un lenguaje de programación... evitaremos pasar algunas vergüenzas :-).

    ✅ Por ultimo, cabe mencionar que HTML no es el único lenguaje, o formato, que maneja etiquetas, por ejemplo, también existe el XML.En si HTML no es un lenguaje de programación; es solo un Lenguaje Etiquetado de Hipertexto.

Los    requerimientos    iniciales

    ✅ HTML es el lenguaje con el que se escriben las páginas web. Las páginas web pueden ser vistas por el usuario mediante un tipo de aplicación llamada navegador. Podemos decir por lo tanto que el HTML es el lenguaje usado por los navegadores para mostrar las páginas webs al usuario, siendo hoy en día la interface más extendida en la red.

    ✅Supongamos por ejemplo una página o sitio, con varios vínculos incrustados en ella. La lectura de dicha página se puede hacer de manera lineal, olvidando que los vínculos existen, o podemos llevar una lectura no lineal siguiendo cada uno de los vínculos. Así nuestra definición podría ser de la siguiente forma:

    ✅Este lenguaje nos permite aglutinar textos, sonidos e imágenes y combinarlos a nuestro gusto.

    ✅ Además, y es aquí donde reside su ventaja con respecto a libros o revistas, el HTML nos permite la introducción de referencias a otras páginas por medio de los enlaces hipertexto.

    ✅ Adicional al navegador necesario para ver los resultados de nuestro trabajo, necesitamos evidentemente otra herramienta capaz de crear la página en si. Un archivo HTML (una página) no es más que un texto. Es por ello que para programar en HTML necesitamos un editor de textos. Y, se suelen citar dos metodologías:

«Vas a necesitar el empleo de un EDITOR DE TEXTO».

    ✅ HTML Con opiniones, unos a favor y otros en contra, algunos no ven inconvenientes en usar el Bloc de notas que viene con windows, cuando estás en esta etapa preparatoria, que se supone limitada en cuanto a ciertas habilidades y aptitudes (y lo digo por experiencia, cuando recuerdo mi "arranque" con los blogs, totalmente neófito pero con mucho entusiasmo).

    ✅ En segundo lugar, están los otros que prefieren cualquier otro editor de textos sencillo. Acá te encuentras con dos salvedades: Primeramente, hay que tener cuidado con algunos editores más complejos como Wordpad o Microsoft Word.

    ✅ Microsoft Word no te sirve para crear códigos porque es un procesador de textos y te agrega su propio código oculto al guardar las páginas y HTML es únicamente texto plano, lo cual va a ensuciar tu código y va a quedar mal con lo que podremos tener problemas. ¡No lo uses para nada!. En todo caso utiliza el blog de notas o seguir la recomendación de utilizar un «EDITOR DE CÓDIGO». de los cuales hay muchos, y es la siguiente secuencia en la argumentación de esta sección del presente post.

    ✅ Existen otro tipo de editores específicos para la creación de páginas web los cuales ofrecen muchas facilidades que nos permiten aumentar nuestra productividad. No obstante, es aconsejable en un principio utilizar una herramienta lo más sencilla posible para poder prestar la máxima atención a nuestro código y familiarizarnos lo antes posible con él. Siempre tendremos tiempo más delante de pasarnos a editores más versátiles con la consiguiente ganancia de tiempo.

    ✅ Así las cosas, resulta que puedes acceder a editores más complejos que el Block de Notas, pero más potentes, y solo por citar algunos, tienes:

  • Sublime Text
  • NOTEPAD++
  • Aptana Studio 3.
  • Arachnophilia.
  • Bluefish.
  • Responsive
  • Site Designer.
  • Eclipse.
  • Komodo IDE.
  • NetBeans.

    ✅ Se suele hallar preferentemente citados en muchas publicaciones y videos, los dos primeros editores de la lista, sin que esto quiera dar a entender la prescindibilidad de los otros.

    ✅ Tienes por ejemplo «SUBLIME TEXT,» el cual es de pago pero tiene una versión de prueba que la puedes utilizar perfectamente.

    ✅ También puedes utilizar «NOTEPAD++,». que es gratuito, soporta muchos lenguajes, y es muy ligero. Si te estás iniciando descárgalo desde el botón de descarga de su página oficial.

EDITORES HTML

    ✅ Es importante tener claro todo lo desarrollado, puesto que en función de nuestros objetivos puede que, más que aprender HTML, resulte más interesante aprender el uso de una aplicación para la creación de páginas.

    ✅ En resumen, ¿qué necesitas para iniciarte?. La iniciación para cualquier principiante va a requerir entonces de dos elementos: vas a necesitar un navegador moderno, también vamos a necesitar algo donde escribir nuestro código, y para ello necesitas auxiliarte de un «EDITOR DE CÓDIGO,» que es lo recomendable, pero incluso puedes trabajar con un blog de notas cualquier programa donde tú puedas escribir lo que sea te será de utilidad.

La    estructura    inicial

    ✅ Así pues, una página es un archivo donde está contenido el código HTML en forma de texto. y ese código configura la estructura o ANATOMIA del sitio web. Estos archivos tienen extensión .html o .htm (es indiferente cuál utilizar). De modo que cuando programemos en HTML lo haremos con un editor de textos y guardaremos nuestros trabajos con extensión .html, por ejemplo mipágina.html

    ✅ Una estructura es lo que llamamos un «contenido.» Veamos què configura una estructura, y para ello partamos de la imagen anexa (la imagen proviene del video de Falconmasters). Entonces supongamos lo que es nuestro texto, las imágenes, los formularios los botones, etc, y todo eso es una estructura. Y su visualización permite comprender lo que es una definición de HTML en función de lo que podemos hacer con ella, o sea, CREAR SITIOS, ¡clarísimo verdad!.

    ✅ Crear estas estructuras básicas es posible con HTML y lo que es asignación de colores, formas, tamaños, etc con otro lenguaje que se llama CSS.

HTML

    ✅ Primer paso: Una vez que tenemos definido el editor, creamos una carpeta, que puedo guardar en el escritorio o donde te sea mejor. La llamaremos MI PRIMER SITIO WEB y dentro vamos a ir guardando todos nuestros archivos.

    ✅ Normalmente cuando estamos navegando nos vamos a encontrar con términos como, HTML, XHTML, HTML5, así que unas breves notas de aclaratorias.

    ✅ XHTML digamos que es una derivada de HTML porque antes se escribia HTML de una forma muy fea la cual afectaba a la lectura del código. En general una serie de malas prácticas que se dejaron atrás. así que si escuchas XHTML y HTML hoy en nuestros días es prácticamente lo mismo, por eso no tienes que preocuparte.

    ✅ También se escucha HTML5 que es la versión Nro. 5 de lo que es HTML. No significa que sean cosas diferentes. Son exactamente lo mismo. HTML5 lo que hace es que implementa nuevas cosas pero no cambia las anteriores. No cambia nada de cómo se escribe.

    ✅ El siguiente paso, es abrir el Editor de Códigos. Aquí se inicia el trabajo con el dominio conceptual de lo que es una «etiqueta» y lo que es un «atributo». Quiere decir, que en la ruta de aprendizaje básico, ambos conceptos representan el siguiente sendero por el cual continuar. Sigamos entonces.

«Sintaxis del HTML. Etiquetas y atributos».

    ✅ Primero, adentrémonos en lo que es la «sintaxis.» El HTML es un lenguaje que basa su sintaxis en un elemento de base al que llamamos «Etiqueta.»

    ✅ Una etiqueta es un fragmento de código que representa algo en un sitio web. Puede representar un botón, puede representar un campo de texto, o puede representar un texto incluso.

    ✅ Entonces, el lenguaje HTML está conformado por un sistema de etiquetas en serie o tags, que incluyen instrucciones que los navegadores traducen como:

  • Imágenes
  • Texto
  • Hipervínculos
  • Listas de palabras
  • Tablas, etc.

        ✅ Así, para que un elemento de este tipo pueda ser leído, la etiqueta debe tener dos partes: una etiqueta de inicio () y una de cierre () entre guiones (< >) de tipo tal cual se aprecia en la imagen siguiente (la cual obviamente no existe, solo para mostrar como se configura una etiqueta):

        ✅ Es importante también explicar, en qué consisten todos esos símbolos de mayor y menor que están distribuidos por ahí. El lenguaje HTML se basa en la sintaxis SGML (Standard Generalized Markup Language).

        ✅ Por ejemplo, las etiquetas <u> y </u> definen un texto en negrita. Si en nuestro documento HTML escribimos una frase con el siguiente código:
    (Ejemplo de aplicación de código HTML)
    <u>Este texto va subrayado.</u>
    El resultado será:
    Este texto va subrayado.
    (El anterior es un ejemplo de aplicación de código HTML)
    ¡Inténtalo tú mismo! Inserta el código anterior en un visualizador HTML.

        ✅ Como seguro habrás notado, la etiqueta inicial sirve para definir el comportamiento del contenido (por ejemplo, si un texto irá en negritas, subrayado, o de color, o si tendrá un tamaño específico), y la de cierre le indica al navegador hasta dónde debe llegar ese comportamie
    nto. Para construir los “cierres” sólo necesitas agregar una diagonal (/) al inicio de la etiqueta.

        ✅ Recuerda: si olvidas poner la etiqueta de cierre, todo lo que escribas después de la etiqueta de inicio se desplegará con ese formato.

        ✅ Cabe destacar que no todas las etiquetas necesitan forzosamente un “cierre”. Por ejemplo, el código <br> para introducir saltos de línea es considerado un “elemento vacío” y puede ir por sí solo en cualquier parte del cuerpo del texto.

        ✅ Las etiquetas cada una tiene sus diferentes nombres.

    ETIQUETAS

        ✅ Cada etiqueta tiene lo que es un contenido, y este contenido puede ser un texto o cualquier otra cosa. Encontrarás las etiquetas de esta forma que se muestra a continuación:
    Hay ocasiones en que no es necesario cerrar la etiqueta.

        ✅ Pero también se pueden encontrar las etiquetas con «atributos.» Cada atributo tendrá un valor. Lo que es un atributo, digamos que es una variación y corresponde a un valor. Así por ejemplo si queremos que el contenido sea de color azul, llamariamos color al atributo y el valor es azul.

        ✅ Todas las etiquetas se encierran de la siguiente manera: si tienes una etiqueta con sus atributos y valor, vas a tener un inicio y un fin de etiqueta. Partiendo de un ejemplo concreto, pensemos en la etiqueta h1 (que significa header 1 o encabezado 1) y la cerramos obligatoriamente y dentro tendrìamos lo que es el título de nuestro documento. Se vería de la siguiente forma:

        ✅ Para cerrar una etiqueta con atributos se utiliza solo la etiqueta de cierre, esto es sin atributos (puedes ver en la imagen anexa que la etiqueta de cierre lo único que contiene es el slage).

        ✅ Algo básico que debemos indicar es que el texto que estamos creando es un documento HTML pues lo indicamos así:
               <HTML>...</HTML>

        ✅ Ya creado el documento, lo guardas en la carpeta MIPRIMERSITIOWEB que creaste según se explicó anteriormente, y a ese documento lo designarás con el nombre de index.html. Por cierto es importante que le pongas .html (html precedido por un punto) para que el navegador lo pueda reconocer. Le das guardar y en tu carpeta ya vas a tener el archivo que al abrirlo y dar doble click o (click derecho y abrir con el navegador) podrás ver el resultado:

        ✅ Lo anterior permite enunciar lo siguiente:

    Etiquetas

        ✅ Los atributos más usados suelen ser los de «class» e «id» porque estos suelen ser referencias para otros lenguajes, para efectuar otras tareas más complejas.

        ✅ Es importante que si quieres ver los cambios en tu documento lo actualices con F5 o con el signo de flecha invertida ubicado en el extremo superior izquierdo.

        ✅ Al copiar esa etiqueta h1 y modificarla a h2, saldrá un nuevo título pero más pequeño, y esto ocurrirá sucesivamente hasta la etqueta h6 que es el titular más pequeño. Y el resultado lo aprecias en la siguiente imagen, que muestra la sintaxis de una etiqueta con su respectivo contenido:

        ✅ Se comprueba entonces que una etiqueta representa un elemento de nuestra página.

        ✅ En resumen: cuando hablamos de etiquetas y atributos, estás frente a frente a la sintaxis de HTML; y hasta acá es suficiente, en el sentido que el estudio de etiquetas y atributos obliga a un post aparte, con el debido desarrollo explicativo que le corresponde.

    «El documento HTML». Etiquetas html, head y body.

        ✅ Pero veamos ahora cómo es que se constituye un documento HTML, en lo que precisamente nos venimos ejercitando desde los párrafos anteriores; y, debemos citar que el documento HTML consta de varias partes:

        ✅ Consta de la cabecera conocida como head y de nuestro cuerpo o Body.

        ✅ Para escribir nuestra página web, siempre vas a escribir lo siguiente:

        ✅ Inicias con la etiqueta HTML, que indica precisamente que es un documento HTML, la bajas varios espacios y dentro vas a escribir la etiqueta head; es importante que estén cerradas estas etiquetas.

        ✅ Dentro de la etiqueta head va información que el usuario no puede ver a primera vista.

        ✅ Dentro de esta etiqueta va el título, encerrado entre la etiquetas title. Pudieras titularlo: Título de nuestra primera web. Lo guardamos. Actualizamos. Y te fijas que no se ve nada aún. Al actualizar esto es lo que aprecias:

        ✅ Si deseas que se vea, tienes que escribir la etiqueta body, que va a contener todo lo que es el cuerpo de nuestro documento HTML, por lo cual todo lo que escibamos aquí si se va a ver. En el editor se ve de la manera siguiente:

    Html

        ✅ Al actualizar, aquí si que se va a visualizar. Y es de la forma siguiente:

    Html

        ✅ Si quieres verificar que todo va correctamente, para que tenga una idea de cómo funciona esto, puedes irte al navegador y dar clicc derecho en « VER CÓDIGO FUENTE » y esto es lo que verás:

        ✅ Puedes corroborar que se abre el código, tal cual como nosotros lo estamos escribiendo.

        ✅ Así es como funcionan todas las páginas web. Sea Google, You Tube, Facebook, das clic derecho en VER CÓDIGO FUENTE, y tendrás ante tí el respectivo código HTML de la misma. Por supuesto en este código fuente encontraremos muchos otros códigos más, que te parecerán extraños por tu desconocimiento de HTML, pero poco a poco, irás sabiendo que son.

        ✅ Dentro de head tenemos más etiquetas. No solo la etiqueta title. Pero por ser algo más complejas,y sirven para otras cosas; se verán en otro post,

        ✅ Toda la información que va dentro de head, es información a la que nunca tiene acceso el usuario, pero es importante para otros fines, tales como:
    Importante para el navegador,
    Importante para los buscadores como Google, para que tu página pueda ser buscada.

        ✅ Prácticamente lo anterior deja explícito todo lo que se hace con HTML. Dentro de body tú puedes escribir todo tu contenido. Fuera no. Dentro de head escribes información solo para el navegador. Y es asñi como se utiliza.

        ✅ Por otra parte, si quieres escribir un poco de información SEO, o si quieres escribir alguna nota que posteriormente te va a servir a tí de guía, por ejemplo, algo como la leyenda siguiente en tu body: «El "h1" se utiliza para titulares » escribes lo que se llaman «comentarios.»

        ✅ Un comentario se escribe de la forma que describo de seguido: escribe una etiqueta normal, das signo de admiracion cierre (!) das dos guiones, otros dos guiones y en medio escribes el código, el cual no va a ser visible. Este código solo va a ser visible para tí, para que puedas darte una idea de cómo estás escribiendo tu código.

        ✅ Por último comentarte que hay otras etiquetas que no se cierran. Algunas etiquetas como son las diseñadas para agregar una imagen, o aquellas para dar un salto de línea. Supongamos que queremos agregar un espaciado entre dos elementos (digamos entre h3 y h4 del ejemplo que venimos trabajando) de nuestro contenido, vamos a nuestro titular y escribimos la siguiente etiqueta « br » que no se escribe de la manera tradicional de apertura y cierre, porque ella no está pensada para ser la celda de ningún contenido, entonces la dejamos simplemente con la forma de etiqueta de cierre, tal como lo muestra la imagen que captura la localizacion de la etiqueta br debajo de h3 para dar el efecto de salto de línea:

        ✅ Al refrescar en tu navegador el efecto de salto de línea se aprecia claramente:



        ✅ Hasta acá se considera agotado este primer capítulo de ideas básicas, y en siguientes post se irán sumando y desarrollando gradualmente más conceptos, que al tratarlos separadamente, permite otorgarles cierto nivel de extensión expositiva.

    Resumen

        ✅ Al revisar varios PDFs y videos, se detecta que la información clasificada como HTML PARA PRINCIPIANTES (o dummies) siempre cumple con un mismo patrón discursivo, que se orienta específicamente a los siguientes ítems:

    👉 Requerimientos básicos para un principiante de HTML. Navegador y Editor. Detalles generales sobre ambos.

    👉 Definición de HTML. Diferenciando XHTML, HTML y HTML5.

    👉 Creación de tu primera página web.

    👉 Explicación de etiquetas y atributos. Sintaxis.

    👉 Explicación de los componentes del documento HTML. Su orden interno. y lo que contienen (HTML, HEAD y BODY).

        ¯\_(ツ)_/¯ ) Los anteriores ítems responden a la pregunta: ¿qué objetivos de aprendizaje se deben cubrir en una clase preparatoria de HTML?.

        ✅ Podrás haber comprobado que esta lección es ¡MUY BÁSICA!. De hecho, es lo más básico de lo básico en HTML, pero investigado al detalle, para que desde lo más básico forjes una sòlida fundamentación que sirva de soporte consistente para contenidos más avanzados. De hecho, no considero esta aseveración como algo fuera de lo normal, porque es habitual siempre el inicio a cualquier área de conocimiento desde lo elemental, porque HTML es una alfabetización para poder escribir páginas web.

        ✅ Cuando en 2010 me inicié en la redacción de blogs, no conocía absolutamente nada de lo que he escrito aquí, ¡qué locura!, y exactamente 20 años después, de manera autodidacta, voy configurando una suite de conocimientos que considero necesarios para mi desarrollo, y tal vez, le sirvan a algún novato, e incluso, como material de consulta académica porque este blog es sin fines de lucro.

        ✅ Esquemáticamente el resumen queda de la manera siguiente:

    NAVEGADOR ---> EDITOR ---> CREAR CARPETA HTML ---> ETIQUETAS-ATRIBUTOS---> DOCUMENTO HTML

        ✅ En la medida que vaya actualizando el blog con más publicaciones, iré colocando enlaces internos hacia temas ítems acá tratados, y tal vez, desde otras lecciones hacia ésta, si el contenido tratado así lo sugiriera.

    ​ Posdata: Tomé como guía para ordenar las ideas, el video de Falconmasters (en bibliografía consultada) el cual fuí enriqueciendo con información adicional cuya fuente también la cito en la bibliografía.

    ⏫ Ir al inicio del post ⏫

    REFERENCIAS    DE    CONSULTAS

    PDFS y Páginas WEB, consultadas:

    Manual de HTML - Manual completo. Por: Desarrollo Web.com

    Curso de HTML 4 (Introducción) por. Efraìn Morales

    https://mx.godaddy.com/blog/10-codigos-html-para-paginas-web-y-para-que-sirven/

    Para complementar:

    https://www.danielclemente.com/html/consejos.html

    https://comocreartuweb.com/curso-de-html.html

    http://www.manualweb.net/html/introduccion-html/

    Cursos:

    https://pdfcursos.com/133-curso-de-html5-desde-cero.pdf

    Videos, consultados: