Mastodon

Inautilo<a href="https://mastodon.social/tags/Development" class="mention hashtag" rel="nofollow noopener" target="_blank">#Development</a> <a href="https://mastodon.social/tags/Launches" class="mention hashtag" rel="nofollow noopener" target="_blank">#Launches</a> A11y Rules · Instructions for AI to generate accessible HTML/CSS <a href="https://ilo.im/1658t6" rel="nofollow noopener" translate="no" target="_blank">https://ilo.im/1658t6</a>_____ <a href="https://mastodon.social/tags/AI" class="mention hashtag" rel="nofollow noopener" target="_blank">#AI</a> <a href="https://mastodon.social/tags/AiAssistant" class="mention hashtag" rel="nofollow noopener" target="_blank">#AiAssistant</a> <a href="https://mastodon.social/tags/VibeCoding" class="mention hashtag" rel="nofollow noopener" target="_blank">#VibeCoding</a> <a href="https://mastodon.social/tags/Prompting" class="mention hashtag" rel="nofollow noopener" target="_blank">#Prompting</a> <a href="https://mastodon.social/tags/Accessibility" class="mention hashtag" rel="nofollow noopener" target="_blank">#Accessibility</a> <a href="https://mastodon.social/tags/WCAG" class="mention hashtag" rel="nofollow noopener" target="_blank">#WCAG</a> <a href="https://mastodon.social/tags/WebDev" class="mention hashtag" rel="nofollow noopener" target="_blank">#WebDev</a> <a href="https://mastodon.social/tags/Frontend" class="mention hashtag" rel="nofollow noopener" target="_blank">#Frontend</a> <a href="https://mastodon.social/tags/HTML" class="mention hashtag" rel="nofollow noopener" target="_blank">#HTML</a> <a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#CSS</a>

Felipe 🐁Also learned you can even customize with any symbols you may like using the `@counter-style` CSS at-rule.<a href="https://developer.mozilla.org/en-US/docs/Web/CSS/@counter-style" rel="nofollow noopener" translate="no" target="_blank">https://developer.mozilla.org/en-US/docs/Web/CSS/@counter-style</a><a href="https://hachyderm.io/tags/learning" class="mention hashtag" rel="nofollow noopener" target="_blank">#learning</a> <a href="https://hachyderm.io/tags/dev" class="mention hashtag" rel="nofollow noopener" target="_blank">#dev</a> <a href="https://hachyderm.io/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#CSS</a> <a href="https://hachyderm.io/tags/HTML" class="mention hashtag" rel="nofollow noopener" target="_blank">#HTML</a> <a href="https://hachyderm.io/tags/web" class="mention hashtag" rel="nofollow noopener" target="_blank">#web</a>

Felipe 🐁Today I learned how you can customize the list markers using the `list-style-type` CSS property.<a href="https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type" rel="nofollow noopener" translate="no" target="_blank">https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type</a><a href="https://hachyderm.io/tags/learning" class="mention hashtag" rel="nofollow noopener" target="_blank">#learning</a> <a href="https://hachyderm.io/tags/dev" class="mention hashtag" rel="nofollow noopener" target="_blank">#dev</a> <a href="https://hachyderm.io/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#CSS</a> <a href="https://hachyderm.io/tags/HTML" class="mention hashtag" rel="nofollow noopener" target="_blank">#HTML</a> <a href="https://hachyderm.io/tags/web" class="mention hashtag" rel="nofollow noopener" target="_blank">#web</a>

CSS Basics<a href="https://hachyderm.io/tags/HTML" class="mention hashtag" rel="nofollow noopener" target="_blank">#HTML</a> Form inspector: "Paste your HTML form code to get a detailed overview of its structure and fields." <a href="https://polypane.app/form-inspector/" rel="nofollow noopener" translate="no" target="_blank">https://polypane.app/form-inspector/</a>

