🎉 Looking to get started with Grid? Download my free ebook! Get into Grid Now »

Let's bring Fan Sites and webrings back!

In the days before the web was mainstream, it was a place of creation. First for education, then for every random idea that any creator had!

As the web transitioned from a network of educational institutions to the consumer force it is today, the early adopters were technologists… AKA geeks!

Promo image of various Fan Sites

A hallmark of geek culture is fandom – a deep knowledge of whatever topic interests them. This could be about a book, TV show, movie or band. With this passion comes a desire to share it with the world. Before the internet, there was no clear path. After the web started gaining traction, it was the biggest and easiest megaphone you could want.

It wasn’t always easy to be found, though. There was no search algorithm. Google was not ubiquitous with search. To be found, you needed to be listed on a site that aggregated other sites about your topic.

Promo Image for Free ebook - Common CSS Grid Patterns

Free ebook - Common CSS Grid Patterns

CSS Grid is a revolution in web layout. With this ebook, I cover 3 design patterns that Grid solves easier, better and more creatively to help push our designs in better directions.

Download Now!

Enter the Webring

A fairly common way for this to happen was the concept of a “Webring.” A webring was a circular collection of sites around a similar topic. Each would display a badge of membership. This badge would allow for a user to jump to the next or previous site or find a random site in the ring.

Some of these sites are still around. Others perished when Geocities, Tripod and other free(ish) hosts went more commercial.

Back then, if there was something you wanted to publish, you could do it with a little knowledge and a little (or no) money. Since you wrote the code, you could take it with you.

As the commercial viability of the web grew, we saw more and more users become consumers and not creators. Many consumers see websites as black boxes full of magic that they could never understand. Because of this, they would never think to try to create something.

This is a shame. We lost a little piece of the magic of the web when this culture came about.

Not everything has to (or should) be profitable

As we were exploring the new magic of the internet, we often didn’t wonder if our fun side projects would make money. Most of us knew they’d do absolutely nothing. Why make them, then? The act of creation itself is fun!

I wish I still had copies of what I made back then. They were truly horrific, but I had such a good time building them! So, reason number one to build a fan site? It’s fun!

Reason number 2 to build a fan site: sharing something you love with the world is worthwhile. Maybe you’re Orange is the New Black’s biggest fan? Build a site dedicated to it! Did you find all the Koroks in the latest Legend of Zelda? Write about it! By sharing what you love, you become a part of something bigger than yourself. You’re taking part in the conversation online. You’re a part of a new community.

Finally, reason number 3: You’ll learn something. Part of the reason I wrote this post is having watched Steve Gardner’s JAMstackConf talk “Make More Pointless Things.” In the talk, he shows off an a lot of “pointless” things he’s made. All of these things were building blocks for doing bigger and better things. If you’re exploring and not worried about the final “product,” you can afford to do things wrong or weird. You can build for a small use case. You can use new cool technology. All of which will make you better at other things you are doing.

That being said, I have a challenge for all the web professionals out there!

The Fan Site Challenge!

Let’s resurrect the idea of the Fan Site and webring! In the next 2 months, I want you to do one of three things (or all three!).

1. Create a Fan Site.

It doesn’t have to be big or fancy. It just needs to showcase your love of something. Maybe your favorite T.V. show or movie? Maybe your favorite book or comic? It doesn’t matter. Make it something you love and let that be enough.

2. Help someone create a Fan Site

As I mentioned above, the web has become a place of magic to many users. Let’s try to fix that.

Find a friend who is NOT a developer. Help them create a Fan Site.

This can (and probably SHOULD) be as simple as creating and HTML page with some minimal CSS. Let’s not get carried away. Let them experience the joy of writing a little bit in a text editor and seeing it magically become a webpage.

3. Create a webring

Whether you create a webring for a topic of Fan Sites or a webring for your friends’ sites, go collect a list of sites and link them together.

I’ve created a simple lambda function repository if you don’t have a starting point. I’ll write up a blog post on how it all works, but you can find the code here.

If you do one of these three things, I’d love for you to go add your site, your friends’ sites or your webring to that same webring repository I just mentioned. 

Together, we can make the web a place of fun and experimentation again.

You May Also Enjoy

Creating an 11ty Plugin - SVG Embed Tool

In the sites I’ve built with Eleventy (11ty) recently, I’ve found myself reusing a couple filters. This has involved me copying and pasting the code a lot. The solution? Create an 11ty Plugin.

Now offering design and code reviews at PeerReviews.dev

For the past few months, I’ve talked with a lot of different people about how best to serve up-and-coming designers and developers. I want to be a resource for people learning to code and learning about design. So, when my friend James Q. Quick released his first code review on YouTube, I knew I needed to follow along.

Routing contact-form emails to different addresses with Netlify, Zapier and SendGrid

When your client wants dynamic form processing, and your site is "static," what are you going to do? In this article, we'll explore two methods to do dynamic form routing based on a user's answer to a form field.

My Side Projects

Web Workers Logo Web Workers Logo Web Workers Logo Web Workers Logo