Manuel Matuzović

frontend developer and consultant
HTML, CSS, accessibility
big fan of <button>s
creator of HTMHell

Public Key

npub1u8999w8pzdt23c237jmerlxsgd7g39qt4jt5d85jtrch56vqp3tsud06cd

NIP-05 Address

matuzo_at_front-end.social@mostr.pub

Profile Code

nprofile1qqswrjjjhrs3x44gu9glfdu3lngyxlygjs96e96xn6f93ut6dxqqc4cpz4mhxue69uhhyetvv9ujumt0wd68ytnsw43qz9thwden5te0v35hgar09ec82c30wfjkccte9rlxfq

Publishing to

relay.mostr.pub

ditto.pub/relay

relay.noswhere.com

Author Public Key

npub1u8999w8pzdt23c237jmerlxsgd7g39qt4jt5d85jtrch56vqp3tsud06cd

Show more details

Last Notes

2024-10-02 10:22:26

I'm about to finish an audit of 42 webcomponents. The devs did a great job because pretty much none of them had detectable issues in axe. Still, only 8 of these 42 components have no critical issues. I only discovered those bugs through manual testing.
Long story short: automatic accessibility testing is only the first step. Manual testing is a must. Also, hire an accessibility expert if possible.

2024-09-25 05:52:13

Attention! Attention! The 2024 HTMHell advent calendar call for papers is here! If you want to contribute to this year's calendar, submit your ideas by October 9th.
This year differs from last year: Instead of a full-length article, I'd love to see your favorite code snippet in HTML and a few words explaining what you like about it and how it benefits users.
https://htmhell.dev/adventcalendar/
Submission form: https://docs.google.com/forms/d/e/1FAIpQLSc60hfylY8cS1Z06R-7fU0qksf_yz0NEvqLQdTPaEtqP3kH2w/viewform?usp=sf_link

2024-09-20 08:42:56

Let's see how long it takes until this thing collects dust. 😁
Thanks to everyone who recommended note books! ❤️
https://cdn.masto.host/frontendsocial/media_attachments/files/113/168/986/219/795/477/original/5b2f522e09787556.jpg

2024-09-10 08:39:50

I can't believe there are still two early bird tickets left for my accessibility testing workshop in two weeks. 😲
Join us and learn how to test your websites and improve their accessibility
https://smashingconf.com/online-workshops/workshops/accessibility-testing-manuel-matuzovic/

2024-09-06 14:42:13

I still like my current process for writing talks. I start with a title and a rough idea. Then I freestyle the talk in my head without knowing where the story goes. I usually do this over and over again on my commute weeks or months before I give the talk. Once I'm happy with it, I create a written outline and practice the talk. Finally, I create the slides.
That works really well if you don't have a lot of time to prepare.

2024-09-04 11:37:09

There are only 4 early bird tickets left for my smashing accessibility testing workshop in September! 😻
Join us for 5 fun, interesting, and practical sessions!
https://smashingconf.com/online-workshops/workshops/accessibility-testing-manuel-matuzovic/

2024-08-30 08:19:49

I'm super happy with my current job but part of me wants to know how far I would get here.
https://jobs.apple.com/en-us/details/200565512/web-technologies-evangelist-safari-webkit

2024-08-01 06:02:27

Ich hatte gestern ein bisserl Zeit und hab mir gedacht, dass ich mich mal an Reaction-Videos versuche. Konkret reagiere ich auf die Barrierefreiheit von Websites.
In diesem ersten Video habe ich mir gruene.at angesehen.
https://www.youtube.com/watch?v=X1-dDbgQP5E

2024-07-24 06:13:45

The Web Accessibility Cookbook is now officially released and the dates are finally correct on Amazon. It should be available everywhere now! 🎉
If you buy it on Amazon, bol, etc. and you also like the book, please leave a comment and rating. If you don't like the book, please don't. 😁
https://accessibility-cookbook.com/

2024-07-19 06:00:33

Day 107: the light-dark() color function
The `light-dark()` color function allows you to define two values for a color property. The property uses the first value when the color scheme is light or unknown and the second when it's dark.
#100DaysOfMoreOrLessModernCSS
https://matuzo.at/blog/2024/100daysof-day107

