Reading List

The most recent articles from a list of feeds I subscribe to.

Introducing: an Eleventy starter project for WCAG reports

When I audit websites for accessibility, I write Markdown files that Eleventy turns into reports. Today, I’ve shared the code I use for that. In this post I’ll provide some context.

At eleventy-wcag-reporter, I have published my Eleventy starter for reports about conformance to the Web Content Accessibility Guidelines (WCAG). It is issue oriented, promotes rich text, comes with a PDF export script and supports two languages (English and Dutch).

Example report shows an issue with code example, a listing of wcag criterion, severity and difficulty and what the sample is There is an example report available.

Note: this is just one specific way to create accessibility conformance reports. This works for me and my clients. Other approaches and requirements exists, and I can’t guarantee this works for you.

Issue-oriented reporting

WCAG conformance reports document whether a website meets the criteria in the WCAG standard. It will tell the reader which Success Criteria met the standard, which did not.

Many WCAG conformance reports list WCAG in its entirety and then specify the result for each. Say, a website is tested for WCAG 2.1, Level AA and 10 problems are found. The report will show all 50 Success Criteria (SCs): 10 say “Failed”, 40 “Passed” (or something else, like “Cannot Tell”). The accessibility problems are metadata of the success criteria, so to say.

Screen3 In this Eleventy project, you’ll create one file for each issue

In my personal experience, teams that commission a report are mostly interested in the actual accessibility problems. They want to know “what needs fixing”. They may also want to know: how severe are the issues in comparison, which expertise can solve it (design? development?) and which assistive technology is affected. And, where relevant, what the issue or solution looks like in code. This is why I provide clients with an issue-oriented report: a list of issues, rather than a list of SCs. The Success Criterion is added as metadata of the issue, rather than the other way around.

A benefit of the issue-oriented approach, is that it can integrate better with a team’s workflow. Issue trackers are more common in workflows than SC-trackers. It also, as mentioned, makes it easier to include other meta data like responsibility and severity, and to include code examples and screenshots.

WCAG-EM, the standard methodology for accessibility conformance reporting, does not specify either of the two approaches. What is important for a conformance report is that all Success Criteria were evaluated, and that this fact is made clear. You want to be sure that “no issue filed for an SC” really means the sample did not contain any issues for that SC.

In other words: the report is only done when you’ve checked all sample pages for all WCAG Success Criteria in your scope (i.e. all 50 criteria for WCAG 2.1, Level A + AA). Always test them all. If your report follows the SC-based approach this is explicit, in the issue-based approach it is implicit.

The power of Markdown and YAML

One of the benefits of using Eleventy for my reports, is that it makes it easy to write rich text. That may sound like a no-brainer, but in many reporting tools I’ve seen, issues are described in plain text. The main reason I want to use rich text to describe issues, is that they can make tips more clear. Lists, links, images, code examples and even text level stuff like bold and italics can make a report more readable. This is important, because it increases the chance the team can fix the issues found.

Markdown is my favourite syntactic sugar for rich text, so that’s what I use, but you can use whatever else. HTML should work, too.

For each issue that is described, there is also a set of meta data, like which Success Criterion it relates to. It is described in Yaml front matter, so at the top of an issue.md, you would add something like:

---
sc: 2.1.1
severity: High
difficulty: High
title: Main menu does not work with keyboard
sample: homepage
---

Spelling out the meta data in front matter makes it powerful. We can do things like add up the issues filed for a specific page, or count how many were filed for a given Success Criterion.

Some essential metadata in WCAG conformance reports

Pointing out accessibility problems and solutions is the bread and butter of my conformance reports, as my goal is usually to help the team fix all issues. But accessibility reports are used in various contexts. There is some important metadata that helps someone looking at the report what’s going on, including monitoring bodies like governments. They may require publication of accessibility conformance reports to help them perform their regulatory duties, good metadata aids this monitoring.

