The easiest way to keep your web apps accessible: Just use text

I'm still looking for "just use links". So many frontends I see use fancy onclicks to emulate links (including updating window.location). However they are either not links or are void links. This breaks all sorts of useful things (copy link location, open in new tab &c.).

Ironically, this article was posted on Medium, whose apps are notoriously inaccessible. Despite being a reading-focused app, it does not let you change the text size or spacing in any way. And on iOS, it also ignores the user's systemwide dynamic text setting.

It really annoys me when a site that just needs to display some text loads a whole react-redux framework.

When it comes to reading text I honestly prefer the old school academic websites (albeit with a max-width set).

Keeping stuff simple even makes maintaining the site simple, I personally run https://www.discoverdev.io and have used zero JavaScript. Inspired by brutalist design principles :)

My biggest pet peeve is when sites use js to try to "help" me scroll. What. The. Hell. is wrong with developers who think their users' browsers can't scroll? Am I the only one?

> You use ALT text by adding the alt attribute with a value of the text equivalent of your image, like so:

> <img src=“https://example.com/image.png” alt=“developer in an office working feverishly to hit a deadline on a software project” />

Is this actually a good idea?

This sounds like a typical "hero" or "teaser" image, to capture the reader's attention or interest. I don't think the alt tag does that in a comparable way, for a screen reader for example. So I'd just leave it blank.

It's really frustrating: all articles on accessibility mention the alt attribute, and that you should use them. But few give guidelines on how to write a good alt attribute that is actually well thought out.

When I write a website that explains things, and uses images, I (nearly) never use only images, but usually images + text. If I put an alt description in the images, I basically duplicate the text, and I guess that will confuse screen reader users more than a blank alt text.

Am I totally off base here?

Reading this article made me realize what it is that's broken about the concept of semantic markup and why websites even today are div soup.

It's the same reason why divs won in the first place. You can't dictate the shape of a document to people and it be anything other than a kludge.

Take the site I work on, Great Big Story[1]. We have sections and headers, but our content isn't defined by text, it's defined by graphics and videos, with little metadata sections on the video player page that I suppose could be semantic if we had the right descriptive tags. I use semantic markup when it seems to make sense, but we have so many weird little needs to introduce elements just for styling purposes.

Take a recent example, I need four elements to make a styled file input form. Two labels, one to look like a button and can be clicked, taking advantage of the browser behavior of treating clicks on the label to be clicks on the form. The other label is the actual label, could be just a span if I wanted, it doesn't have the htmlFor attribute set. The actual form input button is hidden using CSS tricks because the actual button can't be styled. Finally there's the filename display, which is set to the filename of whatever was uploaded or the existing one if present. This uses Javascript callbacks to get set.

None of these elements are semantic, legacy cruft keeps the markup from being simple and readable. I suppose you could demand our video presentation site to be a motherfucking website[2], but I fail to see how that will actually improve much of anything and would just hurt our brand. I'm getting a little tired of coder hatred for web fashion. It keeps us all employed.

But I think we're at least 10 years out from being able to actually use semantic markup. Web standards and browser vendors still have some maturing to do.

[1] https://www.greatbigstory.com

[2] https://motherfuckingwebsite.com/

The founder of the Tachyons css framework has some very similar ideas on his blog. Well worth the dive - http://mrmrs.cc/writing/

Posted on Medium with a massive pointless image at the top and page loaded asynchronously using JS.

Why would I use LogRocket for my all-text no-js web "app"?

I find the classic 90s webpage still warms the cockles of my heart