2024-07-18 16:55:02

The first couple of months it was okay but now that the babies are almost eight months old and they're sleeping less and moving more, shit's starting to get real. Ever tried feeding two babies baby food simultaneously while a three-year-old is making sure that the background noise is as loud as possible? 😅 Also, I'm reminded every day that I'm closer to 40 than to 30. 😁
PS: Of course I absolutely adore all three of them and I wouldn't want to have it any other way. ❤️

2024-07-17 17:43:02

I don't understand how Harry Mack is able to get better and better with his freestyles. He's spitting incredible bars off the top of the dome while I can barely articulate myself. He's so amazing that I've never skipped a single video.
https://youtu.be/T9HOBSrcXC0?si=5PWuI_2iwjkQrDAW

2024-07-15 13:57:52

After 15 months of work I'm finally holding my first book in my hands. 😍
Learn about it here: https://accessibility-cookbook.com/
https://cdn.masto.host/frontendsocial/media_attachments/files/112/790/831/394/995/601/original/9746b9364d7a1fa1.jpg

2024-07-15 13:28:24

- reply

@npub1zyl…t54n oh, I didn't even notice because in Europe that's normal. We stick flowers in every package we send.

2024-07-15 13:06:20

Omg finally! 😍
I'll post a video and blog post later this week!
https://cdn.masto.host/frontendsocial/media_attachments/files/112/790/641/072/924/237/original/ea3354e801dc75c3.jpg

2024-07-15 11:22:52

Do your users a favour and make your checkboxes look like checkboxes and your radio buttons like radio buttons.

2024-07-08 18:28:53

I was invited to give a keynote talk at a conference and I'm trying to come up with a title for the talk. They idea is to bring attendees closer to accessibility and explain why every site must be accessible.
I just remembered that some time ago someone tried to convince me of the opposite and they said “Why would a blind person want to buy a bike online?". I was thinking about using that as the title and the story as an opener.
What do you think? Is the title too provocative or offensive?

2024-07-04 15:27:56

I love Bosnian breakfasts. ❤️
https://cdn.masto.host/frontendsocial/media_attachments/files/112/728/459/503/582/572/original/aa282fb6dd2c9dba.jpg

2024-06-17 21:17:46

- reply

@npub1xed…yg9w yeah, my back was itching when I took the photo.

2024-06-17 14:12:00

Greetings from Trieste! 🦞
https://cdn.masto.host/frontendsocial/media_attachments/files/112/632/356/786/082/891/original/7fd9551474861cfb.jpg

2024-06-14 19:07:05

OMG 😬😱🥳
https://cdn.masto.host/frontendsocial/media_attachments/files/112/616/535/129/884/394/original/ec89a7a48587e69e.png

2024-06-09 21:31:29

🤮 #FCKFPÖ

2024-05-31 05:03:21

I just backed @npub1rx8…jqx4's Eventably, an events management and ticketing platform built with accessibility in mind from the start. Check it out!
https://igg.me/at/eventably/x/37340551

2024-05-30 15:08:56

- reply

@npub1zyl…t54n oh I loved that show as a kid.

2024-05-30 14:00:35

I was surprised to learn that Robert Pattinson played Batman.
Which actor comes to your mind first when you hear “Batman”? For me it's Christian Bale. Before him probably George Clooney...lol just kidding. Michael Keaton, I guess.

2024-05-30 08:55:57

If you want to use json5 in @npub1z9m…rz2z, you can add support using `addDataExtension()`.
```
const json5 = require("json5");
module.exports = function(eleventyConfig) {
eleventyConfig.addDataExtension("json5", contents => json5.parse(contents));
…
}
```

2024-05-30 07:58:38