Logius, the Dutch government department that keeps track of WCAG conformance reports that Dutch governmental organisations provide, uses a checklist to verify if conformance reports meet their requirements:

  • is the methodology (eg WCAG-EM) mentioned?
  • is the scope mentioned (domain and/or sub domains that are in scope, and those outside scope)
  • does the report declare that all 50 Success Criteria in WCAG 2.1, Level A + AA were evaluated?
  • is the level of accessibility support described (for instance: “the website can be used by all common browsers and assistive technologies“)?
  • is there a list of technologies used (eg HTML, CSS, SVG, etc)
  • is there a list of pages that were included in the evaluated sample?
  • is the person or company that did the evaluation listed?
  • are browsers and other software, including versions, listed?
  • is it dated?
  • are the results published in a human-readable or machine-readable format (EARL)?

The above is my translation of the checklist on the Controle door Logius page; many of these are also recommended in WCAG-EM; the requirements likely vary where you or your client are based.

The eleventy-wcag-reporter starter project has variables for each of these checkpoints. A lot of the meta data is added to the report’s index.njk as YAML front matter, so that it can be displayed.

FAQ

After reading this, you may have questions before trying to use the code. The questions below weren’t actually asked frequently, but I hope they have useful answers.

Will this find accessibility issues?
No, you find issues, create a Markdown file for each and then add some frontmatter. The code will then include it in a pretty report. Or really, a report that you can make pretty.
Why not integrate with automated tooling?
There are tools that can find issues, for ~20% of WCAG criteria (other estimates exist). You can use those tools to find issues and add them manually. It is usually easier for a human to group issues in a way that is most useful to readers of the report. For instance, if a brand’s primary colour contrasts badly with a white background, you may not need to file that more than once.
Can more languages be supported?
Yes, feel free to contribute. We need all of WCAG in JSON format (I have code to scrape) and translations for strings.
How many issues should I add to a report?
There is no minimum or maximum, but you should check all pages in your sample for all Success Criteria in your scope, and have issues for all situations where a SC is not met, in order to create a full report.
What about PDFs?
I like HTML as a report format. Some organisations prefer to receive a PDF document. Like web pages, PDFs also need to be accessible, and simply pressing “Save as PDF“ in a browser will be unlikely to include all semantics. So I use PrinceXML, which supports a lot of print CSS. There are licenses for a machine or server, or you can use the SaaS version DocRaptor. The starter project has a Shell script to generate a PDF with PrinceXML, you will need a license or end up with a watermark in your resulting PDF.

Wrapping up

So, find my starter project at eleventy-wcag-reporter, please don’t laugh at my code. Feedback is very much welcomed by email, DMs or in GitHub. I may not be able to get back very quickly, as the open version of this is a side project. Happy accessbility conformance report writing!

Thanks to Roel, Peter, Rian, Jeroen and many others for discussions, ideas and suggestions related to accessibility conformance reports. (Thanks do not imply endorsements)


The post Introducing: an Eleventy starter project for WCAG reports was first posted on hiddedevries.nl blog | Reply via email

Introducing: an Eleventy starter project for WCAG reports

When I audit websites for accessibility, I write Markdown files that Eleventy turns into reports. Today, I’ve shared the code I use for that. In this post I’ll provide some context.

At eleventy-wcag-reporter, I have published my Eleventy starter for reports about conformance to the Web Content Accessibility Guidelines (WCAG). It is issue oriented, promotes rich text, comes with a PDF export script and supports two languages (English and Dutch).

Example report shows an issue with code example, a listing of wcag criterion, severity and difficulty and what the sample is There is an example report available.

Note: this is just one specific way to create accessibility conformance reports. This works for me and my clients. Other approaches and requirements exists, and I can’t guarantee this works for you.

Issue-oriented reporting

WCAG conformance reports document whether a website meets the criteria in the WCAG standard. It will tell the reader which Success Criteria met the standard, which did not.

Many WCAG conformance reports list WCAG in its entirety and then specify the result for each. Say, a website is tested for WCAG 2.1, Level AA and 10 problems are found. The report will show all 50 Success Criteria (SCs): 10 say “Failed”, 40 “Passed” (or something else, like “Cannot Tell”). The accessibility problems are metadata of the success criteria, so to say.

Screen3 In this Eleventy project, you’ll create one file for each issue

