What are your personal website pet peeves?

[Rubbereon]

Somehow I encountered some websites so messed up that the text went to the left of my viewport, yes you read that right, it had gone way beyond the basic window boundary of my browser. 

Genuinely how does anybody do that? Is that some kind of black magic involving position:absolute I'm not aware of?

There is no scrollbar either so the only way to view the text is to set the browser to fullsize (or fullscreen works too)

While I'm at it, it really grinds my gears when somebody puts a giant img over clickable links, those websites also expect you to be fullsize 1920x1080 to browse them which is great! 

The worst part is that I'm pretty sure you can use css so the cursor ignores the img and clicks whatever's behind it.


This right there is the bare minimum: https://motherfuckingwebsite.com/

If your website, somehow, is harder to use or read than this you've failed at your job.

[isomorphie]

I really don't like when pagedolls cover my screen... I use some pagedolls around my site so Im not against them as decoration. But its so odd when Im using a standard size computer screen and the dolls still cover the main content on the page. I always wonder what computer setups/browsers people have as their defaults to make layout sizing less intrusive.

[xwindows]

I always wonder what computer setups/browsers people have as their defaults to make layout sizing less intrusive.

I would rather not recommend you to accommodate according to "default", but rather do so for at least few varieties of resolutions. Many people today run 1920x1080 (full-HD), and some would inflict themselves with 3840x2160 (4K), true; but webmasters outright targeting these in their designs in the manner you asked, is exactly what brought you the problem of this content-obscuring screen edge decorations (and header/footers) in the first place.

Instead of actually "targeting" these contemporary resolutions; I would rather recommend you to do legacy-first design and make your site accommodate all of these low-end "modern" screen resolutions, from important first:

• 1366x768 (16:9 Mid-2010s laptop)
• 1280x720 (16:9 HD-ready LCD TV)
• 1024x768 (4:3 XGA; Windows XP-era desktop)

Once these view well, people viewing it under full-HD 1920x1080 would not have accessibility problem; and by doing it this way, you'd also avoid breaking the bank for people who use cellular Internet in the process. (People who inflicted themselves with 4K 3840x2160 will already have their browser/OS upscale everything anyway; but if you're trying to explicitly accommodate them, see my next point about "font size-centric design")

If you are also explicitly accommodate retro systems, then consider testing on the following resolutions as well:

• 800x600 (4:3 SVGA; Windows 98/dotcom-era desktop)
• 640x480 (4:3 VGA; NCSA Mosaic era, the first mainstream appearance of WWW)
• 840x480 (16:9 WVGA; a bit unusual)
• 480x800/800x480 (The last of pre-smartphone PDAs)

Note that retro software from early-2010s and the time before will not support CSS media query and CSS/MovingGoalpost (CSS3). Thus when accommodating these, you would have to make everything usable in retro resolutions under CSS2 (including its `@media handheld {}`, if any) first, then progressively-enhance it to look proper under current resolutions via CSS media queries; not the other way around!


Another approach which I've been using in the mix, is "font size-centric design"-- which basically mean that I size+position many strategic design elements using classic CSS `em` unit (1), which the actual dimension is multiplied by display font's pixel size at the place where the element is declared.

Once you carefully designed the typesetting of the entire page to use font size that is relative to each other (declared in `%` or `em`) down to the `<html>`-- which has no font size declared (i.e. uses user's default body font size configuration) (2); you'll get a page which is automatically scaled based on the accessibility/font-size setting. When done well, it would mean you now automatically accommodate with people who use smartphones, and rich kids who inflict themselves with 4K screens altogether.


(1) NOT the newfangled CSS/MovingGoalpost's `ch`, `rem`, `vw`, `vh`, `vmin`, `vmax`, and all that jazz.

(2) And at one "default" desktop resolution (usually 1024x768), I would assume a 16px default font size, and adjust things to make sure that images would be displayed with no scaling in that configuration.

[oro_junestar]

I'll share my own two cents:
-Stamp/blinky/button marquees. They're so slow, boring, and overdone, I'd rather they be in one neatly-arranged wall.
-Extremely bright flashing strobe lights covering the entire page with no warning. I've seen this TWICE.
-I once saw a dropdown menu with white text on a white background?????
-Sites that don't use a consistent style where every single page has a completely different layout and I can't tell what went where

Reading through this thread has been very helpful and I'll try to keep everyone's points in mind as I keep working on my site! I should definitely add alt text to my images sometime soon.

[arcus]

"JavaScript Warning"
Does the site not load properly with JavaScript disabled? Does this site run cryptocurrency miners? Or does it simply have JavaScript? What's the warning for?

.com TLDs
Why pick the boring commercial TDL for a personal site, when there's so many other options?

Galleries that don't use thumbnails
My browser hangs having to load a bunch of full size images. Not a fan.

Flashing lights
Not much else to say about this that hasn't been said, aside from this: In many countries, epileptic drivers have to go 3~12 months without experiencing a seizure, or their license will get suspended. This can really screw someone over if they rely on their car for transportation.

[xwindows]

"JavaScript Warning"
Does the site not load properly with JavaScript disabled?

This one is the correct meaning. As someone who kill client-side scripting browser-wide; whenever I share link on the web or even instant messaging like IRC, I'll personally put " (WARNING: JavaS'creep)" next to links that fail to show properly (or worse, exhibit blank page disease (1) ) on setups that don't bow down to such unconsenually-run drive-by programs; so people using such setup could decide to skip, if they don't think it would be worth changing to latest-and-worst browser (or changing settings) to view.

Web destroyers making such thing ought to be punished by having Barry T. Smith's rant playing looped to their ears 24/7; until they die the most hallucinating death.

Galleries that don't use thumbnails
My browser hangs having to load a bunch of full size images. Not a fan.

Yeah, I agree with this one. Some people just don't stop to think about any implications of what they're doing; especially with so much RAM and bandwidth that they often have. (Same applies to people who inflict viewers with villain image)  Some of such galleries also used `width=` / `height=` HTML attribute to "shrink" huge image to tiny on-page size, with several dozens of them on the page; them proceed to show the exact-same image when I clicked it... That's just dreadful.

I run my whole system in 32-bit, 4 GiB RAM, with no swap file; with enough number of huge images on the page, such thing can actually bring down my entire graphical session (including another hundreds of tabs I have open in my lowly single-process browser, and dozens of other application windows) if I wasn't fast enough to to hit my browser's Stop button (or Esc key).


(1) By "blank page disease", I mean "webpages" (scare quotes intended) which simply shown up blank when its script failed to run.