Almanac.httparchive.org: Write content: Chapter 12. Mobile Web

[rviscomi]

Part | Chapter | Authors | Reviewers | Analysts | Metrics | Analysis
-- | -- | -- | -- | -- | -- | --
II. User Experience | 12. Mobile web | @slightlyoff @obto | @hyperpress @AymenLoukil | @ymschaap @rviscomi | #14 | #93

Due by: October 7

• [x] Review the results spreadsheet and work with your analyst(s) (@ymschaap @rviscomi) if you have any questions about the data.
• [x] Write the contents of your chapter and get it peer reviewed (@hyperpress @AymenLoukil).
• [ ] File a PR to merge your written contents in markdown format to the src/content/en/2019 directory.

Refer to the Authors' Guide for writing advice.

[obto]

@rviscomi Think you meant to reference the Mobile Web metrics and analysis in the table above: #14 #93

Metric 12.11:

1. You left a comment saying this should be read as mobile pages include icons in links/buttons, while the metric should be for buttons with ONLY icons in it. The BQ query for this looks good however, so I just wanted to double check with you I'm not missing something.

2. Is the following a bug in the custom metric? Looks like itd flag any clickable that contains an SVG instead of clickables with ONLY and SVG: https://github.com/HTTPArchive/legacy.httparchive.org/blob/156ac9694777a14de48bbf5827e2f0276135e560/custom_metrics/almanac.js#L285-L287

Metric 12.12:

Seeing these numbers got me thinking... along with finding the popularity of various input types (this metric), what do you think about another metric thatd give us a different perspective on adoption rates: For each given input type, what % of sites does it appear on?

---

Everything else looks great!

[rviscomi]

@rviscomi Think you meant to reference the Mobile Web metrics and analysis in the table above:

🙈 yes sorry about that! Bad copypasta! Fixed.

I just wanted to double check with you I'm not missing something.

Yes, I may have been lazy with my comment there. You're right.

Is the following a bug in the custom metric?

And yes, the custom metric only appears to check that the first child of the clickable is an SVG, not necessarily the only child. :(

For each given input type, what % of sites does it appear on?

Updated 12_12 query and results to include the % pages. 👍

[obto]

Thanks so much for adding the extra query. So 10% of all sites at least use the email type. That's way more penetration than I expected :smile:

As for the bug... I suspect SVG buttons are far less popular than icon buttons so what do you think of doing the following:
I'll send in a PR to fix the bug and write the content for this metric using the current, albeit buggy, data. Then next month when the sites are run again (assuming almanac custom metrics will be kept around), we can compare and see how much of a difference fixing this bug made.

[rviscomi]

SGTM 👍

[obto]

Going to check off the data review then :tada:

[rviscomi]

👋 Greetings! Just checking in to make sure this is progressing and remind you of the October 7 deadline timed so we can launch at Chrome Dev Summit.

The checklist above indicates that you still need to write content and get it reviewed. Feel free to reach out if you have any questions about the process.

[obto]

Working on a doc with some of my thoughts and what metrics are really popping out to me. I should have this part done tomorrow :)

[AymenLoukil]

@obto i'm here to help on review, feel free ;)

[obto]

Thanks @AymenLoukil ! Finishing my analysis on the a11y chapter took a lot longer than I expected, so I'm still working on this one. I'll be sure to ping you when I'm through :)

[obto]

Here's the document containing my insights so far. I have a few more metrics to finish looking through and fix up, but let me know what you all think.

You should be able to leave comments, but shoot me your email and I'll be happy to give you edit access as well.

https://docs.google.com/document/d/1QqXiqDq7FsrGCGYDDpFCqg5iK6PxM3L4in3t9TwhYN4/edit?usp=sharing

[obto]

@rviscomi regarding the small, medium and large cls values in chrome-ux-report.materialzed.device_summary, is this a correct interpretation of how these values are calculated?:

Google tracks the CLS for every single pageview. The percentages we see here, are the % of times the CLS for a given pageview falls within small (5% or less), medium (5 - 100%), or large (100% +).

Is this correct?

[rviscomi]

