¿Qué es Hugo y cómo funciona?

Si está planeando crear un sitio web simple basado en el contenido, probablemente no quiera dedicar demasiado tiempo a codificarlo. Este podría ser el caso si está creando un sitio comercial, un blog o una cartera personal.

Los generadores de sitios estáticos apuntan a este tipo de escenarios. Le permiten crear un sitio web que le permite concentrarse en su contenido y su diseño.

Hugo es un ejemplo de un generador de sitio estático. Tiene soporte para temas, autoría en Markdown y otros beneficios además.

¿Qué es Hugo?

Hugo es un generador de sitios estáticos que le permite crear un sitio web con poco o ningún código. Los generadores de sitios estáticos generalmente le permiten escribir su contenido en un lenguaje de marcado simple, como Markdown.

El generador de sitios estáticos luego convierte su contenido en archivos HTML estáticos. Aplica cualquier plantilla o estilo a sus páginas antes de entregarlas al usuario.

Con Hugo, puede elegir entre una biblioteca de temas y diseños de sitios que otras personas ya han creado. Una vez que haya descargado un tema, puede comenzar a escribir su contenido. Hugo acepta diferentes formatos para que escribas tu contenido.

¿Qué son los temas de Hugo?

Puedes visitar la lista de Temas de Hugo para encontrar uno para empezar. También puede seleccionar un tema basado en diferentes categorías y filtrar diseños hechos específicamente para blogs, portafolios y más.

Puede hacer clic en un tema para ver más información. Aquí, puede descargar el tema para comenzar a trabajar en él. También puede obtener una vista previa de cómo se vería el tema una vez que lo implemente.

La mayoría de los temas tendrán datos ficticios como marcadores de posición. Cuando modificas el tema, puedes cambiar estos detalles como quieras.

¿Cuál es la estructura de un sitio de Hugo?

El uso de un tema le permite agregar su contenido con pocos o ningún cambio en el código. Sin embargo, aún puede sumergirse en el código si desea realizar cambios en su estructura. Hugo usa plantillas Go para hacer uso de variables y marcadores de posición dentro de sus archivos HTML.

Crear un proyecto de Hugo en su computadora generará automáticamente los archivos predeterminados necesarios para el proyecto.

Los componentes principales del proyecto incluyen:

• arquetipos: Aquí es donde puede almacenar plantillas que pueden definir cualquier formato o datos adicionales para cada página. Cuando cree una nueva página, se basará en una plantilla.
• activos: Aquí es donde puede almacenar cualquier activo, como sus archivos de hojas de estilo CSS.
• contenido: Aquí es donde puede almacenar el contenido de su sitio web. Puede almacenar cada página en un archivo separado. Por ejemplo, si estuviera creando un blog, usaría un archivo Markdown para cada publicación.
• diseños: Aquí puede almacenar fragmentos breves y reutilizables de código HTML, denominados códigos abreviados. Puede usarlos dentro de sus archivos de contenido.
• público: contiene los archivos y carpetas que puede cargar y usar en un servidor web cuando aloja su sitio.
• temas: Cualquier tema que hayas descargado de Hugo aparecerá aquí.

¿Cuáles son los beneficios de usar Hugo?

Dado que Hugo es bastante liviano y genera páginas web estáticas, su sitio web final y su contenido pueden cargarse muy rápidamente. Esto significa que los usuarios tendrán poco tiempo de espera cuando naveguen por su sitio.

Todo el contenido es estático y no cambia una vez que el usuario está viendo la página. Por lo tanto, no tiene que preocuparse por las solicitudes constantes a un servidor. Tampoco necesita preocuparse por las bases de datos ni por la contabilidad de los datos dinámicos.

Y no necesita conocimientos de programación avanzados para poder trabajar con un sitio de Hugo. Sin embargo, dado que tiene acceso directo al código, puede personalizarlo completamente de la manera que desee si así lo desea.

Uso de generadores de sitios estáticos para crear sitios web

Hugo es un excelente generador de sitios estáticos que convierte su contenido en archivos HTML sin formato. Puede usar una amplia gama de temas y previsualizar fácilmente su sitio durante el proceso de diseño.

Hugo proporciona componentes reutilizables y una cómoda estructura de archivos estándar, entre otros beneficios. Pero Hugo es solo una opción. Debe continuar investigando otros generadores de sitios estáticos que pueda usar para crear un sitio web.

11 generadores de sitios estáticos de código abierto que puede usar para construir su sitio web

Leer siguiente

Sobre el Autor