Steve FaulknerProposal: New attribute alt-origin to indicate provenance of alt text (machine vs. human authored)<a href="https://mastodon.social/tags/HTML" class="mention hashtag" rel="nofollow noopener" target="_blank">#HTML</a> <a href="https://mastodon.social/tags/a11y" class="mention hashtag" rel="nofollow noopener" target="_blank">#a11y</a> <a href="https://mastodon.social/tags/ai" class="mention hashtag" rel="nofollow noopener" target="_blank">#ai</a> <a href="https://github.com/whatwg/html/issues/11448" rel="nofollow noopener" translate="no" target="_blank">https://github.com/whatwg/html/issues/11448</a>

Pyrzout :vm:Hackers Weaponize Compiled HTML Help to Deliver Malicious Payload <a href="https://gbhackers.com/hackers-weaponize-compiled-html-help/" rel="nofollow noopener" translate="no" target="_blank">https://gbhackers.com/hackers-weaponize-compiled-html-help/</a> <a href="https://social.skynetcloud.site/tags/CyberSecurityNews" class="mention hashtag" rel="nofollow noopener" target="_blank">#CyberSecurityNews</a> <a href="https://social.skynetcloud.site/tags/cybersecurity" class="mention hashtag" rel="nofollow noopener" target="_blank">#cybersecurity</a> <a href="https://social.skynetcloud.site/tags/HTML" class="mention hashtag" rel="nofollow noopener" target="_blank">#HTML</a>

Desmu :georges_saucisse:J'en appelle aux webdevs ici. C'est quoi vos sources de veille en <a href="https://mastodon.desmu.fr/tags/HTML" class="mention hashtag" rel="nofollow noopener" target="_blank">#HTML</a> <a href="https://mastodon.desmu.fr/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#CSS</a> et <a href="https://mastodon.desmu.fr/tags/JavaScript" class="mention hashtag" rel="nofollow noopener" target="_blank">#JavaScript</a> ? Hors MDN et CSS Tricks, j'ai jamais vraiment regardé ailleurs et je vais essayer d'à nouveau avoir envie de chercher du taff'.Points bonus si : - Compte Mastodon. - Francophone. - Propose un format podcast. - Apporte un point de vue critique sur le secteur sans être tout le temps alarmiste. - Contenu généré par des humains et pas par IA. - Fait pas la course au dernier framework hype.

Grand-Theft-AutoCybercriminals Target Gen Z Gamers with Weaponized Popular Games A new wave of cyber threats is zeroing in on Generation Z, the cohort born between 1997 and 2012 commonly dubbed “Zoomers.” As d... <a rel="nofollow noopener" class="mention hashtag" href="https://mastodon.social/tags/Cyber" target="_blank">#Cyber</a> <a rel="nofollow noopener" class="mention hashtag" href="https://mastodon.social/tags/Security" target="_blank">#Security</a> <a rel="nofollow noopener" class="mention hashtag" href="https://mastodon.social/tags/News" target="_blank">#News</a> <a rel="nofollow noopener" class="mention hashtag" href="https://mastodon.social/tags/Cybersecurity" target="_blank">#Cybersecurity</a> <a rel="nofollow noopener" class="mention hashtag" href="https://mastodon.social/tags/HTML" target="_blank">#HTML</a> <a rel="nofollow noopener" class="mention hashtag" href="https://mastodon.social/tags/Cyber" target="_blank">#Cyber</a> <a rel="nofollow noopener" class="mention hashtag" href="https://mastodon.social/tags/Security" target="_blank">#Security</a> <a rel="nofollow noopener" class="mention hashtag" href="https://mastodon.social/tags/Cyber" target="_blank">#Cyber</a> <a rel="nofollow noopener" class="mention hashtag" href="https://mastodon.social/tags/security" target="_blank">#security</a> <a rel="nofollow noopener" class="mention hashtag" href="https://mastodon.social/tags/news" target="_blank">#news</a> <a href="https://cyberpress.org/cybercriminals-target-gen-z-gamers/" rel="nofollow noopener" target="_blank">Origin</a> | <a href="https://awakari.com/sub-details.html?id=Grand-Theft-Auto" rel="nofollow noopener" target="_blank">Interest</a> | <a href="https://awakari.com/pub-msg.html?id=VwntBMqQ4E3HJvk7YaW01P3dmfw&interestId=Grand-Theft-Auto" rel="nofollow noopener" target="_blank">Match</a>

