¿Cómo crear una página web con Notion?

Crea una web en Notion con Super.so

Transformar una página en Notion a una web funcional y visual nunca ha sido tan fácil gracias a Super.so.

En este artículo, te guiaremos paso a paso en el proceso y exploraremos alternativas más avanzadas para crear sitios web completamente personalizados y profesionales sin necesidad de ser un perfil técnico o saber programar.

¿Qué es super.so y para qué sirve?

Super.so es una herramienta que permite convertir páginas creadas en Notion en sitios web completos con solo unos pocos clics.

Diseñado para quienes buscan simplicidad y eficiencia, Super.so es perfecto para aquellos que desean una solución rápida sin necesidad de conocimientos técnicos en desarrollo web.

¿Por qué utilizar super.so para crear una web?

Utilizar Super.so tiene múltiples beneficios:

• Facilidad de uso: No necesitas tener conocimientos técnicos avanzados para utilizar Super.so. Con una interfaz intuitiva, cualquiera puede crear y publicar una web en minutos.
• Integración perfecta con Notion: Si ya usas Notion para organizar tu contenido, Super.so te permite aprovechar esa estructura para crear una web sin hacer mayores esfuerzos.
• Rápida implementación: Desde la creación hasta la publicación, el proceso es extremadamente rápido y eficiente.
• Flexibilidad: Aunque Super.so simplifica el proceso, aún te permite personalizar ciertos aspectos de tu sitio web.

Sobre todo desde Nocodehackers recomendamos utilizar super.so si sueles utilizar Notion de normal, ya estás familiarizado con la herramienta y quieres crear una web sencilla y funcional rápidamente desde una página creada en tu propio espacio de Notion.

Veamos ahora cómo utilizar super en detalle:

¿Cómo utilizar Super.so para crear una página web con Notion?

A continuación explicamos el paso a paso que deberás seguir para poder pasar de una página en Notion a una página web sencilla y funcional creada en Super.

Paso 1: Crea una página en Notion

Lo primero que necesitas es crear una página en Notion.

Diseña tu página con el contenido que deseas mostrar en tu sitio web, utilizando las herramientas y bloques que Notion ofrece para estructurar y organizar la información.

Recomendamos que no solo añadas texto, sino que le des estilo (negrita, colores y subrayado) y además añadas imágenes, citas, destacados e incluso puedes probar a añadir una base de datos (con por ejemplo la vista de galería) para que sea todo mucho más visual a la hora de visitar la web.

Pero… si no quieres empezar desde 0 y quieres utilizar una plantilla ya creada, el propio Notion tiene directorio con muchas plantillas de Notion que puedes utilizar para crear páginas web personalizadas a tu gusto.

Paso 2: Publicar página de Notion

Una vez que tu página de Notion esté lista, necesitas publicarla.

Para hacerlo, haz clic en “Compartir” en la esquina superior derecha de la página y activa la opción “Publicar” en la web.

Copia el enlace público que Notion genera para tu página.

Paso 3: Crea una cuenta en super.so

Accede al sitio web de Super desde aquí y crea una cuenta. Este paso es necesario para poder conectar tu página de Notion con Super.so y empezar a configurar tu sitio web.

Puedes hacerlo rápidamente conectándolo directamente a tu cuenta de google o añadiendo tu correo y contraseña.

Paso 4: Conecta la página de Notion a super.so

Una vez creada tu cuenta en Super podrás elegir si empezar con una página que ya tengas en tu propio Notion creada o utilizar una plantilla ya creada por el propio Notion (lo que ya te he adelantado en el paso 1).

1. Si eliges empezar con tu propia página de Notion, deberás darle un nombre a tu web (tranquilo, puedes modificarlo luego) y, a continuación, pegar el enlace a tu página de Notion que podrás encontrar en la esquina superior derecha en “compartir” y en “publicar”, la URL que es te habrá creado al realizar el paso 2 es la que debes pegar ahí.
2. Si eliges empezar con una plantilla de Notion, deberás elegir cuál utilizar y desde ahí seguir.

