Guide to launching a website in 2024

What's in this post and who is it for?

At Dinghy we have lots of experience building websites. In fact, I've been building websites for as long as the internet existed!

When speaking to new customers when starting a new project, we always spend some time discussing different approaches to make their new website a reality.

In this post we'll be looking at the 4 main categories of how to make a website in 2024:

1. Monolith Systems like Wordpress, Typo3, Drupal, etc …
2. Visual Website Builders or No-Code Platforms like Squarespace, Wix.com, Framer or Webflow
3. Static Site Generators (SSG) like Jekyll, Hugo, Astro, and the like
4. The "headless" approach which separated content management (CMS) from the actual website

This post is intended for all audiences: Decision-makers with little or no technical background as well as professional website makers who are looking for inspiration.

Let's dive in!

I was born in 1984 and the first computer my Mom dragged into the house was an X386 that ran DOS around my 8th birthday. You know, that black-and-white command line interface that I primarily used to completely destroy the operating system, so that a friend of the family had to format the whole drive and start from scratch 😅. Marvelous times!

But little did I know back then what was to come …

When the internet arrived at our house some years later I could apply some of the knowledge I gained from dabbling with computers for a while. But this time around the new computer ran Windows 95 and came with a MODEM!

At first, I didn’t understand what was happening when this “modem” started blinking about and making all these funny noises. But after visiting a couple of websites, that kept changing every other time I visited them, a hunch started to develop that it should probably be possible to make a website as well.

So I started to write a couple of HTML tags into a text editor which mostly felt like poking at something with a stick. But Netscape (one of the browsers back then) could apparently understand the tags and showed me my very own website.

The only thing missing from here was to put it somewhere so other people could see it as well. I don’t remember the name of the hosting provider but I do remember that it was this MAGICAL place to which I could upload a single HTML file to have my very own presence on the World Wide Web.

To this day I find it absolutely mind-blowing that I could just learn how to make a new website by browsing around and looking at source code other people had written that was out in the open for people like me to see. The openness of the web and my early experience with the publishing process are what contributed to me becoming a “Web designer”, and is a big part of the reason Dinghy Studio exists today.

A look at the web today

The transparency and ease of use of the old web are long gone though. Making websites is still possible that way but the web is huge now and it takes a lot more than just HTML to be able to compete with big players.

Here’s an incomplete list of requirements, that modern web development and web design attempts to tackle. Follow me in a thought experiment and mentally check all items that you see relevant for your website:

My website should …

• Tastefully represent your brand to the public
• Work on every screen there is on the planet (and we all know there are maaaaaaaaaany different sizes by now)
• Be accessible to everyone, screenreader users, users experiencing low-bandwidth connections, etc …
• Load super fast even in a subway somewhere in Berlin (I think you get at least 3G at the time of writing … 😬)
• Should be easy to understand and navigate
• It is actually enjoyable to browse and interact with
• Protect the users’ security and privacy
• Be GDPR, LGPD, CCPA, etc… compliant
• Nonetheless, enables me, the owner, to understand where visitors are coming from, how they use my site, and which pages are most relevant so I can optimize my business
• Non-tech authors need to be able to update it easily and without tech support
• It has to support multiple languages
• Have a very good search option
• Rank high in search results
• Be extensible in the future
• Be built in a way that I don’t have to make it all over again in a couple of years
• Always be online and available
• possibly even be hosted in an eco-friendly manner

Chances are you checked all of them, or at least most of them. And that brings us to the complexity that is involved in building a website today.

The Big Bang of the Internet and its ever-expanding universe of website builder platforms

By the time Google came onto the scene in the late 90s the internet consisted of around 2.000.000 websites. Today, in 2024, however, there are an estimated number of 1 billion websites on the web.

All those websites are essentially made of HTML, CSS, and JavaScript of course but there are many different ways of how those essential building blocks are put together, using sophisticated server-side software.

Risking over-simplification, I am going to talk about four approaches to modern web development and some surprising results when looking at their technological finesse and the implications that they have on fulfilling the requirements above.

Monoliths like WordPress, Typo3, Drupal, Joomla