Steve Faulknera label and a name walk into a bar"When is a label also an (accessible) name, when is it not and when is it neither?"<a href="https://mastodon.social/tags/HTML" class="mention hashtag" rel="nofollow noopener" target="_blank">#HTML</a> <a href="https://mastodon.social/tags/ARIA" class="mention hashtag" rel="nofollow noopener" target="_blank">#ARIA</a> <a href="https://mastodon.social/tags/accessibility" class="mention hashtag" rel="nofollow noopener" target="_blank">#accessibility</a> <a href="https://html5accessibility.com/stuff/2025/07/14/a-label-and-a-name-walk-into-a-bar/" rel="nofollow noopener" translate="no" target="_blank">https://html5accessibility.com/stuff/2025/07/14/a-label-and-a-name-walk-into-a-bar/</a>

CSS by T. Afif :verified:💡 CSS Tip!Using modern CSS features such as sibling-index() and if(), you can re-create the :nth-child(An + B) selector.<a href="https://css-tip.com/nth-child/" rel="nofollow noopener" translate="no" target="_blank">https://css-tip.com/nth-child/</a>Why? To easily update A and B since now they are variables! I know some of you are in the team: "How to update the values of nth-child() with CSS ?!"<a href="https://front-end.social/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#CSS</a> <a href="https://front-end.social/tags/HTML" class="mention hashtag" rel="nofollow noopener" target="_blank">#HTML</a>

Alvaro MontoroNew comiCSS cartoon: Levels of WCAG Conformance <a href="https://comicss.art/comics/197/" rel="nofollow noopener" translate="no" target="_blank">https://comicss.art/comics/197/</a><a href="https://front-end.social/tags/css" class="mention hashtag" rel="nofollow noopener" target="_blank">#css</a> <a href="https://front-end.social/tags/html" class="mention hashtag" rel="nofollow noopener" target="_blank">#html</a> <a href="https://front-end.social/tags/cartoon" class="mention hashtag" rel="nofollow noopener" target="_blank">#cartoon</a> <a href="https://front-end.social/tags/wcag" class="mention hashtag" rel="nofollow noopener" target="_blank">#wcag</a> <a href="https://front-end.social/tags/a11y" class="mention hashtag" rel="nofollow noopener" target="_blank">#a11y</a>

Inautilo<a href="https://mastodon.social/tags/Development" class="mention hashtag" rel="nofollow noopener" target="_blank">#Development</a> <a href="https://mastodon.social/tags/Debates" class="mention hashtag" rel="nofollow noopener" target="_blank">#Debates</a> Is Tailwind CSS worth it? · “Tailwind is the worst form of CSS, except for all the others.” <a href="https://ilo.im/165a6s" rel="nofollow noopener" translate="no" target="_blank">https://ilo.im/165a6s</a>_____ <a href="https://mastodon.social/tags/TailwindCSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#TailwindCSS</a> <a href="https://mastodon.social/tags/UtilityClasses" class="mention hashtag" rel="nofollow noopener" target="_blank">#UtilityClasses</a> <a href="https://mastodon.social/tags/WebDev" class="mention hashtag" rel="nofollow noopener" target="_blank">#WebDev</a> <a href="https://mastodon.social/tags/Frontend" class="mention hashtag" rel="nofollow noopener" target="_blank">#Frontend</a> <a href="https://mastodon.social/tags/HTML" class="mention hashtag" rel="nofollow noopener" target="_blank">#HTML</a> <a href="https://mastodon.social/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#CSS</a>

DailyHTML<body> Represents the content of an HTML document. There can be only one such element in a document.<a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/body" rel="nofollow noopener" translate="no" target="_blank">https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/body</a><a href="https://mastodon.social/tags/HTML" class="mention hashtag" rel="nofollow noopener" target="_blank">#HTML</a> <a href="https://mastodon.social/tags/WebDev" class="mention hashtag" rel="nofollow noopener" target="_blank">#WebDev</a> <a href="https://mastodon.social/tags/DailyHTML" class="mention hashtag" rel="nofollow noopener" target="_blank">#DailyHTML</a>