In my personal experience, teams that commission a report are mostly interested in the actual accessibility problems. They want to know “what needs fixing”. They may also want to know: how severe are the issues in comparison, which expertise can solve it (design? development?) and which assistive technology is affected. And, where relevant, what the issue or solution looks like in code. This is why I provide clients with an issue-oriented report: a list of issues, rather than a list of SCs. The Success Criterion is added as metadata of the issue, rather than the other way around.

A benefit of the issue-oriented approach, is that it can integrate better with a team’s workflow. Issue trackers are more common in workflows than SC-trackers. It also, as mentioned, makes it easier to include other meta data like responsibility and severity, and to include code examples and screenshots.

WCAG-EM, the standard methodology for accessibility conformance reporting, does not specify either of the two approaches. What is important for a conformance report is that all Success Criteria were evaluated, and that this fact is made clear. You want to be sure that “no issue filed for an SC” really means the sample did not contain any issues for that SC.

In other words: the report is only done when you’ve checked all sample pages for all WCAG Success Criteria in your scope (i.e. all 50 criteria for WCAG 2.1, Level A + AA). Always test them all. If your report follows the SC-based approach this is explicit, in the issue-based approach it is implicit.

The power of Markdown and YAML

One of the benefits of using Eleventy for my reports, is that it makes it easy to write rich text. That may sound like a no-brainer, but in many reporting tools I’ve seen, issues are described in plain text. The main reason I want to use rich text to describe issues, is that they can make tips more clear. Lists, links, images, code examples and even text level stuff like bold and italics can make a report more readable. This is important, because it increases the chance the team can fix the issues found.

Markdown is my favourite syntactic sugar for rich text, so that’s what I use, but you can use whatever else. HTML should work, too.

For each issue that is described, there is also a set of meta data, like which Success Criterion it relates to. It is described in Yaml front matter, so at the top of an issue.md, you would add something like:

---
sc: 2.1.1
severity: High
difficulty: High
title: Main menu does not work with keyboard
sample: homepage
---

Spelling out the meta data in front matter makes it powerful. We can do things like add up the issues filed for a specific page, or count how many were filed for a given Success Criterion.

Some essential metadata in WCAG conformance reports

Pointing out accessibility problems and solutions is the bread and butter of my conformance reports, as my goal is usually to help the team fix all issues. But accessibility reports are used in various contexts. There is some important metadata that helps someone looking at the report what’s going on, including monitoring bodies like governments. They may require publication of accessibility conformance reports to help them perform their regulatory duties, good metadata aids this monitoring.

Logius, the Dutch government department that keeps track of WCAG conformance reports that Dutch governmental organisations provide, uses a checklist to verify if conformance reports meet their requirements:

  • is the methodology (eg WCAG-EM) mentioned?
  • is the scope mentioned (domain and/or sub domains that are in scope, and those outside scope)
  • does the report declare that all 50 Success Criteria in WCAG 2.1, Level A + AA were evaluated?
  • is the level of accessibility support described (for instance: “the website can be used by all common browsers and assistive technologies“)?
  • is there a list of technologies used (eg HTML, CSS, SVG, etc)
  • is there a list of pages that were included in the evaluated sample?
  • is the person or company that did the evaluation listed?
  • are browsers and other software, including versions, listed?
  • is it dated?
  • are the results published in a human-readable or machine-readable format (EARL)?

The above is my translation of the checklist on the Controle door Logius page; many of these are also recommended in WCAG-EM; the requirements likely vary where you or your client are based.

The eleventy-wcag-reporter starter project has variables for each of these checkpoints. A lot of the meta data is added to the report’s index.njk as YAML front matter, so that it can be displayed.

FAQ

After reading this, you may have questions before trying to use the code. The questions below weren’t actually asked frequently, but I hope they have useful answers.

