Removing Nekoweb's Sitebox Preview Screenshot

I have to update my site to add a few things anyways so I might as well throw this old note on here. That and I’ve seen people screw it up a lot. This might technically be a small web reactionary post but it’s important for people to understand so I’m gonna post it anyway.

First off, let’s explain how the user expects a sitebox to work. By default, you have the screenshot, text, and subtext underneath. Clicking on the screenshot, text, and subtext sends you to the site. Pretty simple, right?

So let’s say you’re like me and you want to remove this screenshot for whatever reason. In my case, it’s because the screenshot was and still is broken, don’t ask why I have no idea but I assume it has something to do with me serving my site somewhere other than the root.

The element you want to edit, of course, is the .sitebox element. This element, as I’ve explained before, contains a link to your site. The biggest link, in fact. It takes up the majority of the sitebox.

So for the love of all that is holy, do not set this element to display:none. If you do, the only area people will be able to click on will be the very bottom text, which has now magically become the top text, which is VERY weird behavior.

A better method is to set the element to opacity:0, which will hide the element but allow it to take up the space that it takes up and therefore keep the clickable area of the sitebox intact.

This doesn’t expand over the whole sitebox by default but it’s good enough, definetly better than the display:none method.

Generally do bugtest your siteboxes. It can be often overlooked.