Web Reading UX Etcetera Part 5

May 2017:
http://whatusersdo.com/blog/make-websites-age-friendly
https://news.ycombinator.com/item?id=14348859

Top HN comment:

As sort of a sidenote: websites about UX seem to have the worst UX. Clicking the link, I'm not only met by a social sharing bar that uses 1/6th of the screen and screws scrolling up (because for some reason it should follow through my scrolling but somehow only be visible when scrolling upwards), but a faux-chat window overlaying the content where a Tom is asking me how he can help me. Not at all, thank you. At least being so up-front about how absolutely terrible your website is means I didn't stay long enough for a modal asking me to subscribe to their newsletter to pop up.

Does anyone actually believe that this crap leads to a better user experience? Are UX concepts and standards so inbred that the people involved just can't separate chocolate pudding from excrement anymore?

My emphasis added.

Another HN comment:

While the site focuses on seniors, a lot of the suggestions are good ones in any case - fonts larger than legalese and with good contrast will make your page more easily approachable and less likely to lose viewers who get frustrated because they can't read what you're trying to say.

At the other end of the spectrum, this must be a youngin' or someone with perfect vision.

There's a limit, though. I end up browsing most modern websites at ~60% zoom, because the text is so huge I find it distracting. Luckily the browser zoom feature is pretty great these days, so users can view at any size they like.

What's more likely: decreasing the font size or increasing it?

Why do a lot of websites use a microscopic font size for the mobile view of their responsively designed websites?

Somewhere among my manifesto list of links is a quote by someone who said that most people won't complain about a large font size. To me, a too-large font size is still comfortable to read on phone, laptop, and desktop screens. But a too-small font size requires intervention to make the web page more comfortable to read.

Another HN user who thinks like me with my emphasis added:

There's a limit, though. I end up browsing most modern websites at ~120% zoom when I'm tired, because it's more comfortable. Lay back in chair, still read comfortably. There's so much wasted whitespace it usually doesn't even break the layout.

I'm 29 and my eyesight with glasses is ok. Been wearing 'em for 22 years. But really the worst offenders are gray text on lighter gray background websites. Whyyyy designers why?

Yes, why? What makes designers think that grey text on a grey background is comfortable to read? If they tested their website for accessibility, it would probably fail due to a lack of contrast. These designers must be building their websites in perfect conditions, and they must be testing their sites in perfect conditions.

HN user:

Since the browsers remember zoom level I just set it to be comfortable for whatever it is and forget all about it, I had to check what I have HN set to on my desktop and it's 190%. It's not that I can't read it at 100 it's just tiring and I have mild astigmatism so I get eye strain.

HN user responding to the question above as to why designers use light grey text:

Because A E S T H E T I C

I've yet to see any designer articulate a reasonable defense of this shit.

HN:

I think that's why I still do so much more of my reading on a desktop than on a mobile device. Right-click, inspect. Uncheck font-color setting on article!

That's fine if reading a website on a laptop/desktop computer.

HN:

The less a website changes when I turn on Reader Mode in Firefox, the more I like the website.

HN:

But Reader Mode is not always available. I've settled into using the menu option "View..Page Style...No Style" on noisy pages. Now I need a "No Style" browser that finds the beginning of the narrative automatically.

I should use Firefox more to read websites on my Linux desktop computer. My Firefox browser install contains the following add-ons:

"Reader View" is built into Firefox, and it functions like "Enjoy Reader" or the old Readability extension.

Disabling style is a good way to test the site's HTML markup. Using the Lynx text-based web browser is also a good way to test the layout of the content. And I like to use the NetSurf web browser, since it does not support all of CSS3 and HTML5. These "tests" force me to use simple CSS and HTML markup and to remind me to use progressive enhancement. The NetSurf browser does not understand rem values for sizing.

Another HN user:

On Firefox that's "View ... Page Style ... No style." And I do that enough times per day (precious snowflake designers, take note) that I installed the Firefox addon "Disable Style button" which adds a red/white "CSS" stop sign button. https://addons.mozilla.org/en-US/firefox/addon/disable-style... Honestly, that one button fixes almost every UI/UX problem I encounter. I never use Reader Mode, I never open developer tools, I just nuke styles, read the site and move on.

HN:

About half the devs in my team have their font rendering cranked up on their desktops, and they're all in their 20s, so it's not just old people who benefit from this.

Super hi-res, large monitors probably display font sizes very small by default. I have to crack up the font sizes on every website when viewing the web on my Chromebook, even for Boghop.

HN:

First change I make on any Windows box is to bump up the desktop rendering to 125% or 150%, depending on the monitor size and resolution. I also set a minimum font size in Firefox of 14.

This is part of the problem of web design: a multitude of screen types, sizes, and resolutions. What should the default font size be?

It could be too large when viewed on a small, old, low-res screen, and too small when viewed on a giant, modern, hi-res screen.

