Cómo crear un sitio web con HTML: kit de taller de DigitalOcean

Cómo crear un sitio web con materiales del kit de taller HTML

Este kit de taller está diseñado para ayudar a un instructor a guiar a una audiencia sin conocimientos previos de desarrollo web a través de los pasos necesarios para recrear y personalizar este sitio web HTML de principio a fin en aproximadamente noventa minutos. Los participantes finalizarán el taller con conocimientos de HTML y un sitio web personal listo para implementar en la nube.

Los asistentes al taller deben tener cierta familiaridad con HTML. Si no están familiarizados con HTML, pueden seguir los primeros diez tutoriales de nuestra serie Cómo crear un sitio web con HTML antes de comenzar este taller.

No se presupone que los participantes tengan experiencia previa en codificación. Los instructores sin experiencia en HTML deberían poder enseñar el curso después de revisar primero el material.

El objetivo de este kit de taller es proporcionar un conjunto completo de recursos para que un orador imparta un taller sobre cómo crear un sitio web con HTML. Incluye:

• Diapositivas y notas del orador que guían a los participantes en la configuración de su proyecto de sitio web, ejercicios prácticos y explicaciones conceptuales.
• Una serie de tutoriales en línea con fragmentos de código copiables, descripciones generales conceptuales y lecciones y consejos CSS adicionales para personalizar aún más el sitio web del proyecto.
• Un sitio web de demostración para mostrar a los participantes lo que construirán al final del taller.

Esta página del kit de taller tiene como objetivo ayudar a los instructores a prepararse para el taller y proporcionar un punto de partida para los estudiantes. Los instructores deben indicarles a los estudiantes que visiten esta página para que puedan acceder a las diapositivas (que contienen enlaces útiles), la serie de tutoriales complementarios y el sitio web de demostración.

Si lo desea, los estudiantes pueden prepararse para el taller leyendo la introducción a continuación y asegurándose de tener los requisitos previos listos antes de que comience el taller.

Los participantes que deseen aprender cómo pueden publicar su sitio de forma gratuita en DigitalOcean pueden visitar nuestro tutorial Cómo implementar un sitio web estático en la nube con la plataforma de aplicaciones DigitalOcean.

Introducción

Si está interesado en aprender a crear y diseñar sitios web, el lenguaje de marcado de hipertexto (HTML) es un excelente punto de partida. Esta serie de tutoriales basados ​​en proyectos le presentará HTML y sus métodos mediante la creación de un sitio web personal utilizando nuestro sitio de demostración (a continuación) como modelo. Una vez que aprenda los conceptos básicos, sabrá cómo cambiar el diseño del sitio web y agregar contenido personalizado. No es necesario tener experiencia previa en codificación para seguir los tutoriales de esta serie.

HTML es el lenguaje de marcado estándar que se utiliza para visualizar documentos en un navegador web. Desarrollado por primera vez por Tim Berners Lee en 1990 mientras trabajaba en la Organización Europea para la Investigación Nuclear (CERN), HTML fue una de las tecnologías innovadoras clave que se utilizaron para publicar el primer sitio web del mundo el 6 de agosto de 1991. Gracias a un proyecto de restauración del CERN, ahora puedes volver a visitar el sitio web original. Desde entonces, HTML se ha actualizado y ampliado significativamente, pero su propósito básico de formatear y estructurar páginas web sigue siendo el mismo.

Hoy en día, HTML es una de las muchas herramientas que se utilizan para crear la web. Saber cómo escribir HTML te proporcionará una base sólida para tu carrera como diseñador web y te preparará para aprender habilidades adicionales de desarrollo web front-end como CSS y JavaScript.

En este taller, aprenderá a crear y personalizar un sitio web utilizando técnicas y etiquetas HTML comunes. Después de finalizar el taller, tendrá un sitio listo para implementar en la nube.

Prerrequisitos

• Un editor de código como Visual Studio Code o Atom. Para esta serie de tutoriales, utilizaremos Visual Studio Code como nuestro editor de código predeterminado, pero puedes utilizar cualquier editor de código que desees. Es posible que sea necesario modificar ligeramente algunas instrucciones si utilizas un editor diferente.
• Un navegador web como Firefox o Chrome. Usaremos Firefox como nuestro navegador predeterminado, pero usted puede usar el navegador que desee. Es posible que sea necesario modificar levemente algunas instrucciones si usa un navegador web diferente.
• Dos fotos de perfil, imágenes o avatares diferentes para personalizar su sitio (opcional).

Una vez que tenga listos los requisitos previos, estará listo para comenzar el taller. Siga las diapositivas del orador y la serie de tutoriales en línea para obtener fragmentos de código que se pueden copiar, descripciones generales conceptuales y lecciones y consejos adicionales sobre HTML para personalizar aún más el sitio web de su proyecto.