events/2025-08-12-front-end-study-hall

Front End Study Hall #034 was an IndieWeb meetup on Zoom held on 2025-08-12.

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

Front End Study Hall #034

August 12, 2025

Participants

• Joe Crawford (Joe) https://artlung.com/
• gRegor Morrill https://gregorlove.com/
• Template:webcraftsman https://jeffbridgforth.com/
• Thomas Vander Wal https://vanderwal.net
• Piya https://pjg1.site
• Fractalkitty https://fractalkitty.com or https://toground.link
• jo https://dead.garden
• Tantek Çelik https://tantek.com/
• mandaris

Notes

• Joe's Zoom background today? A screenshot via a bluesky account called "classicweb.site"
  • SASS website from 2012
  • It doesn't look so different today: sass-lang.com
  • SASS implemented ideas for variables, color functions, flow control logic (if) long before we had similar implementations in browsers
  • see also: Sass
  • Eric M is using SASS recently - many - not finding identifiers that are there because they are created with nesting and concatenation via nesting and the & character
  • nesting is new
  • @media blocks for selector

• What's on your mind? What HTML and CSS are you loving or are vexing you these days? ==

HTML Day

• HTML Day on August 2 2025 was a lot of fun! https://html.energy/
  • What did you make on HTML Day?
  • I made a collective noun generator https://nouns.website

Michael's Sun

• • Animated sun: https://codepen.io/kupietz/pen/zxvdPEV
  • Shadowcasting: https://codepen.io/kupietz/pen/LEpzJgL
  • https://developer.mozilla.org/en-US/docs/Web/API/Window/requestAnimationFrame
  • showed it on a page showing text shadows on individual
  • intersectionobserver to add shadows only on the viewport
  • other ways to do it? every words a span feels heavy
  • how abotu a copy of all the text

Animation technique - skeleton to HTML structure

• https://miocene.io/post/css-character-skeleton/
  • Stair dismount (ragdoll physics)

Tiny Awards.net

FYI: https://tinyawards.net/vote/ are open for voting for finalists!

• We've not checked out the sites

Question: Making WebVTT work?

• WebVTT: https://developer.mozilla.org/en-US/docs/Web/API/WebVTT_API
  • Didn't work in browser, maybe because it was a file://

Ghost 6.0

• Sophia: Ghost 6.0 - breaking changes?
• PDX HTML Day - collective nouns random generator -
• https://nouns.website/ collective noun!
• Migrate all GitHub to Codeberg (?)
  • Codeberg
  • GitLab another option

Alternatives to Zoom?

• • Jitsi mixed experience in the past with IndieWeb events, though years ago

Fighting AI

• HTML Bomb: https://www.neuralab.net/creative-defense-against-ai-crawlers-from-labyrinth-to-html-bombs/
• people with websites have been hit in the face and been obliged to upgrade infrastructure to deal with ai traffic because so many are poorly behaved - a natural consequence of that is that people seek solutions to punch back when punched in the face

HTML Question - forms

• When should we use fields and legend?
  • fieldset https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/fieldset
  • legend https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/legend
  • optgroup https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/optgroup
  • Basically? to provide landmarks for screenreader in forms with multiple form elements as a help to navigation (skip an area, go area by area)

• Tetralogical is making an effort to see how different screen readers support and parse various HTML
  • See this git repository https://github.com/TetraLogical/screen-reader-HTML-support

Elsewise

• Sophia updated to Ghost 6 and is looking to understand handlebars - https://docs.ghost.org/themes
• Privacy Policy? Ghost (commenting) - turfing it to Ghost (?)
  • disclosure has some IndieWeb examples
• What do we owe our users? What moral accounting for what we collect?

Blaugust and personal connections

• Blaugust and other blogging challenges
  • Blaugust
  • https://nerdgirlthoughts.game.blog/2025/07/10/blaugust-2025-is-coming/
  • NaBloPoMo
  • challenge

• Permanence and connection and personal connectiion is in contrast to tracking and the negative parts of the web stack

CSS, Comics, Microsoft Comic Chat

• https://nathan.com/ixd-blast-from-the-past-6-comic-chat/
• https://comicss.art/comics/190/
• Comics and CSS intersection

CSS comic: https://comicss.art/

• Joe: appears in art galleries
• Also Joe: "I'm not sure I'm an artist" :D
• https://developer.mozilla.org/en-US/docs/Web/CSS/:target
  • Experimenting with using this on my page https://artlung.com/art/ when targeting an individual piece's #hash as in https://artlung.com/art/#unbought-unbossed

The main Fresh page accepts webmentions as do all the notes pages:

• Front_End_Study_Hall
  • They are collected here: https://artlung.com/front-end-study-hall/

Question

"What is the collective noun for front end study hall participants?"

• if you have an answer, send a webmention!

• Freshies?

Group Photo 2025-08-12