Will this find accessibility issues?
No, you find issues, create a Markdown file for each and then add some frontmatter. The code will then include it in a pretty report. Or really, a report that you can make pretty.
Why not integrate with automated tooling?
There are tools that can find issues, for ~20% of WCAG criteria (other estimates exist). You can use those tools to find issues and add them manually. It is usually easier for a human to group issues in a way that is most useful to readers of the report. For instance, if a brand’s primary colour contrasts badly with a white background, you may not need to file that more than once.
Can more languages be supported?
Yes, feel free to contribute. We need all of WCAG in JSON format (I have code to scrape) and translations for strings.
How many issues should I add to a report?
There is no minimum or maximum, but you should check all pages in your sample for all Success Criteria in your scope, and have issues for all situations where a SC is not met, in order to create a full report.
What about PDFs?
I like HTML as a report format. Some organisations prefer to receive a PDF document. Like web pages, PDFs also need to be accessible, and simply pressing “Save as PDF“ in a browser will be unlikely to include all semantics. So I use PrinceXML, which supports a lot of print CSS. There are licenses for a machine or server, or you can use the SaaS version DocRaptor. The starter project has a Shell script to generate a PDF with PrinceXML, you will need a license or end up with a watermark in your resulting PDF.

Wrapping up

So, find my starter project at eleventy-wcag-reporter, please don’t laugh at my code. Feedback is very much welcomed by email, DMs or in GitHub. I may not be able to get back very quickly, as the open version of this is a side project. Happy accessbility conformance report writing!


Originally posted as Introducing: an Eleventy starter project for WCAG reports on Hidde's blog.

Reply via email

150

This blog has now reached the somewhat random milestone of 150 posts. When I asked around what post #150 should be about, the Twitterverse said “blogging”. Well, OK!

Fun fact, this isn’t my first blog: from 2008 to 2014, I had a travel blog, where I tried to write funny posts about my trips abroad for family and friends. This blog is different as I try to, ahem, add “something” to the field of web development, I fact-check, look for previous work to credit and try to keep posts with technical recommendations up to date.

Why personal blogs are great

The fact that so many people publish their thoughts and share knowledge, is something I’ve always loved about the web. Whether it is practical stuff about how to solve a coding issue or some kind of opinion… everyone’s brain is wired differently. It may resonate, it may not, that’s also fine.

People’s blogs are what helped me get started in this industry and get a feeling for the kinds of problems we’re trying to solve. I started doing web development around 2006, and at that time, lots of people blogged. Many of the conversations happened on blogs. Since 2013, this blog is my attempt to join some of the conversations.

Blogging is like “a kind of catharsis”, said Bruce Lawson once in 2005:

In the old days, people used to shout at passers-by in the street; these days, we blog.

(Don’t follow the link and read about his other analogies to blogging)

Writing in public feels great, even if no one reads it, says Sara Soueidan in her post Just write:

Just write.

Even if only one person learns something from your article, you’ll feel great, and that you’ve contributed — even if just a little bit — to this amazing community that we’re all constantly learning from. And if no one reads your article, then that’s also okay.

It is ideal to do this on your own website. Matthias Ott put it beautifully in his post Into the Personal-Website-Verse—personal websites are about expressing and exploring yourself:

Personal websites are called personal websites because they are just that: personal. Thus, the primary objective still is to have a place to express ourselves, to explore ourselves, a place that lasts while the daily storms pass by. A place of consideration, and yes, a place of proudly sharing what we do, what we think, and what we care about. A place to contribute your voice and help others. A home on the internet. A place to tell your story.

This resonates so much.

Why blog

Social media is hard to search

Do you ever think “there was this tweet by X about Y” and attempt to find it? This can be really hard, as new tweets appear all the time in this endless stream of opinions, thoughts, jokes and anger. You may want to go to a person’s profile and look for the tweet, but with the endless loading that breaks CTRL/⌘ + F, I usually wish my past self had saved a direct link.

In contrast, your blog is “a place that lasts”, as Matthias says above. If you take those tweets and put them into context on your blog, that will make the conversation easier to find them later.

Social media is not optimised for organising thoughts

Not only do posts on social media fade away over time, they also have character limits. While you save words, you likely leave out nuance. Threads exist, of course, but on your website, people don’t have to click to try and expand more content. You get all the space you need.

Own your content

When you publish on your site, you own your content in a way not available on any of the centralised platforms, like Twitter or Medium.