Gurpreet SinghI would love to share with my another open source contribution to the officially listed <a href="https://fosstodon.org/tags/11ty" class="mention hashtag" rel="nofollow noopener" target="_blank">#11ty</a> starter template.Quick Demo: <a href="https://11ty-innovative-intro.netlify.app/" rel="nofollow noopener" translate="no" target="_blank">https://11ty-innovative-intro.netlify.app/</a>Source Code: <a href="https://github.com/learnwithgurpreet/11ty-innovative-intro" rel="nofollow noopener" translate="no" target="_blank">https://github.com/learnwithgurpreet/11ty-innovative-intro</a><a href="https://fosstodon.org/tags/HTML" class="mention hashtag" rel="nofollow noopener" target="_blank">#HTML</a> <a href="https://fosstodon.org/tags/CSS" class="mention hashtag" rel="nofollow noopener" target="_blank">#CSS</a> <a href="https://fosstodon.org/tags/Developer" class="mention hashtag" rel="nofollow noopener" target="_blank">#Developer</a> <a href="https://fosstodon.org/tags/OpenSource" class="mention hashtag" rel="nofollow noopener" target="_blank">#OpenSource</a> <a href="https://fosstodon.org/tags/StaticSiteGeneration" class="mention hashtag" rel="nofollow noopener" target="_blank">#StaticSiteGeneration</a>

G. Ken HolmanIntroducing <PubNote>: open-source XML tools for biomedical research metadata for OLSPub and PubMedToday I'm announcing version 1.0.0 of <PubNote>, a suite of open-source XML tools for biomedical research metadata exposition to support publishers and researchers using XML files with OLSPub from <a href="https://mastodon.social/@ZBMED" class="u-url mention" rel="nofollow noopener" target="_blank">@ZBMED</a> and the US-based PubMed.<a href="https://bit.ly/ro-pubnote" rel="nofollow noopener" translate="no" target="_blank">https://bit.ly/ro-pubnote</a> <a href="https://mastodon.cranesoftwrights.com/tags/olspub" class="mention hashtag" rel="nofollow noopener" target="_blank">#olspub</a> <a href="https://mastodon.cranesoftwrights.com/tags/pubmed" class="mention hashtag" rel="nofollow noopener" target="_blank">#pubmed</a> <a href="https://mastodon.cranesoftwrights.com/tags/biomedicalresearch" class="mention hashtag" rel="nofollow noopener" target="_blank">#biomedicalresearch</a> <a href="https://mastodon.cranesoftwrights.com/tags/lifesciences" class="mention hashtag" rel="nofollow noopener" target="_blank">#lifesciences</a> <a href="https://mastodon.cranesoftwrights.com/tags/openscience" class="mention hashtag" rel="nofollow noopener" target="_blank">#openscience</a> <a href="https://mastodon.cranesoftwrights.com/tags/scientificpublishing" class="mention hashtag" rel="nofollow noopener" target="_blank">#scientificpublishing</a> <a href="https://mastodon.cranesoftwrights.com/tags/xml" class="mention hashtag" rel="nofollow noopener" target="_blank">#xml</a> <a href="https://mastodon.cranesoftwrights.com/tags/pdf" class="mention hashtag" rel="nofollow noopener" target="_blank">#pdf</a> <a href="https://mastodon.cranesoftwrights.com/tags/html" class="mention hashtag" rel="nofollow noopener" target="_blank">#html</a> <a href="https://mastodon.cranesoftwrights.com/tags/docx" class="mention hashtag" rel="nofollow noopener" target="_blank">#docx</a> <a href="https://mastodon.cranesoftwrights.com/tags/jats" class="mention hashtag" rel="nofollow noopener" target="_blank">#jats</a> <a href="https://mastodon.cranesoftwrights.com/tags/openstandards" class="mention hashtag" rel="nofollow noopener" target="_blank">#openstandards</a> <a href="https://mastodon.cranesoftwrights.com/tags/opensource" class="mention hashtag" rel="nofollow noopener" target="_blank">#opensource</a>

