Tags: testing



What, Exactly, Makes Something A Progressive Web App? | Infrequently Noted

Alex runs through the features that a progressive web app must have, should have, and would be nice to have.

In general, installability criteria are tightening. Today’s Good-To-Haves may become part of tomorrow’s baseline. The opposite is unlikely because at least one major browser has made a strong commitment to tightening up the rules for installability.

Right now, this is in the nice-to-have category:

Mobile-friendly, not mobile-only.

Personally, I’d put that in the must-have category, and not just for progressive web apps.

Anyway, read on for some advice on testing and tooling when it comes to evaluating progressive web apps.

Research with blind users on mobile devices | Accessibility

Some interesting outcomes from testing gov.uk with blind users of touchscreen devices:

Rather than reading out the hierarchy of the page, some of the users navigated by moving their finger around to ‘discover’ content.

This was really interesting - traditionally good structure for screen readers is about order and hierarchy. But for these users, the physical placement on the screen was also really important (just as it is for sighted users).

The Sonos Pattern Library — zdfs

There’s a lot I disagree with here. I don’t think this pattern library process is very elegant or scalable, and it certainly wouldn’t work for me.

But I’m still linking to it. Why? Because I think it’s absolutely wonderful that people share their processes like this. It doesn’t matter one whit whether or not it would work for me.

Frontend development may have gotten a lot more complicated, but the simple premise of sharing what you’ve learned hasn’t.

I couldn’t agree more!

Building a Device Lab

The book by Destiny Montague and Lara Hogan is online for free with a Creative Commons licence:

Learn to build a device lab with advice on purchasing, power solutions, and much more in this handy pocket guide.

Device Lab / Oktavilla

Do you live in Stockholm? If so, you’ve got a device lab you can visit.

So feel free to drop by and test your responsive/mobile designs.

Perth Device Lab – An Open Device Lab brought to you by Humaan

This might be the most remote open device lab yet. Looks pretty great.

Online regex tester and debugger: JavaScript, Python, PHP, and PCRE

Regular expressions are my kryptonite. I’m rubbish at them and I can never keep the vocabulary in me head.

Mark recommended this tool so I’m going to give it a go the next time I have to resort to regex.

Building a device lab | Five Simple Steps

Lara and her colleague Destiny Montague have published a ridiculously useful handbook on setting up a device lab. For such a small book, it’s surprisingly packed with information.

NTH-TEST | nth-child and nth-of-type Tester

A tool for getting instant visual feedback on your nth-child selectors. Considering that the way I figure out nth-child selectors is to try randomly changing numbers until it works, this should be quite useful for me.

The W3C Mobile Checker

A new handy little performance testing tool from the W3C along the lines of Page Speed Insights.

Instant Web · An A List Apart Column

More thoughts on the lack of a performance culture, prompted by the existence of Facebook Instant:

In my experience, the biggest barrier to a high-performance web is this: the means of production are far removed from the means of delivery. It’s hard to feel the performance impact of your decisions when you’re sitting on a T3 line in front of a 30 inch monitor. And even if you test on real devices (as you should), you’re probably doing it on a fast wifi network, not a spotty 3G connection. For most of us, even the ones I would describe as pro-performance, everything in the contemporary web design production pipeline works against the very focus required to keep the web fast.

Accessibility and Low-Powered Devices | Brad Frost

Brad points out the importance of supporting—which is not the same as optimising for—the non-shiny devices out there.

I really like using the Kindle’s browser as a good baseline for checking that information is available and readable.

SmashingConf Oxford 2015: Richard Rutter on Don’t Give Them What They Want, Give Them What They Need

A great case study from Richard, walking through the process of redesigning the website for the Royal Borough of Kensington and Chelsea.

Password Masking

A great investigation into the usability benefits of allowing users to fill in their passwords in plain text.

Major caveat: make sure you still offer the ability to mask passwords too.

A New Way to Test Internet Explorer on OS X, iOS and Android | Rey Bango

This a great step-by-step walkthrough from Rey on setting up a remote version of Internet Explorer for testing on Mac.

Projectors don’t lie.

I’ve always liked testing on the crappiest mobile phones in the device lab—it feels like an honest stress test. I quite like the idea of using a crappy projector for the same reason.

The Bocoup Open Device Lab

Mat unveils Boston’s open device lab, and provides a beautiful raison d’être while he’s at it:

Websites work everywhere by default, and they stay that way so long as we know how not to break them. That’s what the Open Web means to me: ensuring that entire populations just setting foot on the web for the first time will find it welcoming, regardless of the devices or connections used to get there.

How to build a device lab | Tutorial by Destiny Montague and Lara Swanson

A set of slides from Destiny Montague and Lara Swanson at Etsy with their advice on setting up a device lab. Lara also wrote about the device lab on the Etsy code blog.

Responsive design testing tool – Viewport Resizer

A handy little bookmarklet for quickly checking how a site might look at different screen sizes, and you can customise it to use whichever screen sizes you like.

Aerotwist - My Performance Audit Workflow

Excellent tips and tools from Google’s Paul Lewis on performance testing.