HN user discussing the article:

The article focuses on over 55s who have money to spend online. I liked the part that spoke to how 40 year olds and up are less likely to explore a website and more likely to abandon a task.

Great line from another HN user:

Translation: Stop getting creative. Make functional websites, not art projects.

Another HN user:

I like an attractive web site, but only as long as I can read it instantly.

Of course, that's assuming it's a text-heavy website. If it's a website that focuses on art, gaming, movies, or graphic design, then it may function a lot differently, and that's probably okay because the behavior would be expected and maybe even welcomed.

HN user touches on another major irritant that I find offensive.

Something that should have been explicit on the vision topic: Disabling pinch-zoom guarantees some fraction of people with vision issues (of all ages) are just going to disengage.

Why do designers disable pinch and zoom on their mobile web displays? Are they shooting for a consistent or fixed look? It's extremely frustrating, especially when the site makes the other major error of using a microscopic font size. At least pinching and zooming would make reading more comfortable even if it means having to use the horizontal scrollbar.

Disabling pinch and zoom on the mobile web display, using a microscopic font size on the mobile web display, using a text color that is too light grey, these are valid reasons for disabling ALL styling to make the site readable on a phone even.

HN user:

The UX world has gone so far backwards, regardless of age, in the last five years it's hard to know where to begin: flat design, washed out colors, thin fonts, buttons that look like badges that look like input boxes that look like borders, modals that take over the entire screen with only a faint x in the upper right corner to indicate what is going on, input fields with internal labels that disappear as soon as anything is entered, and on and on. Just going back to bootstrap 2, for all its problems, would be a step forward at this point.

I like some or many aspects of flat design, probably because I'm a big fan of the nature artist Charlie Harper.

But this is a drawback to flat design:

Flat design is bad UX because it took a useful and familiar dimension, simulated depth, out of the toolbox. I agree that simulated depth was over used and that the minimalist aspect of flat UI did improve aesthetics in many cases, but it was a net loss due to the UX problems it caused.

Unfortunately the design world (and the art world more generally) appears to be extremely prone to binary thinking: either something is obviously wonderful, or it must be discarded completely.

Buttons that require "pressing" may not be obvious. I have resorted to horizontal, oblong-shaped, thin-bordered, flat button links, such as on the search page. Probably not good though.

The website uxpin.com got mentioned in the HN thread. Another user said:

I literally know nothing about UX, but I have to say a visit to UXPin's website instantly turned me off. First, they put this great big demand for my email front and center when I barely even know what their site is (and a single line explaining it is not enough to get me to sign up). The entire website is covered over with "modal grey" with no X box or anything else showing me I can close it, just some links at the top that are not obviously clickable because of the grey modal. Turns out it isn't a modal at all you can just scroll down (no indication of that) and that the small links are clickable. Once I was past that, it was fine and dandy, but if I were actually interested in being a customer rather than a curious person trying to figure out what I was missing, I probably would have just left.

HN user:

Yeah, the product isn't great. To the point about UX blogs though, theirs is pretty solid https://www.uxpin.com/studio/blog/. It isn't bogged down by social sharing widgets, scroll jacking, or pop ups (last I checked)

Scroll-jacking. Good one.

I had to disable JavaScript to get uxpin.com to function somewhat normally.

Anyway, onto another subject in the HN thread.

Noted is the distraction from automatically changing carousels. I've found this a major area of concern -- not just carousels but any autoplay content, automatic slides, and text marquees. And beyond distraction, these elements assume a specific pace of reading and require the user to build UI understanding to get back to interesting content they glimpsed in passing. If the content is compelling enough to display, it's compelling enough to present well.

My emphasis added.

HN:

Yet inevitably every middle manager thinks carousels are a great idea. I'm convinced 9 times out of 10 carousels are installed because the customer got sick of looking at their own site.

From the article http://whatusersdo.com/blog/make-websites-age-friendly/

Peak eyesight is around 30 years old. After the age of 40, many people’s sight is noticeably worse. Presbyopia—commonly known as age-related long sightedness—is just one of the issues that can affect the digiboomer. Less well known is that aging also reduces colour perception and colour sensitivity.

If you want to make sure that a digiboomer has a good experience on your website, make sure that the text size is at least 12pt and make sure that the colour contrast between the text and the background it sits on is good too.

When it comes to hearing, Action on Hearing Loss (formally the RNID) says that hearing loss begins to increase sharply at around the age of 50, and that 55% of people over 60 are deaf or hard of hearing.

As we get older, we become more conservative on websites—one study showed that 45% of older people interviewed were reluctant to try new things or explore a website. Interactions tend to be slow and methodical. Older people are twice as likely to abandon a task as someone under 30 years of age.

Make sure that your website is as simple to understand and use as possible. Use plain English, and keep the acronyms and jargon to a minimum. Try not to have too many components that can be distracting, like automatically changing carousels.

#manifesto