Do you ever miss the feel of a good old webpage? No ads, no pop-ups for 10% off your next purchase, just Comic-Sans and quirkiness?! I for one get a nostalgia-kick every once in a while and decided to take it upon myself to make a website that celebrates all that bizarre 90’s awesomeness and I’m going to show you how to do the same.
There are plenty of reasons for creating a bad website. For starters, if you are just learning the principles of web-design, it can be a perfect example of what your modern day site SHOULDN’T look like! It can also serve as a portfolio piece or you could even implement a “90’s mode” toggle on your modern site that overrides all the CSS to show gloriously basic styles upon clicking it.
I just really love the aesthetic of it all. The site I made for this example can be found here. I created the site in React, however, it is clearly something that can just be made with Vanilla-JS, HTML and CSS. Note that basic Front End Web-Development experience is required but let’s get into it!
Gifs. Lot’s of them. I got mine from this amazing website called gifcities.org
If you really want the ultimate 90’s experience, no need for semantic HTML or responsiveness at all. But since nowadays “Mobile accounts for approximately half of web traffic worldwide.” according to Statista.com, it would be smart to at least use some media queries to ensure the site is viewable on a mobile phone.
You’ll also want to make sure you set a background image for each page. This will add that crowded and obnoxious look across the site. Make sure to go with a very basic color scheme that includes lots of dark reds, dark blues, or light yellows so the visibility is also a nightmare. Like I mentioned before, fonts like Comic-Sans, Helvetica, and Times New Roman will also ensure your site has that 90’s feel.
Something fun I included while playing the tic-tac-toe game is an embedded Youtube video that plays an album of 8-bit songs to accompany your gameplay. I chose an 8-bit Slipknot album to add to the intensity, however, you can add whatever kind of music you like! Just be sure to include this code in the embedded Youtube video to ensure it stays small and doesn’t interrupt the gameplay:
<iframe src="your youtube video here" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"></iframe>
Other than that, just be creative! No one will judge you if you’re purposely trying to make a site fun and carefree. As for hosting, I chose Netlify as a free and simple hosting solution, but it is entirely up to you where you choose to host your site.
The key takeaway is to be as simple and basic as possible when it comes to structuring your code in HTML, the bizarreness is all in the CSS. Get some inspiration from outdated websites that haven’t been updated in ages and just go to town!