Journal

I’ve just read The A11Y Project’s page on alt text.

As most of us know, the HTML alt attribute is for providing “alternate text” descriptions of images to help ensure people do not miss out on information conveyed by graphics. This can help people using assistive technology such as screen readers, and in situations where images are slow or fail to load.

The article made some interesting points and even though I’ve been using the alt attribute for years I found three common cases where I could improve how I do things.

Avoid starting with “photo of…”

Don’t begin alternative text with “photo of…” or “picture of…”. Assistive technologies already indicate the role of the element as an “image” or “graphic”. Redundancy makes for a poor user experience.

Avoid including the word “logo” in logo images

If the image is a company’s logo, the alt should be the company’s name. Adding the word “logo” as part of the alternative text is neither necessary nor useful. (One thing I found helpful here is to think of the way I, as a sighted person, perceive Apple’s logo. I just think “Apple”, not “Apple’s logo”, so I guess the same principle applies.)

If using an image multiple times on the page, tailor the alt text

Using an image several times in a website doesn't necessarily mean the alt attribute should be the same for each instance. For example, when using a logo in the website’s header this often doubles as a link back to the home page. In this example, the alt would be most useful as “Apple - Homepage”. If that same logo were used in the footer of the site alongside the text “Apple, copyright 20XX”, then the logo should have an empty alt (alt="") so as to avoid creating a redundant announcement of the company’s name.

Here’s a list of factoids describing societal harms caused by technology platforms, each supported by a citation.

Under immense pressure to prioritize engagement and growth, technology platforms have created a race for human attention that’s unleashed invisible harms to society. Here are some of the costs that aren’t showing up on their balance sheets.

(via @adactio)

When advocating accessible web practices for a commercial website, the question of “what does the law require us to do?” invariably arises.

The appropriate answer to that question should really be that it doesn’t matter. Regardless of the law there is a moral imperative to do the right thing unless you are OK with excluding people, making their web experiences unnecessarily painful, and generally flouting the web’s founding principles.

However as Web Usability’s article What is the law on accessibility? helpfully advises, in the UK the legal situation is as follows:

“The accessibility of a UK web site is covered by the Equality Act 2010” (which states that) “Site owners are required to make ‘reasonable adjustments’ to make their sites accessible to people with disabilities”. While “there is no legal precedent about what would constitute a ‘reasonable adjustment’”, “given that the Government has adopted the WCAG 2.1 level AA as a suitable standard for public sector sites and it is more broadly recognised as a ‘good’ approach, any site which met these guidelines would have a very strong defence against any legal action.”

So, WCAG 2.1 Level AA is the sensible accessibility standard for your commercial UK-based website to aim for.

While not aimed specifically at the UK market, deque.com’s article What to look for in an accessibility audit offers similar advice:

The most common and widely-accepted standard to test against is WCAG, a.k.a. Web Content Accessibility Guidelines. This standard created by the World Wide Web Consortium (W3C) defines technical guidelines for creating accessible web-based content.

WCAG Success Criteria are broken down into different “levels of conformance”: A (basic conformance), AA (intermediate conformance), and AAA (advanced conformance). The current standard for compliance is both WCAG 2.1 Level A and AA.

If you don’t have specific accessibility regulations that apply to your organization but want to avoid legal risk, WCAG 2.1 A and AA compliance is a reasonable standard to adopt.

Additional references

• GOV.UK’s overview of WCAG 2.1
• WCAG 2.1 Official Docs
• UK Accessibility Laws on siteimprove.com
• Disabled access to websites under UK Law (from 2011)

Here’s an interesting tool for creating and sharing small-ish web pages without having to build a website or organise hosting.

itty.bitty takes html (or other data), compresses it into a URL fragment, and provides a link that can be shared. When it is opened, it inflates that data on the receiver’s side.

While I find this idea interesting, I’m not yet 100% sure how or when I’ll use it! I’m sure it’ll come in handy at some point, though.

Here’s my first “itty bitty” page, just for fun.

(via @chriscoyier)

Hidde de Vries explains why an HTML heading should never be immediately followed by another.

When you use a heading element, you set the expectation of content.

I have always prided myself on using appropriate, semantic HTML, however it’s recently become clear to me that there’s one thing I occasionally do wrongly. Sometimes I follow a page’s title (usually an h1 element) with a subtitle which I mark up as an h2. I considered this the right element for the job and my choice had nothing to do with aesthetics.

