Con el próposito de organizar páginas web para su correcto funcionamiento, identificaremos la estructura inicial de documentos HTML. Algunos creadores de páginas web utilizan editores gráficos para estructurar sus proyectos y, por desconocimiento de las etiquetas básicas, pasan largas horas para determinar algunos errores o el lugar exacto para agregar nuevos procedimientos. Por ello, dominaremos las etiquetas bases en la creación de proyectos web.

Es necesario seguir la estructura especificada en el estándar oficial de HTML, a fin de ejecutar correctamente las páginas web. La importancia de crear con precisión la base para el desarrollo de un proyecto web radica en seguir el estándar recomendado y conlleva a la ejecución correcta del mismo. En él describen la siguiente división básica:

• Doctype: para especificar el tipo de documento.
• Head: para crear la cabecera del documento.
• Body: para crear todo el cuerpo, es decir la mayoría de las instrucciones.

061-01_0303_ilu01. Estructura inicial de un documento

Para iniciar, seleccionamos el editor de texto descargado en el computador o el instalado por defecto en el sistema operativo. En este caso, utilizaremos Notepad++, principalmente especificamos la versión a redactar de HTML, para ello:

• Abrimos con el signo de menor.
• Agregamos el símbolo de exclamación.
• Definimos en inglés doctype, en español tipo de documento.
• Especificamos HTML.
• Cerramos con el signo de mayor.

061-01_0303_cap01. Creación del documento HTML

Leugo, guardamos el documento con el nombre y ubicación de preferencia, junto a la extensión HTML.

061-01_0303_ilu02. Almacenamiento del documento HTML

Es la forma universal para declarar un documento HTML en la versón número 5, ya que anteriormente se escribía la especificación del lenguaje mediante un enlace para acceder al estándar recomendado, utilizado en el momento, así como datos adicionales, los cuales hacían extensa dicha instrucción. Un ejemplo de ese antiguo proceso se muestra en la ilustración siguiente.

061-01_0303_ilu03. Antigua definición de documento HTML

Un documento en HTML, se divide en tres bloques o secciones:

• La definición del documento o lenguaje a utilizar, con la creación de la etiqueta tanto de inicio como de cierre. Ello facilita el manejo de otros lenguajes junto a HTML, al momento de crear una página web o aplicación.
• La cabecera del documento se crea con la etiqueta head, su denominación en inglés. En esta sección se incluye información apropiada del documento, la cual en su mayoría permanece oculta para el usuario, tal como estilos o enlaces a otros documentos.
• El cuerpo del documento, identificado con la etiqueta body, es el espacio para abarcar todo el contenido HTML, es decir, las imágenes, videos, información. Se refiere a lo observable por el usuario final en la página o aplicación en desarrollo.

Es indispensable el inicio y cierre de cada sección, de lo contrario es posible la generación de errores en la ejecución del proyecto. Lo recomendable al momento de crear una etiqueta, es agregar inmediatamente su cierre.

061-01_0303_cap02. Clasificación de documento HTML

Keynotes

• Es necesario seguir la estructura especificada en el estándar oficial de HTML, a fin de ejecutar correctamente las páginas web.
• La importancia de crear con precisión la base para el desarrollo de un proyecto web radica en seguir el estándar recomendado y conlleva a la ejecución correcta del mismo.
• Anteriormente se escribía la especificación del lenguaje mediante un enlace para acceder al estándar recomendado, utilizado en el momento, así como datos adicionales, los cuales hacían extensa dicha instrucción.
• La cabecera del documento se crea con la etiqueta head, su denominación en inglés. En esta sección se incluye información apropiada del documento, la cual permanece oculta para el usuario, tal como estilos o enlaces a otros documentos.
• El cuerpo del documento, identificado con la etiqueta body, es el espacio para abarcar todo el contenido HTML, es decir, las imágenes, videos, información. Se refiere a lo observable por el usuario final en la página o aplicación en desarrollo.
• Es indispensable el inicio y cierre de cada sección, de lo contrario es posible la generación de errores en la ejecución del proyecto. Lo recomendable al momento de crear una etiqueta, es agregar inmediatamente su cierre.

Reto

Organiza el código creado en el documento con nombre proyecto01 y define la estructura inicial aprendida en el video:

• tipo de documento
• cabecera
• cuerpo 

Es necesario verificar las recomendaciones oficiales de HTML a fin de cumplirlas con exactitud.

¡Comparte los resultados de tu reto en vPages, e invita a tus compañeros a que evalúen tu código y te sugieran un cambio, si es necesario!

Tiempo disponible: entre 15 y 30 minutos.

Gracias a la identificación de la estructura inicial de documentos HTML, optimizamos el tiempo al momento de determinar errores o el lugar exacto del código para agregar nuevos procedimientos. También, organizamos páginas web con pulcritud para su correcto funcionamiento. Con esmero y organización obtendremos eficientes códigos para proyectos web