Building a website can seem difficult, but half the battle is just getting started! We wanted to put this guide together as an easy compilation of tutorials and places to learn exactly what you need to get started.
This is a really useful guide for beginners!
We hope this guide helps make everything feel more accessible to you, because it is! The internet belongs to all of us, so be sure to stake your claim in it.
In the same vein as that last link, Chris says what we’re all thinking:
Most of what we build is links from one page to another, and
formsubmissions that send data from the browser to the server.
This is going to be a fun weekend!
Not got a personal website? Bring your laptop or mobile device, and we’ll help you get setup so that you can publish somewhere you control and can make your own.
Seasoned web developer? Learn about the different open web services, software and technologies that can help empower yourself and others to own their content and online identity.
If there’s one takeaway from all this, it’s that the web is a flexible medium where any number of technologies can be combined in all sorts of interesting ways.
Personal sites—and, more broadly, our digital lives—are a mirror of who we are. Some of us will try to neatly organize everything under one hyper-curated digital roof while others will scatter things around on 12 different domains and 24 services. Some will design a site for themselves and not touch it again for a decade while others will feel the need to redesign every 6 months. Those are all right answers to a question that doesn’t have wrong answers.
Your website is a way for you to share your stream of consciousness, that temporary and subjective and highly biased snippet of the universe, with everyone else, including your future self.
Ben wrote a post a little while back about maybe organising his home page differently. It’s currently a stream.
That prompted Om to ask is “stream” as a design paradigm over? Mind you, he’s not talking about personal websites:
Across the web, one can see “streams” losing their preeminence. Social networks are increasingly algorithmically organized, so their stream isn’t really a free-flowing stream. It is more like a river that has been heavily dammed. It is organized around what the machine thinks we need to see based on what we have seen in the past.
Funnily enough, I’ve some recent examples of personal homepages become more like social networks, at least in terms of visual design. A lot of people I know are liking the recent redesigns from Adam and Jhey.
Here on my site, my home page is kind of a stream. I’ve got notes, links, and blog posts one after another in chronological order. The other sections of my site are ways of focusing in on the specific types of content links, short notes, blog posts in my journal.
Behind the scenes, entries those separate sections of my site are all stored in the same database table. In some ways, the separation into different sections of the site is more like tagging. So the home page is actually the simplest bit to implement: grab the latest 20 entries out of that database table.
I don’t make too much visual distinction between the different kinds of posts. My links and my notes look quite similar. And if I post a lot of commentary with a link, it looks a lot like a blog post.
Maybe I should make them more distinct, visually. Because I actually like the higgedly-piggedly nature of a stream of different kinds of stuff. I want the vibe to be less like a pristine Apple store, and more like a chaotic second-hand bookstore.
Going back to what Ben wrote about his site:
As of right now, the homepage is a mix of long-form posts, short thoughts, and links I consider interesting, presented as a stream. It’s a genuine representation of what I’m reading and thinking about, and each post’s permalink page looks fine to me, but it doesn’t quite hold together as a whole. If you look at my homepage with fresh eyes, my stream is a hodgepodge. There’s no through line.
For me, that’s a feature, not a bug. There’s no through line on my home page either. I like that.
Some lovely people have recently made some lovely websites.
Dan has launched his type foundry, Simple Type Co. and it’s gorgeous!
For as long as I’ve been making websites, Dan’s designs have been an inspiration: Corkd, Dribbble, his own website; whenever he unveils something it always sits just right with me.
Oh, and I love the tagline for Simple Type Co.:
Never perfect. Always a-okay.
Someone who is a perfectionist is Marcin. He’s been working on his book about keyboards for years now (the Kickstarter project will launch in February) and he’s made a stunning website for the book called Shift Happens. Click around and find out.
Mandy has a lovely new professional website, courtesy of Ethan. It’s called everything changes. I love the subtletly of the different colour schemes for dark and light modes. It’s almost as if Ethan knows a thing or two about responsive design.
Look! Jason has new professional website too. The text is just scrumptious. It’s almost as if Jason knows a thing or two about typography.
And look! Lynn has done it again—a new site design for a new year. Beautiful stuff, as always—have a look through the archive if you want to the creativity she puts into this every single year.
All of these people are my web design heroes.
Paul’s indie web project is live!
Meet the little Node.js server with all the parts needed to publish content to your personal website and share it on social networks.
You can read the accompanying blog post.
A directory of blogs, all nicely categorised:
ooh.directory is a place to find good blogs that interest you.
Phil gave me a sneak peek at this when he was putting it together and asked me what I thought of it. My response was basically “This is great!”
And of course you can suggest a site to add to the directory.
A lovely collection of blogs (and RSS feeds) that you can follow.
(Just in case, y’know, you might decide that following people on their own websites is better than following them on a website controlled by one immature manbaby who’s down with the racists.)
❤️
I believe we aren’t nostalgic for the technology, or the aesthetic, or even the open web ethos. What we’re nostalgic for is a time when outsiders were given a chance to do something fun, off to the side and left alone, because mainstream culture had no idea what the hell to do with this thing that was right in front of it.
It me:
Broadly, these are websites which are still web pages, not web applications; they’re pages of essentially static information, personal websites, blogs, and so on, but they are slightly dynamic. They might have a style selector at the top of each page, causing a cookie to be set, and the server to serve a different stylesheet on every subsequent page load.
This rings sadly true to me:
Suppose a company makes a webpage for looking up products by their model number. If this page were made in 2005, it would probably be a single PHP page. It doesn’t need a framework — it’s one SELECT query, that’s it. If this page were made in 2022, a conundrum will be faced: the company probably chose to use a statically generated website. The total number of products isn’t too large, so instead their developers stuff a gigantic JSON file of model numbers for every product made by the company on the website and add some client-side JavaScript to download and query it. This increases download sizes and makes things slower, but at least you didn’t have to spin up and maintain a new application server. This example is fictitious but I believe it to be representative.
Also, I never thought about “serverless” like this:
Recently we’ve seen the rise in popularity of AWS Lambda, a “functions as a service” provider. From my perspective this is literally a reinvention of CGI, except a) much more complicated for essentially the same functionality, b) with vendor lock-in, c) with a much more complex and bespoke deployment process which requires the use of special tools.
Thanks to the mistrust of big tech, the creation of better tools for developers, and the weird and wonderful creativity of ordinary people, we’re seeing an incredibly unlikely comeback: the web is thriving again.
Smart analysis from Anil, though I’m not sure I’d agree with his emphasis on tools and frameworks—it’s the technology built into browsers that has really come along in leaps and bounds, allowing people to do more with less code.
But then there’s this:
So if we have the tech, then why hasn’t it happened already? The biggest thing that may be missing is just awareness of the modern web’s potential. Unlike the Facebooks and Googles of the world, the open, creative web doesn’t have a billion-dollar budget for promoting itself. Years of control from the tech titans has resulted in the conventional wisdom that somehow the web isn’t “enough”, that you have to tie yourself to proprietary platforms if you want to build a big brand or a big business.
True! Anil also points to an act of rebellion and resistance:
Get your own site going, though, and you’ll have a sustainable way of being in control of your own destiny online.
I can’t remember the last time that a website made me smile like this.
Obviously, no one does this, I recognize this is a very niche endeavor, but the art and craft of maintaining a homepage, with some of your writing and a page that’s about you and whatever else over time, of course always includes addition and deletion, just like a garden — you’re snipping the dead blooms. I do this a lot. I’ll see something really old on my site, and I go, “you know what, I don’t like this anymore,” and I will delete it.
But that’s care. Both adding things and deleting things. Basically the sense of looking at something and saying, “is this good? Is this right? Can I make it better? What does this need right now?” Those are all expressions of care. And I think both the relentless abandonment of stuff that doesn’t have a billion users by tech companies, and the relentless accretion of garbage on the blockchain, I think they’re both kind of the antithesis, honestly, of care.
A personal site, or a blog, is more than just a collection of writing. It’s a kind of place - something that feels like home among the streams. Home is a very strong mental model.
This is like the Gashlycrumb Tinies but for websites:
It’s been interesting to see how websites die — from domain parking pages to timeouts to blank pages to outdated TLS cipher errors, there are a multitude of different ways.
What, then, is a personal website? It is precisely that, personal. It is a new kind of self-portraiture done not with pencils, charcoal, ink, or paint. Instead it is self-portraiture done in markup language, code, prose, images, audio, and video.
There’s a sort of joy in getting to manually create the site of your own where you have the freedom to add anything you want onto it, much like a homemade meal has that special touch to it.