Editing mobile web chapter

[shantsis]

Progress on #2525
Closes #2151

Stage link: https://20211119t010018-dot-webalmanac.uk.r.appspot.com/en/2021/mobile-web

@ashleyish you're also missing your bio. I tagged you in a couple spots, including most of the figure descriptions because they don't describe the actual stats

[shantsis]

@tunetheweb / @rviscomi this chapter has 2 GIFs for images which are great (they convey the message), but they also make me wonder if we need a mechanism to stop or pause them for accessibility. https://www.w3.org/WAI/WCAG21/Understanding/pause-stop-hide

Edit: figures 12.26 and 12.27

[rviscomi]

It'd be nice to support prefers-reduced-motion and use a still image instead. The first part of that is a task for developers and the second half would require asking the authors for a still version of the gif. WDYT?

[shantsis]

I was thinking that too. In this case I'm not sure how the static message would show the delay they're exampling, but it could still work.
Is it possible to play the gif once or twice and then pause it the way MS teams does?

[tunetheweb]

For the GIF issue, there's interesting tips here: https://css-tricks.com/gifs-and-prefers-reduced-motion/

To demonstrate the motion without the gif, you can just have two images side by side (like I did here:

We'll probably need something like this for the ebook anyway.

[shantsis]

For the GIF issue, there's interesting tips here: https://css-tricks.com/gifs-and-prefers-reduced-motion/

To demonstrate the motion without the gif, you can just have two images side by side (like I did here:

We'll probably need something like this for the ebook anyway.

I like it! Long as we give that guidance to the authors it shouldn't be too hard to do. And good point for the ebook.

[dwsmart]

For the GIF issue, there's interesting tips here: https://css-tricks.com/gifs-and-prefers-reduced-motion/
To demonstrate the motion without the gif, you can just have two images side by side (like I did here:

We'll probably need something like this for the ebook anyway.

I like it! Long as we give that guidance to the authors it shouldn't be too hard to do. And good point for the ebook.

Happy to do that, should we just have a side by side anyway? I liked the animation, but sounds like it may be an issue?

[tunetheweb]

We’ll figure out a way of making both work. Always interesting to think about these things and add the abilities to our toolkit for future years!

Could you come up with the side by side image though and add to this branch? The. Leave the rest to me.

[dwsmart]

Absolutely, will do this later! will the gif and the static need to be the same dimensions?

[tunetheweb]

Nah. As presume the side by side one will be wider.

[dwsmart]

added desktop-cls-example-static.png & mobile-cls-example-static.png

[dwsmart]

I addressed some of the great, valid points @shantsis, in the last commit I added a {# TODO (Editor) - … #} comment under yours for clarity, hope that's not breaking anything.

[tunetheweb]

Fixed the Gif thing. Can't get it to stop after two run throughs but do handle prefers-reduced-motion and ebook.

As mentioned in the chat:

I’ve just made another run through, more on the technical and “Web Almanac” consistency side and made quite a few edits (hope you don’t mind - but let me know if you massively disagree with any of them!).

Unfortunately, I’ve raised a few more TODOs that I’d like you to look at. Sorry about that! Have a search for them, and feel free to remove them when addressed, rather than adding another “Editor: done” line. I trust cha!

I’ve staged the latest version here: https://20211119t010018-dot-webalmanac.uk.r.appspot.com/en/2021/mobile-web

I’d like another run through of the graphs, and need to redo some of the screenshots after that, but it’s late here now so will leave that until tomorrow or the weekend.

It’s definitely almost there. Great read!

[tunetheweb]

Made some more edits for decimal place consistency, to add a couple more charts, increased the figure descriptions and run another spelling and grammar check.

I think this is good to merge.

@fellowhuman1101 / @dwsmart are you finished or still planning on tweaking it further? If not let's get this merged and finished!!

[dwsmart]

Hey @tunetheweb, we're good here too, and happy for it to be merged!