Hoy en día, si quieres ser alguien en Internet, debes tener sí o sí tu propia página web. Ya sea porque tengas un pequeño negocio, una idea, o simplemente quieras tener un perfil que los demás puedan visitar fácilmente, es vital contar con tu propio sitio web. Y esto es, precisamente, lo que te permite hacer HTML5 UP.
Hace años, crear una web era una tarea muy complicada que requería conocimientos de programación, y contratarla a una empresa era algo bastante caro. Hoy, esto ha cambiado, y gracias a plantillas como las de HTML5 UP, puedes tener tu propia web 100% gratuita, y personalizada, en cuestión de minutos. Y lo mejor de todo: sin escribir una sola línea de código.
Qué es HTML5 UP
HTML5 UP es una web que, principalmente, demuestra que tener una página web propia ya no es un lujo ni una tarea reservada a expertos. Esta web pone a nuestra disposición una serie de diseños web totalmente gratuitos, de alta calidad, para que podamos bajarlos y modificarlos con nuestro contenido sin necesidad de programar. De esta forma, partiendo de una plantilla predefinida, podemos tener en minutos nuestra web funcionando en Internet.
Las principales características que nos ofrecen las plantillas de HTML5 UP son:
- Desarrolladas en HTML 5 y CSS3, lo que garantiza compatibilidad con los estándares actuales y una experiencia visual atractiva.
- Son 100% responsivas, por lo que se verán perfectamente en un ordenador, un móvil, una tablet, etc.
- Cuentan con un diseño moderno, con estética limpia, profesional y minimalista.
- El código fuente de las webs es limpio y está muy bien estructurado, lo que facilita en gran medida su modificación o nos puede servir para aprender a programar.
- Tienen licencia Creative Commons, lo que nos permite usarlas libremente, incluso en proyectos comerciales.
- Tenemos una gran variedad de estilos diferentes, desde portfolios hasta webs de fotos, páginas personales, landing pages y sitios web corporativos.
Cómo montar una web con estas plantillas
Lo primero que tenemos que hacer si vamos a usar una plantilla de HTML5 UP para nuestra web personal es entrar en su página web principal, en este enlace, y navegar por todas las plantillas que nos ofrece. Cada una de ellas tiene una «demo», para que podamos probarla online antes de descargarla. Aunque podemos descargar y adaptar la que queramos, algunas de las más usadas, según la finalidad que tengamos, son:
- Massively, ideal para blogs visuales.
- Dimension, perfecta para portafolios personales.
- Editorial, enfocada en contenido escrito.
- Prologue, muy usada para presentaciones personales o CVs online.
Una vez que hemos elegido la plantilla que queremos usar, la descargamos. Y, cuando la tengamos descargada, el siguiente paso será descomprimirla. Dentro de cada proyecto encontraremos, principalmente, dos elementos: la carpeta «assets», donde debemos copiar las imágenes, los estilos, scripts, y el resto de contenido que vayamos a usar, y el archivo «index.html», que será la web en sí.
Ahora llega la parte «complicada», editar la web. Lo más rápido y sencillo es abrir el archivo index.html con un editor de texto, como Visual Studio Code, o cualquier otro editor HTML, y desde él cambiar los textos que vienen en la plantilla por los nuestros propios. También debemos cambiar los enlaces a las redes sociales, las imágenes (por las que hayamos copiado previamente a la carpeta assets), etc. También podemos personalizar el diseño y el estilo editando el archivo CSS, lo que nos permitirá ajustar colores, tipografías o tamaños.
Una vez hecho todo esto, ya solo nos queda probar la web en el navegador. Abrimos el archivo «index.html» en Chrome, Edge, o nuestro navegador web de confianza y veremos cómo queda la web final. Si algo no nos convence, solo tenemos que volver al editor, retocar, guardar, y pulsando F5 los cambios quedarán reflejados al momento.