sb arms & legsIs there such a thing as a <a href="https://metroholografix.ca/tags/WYSIWYG" class="mention hashtag" rel="nofollow noopener" target="_blank">#WYSIWYG</a> <a href="https://metroholografix.ca/tags/html" class="mention hashtag" rel="nofollow noopener" target="_blank">#html</a> editor? Is <a href="https://metroholografix.ca/tags/seamonkey" class="mention hashtag" rel="nofollow noopener" target="_blank">#seamonkey</a> still a thing?

FirefoxThoughts on close requests for dialogs (#blogPost) Manuel published "Close requests, close watchers, and the dialog element" . I learned some things, have some questions and needed to struc... <a rel="nofollow noopener" class="mention hashtag" href="https://mastodon.social/tags/blogPost" target="_blank">#blogPost</a> <a rel="nofollow noopener" class="mention hashtag" href="https://mastodon.social/tags/HTML" target="_blank">#HTML</a> <a href="https://www.stefanjudis.com/blog/risky-mobile-close-requests/" rel="nofollow noopener" target="_blank">Origin</a> | <a href="https://awakari.com/sub-details.html?id=Firefox" rel="nofollow noopener" target="_blank">Interest</a> | <a href="https://awakari.com/pub-msg.html?id=Vpjia80mA570extlrT9ZVaG2xQO&interestId=Firefox" rel="nofollow noopener" target="_blank">Match</a>

Adrian RoselliTwo years ago I took 7 `<blockquote>` variations (W3C & WHATWG HTML) and reported their output across 7 screen readers, for a measly 49 variations: <a href="https://adrianroselli.com/2023/07/blockquotes-in-screen-readers.html" rel="nofollow noopener" translate="no" target="_blank">https://adrianroselli.com/2023/07/blockquotes-in-screen-readers.html</a>I made one anti-recommendation (and fixed MDN’s). I also explained the pattern I use.<a href="https://toot.cafe/tags/accessibility" class="mention hashtag" rel="nofollow noopener" target="_blank">#accessibility</a> <a href="https://toot.cafe/tags/a11y" class="mention hashtag" rel="nofollow noopener" target="_blank">#a11y</a> <a href="https://toot.cafe/tags/HTML" class="mention hashtag" rel="nofollow noopener" target="_blank">#HTML</a>

FirefoxThoughts on close requests for dialogs (#blogPost) Manuel published "Close requests, close watchers, and the dialog element" . I learned some things, have some questions and needed to struc... <a rel="nofollow noopener" class="mention hashtag" href="https://mastodon.social/tags/blogPost" target="_blank">#blogPost</a> <a rel="nofollow noopener" class="mention hashtag" href="https://mastodon.social/tags/HTML" target="_blank">#HTML</a> <a href="https://www.stefanjudis.com/blog/risky-mobile-close-requests/" rel="nofollow noopener" target="_blank">Origin</a> | <a href="https://awakari.com/sub-details.html?id=Firefox" rel="nofollow noopener" target="_blank">Interest</a> | <a href="https://awakari.com/pub-msg.html?id=AKpsvr02ixFu57AHMiCUAW1xlEe&interestId=Firefox" rel="nofollow noopener" target="_blank">Match</a>

Programming N' Language⚠️🚫Google Search Console flagged a critical issue: "duplicate url" blocking pnl.dev from indexing. Turns out the culprit is a tiny itemprop="url", which is used for SEO metadata, but misusing it can confuse crawlers 🕷️📉. >ref: <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Guides/Microdata" rel="nofollow noopener" translate="no" target="_blank">https://developer.mozilla.org/en-US/docs/Web/HTML/Guides/Microdata</a> <a href="https://techhub.social/tags/SEO" class="mention hashtag" rel="nofollow noopener" target="_blank">#SEO</a> <a href="https://techhub.social/tags/WebDev" class="mention hashtag" rel="nofollow noopener" target="_blank">#WebDev</a> <a href="https://techhub.social/tags/HTML" class="mention hashtag" rel="nofollow noopener" target="_blank">#HTML</a> <a href="https://techhub.social/tags/TechTips" class="mention hashtag" rel="nofollow noopener" target="_blank">#TechTips</a> <a href="https://techhub.social/tags/devlog" class="mention hashtag" rel="nofollow noopener" target="_blank">#devlog</a>

Recent searches

Search options

Administered by:

Server stats:

#html