However a recent article on subtitles by Chris Ferdinandi and now this article by Hidde have made me reconsider.

HTML headings are essentially ”names for content sections”. On screen readers they operate like a Table of Contents – one can use them to navigate to content.

Therefore I now reckon I should only use a hx heading when it will be immediately followed by (non-heading) content – paragraphs and so on – otherwise I should choose a different element.

I should probably mark up my subtitles as paragraphs.

I watched Netflix’s documentary The Social Dilemma the other night. It’s been generating a bit of a buzz, and its subject matter – the effects of social media – is one I’m generally interested in. However, I wasn’t a fan.

While I totally agree with the sentiment that Facebook and Google (amongst others) don’t act in our best interests, there were more than a few aspects of this film that didn’t sit quite right.

Firstly, Netflix themselves are no angels (their CEO once said “sleep is our main competitor”) so for them to suddenly dress this up as “breaking news”, act as heroic whistleblower then make it all sexy with that typically shiny Netflix aesthetic, felt really disingenuous and nasty.

Secondly, why is it all former employees of Google and Facebook (with the exception of proper commentators like Shoshana Zuboff) that are “breaking the news” to us? It stinks of “I took the big pay cheque from a company doing bad things, now I’m taking Netflix’s pay cheque to rat on my former employee, even though Netflix do bad things too”. I trust some of these guys, and Netflix, about as far as I could throw them.

I like the social connection aspects of Facebook and it’s been handy over the years, but (lovely birthday messages and event planning aside) I wish I could bite the bullet and get off. I’d also love to see more people have their own websites/blogs – their own home on the web – and for there to be modern means of cross-communication between those. I reckon too many people have come to think that Facebook and Google are the web. They’re not.

You can have your own home on the web where the content you publish is not fodder for an algorithm that pushes you stuff and sells your data to the highest bidder.

An interesting BBC podcast on the history and true nature of the cloud.

We connect to the cloud, think of it as place-less, a digital “elsewhere” for storing and retrieving our data, content and memories. But far from being immaterial, the cloud is a vast, physical network made up of concrete, silicon and steel, of earthbound server farms, subterranean data centres and cables beneath the sea. It is not a publicly owned space or digital 'commons'. It is a multi-billion dollar, private infrastructure dominated by some of the world’s most powerful companies—principally Amazon, Microsoft and Google. The cloud exists within the same geography that we do: a patchwork of national and legal jurisdictions, which determine—most of the time—what it can and cannot do.

The aria-label and aria-labelledby attributes do the same thing but in different ways. Sometimes the two attributes are confused and this has unintended results. This post describes the differences between them and how to choose the right one.

The key takeaways for me were:

• Many HTML elements have an accessible name (which we can think of as its “label”) and this can be derived from the element’s content, an attribute, or from an associated element;
• for aria-labelledby, use the id of another element and that will then use that element’s text as your first element’s accessible name;
• use native HTML over ARIA where possible, but when you need ARIA it’s better to reuse than duplicate so if an appropriate label already exists in the document use aria-labelledby; otherwise use aria-label;
• an ARIA attribute will trump any other accessible name (such as the element’s content)
• there are some elements on which these ARIA attributes do not work consistently so check these before using.

I watched Tenet again last night (in IMAX with Jamie) and second time round it all made sense.

My initial viewing was good but really confusing; but this time I knew what was going on and loved it! Based on the plot, it actually makes sense that you need to see it twice, too.

This film has its flaws, no doubt, but for sheer invention, visuals you’ve genuinely never seen before, combined with the overall look, sound and mood, Mr Nolan has me hook, line and sinker and TBH I will likely never tire of watching his films. I expect to revisit this one roughly another ten times in the next year!

Footnote: I’ve been enjoying some internet rabbit-holing to squeeze out every last nuance of the plot I might have missed. Here are some great articles and resources which have helped (with the usual “heavy spoilers” caveat):

• Adactio’s fantastic review and insights
• Vulture’s humorous plot appraisal
• Transcript on Scraps from the Loft. It’s neither official nor 100% accurate but does a job.

I’m available for limited logo design projects. Just the logo. Limited back-and-forth. Reasonable price. With a particular focus on elevating small businesses that can’t or don’t want to hire a full-blown agency. Let’s keep this simple.

I’m a long-time fan of Dan Cederholm and his work. If I wanted a new logo, this is where I’d go!