How to build a website in 2021

It's really easy.

Child grabbing their cheeks with a look of disappointment

Step 1: Buy a domain. You might have a problem if you already have 20 domains waiting to be used, but that's okay. Feel free to buy more domains. You never know when you might need that perfect domain name. P.S. Vercel has a great domain search tool with hacks. Now I've just enabled your habit. You're welcome.

Step 2a: Engage in Twitter debates about how JavaScript is ruining the web and which static site generators are best. Do this for 4 months.

Step 3: Take an entire course to get better at design. Spend 5 hours generating an HSLa exploration CodePen to visualize something that already exists. Bemoan color systems and values. Read a shout-out tweet about best conference talks that happen to be about React and color. Find a tool that does it way better than you.

Step 2b: Eventually some rando will tell you about Eleventy, and you're like "sounds brilliant". Repeat step 2a.

Step 4: Clone that starter repo and fire it up. Waste 17 hours trying to figure out how to implement some esoteric design feature no one will notice. "Fuck, it's midnight on a Friday, why am I still doing this?" On Monday, "add a circle".

Step 5: Let's do dark mode.

Step 6: (Six hours later) Let's not do dark mode.

Step 7: Look at other people's sites in envy.

Step 8: Write the actual content.

Step 9: Join the Learn with Jason livestream on variable fonts. "Oh that's cool, must add."

Step 10: Edit the color scheme 20 more times. Play with the design and variable fonts. Open Firefox because the font dev tools are πŸ”₯. Go blind because Firefox oversaturated the colors. Recover from blindness, and edit the colors again.

Step 11: Sees how CSS Tricks implemented dark mode and admire how well they did it. Silently close the tab.

Step 12: Launch! Ugh, non-responsive iframes and bad break points. Run Axe. Feel like a terrible person. Fix issues (and edit colors again).

Step 13: 5 months later, write a blog post.

Note to self: next time, just hire a designer.

Blog gallery photo by Henrikke Due on Unsplash

You might also like

Build that blog already

What's holding you back from starting your blog? Sort through the real issues from the noise and start today.

Webmentions

If you liked this article and think others should read it, please share it.

❀️ 28 πŸ” 7 πŸ’¬ 13
Vx. Super Di πŸ¦„ Vx. Super Di πŸ¦„

SO COOL! source

Sia Karamalegos Sia Karamalegos

Thanks! source

not the cybertruck not the cybertruck

l i v i n g for these scarequotes source

Chris | Dev Advocate Chris | Dev Advocate

I REALLY need to get a fire under my ass and re-do my site. I want to use 11ty and make it super cool like yours. source

Sia Karamalegos Sia Karamalegos

Then you might not want to follow the advice in my post πŸ˜… Seriously though, for me it's about getting that first draft posted as soon as possible. I'm not super motivated to work on something until it's actually out there in public. source

Aleksandr Hovhannisyan Aleksandr Hovhannisyan

"(Six hours later) Let's not do dark mode." Lol! I've had this internal debate myself. Part of me likes it, but the other part hates having to support it. source

Austin Gil Austin Gil

FYI, first link to zeit.co is broken source

Sia Karamalegos Sia Karamalegos

Thanks! I guess they didn't redirect the old domain lol source

Austin Gil Austin Gil

Oh, I also want to mention that I liked your post, and your website ^_^ Thanks for sharing source

Sia Karamalegos Sia Karamalegos

Fixed the links, thanks again! source

Austin Gil Austin Gil

Yeah, but it was funny. And your other ones are helpful. source

Stephen Masters Stephen Masters

Personally …. When it comes to IDEs dark mode is needed sometimes to avoid eye strain if you’re going to be staring at it for hours. But it’s horrible if you want to create a visually appealing website. And not great for reading prose. source

Aleksandr Hovhannisyan Aleksandr Hovhannisyan

I'm so used to VS Code's dark mode theme that I can't even code in a light theme anymore πŸ˜„ source

These are webmentions via the IndieWeb and webmention.io. Mention this post from your site:

← Home