-
#CSS thread. I was excited to finally read @Una’s and @argyleink’s CSS report (almanac.httparchive.org/en/2019/css), part of the @HTTPArchive’s #WebAlmanac. Here are some observations.
-
@Una @argyleink @HTTPArchive #Color count, with a median of about 50 colors per page (!), seems really high, and I like the question respective section ends with: “How can you reduce this number into a manageable and reasonable amount?”
-
@Una @argyleink @HTTPArchive As for #color duplication (median 25 repetitions), custom properties or variables are one option to curb it—the other being using every declaration just once (#UDJO, meiert.com/en/blog/dry-css/). UDJO can be employed intelligently on a component or module level.
-
@Una @argyleink @HTTPArchive Side note: For classes per element, knowing the average seems to be more useful than the median (1). What is it?
-
@Una @argyleink @HTTPArchive Crazy: Medians (!) like * 40 font sizes * 100 distinct margin values * 16
z-index
values * 18 transitions * 14 media queries No surprise our people go crazy 😬 -
@Una @argyleink @HTTPArchive “We estimate [
margin-left
&c. to be] of limited duration, soon to be supplemented by their writing direction agnostic, successive, logical property syntax.” Maybe, but logical props don’t matter for many projects. Let’s not create a problem here: meiert.com/en/blog/logical-properties/. -
@Una @argyleink @HTTPArchive The number of style sheets per page (median 6) is unnecessarily high, for it can in any environment be 1, and their names (style.css!) unnecessarily… unimaginative. I like to refer to 2009’s “maintenance issue #1” which was all about CSS integration: meiert.com/en/blog/css-maintenance-issue-1/.
-
@Una @argyleink @HTTPArchive I may have co-developed the “hard reset” but I hate resets w/ great passion (cf. meiert.com/en/blog/reset-style-sheets-are-bad/, meiert.com/en/blog/one-photo-reset-style-sheets/, meiert.com/en/blog/stop-using-resets/. That resets, including “normalizers,” ring in at 36%, gives hope. But let’s hold it until next #WebAlmanac—I can’t wait! 🙏