Google tracks the CLS for every single pageview. The percentages we see here, are the % of times the CLS for a given pageview falls within small (5% or less), medium (5 - 100%), or large (100% +).

Yes, that's correct.

is this a correct interpretation of how these values are calculated?

That's a different question :)

This is the first time anyone has ever looked at CLS data in aggregate, so we're still figuring out if bucketing by small/medium/large is the best/most correct way to do so.

You may find that you're not able to glean anything from the CLS results, which is ok.

[obto]

I think there is something very interesting here, it's just a matter of wording 🤔

Because it seems a large CLS means there were enough repaints and shifting to essentially repaint the ENTIRE viewport. And based on the data below... the average site does this for 25% of its visits.

That's a mouthful to say right now though haha

percentile | % small cls | % medium cls | % large cls
-- | -- | -- | --
25 | 58.66 | 37.41 | 3.93
50 | 31.75 | 44.41 | 23.84
75 | 17.66 | 2.72 | 79.62

[obto]

What could be fascinating to measure in the future however, is how many times (per page view) there is a sizeable layout shift. Perhaps to measure how erratic the page load was.

[obto]

Here's the document I'm currently writing in: https://docs.google.com/document/d/1ypPGDyvpWJcil1bNuvq3D8DXcwjHN00NX2iYQtU70oo/edit#

My analysis of the metrics is now done, so I'll be working on writing it all up this weekend.

[logicalphase]

I'm open over the weekend for review when ready.

[obto]

Thanks for waiting everyone, I've finished writing everything besides the intro and conclusion, and am ready for editing.

@slightlyoff @hyperpress @AymenLoukil

[obto]

@rviscomi At some point I'd love to get your thoughts on my interpretation of the CLS metrics. They're in the section named: Shifting content while loading

[logicalphase]

Great. I can review this evening. 📖

[AymenLoukil]

Nice ! I'll start reviewing tomorrow @obto :)

[AymenLoukil]

I did a review of the document @obto. I found the writing style nice and catch users to read, bravo !
I added some comments..

[obto]

Thanks! I took a quick look and you made some really good suggestions. I'll
make some changes tonight 😊

On Tue, Oct 8, 2019, 15:48 Aymen Loukil [e-mail] wrote:

I did a review of the document @obto https://github.com/obto. I found
the writing style nice and catch users to read, bravo !
I added some comments..

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/HTTPArchive/almanac.httparchive.org/issues/147?email_source=notifications&email_token=AAFHFS3SNK4YGQ336WFDSSDQNTWYNA5CNFSM4IUSKBIKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEAVSEZQ#issuecomment-539697766,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAFHFS66CILZRUHK2JYZXCLQNTWYNANCNFSM4IUSKBIA
.

[logicalphase]

@obto Other than a couple of minor nits (I added as comments on the Doc), I didn't find any issues with accuracy or presentation. Kudos David.

[obto]

Thanks! I'm going to make another pass-through and see if I can find a few more places figures would be helpful (like the tap-targets image). After that I'll start writing the take-aways, intro, and we'll be done 🙌

Right now I'm busy writing and editing the A11Y chapter, so I'll aim to finish this weekend and ping you all again after that.

[logicalphase]

Great thank you for doing that.

[obto]

The chapter is now completely finished. Once I get it reviewed I'll turn it into markup and make a PR 😄

[logicalphase]

I'll do my review later today. Thanks for the update.

[logicalphase]

I completed an additional review. Very well researched. Other than a few
small nits here and there I found no issues. Very informative and easy to
understand. Nicely done.

https://themesurgeons.com

https://themesurgeons.com

[obto]

Waiting on 2 things before I make a PR for this chapter and close this out:

1. @rviscomi Can you review the portion regarding CLS?
2. @slightlyoff can you give me your thoughts on the chapter by EOD friday?

[rviscomi]

Sorry for the delay. Just left feedback on CLS.

[logicalphase]

Completed full review of latest draft. I'd already made a few passes with @obto. This is definitely a winner and contains some facts on wild use of JavaScript. Other than a few nits already resolved, This is ready to go. Really nicely done and informative with easy to understand examples and figures.