events/2025-06-03-front-end-study-hall

Front End Study Hall #029 was an IndieWeb meetup on Zoom held on 2025-06-03.

• Archived from: https://etherpad.indieweb.org/2025-06-03-front-end-study-hall

Front End Study Hall #029

June 3, 2025

Participants

• Joe Crawford
• Kevin Marks
• gRegor Morrill
• benji
• Reilly Spitzfaden
• capjamesg
• Template:meyerweb
• Template:vanderwal
• Template:webcraftsman

Joe's Zoom Background

Todays' background covers 3 books, one of which I've used as a background before, "Creating Killer Website" during FrESH #018 - the other two are by Jakob Nielsen and by Jeffrey Zeldman, two other folks who spoke loudly about best practices on the web, and threading the needle between good code, good accessibility, good search engine friendliness, and more.

It's cribbed from a great recent post from Richard McManus (of ReadWriteWeb): The 3 Gurus of 90s Web Design: Zeldman, Siegel, Nielsen

Other Writers and Thinkers

• Zeldman "A List Apart"
• Jeff Veen / Hotwired
  • (former) Vivid Studios - lots of sharing, user centered design
• Nathan Shedroff
• Molly Holzschlag
• Ana Tudor

Notes

So many topics we might cover! Front_End_Study_Hall#To-Study_List.21

• Do any prompt something we want to look at and discuss?

grid-auto-flow: column;

• Kanban Board: https://codepen.io/artlung/pen/bNdwwVN

Eric Meyer

• https://meyerweb.com/eric/thoughts/2025/05/21/masonry-item-flow-and-gulp/

Unshipping (Igalia Chats podcast episode about Google’s process for removing things from browsers): https://www.igalia.com/chats/unsh ipping

Dan Cederholm

• https://www.amazon.co.uk/Bulletproof-Web-Design-flexibility-Professional/dp/0321509021
• https://www.amazon.co.uk/Handcrafted-CSS-Bulletproof-Design-Voices/dp/0321643380

Q: Who are some people you like to read/learn from?

• Lea Verou: https://lea.verou.me/
• Heydon Pickering and Andy Bell: https://every-layout.dev/
• Whoever ppk points at --- CSS Day starts Thursday
  • https://cssday.nl/
• Jeremy Keith Jeremy Keith https://adactio.com/
• Eric Costello
• Ana Tudor https://codepen.io/thebabydino/
• Temani Afif https://css-tricks.com/author/afiftemani/
• Sara Soueidan: https://www.sarasoueidan.com/
• The Zen of CSS Design -https://csszengarden.com/
• Jason Santa Maria - https://jasonsantamaria.com/
• Rachel Andrew - https://rachelandrew.co.uk/
• Ahmad Shadeed - https://ishadeed.com/
• Kevin Powell - https://www.youtube.com/@KevinPowell
• Mike Bostock is another person to learn from via Plot https://observablehq.com/plot/ and d3 (and the lighter D3, Vega) https://github.com/d3/d3
• on a more abstract level, Edward Tufte https://www.edwardtufte.com/

Area Maps goes back to mid-1990s (html 2)

• 1994: area map / case western universaity website
• button bars - image map

https://htmlforpeople.com/ by Blake Watson

• This article mentions HTML for People, plus some other useful things: https://osteophage.neocities.org/essays/you-can-make-a-website

Edward Tufte books at least

• "chartjunk" "sparkline" coiner of words - Tufte as print designer
• Tufte_CSS Tufte CSS https://edwardtufte.github.io/tufte-css/
• Tufte CSS as a Hugo theme with microformats (may need updating) https://github.com/ChristopherA/LifeWithAlacrityBlog/tree/master/blog/themes/indie-tufte
• https://x.com/EdwardTufte/status/389717292621119489
• https://x.com/kevinmarks/status/389620524134830081

• https://github.com/w3c/csswg-drafts/issues/3720

"Hairline" unit -what would that size be? CSS Unit? border-width keyword? https://github.com/w3c/csswg-drafts/issues/3720

Richard Rutter

• https://webtypography.net/
• https://book.webtypography.net/

Thinking in Type by Ellen Lupton (book)

How is readability measured? If we are exposed to a font more, does that make

some citations here: https://www.kevinmarks.com/unreadable-web

funny implementation of CSS Pixels https://webdesign.maratz.com/lab/responsivetypography/realtime/

Neil Cohn: Comics researcher

• https://www.visuallanguagelab.com/neilcohn
• human beings adapt to different sorts of comics

Scott McCloud - Understanding Comics

• Why two spaces after a period isn’t wrong (or, the lies typographers tell about history): https://web.archive.org/web/20120331002003/http://www.heracliteanriver.com/?p=324

• Steve Krug "Don't Make Me Think" - usablity testing

• https://vhbelvadi.com/good-old-online-communities - IndieWeb member's page layout sent me down a rabbit hole over the weekend - VH Belavadi

• Promethea Mobius full panel [1]

• Scott McCloud : Understanding Comics

• Flow of language, based on language English vs Japanese

Google Fonts does not have woff2?

• variable woff? - tools to convert ttf to web fonts?
• https://www.fontsquirrel.com/tools/webfont-generator ?
• Libre Gothic
• No experience with this, but found: https://github.com/rafaelmardojai/webfont-kit-generator (Python)
• https://github.com/AliceWonderMiscreations/FlossWoff2/tree/master/www/LibreFranklin/1.015
• Google's converter to woff2 in GitHub - https://github.com/google/woff2.

Idenfity Font https://www.myfonts.com/pages/whatthefont

Michael K had experience with book with such great type he looked it up

• Maybe I'm thinking of this: https://www.codingfont.com/
• https://fontjoy.com/

Color of text vs other text? StackOverflow answers coming in hot for Reilly's question at last week's EU/London HWC: please review and upvote answers if you feel so moved

• https://stackoverflow.com/questions/27433399/same-color-text-looking-different-color

Making RSS / Atom ~ autodiscovery / discover?

• https://subscribeopenly.net/subscribe/?url=https://jamesg.blog
• SubToMe a similar tool
• https://multiline.co/mment/2025/05/request-for-feed-reader-app-developers/

Newest Tufte book

• https://www.edwardtufte.com/book/seeing-with-fresh-eyes-meaning-space-data-truth/

---