Khoi Vinh says about this in an interview:

I personally can’t imagine handing over all of my labor to a centralized platform where it’s chopped up and shuffled together with content from countless other sources, only to be exploited at the current whims of the platform owners’ volatile business models.

Ana Rodrigues lists this and many other advantages of owning your own content in her fantastic post Autonomy online: a case for the IndieWeb, which also contrasts the IndieWeb with the Corporate Web.

What I write about

This blog isn’t particularly structured, but scrolling through the past 149 posts, I did find some common themes. I had forgotten about a lot of the stuff. Warning: there are a lot of links below.

Summaries of events

Sometimes, I write summaries of the conferences I attend, like when I met the TAG, attended ConfConf and joined MozFest. This requires me to hold my phone while listening, frantically taking notes, while being focused on what is being said. After the event, I structure my writings and try to piece together summaries per talk, adding links, sometimes revisiting slide decks if they’re available. This is exhausting, but helps me personally process what I’ve learned. It usually also leaves me with many tabs open and a bunch of self doubt about properly representing the speakers’ points.

Opinions

I’ve also published some ‘hot takes’. The one I’m now most embarrassed by is the clickbaitily titled Bootstrap considered harmful. Let’s say I had not read Eric Meyer’s awesome “Considered Harmful” Essays Considered Harmful yet, and I was younger. I also wrote about Web Components and which kinds we need, overengineering CSS, “your mom” jokes in corporate culture, why Uber’s for everyone isn’t like Timbl’s and why slowness of websites is optional.

Components

In the last 10 years component systems ruled front-end development. Before that, it would not be uncommon to be hired to build some full pages. Those times are gone. Components have been a favourite subject to write about. Recently this was about accessibility claims of third-party components, before that I wrote about baking accessibility into components, frameworks and standards, Web Components and native elements, the websites as an instance of a design system, grids and components and accessibility in pattern libraries.

Reading lists

I did some reading lists, too, with recommendations about AI, equality, tech and society and more equality.

Accessibility

Some of my more technical articles are about accessibility. I wrote about how accessibility trees work, alternative text and when you don’t need it, accessible names and focus traps. There were also posts about testing pattern library accessibility, inline error messages and making websites more mobile friendly.

CSS

I praised the wonders of CSS in many of the posts. It lets you style things that don’t even exist yet, has simplicity as its core principle and can be used to rebuild awesome posters. To me, the cascade is a feature, not a bug and I feel simple fallbacks for Grid Layout are preferred to complex ones.

My favourite local conference is CSS Day in Amsterdam and I did write-ups for CSS Day 2019, CSS Day 2017.

Progressive enhancement

One of my first posts about progressive enhancement was about an approach for progressive enhancement with data--attributes and I did a follow-up on initialising script from mark-up. More recently I wrote about the merits of separating HTML, CSS and JS.

Here’s to the years to come!

There are lots of things I would like to do better. One is to write better, maybe by writing more. Maybe also by submitting to other publications, so that I can get more feedback on my writing. There’s so much to learn about writing and it’s hard to learn alone. I would also like to write more interesting content (don’t we all? 🤓). So far I noticed something interesting can come out when I don’t expect it, and write something short that I never really planned to write about. Probably think about it less?

Anyway… I’ve really enjoyed having my own blog and I hope to continue posting for many years to come. Thanks everyone for support and encouragement, you know who you are! I hope to be back soon with a post that is more useful than this one.


The post 150 was first posted on hiddedevries.nl blog | Reply via email

150

This blog has now reached the somewhat random milestone of 150 posts. When I asked around what post #150 should be about, the Twitterverse said “blogging”. Well, OK!

Fun fact, this isn’t my first blog: from 2008 to 2014, I had a travel blog, where I tried to write funny posts about my trips abroad for family and friends. This blog is different as I try to, ahem, add “something” to the field of web development, I fact-check, look for previous work to credit and try to keep posts with technical recommendations up to date.

Why personal blogs are great