You might have heard one or more of the following names because together they ran and still run a pretty hefty chunk of all websites on the web. WordPress is at the absolute pole position here with a whopping 40% of all sites on the web.

These platforms have been around for a long time and by now have great plus points going for them:

Pros:

1. User-Friendly Interface: WordPress is known for its simplicity and user-friendly dashboard, which allows users to easily manage content without technical expertise.
2. Flexibility: With a wide array of themes and plugins, WordPress is highly customizable, making it suitable for virtually any type of website, from blogs and small business sites to e-commerce and portfolios.
3. Active Community: The WordPress community is very active, providing a vast number of tutorials, forums, and third-party resources for support.
4. SEO-Friendly: WordPress has excellent SEO capabilities, and with the right plugins, it can be optimized to rank well in search engines.
5. Cost-Effective: The WordPress software itself is free, and many themes and plugins are available for free or at a relatively low cost.

But there are downsides as well of course.

Cons:

1. Security Concerns: Due to its popularity, WordPress is a common target for hackers. Regular maintenance and security measures are required to keep a WordPress site secure.
2. Performance Issues: Without proper optimization, WordPress sites can become slow, especially when too many plugins are used or when using low-quality hosting services.
3. Frequent Updates: While updates are essential for security and new features, they can sometimes break functionality if themes and plugins are not compatible with the latest version.
4. Customization Complexity: While WordPress is customizable, deep customization may require coding knowledge or hiring a developer, particularly for complex features or unique designs.
5. Plugin Overload: Relying too much on plugins can lead to conflicts and performance issues. Quality control varies, and bad choices can compromise both speed and security.
6. Scalability: While WordPress can handle high traffic, large-scale sites may need significant optimization and custom hosting solutions to ensure performance and reliability.

Visual Website Builders like Squarespace, Framer, Wix, Webflow

Visual website builders are not a new idea and have been around since the very beginning. Does anyone remember Dreamweaver and Frontpage? Good times! But those tools ultimately couldn’t keep up with the ever-rising demands of modern websites and disappeared.

In recent years though, there’s been a new uprise of visual website builders and this time they pack quite a punch!

Each platform has its own set of features and capabilities, but they share some common advantages and disadvantages.

Pros:

1. Ease of Use: These platforms typically offer drag-and-drop interfaces, making them very user-friendly, especially for beginners.
2. No Coding Required: Users can design websites with little to no knowledge of HTML, CSS, or JavaScript.
3. All-in-One Solution: Hosting, domain registration, and technical maintenance are often included, simplifying the process of setting up and maintaining a website.
4. Design Templates: They provide a variety of pre-designed templates that are generally responsive and visually appealing.
5. Support and Resources: Access to customer support and extensive help libraries can assist users in troubleshooting or learning how to use the platform’s features.

Cons of Using Visual Website Builders:

1. Limited Customization: While they offer customization options, there are limits to how much you can alter the templates without knowing how to code.
2. Cost Over Time: While starting costs can be low, over time, subscription fees can add up, and certain features may require higher-tier plans.
3. Proprietary Platform: If you decide to move your website to another platform, it can be difficult or impossible to take your design with you. You may need to rebuild from scratch.
4. Generic Design: The reliance on templates can lead to websites that lack uniqueness, which might be a drawback for brands seeking a strong, individual identity.
5. Scalability Issues: While sufficient for small to medium-sized businesses, these platforms might not scale as well for very large or complex websites with specific needs.

Choosing between a visual website builder and other platforms like WordPress will depend on your specific needs, technical ability, and the type of website you intend to create. For simple, aesthetically pleasing sites that can be set up quickly without much technical know-how, visual website builders can be an excellent choice. For more complex, highly customized, or content-heavy sites, a more flexible platform might be necessary.

Reducing complexity with static site generators like Jekyll, Eleventy, Hugo, Astro, etc…

What might have begun as a sort of old web nostalgia turned into a huge global trend: Static Site Generators were invented as an easy-to-use alternative to complex, server-side systems like Typo3. The idea is to not have a server anymore at all and instead to have a system that will churn out a whole bunch of static HTML files to your computer, which can then be uploaded to a simple web server.

Pros:

