Building better product websites
I wrote this post for solo software entrepreneurs who want to make fast, secure, free, no-maintenance, and traffic-ready websites for their products. These work especially well for selling downloadable products, but they can be used for many types of online business.
Remember this guy? What does he have to do with anything? Well, let’s take a look at the technology that powered the website for his presidential campaign:
- Static HTML pages generated by Jekyll
- Served by Akamai CDN, origin hosted on Amazon S3
- Version control with GitHub
- Conversion optimization with Optimizely
- Redundant, REST payment processor
It stood up to 81 million pageviews over six months. Raised $250 million. 4 million separate payments. Do you get where I’m going with this? Unless you’re planning on running for president (I’d vote for you), the essentials behind this stack would also add up to a pretty good product website:
- Static HTML pages
- Obviously, hosting
- A CDN1
I. Generating Static HTML Pages
The biggest piece of the puzzle is the static website. These things are the tanks of the Internet. Let’s take a look at what happens if you’re not using a static website:
The above is an example of how a database-driven website, like WordPress, handles requests. A static site’s process is much more straightforward:
How can it be so simple? Well, it’s because static sites are prebuilt before being uploaded to the server. To do this, you’d use a static site generator like Jekyll.2 Write some HTML and dress it up with a little bit of “smart” Liquid syntax, and Jekyll will comb through it to pre-assemble each of the pages on your site.
Benefits of static sites
- They can handle tons of traffic without crashing
- They’re much more secure (you can’t hack HTML)
- They never require theme, plugin, or security updates
- Jekyll sites get free hosting from GitHub Pages (more below)
II. Completely Free Hosting
GitHub provides free hosting for Jekyll sites through GitHub Pages. As long as you’re using Jekyll to generate your static site, this is a no-brainer.
Pages also supports custom domains. I buy mine through Hover, which is the easiest-to-work-with domain registrar I’ve ever found. Their domains come with free privacy protection (so your contact info isn’t listed on the public WHOIS directory). If you have 10+ domains, they’ll also cut deals on renewal costs.
III. Handling Payments
Remember how static sites don’t have databases? If you want to accept payments directly on your website, you’ll need to embed a third party payment solution: PayPal, Gumroad, Stripe, Coinbase Commerce, etc. I like using Gumroad because they’re specifically made for selling digital downloads.
IV. Free CDN & HTTPS
V. Making pages performant
- Resize and compress your images.
- Use SVGs instead of images where possible.
- Need a grid system? Check out Silver. It’s tiny and easy to work with.
Stripe, Netflix, and Spotify all have homepages around 1MB. I’d argue that your landing page could be even less, although you don’t have to focus on that too much if you’re keeping everything else in mind.
You can also use Google Chrome’s Lighthouse to identify quick wins for accessibility, performance, and best practices. (Don’t worry about the “Progressive Web App” section if you’re making a landing page.)
Bonus: Incorporate Modern Design
Your homepage is likely the first place users will land if they come from a high-traffic source, so it’s worth spending some time on. I’m a big fan of the designs of these homepages. Feel free to use them for inspiration:
And there you have it. Take advantage of the performance benefits of static sites and free resources, and you can have a nice network of product websites that you can “set and forget”. If you make a website with this guide, get in touch with me. I’d love to see.
A CDN is a “content delivery network”. This is just a fancy way to say that files are served from servers closer to your users’ geographic location, increasing the loading speed. This post talks about how to get one for free. ↩︎
Jekyll is arguably the most popular static site generator, as well as the one that powers this site. This may be due to GitHub Pages providing free hosting to Jekyll sites (explained in Section II of this post). ↩︎