Desde ese momento ya tendrás tu página en Notion publicada en la web junto a Super.so.

Pero claro, querremos darle una capa de personalización… vamos a ello:

Paso 5: Personaliza tu sitio web

Vamos a ver las diferentes opciones que Super nos da para personalizar nuestra página de Notion explicando cada una de las secciones que podemos utilizar de Super.

• Site: podrás ver si tu página web está publicada y habilitar que se publique manualmente (solo para usuarios pro)
• Settings: encontrarás los ajustes de la página desde donde podrás cambiar el nombre de la web, la url de la página de Notion que estás compartiendo y el Favicon (el icono que se ve cuando alguien abre tu web) y el lenguaje del sitio web.
• Domains: podrás modificar el dominio que por defecto Super ha creado para tu web o conectar / comprar un dominio personalizado (solo para usuarios pro).
• Page: podrás añadir páginas a la principal que ya le has compartido.
• SEO: podrás modificar opciones relacionadas con el SEO para que la página web posiciona mejor en los buscadores (solo para usuarios pro).
• Design: podrás modificar colores, tipografía, layout, bloques, base de datos y la navegación. Básicamente todo lo que necesitas para darle estilo a tu página web y que no se vea como la página por defecto que has compartido de Notion.
• Navigation: podrás elegir si añadir o no una Navbar, footer o sidebar y añadir a las mismas CTA que redirijan a cierta sección de tu web o a enlaces o páginas externas.
• Code: para una mayor personalización, podrás añadir fragmentos de código que permitirán crear funcionalidades que no te permita añadir el propio super por defecto (solo para usuarios pro).
• Options: podrás modificar diferentes opciones relacionadas con las bases de datos, el tema, el buscador…
• File: podrás subir archivos (solo para usuarios pro).
• Analytics: podrás ver de manera nativa la analítica del sitio, viendo datos de visitantes, clicks, etc. (solo para usuarios pro).

Desde Nocodehackers recomendamos que sobre todo utilices la sección de Settings, Design y Navigation para darle el estilo que quieres a tu web.

Desde el momento en el que vincules Notion con Super, todo cambio que hagas en la página de Notion vinculada o desde el propio Super, se verán modificados en tiempo real (puede tardar unos segs) y se publicarán en tu página web.

Alternativas a super.so para crear webs profesionales

Como habrás visto, super es muy sencilla de utilizar y te permite pasar de una página en Notion a una página web funcional publicada.

Pero la realidad es que las opciones de personalización no son demasiadas y la gran mayoría de funcionalidades un poco más avanzadas requieren de ser usuario pro, que depende las funcionalidades que quieras tener, te costará un precio u otro:

Es por ello que, aunque super se una buena opción para crear una web sencilla, desde Nocodehackers recomendamos otros constructores web que te permitirán crear webs a medida y profesionales sin necesidad de ser un perfil técnico o saber programar:

Crea webs con Framer

Framer es ahora mismo la herramienta que más nos gusta desde Nocodehackers debido a la facilidad con la que puedes crear una página web en cuestión de horas, completamente personalizada y a tu gusto.

Podrás empezar a crear tus primeras webs utilizando plantillas o secciones pre-hechas o empezar completamente desde 0, haciéndola a tu gusto.

Si quieres aprender a crear webs con Framer, hemos creado un curso gratuito con 9 lecciones con las que aprenderás a crear tu primera página web.

Curso gratuito Framer.

Crea webs con Webflow

Webflow es el constructor web con el que hemos creado nuestra página web, y aunque sea más complejo de utilizar que Framer, una vez superas su curva de aprendizaje serás capaz de crear cualquier diseño que tengas en mente sin ningún tipo de limitación.

Está pensado para crear webs que sean un poco más grandes o necesiten tener un nivel extra de complejidad.

Para que puedas superar esa curva de aprendizaje inicial y puedas aprender Webflow desde 0, hemos creado una curso gratuito de Webflow con el que podrás crear tu primera página web.

Curso gratuito Webflow.