The fact that so many people publish their thoughts and share knowledge, is something I’ve always loved about the web. Whether it is practical stuff about how to solve a coding issue or some kind of opinion… everyone’s brain is wired differently. It may resonate, it may not, that’s also fine.

People’s blogs are what helped me get started in this industry and get a feeling for the kinds of problems we’re trying to solve. I started doing web development around 2006, and at that time, lots of people blogged. Many of the conversations happened on blogs. Since 2013, this blog is my attempt to join some of the conversations.

Blogging is like “a kind of catharsis”, said Bruce Lawson once in 2005:

In the old days, people used to shout at passers-by in the street; these days, we blog.

(Don’t follow the link and read about his other analogies to blogging)

Writing in public feels great, even if no one reads it, says Sara Soueidan in her post Just write:

Just write.

Even if only one person learns something from your article, you’ll feel great, and that you’ve contributed — even if just a little bit — to this amazing community that we’re all constantly learning from. And if no one reads your article, then that’s also okay.

It is ideal to do this on your own website. Matthias Ott put it beautifully in his post Into the Personal-Website-Verse—personal websites are about expressing and exploring yourself:

Personal websites are called personal websites because they are just that: personal. Thus, the primary objective still is to have a place to express ourselves, to explore ourselves, a place that lasts while the daily storms pass by. A place of consideration, and yes, a place of proudly sharing what we do, what we think, and what we care about. A place to contribute your voice and help others. A home on the internet. A place to tell your story.

This resonates so much.

Why blog

Social media is hard to search

Do you ever think “there was this tweet by X about Y” and attempt to find it? This can be really hard, as new tweets appear all the time in this endless stream of opinions, thoughts, jokes and anger. You may want to go to a person’s profile and look for the tweet, but with the endless loading that breaks CTRL/⌘ + F, I usually wish my past self had saved a direct link.

In contrast, your blog is “a place that lasts”, as Matthias says above. If you take those tweets and put them into context on your blog, that will make the conversation easier to find them later.

Social media is not optimised for organising thoughts

Not only do posts on social media fade away over time, they also have character limits. While you save words, you likely leave out nuance. Threads exist, of course, but on your website, people don’t have to click to try and expand more content. You get all the space you need.

Own your content

When you publish on your site, you own your content in a way not available on any of the centralised platforms, like Twitter or Medium.

Khoi Vinh says about this in an interview:

I personally can’t imagine handing over all of my labor to a centralized platform where it’s chopped up and shuffled together with content from countless other sources, only to be exploited at the current whims of the platform owners’ volatile business models.

Ana Rodrigues lists this and many other advantages of owning your own content in her fantastic post Autonomy online: a case for the IndieWeb, which also contrasts the IndieWeb with the Corporate Web.

What I write about

This blog isn’t particularly structured, but scrolling through the past 149 posts, I did find some common themes. I had forgotten about a lot of the stuff. Warning: there are a lot of links below.

Summaries of events

Sometimes, I write summaries of the conferences I attend, like when I met the TAG, attended ConfConf and joined MozFest. This requires me to hold my phone while listening, frantically taking notes, while being focused on what is being said. After the event, I structure my writings and try to piece together summaries per talk, adding links, sometimes revisiting slide decks if they’re available. This is exhausting, but helps me personally process what I’ve learned. It usually also leaves me with many tabs open and a bunch of self doubt about properly representing the speakers’ points.

Opinions

I’ve also published some ‘hot takes’. The one I’m now most embarrassed by is the clickbaitily titled Bootstrap considered harmful. Let’s say I had not read Eric Meyer’s awesome “Considered Harmful” Essays Considered Harmful yet, and I was younger. I also wrote about Web Components and which kinds we need, overengineering CSS, “your mom” jokes in corporate culture, why Uber’s for everyone isn’t like Timbl’s and why slowness of websites is optional.

Components

In the last 10 years component systems ruled front-end development. Before that, it would not be uncommon to be hired to build some full pages. Those times are gone. Components have been a favourite subject to write about. Recently this was about accessibility claims of third-party components, before that I wrote about baking accessibility into components, frameworks and standards, Web Components and native elements, the websites as an instance of a design system, grids and components and accessibility in pattern libraries.

