Common Mistakes Found on the Indie Web
Last edited on June 22, 2025
Contents
- Introduction
- Lack of better performance
- Confusing words
- It's not your comment section
- Audio
- It's not a "Linktree" page
- Carrd
- Webrings
- Ads
- Links
- Lack of a site map
- Dead links
- "Made with a site builder"
- Frames
- Hotlinking
- Links that open new windows/tabs
- Conclusions
Introduction
The Indie Web or the independent web, it's this big community that are on their way to build their own websites and creating their content outside of the corporate web (Facebook, YouTube, Twitter (or Xhitter, more like shi-), Instagram, TikTok, etc.) with full control1, sometimes having a secondary place to post content on the corporate web but being this untouched territory your principal place to create and share to the world.
As a owner of websites for many years I always found it some of the best content and information you could find on the net, either are from articles or wikis or blog posts (like this), games or downloadable stuff, or art galleries or inventive, creative and fun pages and so much more. You might think that all of the problems from many of the corporate websites are nonexistent on the Indie Web and you might be right for the most part, but ultimately from any independent website, they're from real people, and real people do mistakes.
Although, that's one of the best parts of the Indie Web, not only they're full of personalities but also as you learn building your website, the better your website becomes, unlike any corporate website which each year are becoming worse.
After all that introduction, here are the most common mistakes I found on the Indie Web (he said it! he said it!) and my suggestions to improve your website.
Lack of better performance
This is something minor but I don't own a computer from NASA so this is still very common. Sometimes my browser starts to lag because of giant images loading 3 seconds each, many of the resources are loading simultaneously, or some weird usage of CSS coding with complex animations and such. A very subjective matter but my suggestions are:
- Use "thumbnails" (or compressed image preview) for any media that could kill the entire performance while visiting your website, and leave an anchor element "
<a>" that leads the full picture. - For collections, not attach all these on one big webpage, you should add categories and split them, optionally with a page index.
- Alternatively you could create a more basic/simple version of your website. Any browser from before the 2010s will thank you for that.
Confusing words
Another subjective matter but if it isn't a joke page, and it's hard to read through your page for some reason, my suggestions:
- If you're using a very detailed background while all the words are in front of that no matter what are the colors, it will be annoying to read through. I'm more of this "content first, then visuals" posture, and so you should consider to contrast all the most important stuff of your website. You could accomplish this by just adding another layer behind the content and leave everything else untouched. Example:
<body class="detailed-background">
<div class="transparent-white-background">important stuff</div>
</body>
- Avoid writing paragraphs with colors that might be hard to read with a bright background.
- Differentiate words with links. Links with a different but standardized color palette, the better (see more on the "Links" section).
- Make it more clear all text accompanied with images. Sometimes with many details around the page make all the most important stuff hard to notice. Animated objects all over the place while a paragraph standing there waiting to be read.
It's not your comment section
What I'm referring to is that your website it's not just a guest book where you get signatures and that's it. Chat boxes also applies.
- At least add something meaningful. Linking to any of your favorite webpages would be enough, like a web directory.
Audio
While adding audio in the background enhances the experience, there are users that are unaware of that feature because either their browsers disables autoplay2 or their speakers are at zero volume, so here's what I think what could solve that problem:
- An audio player is explicitly shown on the page, any user would notice that and they would start listening to it.
- If not, then leave it somewhere (still explicitly shown) and don't bother to add autoplay.
It's not a "Linktree" page
You could add all your social media on your website but not leave it just being that.
- You can do so much more than that on your website, don't rely purely on social media. For that reason Linktree was made: for users that aren't on their way to build their websites but posting content on social media.
Carrd
Avoid building yours there, I had a terrible experience with another website builder a decade ago which does pretty much the same as Carrd, but this is way more limited and for some reason heavier.
- As Carrd builds websites by just one page per user, it's not flexible enough to make everything unique.
- Each Carrd page is made almost entirely with CSS and JavaScript code, therefore for loading more and more different content in one single page is very fragile and heavier than any regular page.
- Like I said about Linktree, this was made for users that are relying 100% on social media and they don't intend to build websites.
- Prefer NeoCities or Nekoweb, please.
Webrings
This is another whole problem that I feel like I would expand more on another post, but for now here's what you need to know:
- For webring masters: please add a function to your webring that ignores/skips all dead links/webpages, that would improve a lot the experience. A member list is not enough when your anchor elements are altered to a single color (see more on the "Links" section).
- For webring members: if you update your website and remove the webrings you're in, put them back, I beg you.
Ads
Hot take but what is up by adding ads, aside from aesthetic purposes?
The time when GeoCities existed, as a free service you would expect adverts being there, and for any user from that era were just annoyed3 as you when you watch an annoying ad on YouTube, and things like Adblocks weren't that accessible to everyone like it is now4. For some reason, many webmasters are nostalgic of that. Probably most of them never touched a GeoCities page back in the day.
I don't have real suggestions for this aside of wondering why. Just put funny ads or that one webring that displays their members as ads for fun.
Links
This is probably one of the most common mistakes out there, and applies to any website, not just the Indie Web.
When you start to add a color CSS property to your links, all links would look like that even if you click it or visited it. However, this come with a risk5. When an anchor element is a single color, it becomes difficult to tell the difference between an already visited link and one that hasn't6, and even worse when there isn't a way to tell if it's a regular text or a link (e.g removing the underline)7.
- There's a perfect page from MDN that documents all the other important CSS code for your anchor element: link states.
- If you use colors on your links that are similar to the standard the better (e.g blue for unvisited, purple for visited, red for active)6.
- This is a personal preference but think about it when you're about to remove underlines on links7.
Lack of a site map
I'm not talking about what search engines want from your website, I mean the section that a website should have.
Site maps are more important than you think8. It serves as the geography of a website. Most websites nowadays lack of one because if these have a navigation bar linking to every section of their website, then what's the point?
There is a point however, in which the navigation bars or menus are there to not take too much space on your website and so lacks of information. Site maps on the other hand tells you each section and even subsections of your website what they are all in one place. Kind of like the Links page but of your entire website.
- For a starting point, here are a few good examples:
- A very basic one.
- Each page organized as a tree branch.
- Another basic one but with different rows.
- You might like this one.
- A mix between the second and fourth example.
- A more detailed and organized one. The kind of site map that I like the most.
- The less confusing you make your site map, the better.
Dead links
Maintaining a website active is hard, and for worse some websites that were linked on your page disappear without leaving a trace, but there are solutions for that.
- Redirect those old nonexistent webpages of yours to the newer ones with a script. For more information there's a wiki article about it, specifically the 301 status code.
- If not, customize your 404 error page and leave a link to your homepage. This is good to differentiate between a dead website and a dead link.
- For checking any dead link on your website, there's Dead Link Checker and the W3C's Link Checker.
"Made with a site builder"
There's nothing wrong about using site builders that generates a webpage for you, in fact for anyone who is starting to build their websites is absolutely great, but I encourage you to start building your own if you are already using that same layout for a long time, and between other websites that were built from the same site builder these become to look very similar to each other.
- W3Schools is a great place for any novice who wants to start building on their own.
- MDN, which was already mentioned on the "Links" section, is my favorite resource for anything related to web, with more detailed documentation on HTML, CSS and even JavaScript.
- Lissa Explains it All is another one with more documentation but it's easy to learn. A website from the gold age of the Internet with this specialty is a must-see.
- Intro to the Web Revival is a tree-part series of guides explaining the Web Revival, as well teaches you how websites work, materials and resources for inspirations, what they are and its importance.
- sadgirl's HTML & CSS guides , another useful guide.
For more resources, go to this page.
Frames
Frames are a double-edged sword.
For the webmaster is easy to keep everything in one place many of the elements of a website to be used across each subpage and, that's literally about it. For the users it could be a torment.
When it's not used to navigate through pages is great, fantastic I would say, but when it comes to just entirely for cosmetics on the entire page, each webmaster that does this might hate their website because not only is unfriendly for search engines (and when they do, links to a page that isn't a frame page, ironic), but also it's hard to tell from modern browsers that some frames are actually frames and not just rectangles since certain browsers don't show the scrollbars and you have to second guess by moving the mouse to anything, any of these pages could be vulnerable to change and then ruin the layout (like what I mentioned on the "Dead Links" section), some websites are not displayed because certain browsers block them for security reasons (which tricks the user to click uncertain places), and linking/bookmark a specific page from frames is difficult9.
There's a good reason why <frameset> and <frame> are deprecated, but either way you could imitate that same thing with inline frames (or "iframes") so it is still problematic and, of course, a common mistake found on many personal sites.
- The only times that it worked is when it's not used to navigate through pages, and the most uncommon times is how Melon managed to make his website with iframes to be easy to save or link specific pages.
- When you're leaving a link to a different website inside a frame page make sure to include
target="_top"inside of the anchor element, because if not then you will load a different website inside of a frame and... let's say, it's terrible. - Inline frames have an attribute called
srcdocthat embeds HTML code! but it's not present on older browsers (Chrome 20+, Firefox 25+ and Edge 79+) so for that I would say, use theoverflowCSS property for some frames. - If you're that webmaster that wants to have every element of a website used on each page you might start to make dynamic sites (PHP with
include()andrequire(), Perl with modules, etc.). I don't make frame-like pages because I care to make my website to look like a document, so for example my homepage includes two different files: the header and the footer. With that, I don't think you will need frames anymore for navigation purposes. - There's a CSS property that can position a specific element to the side, the top or anywhere (
position: fixed;), but requires to add atopand/orleftproperties. There's also a different value of thepositionproperty which isstickythat doesn't need eithertoporleftproperties because once you start scrolling, that element with those values would start to follow you after passing it. - You could make a non-frame version to choose between the two but at that point just make your website like a regular website.
Hotlinking
Try to not doing this. Hotlinking (or embedding any media from a different external page) and putting it on your website could not only be problematic with copyright infringement or broken links (see more on the "Dead Links" section) that end up displaying a blank image or CSS/JS code not working on your website, but also as these embedded stuff are from a different host, visitors are using someone else bandwidth, causing both websites the worst to stop working properly, even for your visitors to confront any security risk.
- There are many guides on how to stop and protect hotlinking from your website for a good reason but here's one that I did for my website to prevent hotlinking thanks to the web hosting that I'm using. It's not perfect but you can make your changes on your ".htaccess" file:
RewriteEngine On
RewriteCond %{HTTP_REFERER} !(^http(s)?://(www\.)?barrarchiverio\.cl)
RewriteCond %{SCRIPT_FILENAME} \.(js|css|jpg|gif|png|bmp|3gp|mp4|m4a|m4r|aac|mp3|ogg|wave)$
RewriteRule ^(.*) https://example.com/stop.gif [L]
The "example.com" URL is not actually on my .htaccess file, that's the URL you want to change in addition to changing my domain to yours.
- It sounds all of this terrible but there are some good things such as the assets being updated by its owner, the usage of image hosting services like Imgur and Catbox, reduces loading duplicated assets, considering giving credit from where it's from, asking permission and back-linking to the original source. Expect all of the problems that I mentioned above anyway, since you're not the one who is in control of the embedded file. One mistake and your website would fall apart.
Links that open new windows/tabs
The last, and probably the deadliest? After the last section I don't know if this is the deadliest, but still this is very common, equally common as the "Links" section. An article explains why the target="_blank" attribute is very bad and I agree for the most part. What I think about this fatal error is that you could use that attribute to your anchor element when it is really necessary (e.g unsaved work) but when it's not:
- Don't do this, the user has already this ability to open links to new tabs by middle clicking, and not only that but right clicking or clicking while pressing the Control/Command key. If you're afraid of any visitor leaving your website, then probably there's something you did wrong10.
- If you really think it's necessary for specific links on specific pages, you must use
rel="noopener". The reason behind that is that if you don't use that attribute for opening new windows/tabs, there's a security risk that without it makes the website vulnerable to attacks from the new page11 12. - Even if now using it on modern browsers is not that of a big deal9, the problem to distinct a regular link and a link that opens new tabs still persists, so if you still think adding that attribute, make it more clear that it opens new windows/tabs with visual elements such as icons, like what Wikipedia does with external links13.
Conclusions
Since 2020 has become more and more popular to own a website and the awareness about privacy on many of the corporate social media14, the more people are starting to build their own websites and even from scratch which is something that I admire watching.
While most of these examples are just design choices by the webmaster, these decisions ultimately ruin the user experience to some extent.
Over the years some of these mistakes have become more frequent to see on the Indie Web, but at the same time it became less regular since last year or so and I don't know exactly why. Probably there's a trend now on the community that is about simplicity.
Think what you want, simplicity is the key.
In a era where the AI is taking everything from us, creating a website has never been so important than before where creativity has no limits, that's what makes it so special about the Indie Web. Over the years it has become the perfect place to explore the Internet, just what was intended. But please, consider wasting someone's time in a good way.
If something bothers you just as me with each problem that I mentioned, build a better alternative, make something you think is special, make the Internet a better place.
References
Revenge of the Dirty Marketing SOBs (+14) by Bill Webb↩
Getting rid of annoying, intrusive ads (+14) by Bill Webb↩
Change the Color of Visited Links by Jakob Nielsen (Kind of ironic when the whole Nielsen Norman Group's website does the same mistake. None of their web designers probably ever read Nielsen's articles)↩
How recognized link colors help - Links Want To Be Links by Jukka Korpela↩
How underlining may help - Links Want To Be Links by Jukka Korpela↩
Site Map Usability by Jakob Nielsen↩
Why Frames Suck (Most of the Time) by Jakob Nielsen↩
Target attribute - Links Want To Be Links by Jukka Korpela↩
Why We Avoid Using target="_blank" (And When We Should Use It)↩