New Site Who Dis?
Not long ago, I announced on Twitter that I would be building a new personal site. Well, it’s here. For real, this is it.
How It Started
It started with a desire to rebuild this site. Based on that basic desire, it left me with a few options:
- Customize an existing design, then build something based on that.
- Hire a designer to design something for me.
- Utilize my horrendous eye for design and build something myself.
Considering that I’m absolutely garbage at designing anything, the first two options solve a major piece, but come with a downside - as the site evolves, I’m going to have to create additional components that fit within that overall aesthetic. For a designer, it’s no big deal to come up with soolutions using an existing design, but for me, it means making more decisions that I already suck at making.
So I got to thinking… what if I could come up with something that embraced chaos? Could I encourage bad design practices with total disregard for consistency, therefore minimizing any design choices whatsoever?
Conceptualizing the New Site
Now that I had an idea of how I would approach this new site, I had more to think about:
- I still plan on putting useful information on here. How do I make a chaotic site that’s still readable?
- Accessibility matters. I want the new site to be painfully ugly, while still providing sanity for those who may need it.
- Can I minimize the negative SEO impacts of a site that intentionally goes against the status quo?
- I still don’t want it to be “just bad”. I want it to be so bad that it’s good. How do I build this site in a way that makes my intentions immediately apparent, encourage exploration, and show off some cool ideas?
Calming the Chaos
Dark and light modes are awesome - they satisfy aesthetic preferences while also addressing accessibility benefits in whatever way best suits the user.
That got me thinking - what if I added a third mode that puts all of the chaos aside? Thus, Sanity Mode was born.
By introducing a third mode, I can still take users on a wild ride through this beautiful disaster of a website, while still offering an accessible mode that can either be switched to or automatically detected based on browser needs. Everybody wins.
(Accessibility expert friends, reach out and let me know how it works - I’m far from an expert on this.)
Plain, Machine-Readable Markup
I’ve been writing content for what seems like ages. One thing that drives me crazy is when the main body content becomes bloated and convoluted. It’s not a good experience for anyone; it’s hard to maintain, complicated to parse, and worst of all, it provides a substandard user experience for those who just need to consume it. I’m looking at you, news sites.
To keep it clean, I’ve taken the Geocities approach. Static, simple markup that anyone could produce. Not only does it help to eliminate complexity, it also makes it easier to consume for both humans and bots. The styles might be ugly AF, but the markup doesn’t have to be.
Thanks to static site generators, partial hydration, and server side rendering, I don’t have to deal with a bunch of client side scripts either. The only things rendered client-side are the interactive elements, and only when necessary. Light, fast, clean, easy to maintain, and easy to consume.
Putting the Dumpster Fire on a Pedestal
As I said earlier, the primary design descision was to disregard design decisions; a point that I want to make immediately apparent to tech and non-tech folk alike. How? Wrap the whole damn thing in a Windows 2000 lookalike window, of course!
After I got to work building the wrapper, I thought to myself “what do I do with these window actions?”. Then it occurred to me - that’s my navigation. It fits the aesthetic, I can just reproduce what’s been done in the past, and it eliminates the need to figure out where to put these other miscellaneous controls. Since it’s all a reusable component, it’ll probably come in handy when applying to other contexts too.
Overengineered solutions to stupid problems hold a special place in my heart. Since most of you reading this are developer friends, I decided to put a little bit of icing on the turd-flavored cupcake and publish the entirety of the site on GitHub. Easter eggs and all. Who knows, maybe there’s even something useful there for you.
What’s Next?
Who knows. At the very least, I plan on blogging here, sharing useful snippets, or implementing bizarre features that have no purpose other than to scratch an itch.
Poke around and let me know what you think. Most of all, have fun with this stupid site.
Comments
Upgraded a bunch of stuff and in the middle of a rebuild. Comments are disabled for now.