Reading lists

I did some reading lists, too, with recommendations about AI, equality, tech and society and more equality.

Accessibility

Some of my more technical articles are about accessibility. I wrote about how accessibility trees work, alternative text and when you don’t need it, accessible names and focus traps. There were also posts about testing pattern library accessibility, inline error messages and making websites more mobile friendly.

CSS

I praised the wonders of CSS in many of the posts. It lets you style things that don’t even exist yet, has simplicity as its core principle and can be used to rebuild awesome posters. To me, the cascade is a feature, not a bug and I feel simple fallbacks for Grid Layout are preferred to complex ones.

My favourite local conference is CSS Day in Amsterdam and I did write-ups for CSS Day 2019, CSS Day 2017.

Progressive enhancement

One of my first posts about progressive enhancement was about an approach for progressive enhancement with data--attributes and I did a follow-up on initialising script from mark-up. More recently I wrote about the merits of separating HTML, CSS and JS.

Here’s to the years to come!

There are lots of things I would like to do better. One is to write better, maybe by writing more. Maybe also by submitting to other publications, so that I can get more feedback on my writing. There’s so much to learn about writing and it’s hard to learn alone. I would also like to write more interesting content (don’t we all? 🤓). So far I noticed something interesting can come out when I don’t expect it, and write something short that I never really planned to write about. Probably think about it less?

Anyway… I’ve really enjoyed having my own blog and I hope to continue posting for many years to come. Thanks everyone for support and encouragement, you know who you are! I hope to be back soon with a post that is more useful than this one.


Originally posted as 150 on Hidde's blog.

Reply via email

Criticism pushes the web forward

This week, a friend shared a blog post that critiqued a popular framework for CSS. Twitter started to discuss if it’s okay to criticise tools. In this post, I’ll say it is not just okay, it is also important.

I was a little disappointed to see the replies to this tweet. Among the many replies, the person who came up with the framework exclaimed seeing the post shared by her “ruined” his day. Note: the post was not about him, it was about the framework (the one that, on its homepage, criticises other people’s CSS methodologies) . Other commenters said the article was “not worth sharing”, “you’re just starting of fights” and “why would you amplify that?”.

I’m not interested in attacking anyone here, or going into the merits or faults of The Post, but would like to answer that last question. Or, in fact, a more generic one: “is it okay to criticise tools?”

Listening helps

The short answer is: yes. As long as it is aimed at the tool, not the person that created it, it is better to share criticisms than not. I have never been involved in the development of frameworks for the web, but in standards for the web, like HTML, CSS and ARIA, there is lots of criticism. People poke holes in each other’s assumptions, suggest ways to make features better and explain why things don’t work well for them. Good standards require diverse perspectives.

Again, the kind of criticism I’m talking about here is criticism of the content, not a person. Is some proposal vague? Should we really call that property “left justify” or number-form seems counterintuitive as a property name–just two examples of critiques of the first version of CSS, in 1995. They’ve made CSS better, because we’ve ended up with better names. Thanks to the people who took the time to send in comments. This is, for over 25 years, how we’ve evolved the web: by listening to each other and not taking critical comments personal.

Can we “just not use it”?

Maybe web standards like CSS are different. The web is built on it and you cannot not use CSS when you build a website. Browsers have stylesheets. But if we’re honest, the most popular tools and frameworks also impact all of us. Most web developers don’t always get to choose their own tools and frameworks, they join a team with existing code or have team members with other opinions.

I’ve never included Bootstrap in a project myself, but have contributed code to many projects that did. Just like it is helpful to comment on web standards, it is helpful to comment on tools and frameworks, because they too affect us all. This goes both for whether to use the thing at all, and for features the thing has or lacks.

Like critical thinking pushes the world of ideas forward, I mean in philosophy, criticism of ideas for standards, tools and frameworks pushes the web forward. We should give feedback respectfully and constructively, but we should give feedback. And open up to feedback, not demand it to go away. It may not be easy, but it is important to include perspectives outside your own.


The post Criticism pushes the web forward was first posted on hiddedevries.nl blog | Reply via email