Looking for some Design Feedback

I have a page on my site dedicated to the collection of neat or helpful links I find on the internet. While I do trim it on occasion, it has a tendency to just grow. And that’s good! My favorite part of the internet is websurfing, and that’s hard(er) to do on the modern internet, so I want to have a massive hoard of links to hopefully start people down rabbit holes.

However, as it grows, I’ve become concerned about how to organize and display the information. I don’t want to be too detailed about it, since it’s not the sole point of the site, but I still want it to be easy to read and navigate - regardless of size. I’ve looked at some other sites’ lists for inspiration, but also wanted direct feedback just in case.

Do you think the way I have the organization set up right now needs changed in any major way? Minor tweaks?

Are there better methods for organizing the links entirely?

Are there any other issues with this page unrelated to organization? (May as well ask, since I’m here, but absolutely not the focus of my concern lol)

The link hoard (Domain of the Grubby Dog)[can be found here].

2 Likes

Something seems to be preventing your fonts loading properly on Firefox browsers, but it was working in Vanadium (chrome based) on mobile.

Error message in details

GET
https://your-local-grubdog.neocities.org/assets/fonts/ubuntu.ttf
[HTTP/2 404 28ms]

GET

scheme
https
host
your-local-grubdog.neocities.org
filename
/assets/fonts/ubuntu.ttf
Address
198.51.233.2:443
Status
404
VersionHTTP/2
Transferred367 B (425 B size)
Referrer Policystrict-origin-when-cross-origin
Request PriorityHigh
DNS ResolutionSystem

content-encoding
	br
content-type
	text/html
date
	Mon, 30 Dec 2024 15:17:55 GMT
etag
	W/"66f5b382-1a9"
server
	neocities
vary
	Accept-Encoding
X-Firefox-Spdy
	h2
	
Accept
	application/font-woff2;q=1.0,application/font-woff;q=0.9,*/*;q=0.8
Accept-Encoding
	gzip, deflate, br, zstd
Accept-Language
	en-US,en;q=0.5
Connection
	keep-alive
Host
	your-local-grubdog.neocities.org
Referer
	https://your-local-grubdog.neocities.org/assets/css/base-style.css
Sec-Fetch-Dest
	font
Sec-Fetch-Mode
	cors
Sec-Fetch-Site
	same-origin
TE
	trailers
User-Agent
	Mozilla/5.0 (X11; Linux x86_64; rv:128.0) Gecko/20100101 Firefox/128.0

Other than that the page is fine, as it grows you might consider breaking each category down by sub category (maybe with headings?) but as is now it’s entirely navigable.

Hi! My suggestion after a quick browse on my phone is to explore using lists for items within categories. They can be helpful for folks using screen readers, for example, because they let folks know how many items there are, which is something sighted folks can get a feel for just by looking at the page. See Content structure by WAI for more info.

I haven’t looked at things more closely on desktop, but I also suspect that focus management might be a bit confusing with the category buttons? But I don’t know how all of that is put together.

it seems pretty good to me! i think i would add more spacing to the headers within each category, though; they feel a little cramped! it might also be good to add a line or even just an asterisk or something between subsections.

1 Like

When I click the “fun stuff” button the page scrolls so the category buttons are no longer visible. I think it’d be easier to browse if it didn’t scroll.

Wow, you have a neat directory!

Seconding this. I would try adding a bit of margin-top to the h3s. That might help with the readability!

A few things came up, but I was finally able to take a look at this! ^^

@xixxii and @delovely - I was able to add both of your suggestions easily. That being said, they didn’t seem to fully go through when they were pushed to my site - so I’ll have to play around and see why it looks different on my local host versus the internet proper.

And part of me wonders if it’s the same Firefox issue @Frankie ran into. Either way, both fixes will have to come latter when I have more time.

@eladnarra that is a good idea! It would take a little bit for me to make everything into list items, so it’ll have to be an update for another afternoon. Whenever I do that, I’ll also test focus management and such.

And @memo - I can see why that’s annoying, but I don’t think a fix is possible unless I find another method entirely for tabs. These tabs are done with just some CSS hiding most of the page, and then showing a particular section when you choose it. On the back-end, each button is basically just a link taking you to a different part of the page. Thus, it causes the jump.

Unless, of course, someone more experienced than me can explain why that’s not actually an issue lol. But from what I do understand, that’s just how it will be unless I find entirely new tab code.

And thank you all so much for the feed back!!! It means a lot, even for cases where I can’t add the fix right away (or at all) for one reason or another.

3 Likes