Website Builders
Since there are various needs when it comes to having and building a website I want to highlight that developing your own website might not always be the best option for your situation. There are various ways you can create a website.
The 3 main ways to build a website are:
- Website builders
- Content management systems (CMS)
- Custom coded
Website builders are more simple but lack in customizability. Custom coded is the most complex but gives you full freedom and thus more room for optimization. (The term website builder and CMS is used interchangeably in the following text.)
But even for each category there are a multitude of options that each have different use cases.
Want to build your own online shop? ➡️ Shopify
Visual website builder that feels like Figma for designers ➡️ Webflow or Framer or Builder.io
E-Mail newsletter based ➡️ Substack or Beehiiv or Buttondown
Very simple and very basic website ➡️ Google sites
Overview of different website builders
The following recommendations are sorted into groups for what you might be looking for.
Documentation pages & knowledge bases
These tools focus on providing a simple way to build content-heavy documentation sites. They use complex web frameworks that you can utilize to customize as needed, or you can keep it simple and follow the setup and then write your content in markdown files.
| Tool | Use case | Ease of Use | Customizability | Cost |
|---|---|---|---|---|
| Starlight | Create documentation sites using Markdown. Utilizing Astro. | ⭐⭐ | ⭐⭐⭐ | Free |
| Nextra | Create documentation sites using Markdown. Utilizing Next.js. | ⭐⭐ | ⭐⭐⭐ | Free |
| VitePress | Create documentation sites using Markdown. Utilizing Vue. | ⭐⭐ | ⭐⭐⭐ | Free |
Visual site builders that feel like Figma
These visual site builders focus on giving you a design-driven interface to create good-looking sites while retaining control over the design.
| Tool | Use case | Ease of Use | Customizability | Cost |
|---|---|---|---|---|
| Webflow | Create websites using Figma like interface | ⭐⭐ | ⭐⭐ | Monthly subscription |
| Framer | Creating documentation sites using Markdown | ⭐⭐ | ⭐⭐ | Monthly subscription |
| Builder.io | Creating documentation sites using Markdown | ⭐⭐ | ⭐⭐ | Monthly subscription |
| WebStudio | Creating documentation sites using Markdown | ⭐⭐ | ⭐⭐ | Monthly subscription or free |
Using existing note taking tools
Use the writing apps you are already familiar with to create your website.
| Tool | Use case | Ease of Use | Customizability | Cost |
|---|---|---|---|---|
| Obsidian Publish | Publish Obsidian notes using the official integration. | ⭐⭐⭐ | ⭐⭐ | Monthly subscription |
| Obsidian Quartz | Publish Obsidian notes using Quartz. | ⭐⭐ | ⭐⭐ | Free |
| Notion | Publish Notion notes as a website using Notion’s official integration. | ⭐⭐⭐ | ⭐⭐ | Monthly subscription |
Beginner-friendly builders
These tools are especially simple to use but come at the cost of customization. They are also typically more expensive.
| Tool | Use case | Ease of Use | Customizability | Cost |
|---|---|---|---|---|
| Squarespace | One of the easiest ways to create a website. | ⭐⭐⭐ | ⭐⭐ | High monthly subscription |
| Wix | One of the easiest ways to create a website. | ⭐⭐⭐ | ⭐⭐ | High monthly subscription |
| Google Sites | Very simple but also quite limited. | ⭐⭐⭐ | ⭐ | Free |
| Hostinger Website Builder | Hostinger is a host provider, but they also have their own website builder. | ⭐⭐ | ⭐⭐ | Monthly subscription |
| Wordpress | Very popular. Wordpress has multiple visual builders, like Gutenberg, Elementor or beaverbuilder. The theme and plugin ecosystem is large. | ⭐⭐ | ⭐⭐⭐ | Monthly subscription or self-hostable |
If you want a store page Shopify is a popular option. For eCommerce activity and selling things online there is also WooCommerce which is a Wordpress plugin.
This list could continue almost endlessly, but in summary, simple tools above with high ease-of-use will be better for you if you quickly need a website that you can maintain yourself without much expertise and upfront costs at the cost of customizability and things like ownership or search engine optimization (SEO).
Custom coding
If you want full control over your website you will have to go with coding it yourself.
Even when it comes to custom coding your own webpage there are many tools available. But at the core of every website lies HTML, CSS and JavaScript.
For knowledge bases, like this page (webdev.bryanhogan.com), I like Starlight. I own all my content and I have full control since it is just using Astro.
For creating static pages like my personal blog I used Astro as well. If I need some interactive behaviour I add Svelte to Astro, Astro allows you to use Svelte components.
For highly interactive apps I use SvelteKit.
Sources & References
- Helpful step-by-step tutorial on setting up a basic Wordpress site in Hostinger: https://youtu.be/IdxuNU2LkZo