Just a quick reminder that there's a scripting media feature.
```
@media (scripting: enabled) {
/* js is enabled */
}
@media (scripting: none) {
/* js isn't enabled */
}
````
https://matuzo.at/blog/2023/100daysof-day106

2024-05-24 08:42:46

I've decided to update my monthly contributions to @npub1z9m…rz2z, now supporting them with $50 instead of $5 monthly. ❤️
If you can, support them, too! They need your help.
https://www.zachleat.com/web/independent-sustainable-11ty/

2024-05-24 08:25:14

I made a little website for my book. Before I publish it, is there any feedback you have? Does it answer all your questions? Are there bugs? Is anything missing? Thank you! ❤️
https://accessibility-cookbook.com/

2024-05-14 05:07:00

I know it's May, but I'll send out the CFP for the HTMHell advent calendar 2024 in a couple of weeks. You can start to think about topics now, if you want to participate. 😊
Also, now is a good time to propose topics, even if you don't want to write yourself. What's something about HTML you'd love to learn?
Here's last year's calendar:
https://www.htmhell.dev/adventcalendar/

2024-05-07 05:23:43

It's 7AM and I've already confused margin-block-end with margin-inline-end.

2024-04-26 06:26:36

In September 2022 I published the first of 100 #100DaysOfMoreOrLessModernCSS posts because I saw the need to catch up with recent developments in CSS. More that 1,5 years and 106 blog posts later I almost feel the same as in 2022. I've got a whole lotta catching up to do.

2024-04-25 19:57:24

“Forms are accessible by default and should be used over div’s at all times. It announces to a screen reader that the element is a form.”
I swear if the keep publishing blog posts like these I'll start my own front-end community website just to prove that it can be done better.

2024-04-24 07:20:20

I've been building websites with @npub1z9m…rz2z for almost 8 years now and it has never disappointed me. It's such a fantastic tool for building fast and accessible websites efficiently.

2024-04-23 19:41:00

Tomorrow we celebrate JS Naked Day!
https://js-naked-day.org/

2024-04-16 06:31:45

Photos usually sends me photo memories of my family, friends,...and @npub1xed…yg9w. 😁
https://cdn.masto.host/frontendsocial/media_attachments/files/112/279/482/375/085/829/original/5aeb0f326663f3f2.png

2024-04-15 13:49:58

I'd love to give every “social media expert” who told local businesses 10-15 years ago that they don't need a website because “_everyone_ is on Facebook and Facebook is going nowhere” a long and hard wedgie.

2024-04-10 06:29:11

If a website offers a machine readable version of its pages, what would you expect to get? JSON, JSON-LD, something else?
The idea is you have something like /events/my-event that gives you HTML, but you could get the raw data by accessing /events/my-event.json.

2024-04-07 10:24:57

_Someone_ left this here...strange!
https://cdn.masto.host/frontendsocial/media_attachments/files/112/229/445/190/703/764/original/fe76cce3a87b7d02.jpg

2024-03-30 11:50:51

- reply

@npub1zyl…t54n it has! They even replied.

2024-03-30 10:53:00

If, after one year of silence, that's the direction their heading, then we don't need anyone to save the sinking ship. We need other ships!

2024-03-26 19:33:58

caniemail: caniuse but for email!
By @npub1ttj…4lnx
https://www.caniemail.com

2024-03-26 07:31:41

WOW! The first article on CSS Tricks in almost a year and it's ridiculously bad.
I don't care who they hire and how much money they throw at them, that's it for me with CSS-Tricks. Thanks for nothing Digital Ocean.
https://css-tricks.com/accessible-forms-with-pseudo-classes/

2024-03-23 18:05:50

- reply

@npub1xed…yg9w what are these? Pokémon?

2024-03-07 09:49:17

I finally found good use for all the stickers I have. 😁 (That's the fridge in my new office)
https://cdn.masto.host/frontendsocial/media_attachments/files/112/053/767/290/512/175/original/2eba760b8f40bfcf.jpg

2024-03-06 06:05:56

Can you recommend non-technical books about accessibility? Books that focus more on the medical, social, or socioeconomic aspects of accessibility? I'd like to list them in the foreword as alternatives or additions to my book?

2024-03-03 20:12:37

There are two things I will do next weekend: on Saturday I'll party like there ain't no tomorrow because ~30 of our friends (mostly from Vienna) visit us to celebrate our birthdays and I celebrate finishing the book. The other thing I'll do is regret partying like there ain't no tomorrow because 1. I turn 37 and 2. my kids don't care what I did the night before. They expect me awake and up at 6:30. 😁

2024-03-03 18:11:14

Do you use Threads? Does anyone use Threads? At least in Austria it some as if it has absolutely no relevance.

2024-02-26 17:51:50

For the City or Vienna I helped build a tool that takes a PDF and turns it into a website using a node script and @npub1z9m…rz2z. Those sites are HTML-first, use web components, are themeable, and have search built-in.
Would an introduction of the tool make an interesting talk for the 11ty conference?

2024-02-05 18:21:51

I'm taking a break from social media. Please, send me links to your RSS so that I can still read your blog. Thanks!

2024-01-29 10:42:24

CSS Selector Specificity calculator
https://polypane.app/css-specificity-calculator/

2024-01-29 05:32:59

I just read in a blog post that VO on macOS announces nested inline aria-hidden text.
```
<p>
Hello <span aria-hidden="true">World</span>.
</p>
```
I tested it. I can confirm that pressing VO + P, VoiceOver in Safari reads “Hello World”. Only in Safari and only with VO + P. That's a bug, right?
Edit: yes, a bug. https://bugs.webkit.org/show_bug.cgi?id=161740

2024-01-19 07:20:28

My book about accessibility is basically a summary of @npub1zyl…t54n's blog. Y'all need to write more about HTML and accessibility. 😁

2024-01-16 07:07:18

I quickly scanned the currently 314 pages of my book and I can't believe that I wrote all that. Strange feeling.

2024-01-02 12:37:36

How would you explain when it's appropriate to use a `<table>` in a sentence or two without mentioning examples or bad practices?

2023-12-05 20:36:35

I know what's happening here but I also know that I won't know it anymore in two weeks. 😁
min(), max(), minmax() are super useful but my brain just can't handle them easily.
https://cdn.masto.host/frontendsocial/media_attachments/files/111/529/720/470/935/673/original/b390943ff1f51758.png

2023-12-01 19:47:48

Our two beautiful daughters Olivia and Philippa were born today at 12:53 and 12:54. ❤️❤️
We're more than happy and relieved! ❤️

2023-11-29 06:18:04

- reply

@npub13q3…hr6l Got it! Thank you, Lea!

2023-11-29 06:14:55

- reply

@npub13q3…hr6l That's bad news. :( Do you know where I can learn what "clipping" means in that case?

2023-11-29 06:10:37

- reply

@npub13q3…hr6l WTF? I thought the whole reason for oklch/oklab, besides access to a wider gamut, was perceptual uniformity? Just yesterday a told a group of 40 people in a workshop about how great that is compared to HSL and not this? Fuck me..

2023-11-23 12:29:24

- reply

@npub1zyl…t54n Oh yeah! I'm publishing exclusively on Medium!

2023-11-23 06:05:22

- reply

@npub1zyl…t54n So now I know why you're not sharing my blog posts haha

2023-11-22 06:28:26

You would expect that a site named "Understanding Accessibility.” (understandingaccessibility.com) is accessible but nope. Please be careful with the advice on this site. It's not horrible but I would've expected that they at least get the basics right. Also, some of the stuff they write is nonsense.
I'm only posting this because it's being shared in newsletters and reaching many people.

2023-11-15 08:30:34

- reply

@npub16mu…qy4m @npub1xpy…yjva I get why it works the way it works in a @scope rule but not why both h2 and body h2 work inside a @container rule.

2023-11-15 08:12:26

Styles are scoped to the container within a container query, okay. The color of h2s inside .container is red, fine, but why can I use combinators with ancestor elements inside a container query? That doesn't work in a @scope rule. You'd need a :scope between body and h2.
It's a weird mix of conditional styling and scoping. I can't find anything about that in the spec or in blogs.
MMMIIIRRIIIAAAM, HEEEELP!
@npub1xpy…yjva
https://codepen.io/matuzo/pen/bGzoMwX?editors=1100
https://cdn.masto.host/frontendsocial/media_attachments/files/111/413/530/591/880/309/original/5d4e34c60b5ddc3e.png

2023-11-14 10:59:26

This simple demo illustrates the difference between lch and oklch and the bug oklch fixes.
https://codepen.io/matuzo/pen/yLZoZYK?editors=1100
https://cdn.masto.host/frontendsocial/media_attachments/files/111/408/545/275/765/120/original/3a3b83b6d6ef3d6e.png

2023-11-13 19:34:59

What was your favourite conference talk in 2023?

2023-10-31 20:35:29

- reply

@npub13u2…x3ey I'd love to read a spicier version of that just to enrage people. 😁
- Should I use Tailwind for every website I build?
- Is a SSG that ships 85kb of JS by default a shitty product?
- Are people who still believe that MPAs are better than SPAs just afraid of losing their jobs?
- Can you call a website without JS really a website?
- Will Figma replace web developers?
...

2023-09-28 19:17:51

I'm at my first HTML meet-up right now, and I'm enjoying it a lot. Running a HTML only meetup is a great idea because you'll never run out of possible topics and it's certain that there's someone who'll learn something new about HTML no matter how advanced or basic the topic is because HTML pretty fucking extensive and complex.

2023-09-27 10:02:11

I'm impressed!
https://cdn.masto.host/frontendsocial/media_attachments/files/111/136/533/691/611/368/original/85775e6e1b6305f3.png

2023-09-26 17:12:28

I'm at a burger place where all burgers are vegetarian or vegan by default and you can switch to a meat patty for an extra Euro.
It made me just go for the Vegetarian option because I always assume that the standard burger is the best option. Let's see! :)

2023-09-25 16:21:33

Playing with the idea of writing a post along the lines of “web components are for everyone" explaining that web components can be useful for you even if you're building a standard Wordpress or static website, making the case that they're not just for large design systems or sites that run on JS.

2023-09-21 13:37:31

- reply

@npub1xed…yg9w what are you talking about? the three schnitzels button?

2023-09-21 04:51:29

I'm live in 9 minutes. 😱 #id24
https://www.youtube.com/watch?v=ko1WlkT4Phc

2023-09-14 20:22:27

Ooph! @npub13f0…mgjg 🔥
https://cdn.masto.host/frontendsocial/media_attachments/files/111/065/340/397/186/600/original/ab6067f8fc5e18c2.png

2023-09-12 10:26:32

I was supposed to speak in the UK and US but I had to decline because... *drumroll* my partner is pregnant again...with twins! 😍😍
A 2.5 year old and 2 babies. 2024 will be the year I retire from public speaking and blogging hahaha

2023-09-02 18:59:12

I'm in a pretty fancy hotel in Italy and it just makes sense that there's a tiny mirror-table in our room.
https://cdn.masto.host/frontendsocial/media_attachments/files/110/997/084/223/576/696/original/c9f3d52a41f6821c.jpeg

2023-08-16 05:50:22

Instead of my daughter's name, I'll get this sentence from the HTML spec tattooed on my forearm:
“Authors are strongly encouraged to view the div element as an element of last resort, for when no other element is suitable. Use of more appropriate elements instead of the div element leads to better accessibility for readers and easier maintainability for authors.”

2023-07-17 07:32:59

Here’s a job interview question for you: When you click a button and call the showModal() method to open a modal <dialog>, where does the focus go by default, and how can you move it elsewhere?
Can you imagine a job interviewer caring about accessibility and HTML? Me neither, but the question is interesting nevertheless. I didn't know the answer, so I tested it.
https://www.matuzo.at/blog/2023/focus-dialog/

2023-07-12 15:59:18

Hypothetically speaking, let's say you're organising a web dev conference with a strong focus on design and front-end next year in May or September in Vienna, who would you invite to speak at the event? 😁

2023-07-11 16:53:57

Whoever invented Bluetooth can fuck off together with whoever invented Bluetooth earphones. I hate this expensive piece of crap. Give me my cables back! 😭

2023-07-10 18:15:14

Hello, my dear friends of high-quality markup!
Last year we launched the HTMHell Advent Calendar, and it was a great success. You wrote fantastic articles about security, accessibility, UX, and performance. This year we want to do it again and you can contribute one of these 24 articles. Please submit your name, e-mail address, working title of the blog post, and a short description by August 24th!
I'm looking forward to your submissions!
https://docs.google.com/forms/d/e/1FAIpQLSd1TaQ22c1dwXsLIvD9NhaWkbO26ay4rK4pm2HB5pSN92gOmQ/viewform?usp=sf_link

2023-07-07 05:04:40

Here's what I'll do today and it would be great if you would join me.
On the website you're working on today, find a stylesheet and add the following rule.
```
*, *:hover {
cursor: none !important;
}
```
That forces you to use the keyboard. If you find something that makes it hard or impossible to do using the keyboard, fix it! Not just for yourself but for everyone relying on keyboard accessibility.
Edit: fixed code formatting

2023-07-03 08:37:34

This week I'll send out the call for papers for the 2023 HTMHell advent calendar. I thought it might be a good idea to add a list with possible topics as an inspiration because many people want to contribute but don't know what they should write about.
Here's where you can help: What's something you always wanted to learn about HTML, ARIA, HTML security or SEO? What would you want to read?
For example:
- the difference between "search" and "text" inputs
- An introduction to the dialog element

2023-07-03 07:13:28

Modern Font Stacks
The fastest fonts available. No downloading, no layout shifts, no flashes — just instant renders.
https://modernfontstacks.com/

2023-07-03 06:43:19

Is there any good reason why you would avoid using input type="search"? I remember (probably a long time ago) you couldn't overwrite the default styles in Safari but that's not the case anymore.

2023-06-29 06:55:03

TPGi and WAI use “breadcrumb" as the accessible name of their breadcrumb navigation. Is that a great choice? Like, do native English speakers really understand what a breadcrumb navigation is? I can imagine that „Brotkrümelnavigation” would be very confusing to German speaking users.
Examples:
https://www.tpgi.com/assume-the-position-a-labelling-story/
https://www.w3.org/WAI/tutorials/

2023-06-29 04:52:16

Shout-out to border-style: double, another unsung hero in CSS.
https://codepen.io/matuzo/pen/bGQqQgq

2023-06-28 09:22:39

Kinda a niche topic, but I tested how well browsers and screen readers support the form and search landmark roles.
Here are my results:
https://www.matuzo.at/blog/2023/form-and-search-landmark/

2023-06-26 14:25:03

If you ever need a good example for prefers-reduced-motion in action, check out the Enhance home page. They do it really well!
https://enhance.dev/

2023-06-13 13:16:07

I know you don't wanna hear that in June, but I'll open the call for papers for the 2023 HTMHell advent calendar soon!
If you want to contribute by writing an article about performance, security, usability, accessibility, or SEO in HTML, you can start thinking about possible topics now. :)

2023-06-11 19:15:36

I just came home after three beautiful days in Amsterdam, where I gave a talk at the @npub1hw3…utrr conference. I’ve watched many inspirational and engaging presentations and had many interesting conversations. My biggest takeaway: The CSS community needs you! #cssday
https://www.matuzo.at/blog/2023/css-css-css/

2023-06-09 05:07:51

@npub16ce…rq62 yesterday said that there aren't enough events focusing on CSS and that we should organise more CSS meetups and conferences. That stuck with me because she's absolutely right. Same for HTML. #cssday

2023-06-08 10:17:23

@npub1vvt…hntm is such a fantastic speaker! Her talk about CSS Speech is also super interesting; Check it out if you can! #cssday
https://cdn.masto.host/frontendsocial/media_attachments/files/110/508/074/816/868/881/original/638ef581715945bd.jpeg

2023-05-29 07:14:09

The other day I learned that forbidden characters in file names mess with git repos on Windows.
https://www.matuzo.at/blog/2023/deleted-files-clone/

2023-05-14 09:20:28

“Eliel Saarinen said:
‘Always design a thing by considering it in its next larger context; a chair in a room, a room in a house, a house in an environment, an environment in a city plan.’
I think the same could apply to making the case for web performance. Don’t stop at the obvious benefits. Go wider. Show the big-picture implications.”
- @npub1gf2…u0nm
https://adactio.com/journal/20154

2023-05-12 06:27:02

I want to setup a personal blog, I don't care about the stack. I just want to blog and enable people to comment. Setup shouldn't take more than 10 minutes. Is wordpress still the best option?

2023-04-24 18:01:10

Firefox 112 supports inert! 🔥
https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/112

2023-04-24 08:54:32

Read-only web apps by #[0]
https://adactio.com/journal/20113

2023-04-17 11:50:34

Love the design of the Creative South '23 website! 😍
https://www.creativesouth.com/