Skip to main content

Posted

Learning Log, Jun 2021 + Seasonal Cleaning IV

I think this is the latest I’ve ever posted a monthly Learning Log, but times have been busy! I also haven’t posted the most recent seasonal cleaning recap, so…it’s all getting rolled into one.

  • Late in the month I went to visit my family in Florida! 🐊 The weather was an absolute mess (torrential downpour every day, before going back to >100° temps in Seattle!) but it was so, so nice to see my family again and celebrate several birthdays. The last time I was with them in person was Christmas 2019. Some families are more used to long breaks, but it was hard for me—especially considering my niece was 6 months old the last time I visited. Thank goodness for FaceTime and its ilk.
  • Declared GitHub notification bankruptcy and marked >100 notifications as read. I feel all powerful! 😈 I’m probably missing stuff!
  • Thinking lately about: “what is my through line?” In true generalist fashion I am interested in many things—what is a stable interest or passion? What underlying theme connects my many interests? Something to lean into.
  • Chipping away at a mini-site dedicated to ideas for seasonal living.
  • Japanese: I’ve started “burning” items on WaniKani, which sounded like a bad thing but AFAICT means they are “burned” into your memory.

Seasonal Cleaning IV

  • Renamed an sr-only utility class to u-vis-hidden across a couple of older projects, as that is more accurate: this content is visually hidden; screen readers are not the only assistive tech that can access the hidden text on behalf of the user.

Bucketlist

  • Fixed a responsive layout issue where a masthead image was rendered in the wrong place when viewed on my iPad. I was using both min-width and max-width queries for the same 48em-breakpoint (I was avoiding resetting styles that were small-viewport-specific), but that led to a bad mix of styles precisely at 48em wide.
  • Reordered the “anywhere” list according to general category: activities, specific adventures, and general travel. That way, when I visit the site to see what to try next, the immediately actionable items are at the top of the list.

Fiber blog

  • Embraced loading="lazy" and decoding="async" attributes on images. It’s interesting to note how implementations of lazyloading differ: the Chromium implementation has a distance-from-viewport threshold of 1250px on fast connections, while Gecko seems to only start loading 600px from the viewport. The difference is noticeable when omitting dimension attributes, so I suppose I need to stop being lazy (heh) about that now. Good news is that adding width and height attributes is also helpful in reducing cumulative layout shift, beneficial for the user experience and now for SEO.

On the Internet

Reading

Responses

My blog uses Webmentions. Responses from Mastodon and other sites that send Webmentions will show up here.

  • Nick Simson My six favorite utility classes on

    My approach to writing CSS these days lays somewhere in between Andy Bell’s CUBE CSS and Harry Roberts’ ITCSS. I prefer Andy’s definition of a utility class from the CUBE CSS docs: A utility, in the context of CUBE CSS, is a CSS class that does one job and does that one job …