1. Performance: Static sites generally load faster because they consist of pre-built static files without the need for database queries or server-side processing.
2. Security: With no database or dynamic content to exploit, static sites are less vulnerable to common web attacks.
3. Version Control: Entire sites can be managed using version control systems like Git, which enhances collaboration and track changes.
4. Hosting Flexibility: Static sites can be hosted on any server or even on services like GitHub Pages or Netlify, often for free.
5. Scalability: Handling traffic spikes is easier since static files can be served efficiently without the need for complex backend infrastructure.

Cons of Using Static Site Generators:

1. User-Friendliness: They are generally less user-friendly for non-developers compared to CMS platforms with GUI-based interfaces.
2. Dynamic Content: Serving dynamic content or having user interactions like comments or search functionality requires third-party services or custom solutions.
3. Content Management: Non-technical users may find it challenging to add or update content, as it often requires familiarity with markdown, version control systems, and deployment processes.
4. Limited Built-in Functionality: Unlike full-fledged CMSs, static site generators may lack built-in functionalities like user authentication, form handling, etc.
5. Database Access: Direct access to a database is not available, which can be a limiting factor for sites that rely on large, dynamic datasets.

Choosing a static site generator is a good option when security, performance, and version control are top priorities, and the site content does not change frequently. However, for sites that require extensive dynamic features or are managed by users with less technical expertise, a more traditional CMS might be more appropriate.

Flexibility and extensibility using the “headless” CMS approach

The headless CMS approach has been gaining traction among web developers and content creators for its flexibility and ability to deliver content across multiple platforms. Unlike traditional CMS platforms that tightly couple the back-end content management with the front-end presentation layer, a headless CMS provides only the back-end, leaving the front-end development completely open to developers' choice of frameworks.

Pros of Using a Headless CMS:

1. Flexibility in Front-end Development: Developers can use any technology stack or framework for the front end, allowing for the creation of bespoke, cutting-edge user experiences without the constraints of a predefined theme or template system.
2. Omnichannel Content Delivery: Content can be delivered across multiple platforms and devices (websites, mobile apps, IoT devices, etc.) from a single content repository, ensuring a consistent content experience everywhere.
3. Improved Performance: Without the overhead of traditional theme-based rendering, websites and applications can achieve faster load times and better overall performance.
4. Enhanced Security: The separation of the content management system from the presentation layer reduces the surface area for attacks, as there is no direct database access from the front end.
5. Scalability: The API-driven nature of headless CMS platforms allows for easy scaling of content delivery to meet high traffic demands without impacting the CMS's performance.
6. Future-proof: As new technologies and devices emerge, a headless CMS allows for easy adaptation of your content strategy to include these new channels without requiring a platform overhaul.

Cons of Using a Headless CMS:

1. Increased Development Time and Cost: Building the front end from scratch can require more development resources and time, potentially increasing project costs.
2. Maintenance of Custom Code: Unlike traditional CMSs where the platform itself is updated regularly, with a headless CMS, the custom-built front-end needs to be maintained and updated separately, which can add to long-term maintenance efforts.
3. Learning Curve: For teams accustomed to traditional CMS platforms, the shift to a headless approach can involve a learning curve, particularly in mastering new front-end technologies and understanding API integration.
4. Lack of Built-in Features: Features like form handling, user authentication, and commenting systems that are often built into traditional CMSs may need to be implemented separately, adding complexity to development.

Adopting a headless CMS approach can offer significant advantages in terms of flexibility, performance, and multi-platform content delivery. However, it's important to weigh these benefits against the potential complexities and additional development efforts required.

Conclusion

In this blog post, we saw that there are many, popular ways to make a website today – and that list is not even exhaustive.

The goal of this blog post is to give you a comprehensive overview of what's out there so you can make an informed decision, on which approach might be best for your website.

At Dinghy we built many websites using the "headless" approach which worked out great for our customers. However, I should add that most of our customers had a Wordpress or Squarespace website before they turned to us. Their setups did not scale well and we helped them set up a website that was extensible and flexible enough for anything they could imagine.

I'm planning on turning the blog post into a series to shed light on important areas of website development and maintenance. Stay tuned for more!