How I Broke, Fixed, and Rebuilt LiteralHat.com

Websites were always something that fascinated me due to their accessibility to almost anyone in the world. The moment I gained internet access I immediately wanted to feel part of it, not as a participant but as someone who made the internet.

Back then it wasn't so easy. Tutorials were difficult to come across, and as a vocabulary-challenged kid, the ones that did exist, were tailored to the terrifying adults who dominated the same forums I did.

So I committed the mistake that everyone else does, and found myself a nice website builder which required all my personal information to register. It lasted only 2 weeks before the free hosting expired, but when you're a kid, 2 weeks seems like forever.

After a few years, the whole thing with Wix and Weebly came out. So of course, I had to jump on the bandwagon. To no one's surprise, my Wix site was not any better. Making a list-of-everything-you-own is a fun concept on paper until you get to counting every single pencil in your art kit, or some other absurdly unquantifiable collection.

LiteralHat.com

After I begin my journey with LiteralHat related things I decided that we needed a home base. I clearly did not learn from my mistakes because I decided to use Wix again and made this website. It was tempting to pay for their hosting. And I think they know that I'm still tempted. Because they keep sending me emails. But I am a creature of dedication, and I do not cave so easily to the temptations of internet Satan.

There's a lot of site builders out there. One of the more simpler ones is carrd which I so desperately tried out as well. It's a good service, it's straightforward and convenient. But if you want anything beyond a landing page for your socials, I hope you're prepared to dish out some money.

I also tried Weebly. It's kind of like the Facebook of website builders - take that how you will.

So in the end, after years of overwhelming convenience and comfort that website builders offered me, I fully accepted my masochistic tendencies... and bought LiteralHat.com.

This website is still under construction!

Isn't it cute?

It actually looked nicer in person, but at the time of taking the screenshot, I didn't want to install Ruby just to compile. So this was the peak of my career, because it was hosted on GitHub and my workflow was basically: edit, commit, push, then edit, commit, push. You know, because what's the 'Git' in Github, anyway?

WordPress. Dot. Com. (Not Dot ORG. Dot COM.)

After 1289 commits, I decided to double down in my stupidity and move to WordPress.com.

I've got good memories with this site. I drew assets just so they'd look cool on the page. It had articles, artwork galleries, a responsive navbar, bebas neues. What more could one possibly want?

Well, if you don't know anything about WordPress, it's kind of like if Wix had a baby with cpanel, and 8912467 gigs worth of unnecessary bloat. And instead of the company spamming you about subscriptions, every single plugin you installed had its own personal junk-mail campaign.

So I realized I was cutting corners. If I wanted something to work exactly the way I wanted… well, that meant actually touching code. Horrifying!

Hat actually Codes

This was the first site that I made by hand. If you're artsy (or a parent) you would know that often, the things you are most proud of tend to be the things that you've made completely by yourself. Because she was my baby. I love this site from the bottom of my heart, and if I had an office, she would be framed on the wall.

But you know, you must kill your darlings to carry on. The site just didn't serve my needs. I needed a bit more. I needed... back end.

Learning server-side code effectively doubled my pain tolerance.

Be Gay, Do Crime, Do Debugging, Do Crime, and...

The iconic punk site of 2024. If you were around when this was made, you would've known how much I loved this even more than the last one. I drew css layouts with pen and highlighter, went on a deep dive into color theory to come up with a stunning palette, and... and it had templating. The best part? It was mine! I could do whatever I wanted with it!

Everythnig good comes to an end. This time, it was because I learnt that SQL injection is a cybersecurity thing where typing code into an unsecured input field can let you modify or delete the entire database. Did I do anything to protect against it? Of course, I didn't.

2025 Minimalist Site

I was deep in a period of choice paralysis around what the website's 'identity'. Light mode or dark mode? Modern and slick, or gradients everywhere like it's 2008-addictinggames.com? Then I thought: why pick at all? That’s how we ended up with the minimalist version in early 2025.

Out of all the sites that I had made before this point, this one, with the most plain, unappealing design ever, ended up being the most functional. And somehow, this site still lives on as a branch of the minimalist version.

The Current Site.

Here I show you all my mockups, why I made them, and why they weren't used.

I lovingly called this design VintageSite. It used Verdana as its main font and the same blinding blue that you'd see on oldschool hyperlinks.

I've always loved the aesthetic of older-style desktop sites, but most internet traffic now comes from mobile devices. While I could have easily just gone down the 'fuck you, mobile users' route, I'd rather make my site accessible to everyone.

This was a mockup. Minimalist, but in black. The current site's mobile design takes on this design philosophy, with its thin white lines. I never used this as the desktop version just because it seemed a tad bit too plain, but in the future it might be something worth migrating to.

If you're a dev, and you know of awwwards.com, then, you know.

There's this fad out there to make sites 'brutalist', with fat lettering, and high contrast designs. As much as I love how it looks and sounds on paper, it is good for only that - being on paper. I had coded up this site in a few minutes and immediately realised how unintuitive and hostile the design was.

This is a design I committed on, then rolled back because it simply wasn't viable long term. It was similar in spirit to my YouTube banner. It had Marla! It even had an art gallery:

Images and labels would slide on and off screen with easing transitions to make for an interactive experience. And while I love Javascript / noSQL, I wanted something that would allow for a colossal database, even if my database would never reach such volumes.

I optimise all images, but anyone with a slow internet would suffer using the UI. Adapting absolute designs to different screen sizes are a headache. The code was unmanageable. And I think this is where I hit the ceiling of my pain tolerance, because I would've gone crazy if I had to touch Javascript only for longer than 2 years.

But it's okay. Nothing goes to waste. The parallax code was adapted into my portfolio site.

CharlieBoard was a web application that would redirect you to different sections of the site depending on the item clicked. It was very fancy and very fun, but sites aren't made to be games.

The cool gimmick of this site was that Hat would point his finger at whichever menu option you were hovering over. He'd follow your cursor, and on click the entire screen will have a super cool flash frame and teleport you to the next page. It wasn't used because it relies on the user's ability to hover, which isn't possible on mobile devices.

This design put archiving on the forefront with sorting functionalities, pagination, and all sorts of nested pages. It felt a little too impersonal.

Among all of these concepts, only one of them made it to the end.

Two Tone... Ska Punk!

I love punk rock, and I especially love Ska. Initially I had preoccupations about committing to this design as Ska music is not something I make. But I decided that in the end, if I couldn't contribute musically, I could at least contribute aesthetically.

And so, if you're reading this right now, I hope that the Ska site is still kicking. And if not, that's okay too. Nothing lasts forever, except my inability to stop redesigning my own website.

And I really hope you all like it as much as I do.

Conclusion

It only took a whole 5 years to learn how to make websites! Wow!

There is a full development blog on my Patreon about how I made this website, all the way from start to finish. Whenever I make a new update, I make a Patreon post too. And if you're incredibly lucky I might get you to help test. Check it out here.

Thank you for reading and have a nice day.