Home | hidde.blog
Hidde's blog about web accessibility, standards, HTML, CSS, JavaScript and more.| Hidde's blog
Hidde's blog about web accessibility, standards, HTML, CSS, JavaScript and more.| Hidde's blog
Here's why they technically can't, and why that makes sense to me.| Hidde's blog
The popover attribute adds behaviour, but not a role. Which role should you use in combination with the popover attribute?| Hidde's blog
What does “built in accessibility” actually mean for browsers that support popover?| Hidde's blog
When someone called out lack of accessibility, they got ableist responses. This post has a collection of those responses and an explanation of why they're problematic.| Hidde's blog
I just read Anna Debenham’s pocket guide to front-end styleguides. With only 69 pages, it is a concise guide to what (front-end) style guides are and how to use them.| Hidde's blog
Last week, the World Usability Day Bristol was hosted in MShed, a building that is home to Bristol’s city museum with the same name. | Hidde's blog
On November 27th, I attended Mark Boulton’s workshop about designing grid systems. It took place in Cardiff, UK, on the day before Handheld conference.| Hidde's blog
In this post I’m going to go through some highlights of Handheld 2013, which started of with the Welsh anthem being played on an electric guitar. | Hidde's blog
In this article, I describe a way to add icons to descriptive links, and one that makes icons by themselves more accessible. | Hidde's blog
When Bruce Lawsontweeted about an opportunity to meet the TAG, I managed, at the last minute, to get a ticket and joined a room full of very smart people discussing some technical aspects of the web medium.| Hidde's blog
Many videos on the web are hosted at third parties and included through an <iframe>. This can be a problem for flexible width sites, as an <iframe> with 100% width will not automatically have a height that respects the aspect ratio of the embedded content.| Hidde's blog
At State of the Browser in London, a one day event in Conway Hall, organised by the London Web Standards team, eight speakers talked about recent developments in the web and web browsers. Topics included Service Workers, performance, responsive images, web ‘apps’ and new CSS features for responsive web design. | Hidde's blog
When trying to improve front-end skills, we should improve our knowledge of HTML, CSS and JavaScript first and our knowledge of specific tools later.| Hidde's blog
“Museums Get Mobile!” was a one day event on designing mobile experiences, aimed at managers, curators and consultants in the cultural sector. It was organised by the UK Museums Computer Group in MShed, Bristol.| Hidde's blog
Last year I experienced Responsive Day Out through its audio podcast (RSS), this year I decided to buy a ticket and travel from Bristol to Brighton for the real thing. It was a varied day, with room for aspects like design, business, information architecture and even CSS specs. | Hidde's blog
In responsive web design, many of us think of breakpoints as related to the width of lay-outs. But there are other points that can break a website, like language.| Hidde's blog
Peter-Paul Koch, famous for PPK on JavaScript, Quirksmode.org and more recently as a co-organiser of various Amsterdam-based web conferences just released his new book: the Mobile Web Handbook, published by Smashing Magazine.| Hidde's blog
At the lovely St George’s, Bristol-based UX agency Nomensa organised Collaborate, a one day conference about user experience and (interaction) design.| Hidde's blog
It’s been 4 years since Ethan Marcotte’s seminal A List Apart article, and by now, responsive web design has become a pleonasm. All proper web design is now responsive, and the question is no longer if we do responsive, it is how we do it and why we should do it better or more responsible.| Hidde's blog
Recently I adopted a different way to manage bits of JavaScript in websites I was building. It exercises progressive enhancement (PE) by declaring handler and enhancer functions on HTML elements.| Hidde's blog
This week I attended my first Accessible Bristol, which was an interesting talk by Alastair Somerville about cognitive accessibility. Slides are available.| Hidde's blog
From yesterday, this website is only available via HTTPS. In this post I will explain my reasons for making the switch, and how I did it at Webfaction.| Hidde's blog
From 21 April, Google will start preferring sites it considers “mobile friendly”. The criteria are listed in a blog post and Google provide a tool for web masters to check whether they deem websites eligible for the label.| Hidde's blog
Writing CSS is, much like the rest of web development, about solving problems. There’s an idea for laying out content, the front-end developer comes up with a way to get the content marked up, and she writes some CSS rules to turn the marked up content into the lay-out as it was intended. Simple enough, until we decide to outsource our abstraction needs.| Hidde's blog
A major web corporation recently started serving simplified versions of websites to load them faster1. Solving which problem? The slowness of modern websites. I think this slowness is optional, and that it can and should be avoided. The web is fast by default, let’s keep it fast.| Hidde's blog
At this month’s Accessible Bristol, Léonie Watson talked about improving accessibility by making use of WAI-ARIA in HTML, JavaScript, SVG and Web Components. | Hidde's blog
Yesterday I attended the third (and hopefully not final) edition of Responsive Day Out, Clearleft’s one day conference about all things responsive web design.| Hidde's blog
Web Components will allow web developers to create their own elements: custom elements. Last week I attended the Web Component panel and accessibility break-out at Edge Conference, and left both sessions full of questions. One was: what kind of custom elements do we need?| Hidde's blog
The next problem being solved for the web is not having the network: apps that work offline. I think when designing such apps, we should consider user intent, and in particular what a user intends to be available offline.| Hidde's blog
Grids… for long I have thought they are the trivial bit in front-end development. Many sites do not have much variation in column widths, so to use a ‘grid system’ would be a clear violation of the KISS principle. Now I think complex grid systems can be of great use in component-based front-end builds.| Hidde's blog
CSS Grid Layout has been coming for a long time, browser support seems to be on its way (at last!). This is great news! It means we can soon use ‘just’ CSS to describe our lay-outs. But, arguably, this leaves us with a naming problem.| Hidde's blog
WordPress is used by many different audiences. It is used by people who do not know much about code, as well as by experienced programmers1. Expectations of plug-ins therefore vary.| Hidde's blog
JSHint helps you enforce code correctness, whereas JSCS helps you enforce a code style. | Hidde's blog
In his talk at Beyond Tellerand last year, web designer Brad Frost talked about the website “as an instantiation of your design system”. I really liked that idea. | Hidde's blog
If conference videos are made more accessible, they can be shared with a wider audience. This is a great way to add value! Most Fronteers 2015 videos are now available with captions and transcripts. In this post I will explain why we did it, how we got our transcripts made and what happened next. | Hidde's blog
Heartbeat API is a thing built into WordPress that sends a POST request every 15 seconds. It allows for interesting functionalities like revision tracking, but can also dramatically slow things down and even block editors from editing content (if your connection is quite slow).| Hidde's blog
This weekend I attended World IA Day in Bristol. The event is organised simultaneously in 61 locations across 31 countries. The local one was put together by Nomensa, an awesome Bristol web agency whom I had the pleasure of freelancing with for 3 months last year.| Hidde's blog
When I started out learning to build websites, the web world was just moving from adding style declarations to every single element, to a generalised approach where one small-ish set of rules would apply to all of a website’s pages.| Hidde's blog
On Friday 1 April I attended Fronteers Spring Conference at EYE in Amsterdam. The first of its kind, after 8 two day conferences in autumn. IMHO, this one day spring thing is a fantastic format worth pursuing again!| Hidde's blog
If one phrase from Bram Stein’s excellent Fronteers Spring Conf talk stuck with me, it was ‘always have a font loading strategy’. The point he made was that if you use custom web fonts in CSS, you should not rely on browser default behaviour, as that will often mean users see white pages with invisible text in case of font loading failure.| Hidde's blog
In “Meaningful CSS: style like you mean it”, Tim Baxter argues for replacing CSS approaches that heavily rely on classnames with a markup-centric approach. I think adding styling to HTML elements is hugely beneficial, but works best when combined with a class-based approach. We need a bit of both.| Hidde's blog
In preparation of the Grid Layout Workshop in Amsterdam this Friday, I read the grid spec. I highly recommend doing this.| Hidde's blog
A conference about conferences, isn’t that super meta? It is, a bit. Most web conferences aim to bring web people together and inspire them to do better work. ConfConf in Bristol did something similar for those who organise conferences.| Hidde's blog
Yesterday I attended NCDT, the Dutch conference for digital accessibility. Hundreds of people whose work somehow involves digitally exposing information gathered in Utrecht.| Hidde's blog
Although it may be very exciting to make new things for the web, it’s important to think about archiving what we have made before. This requires one to think about the long term, and about whom we trust with our content.| Hidde's blog
This week I had the pleasure of attending the Progressive Web Apps Dev Summit, an event organised by Google in the beautiful city of Amsterdam. These are my takeaways from the event.| Hidde's blog
Every so often in a project, the issue comes up of whether cursors on buttons should be ‘the hand’ or default. The spec says they should be default, but many people (myself included, until recently), are unaware. Many designers I’ve worked with want pointer-cursors regardless of what the spec says.| Hidde's blog
This week I visited the 6th From the Front conference in Bologna, which this year was themed The Frontend Guide to Life, The Universe and Everything. It was my second time at the conference, having visited their first in 2012. Great to be back!| Hidde's blog
This week Heydon Pickerings’ Inclusive Design Patterns came out. As I was quite fond of his previous work, I insta-bought the ebook version (hard copy will be available from October). | Hidde's blog
This week I resigned from the Fronteers board. I tweeted about it earlier, but didn’t express myself as carefully as I would have liked to do. In this post I hope to explain things properly.| Hidde's blog
In Don’t initialise JavaScript automagically, Adam Silver argues that we should not rely on markup to trigger bits of JavaScript. I disagree with the advice he gives, and think markup is great place to trigger behaviour. Where else?| Hidde's blog
For information on how to accessibly implement the components I’m working on, I often refer to WAI-ARIA Authoring Practices specification. One thing this spec sometimes recommends, is to trap focus in an element, for example in a modal dialog while it is open. In this post I will show how to implement this. | Hidde's blog
Yesterday I attended the Inclusive Design and Accessibility meetup (“idea11y”) at De Voorhoede in Amsterdam, which was about development tools, graphic design and, the surprise act, the accessibility of React apps.| Hidde's blog
When Harry Roberts tweeted he would be free to give a workshop in The Netherlands this week, Joël approached Xebia and Fronteers and made it happen. Almost 20 of us gathered in the Wibautstraat in Amsterdam and spent a whole day getting all nerdy about web performance.| Hidde's blog
So… tomorrow is the end of me volunteering at Fronteers. As of then, I am no longer part of Fronteers’ workshop team. With that, I am officially no longer volunteering at Fronteers. Time for a round-up! | Hidde's blog
On one of my projects I am helping a governmental organisation to take their application forms to the web. They are mostly very complex forms (for reasons). We do our best to help people fill out the forms correctly and identify incorrect input to them where we can. In this post I will go into some ways to do this accessibly.| Hidde's blog
Sometimes you want parts of your page to be invisible. For example, because all of your application is on a single page. The hidden attribute in the HTML standard is made for this. In this post I will explain how the attribute works, how it differs from [aria-hidden] and how it relates to just hiding with CSS.| Hidde's blog
Dutch retail giant Coolblue showed the world this week that they have a new meeting room, named ‘Your Mom’. They explained in a blog post how this name sets the stage for all sorts of mom-jokes. I think this is not really OK. | Hidde's blog
When I visited New York last year, I picked up a copy of Chris Bernhardt’s book Turing’s Vision: The Birth of Computer Science, which dissects one of Alan Turing’s most interesting papers. I’ve been recommending it to various people since, so I thought I would write about it here.| Hidde's blog
Today I learned about the sequential focus navigation starting point, which helps browsers decide what to do with focus when you link to content that is not focusable. | Hidde's blog
If your website lets users upload files, you have probably compared the default file upload control with custom solutions. In this article I will show you can have both, using a method that uses the default input, but looks completely custom. | Hidde's blog
All interactive elements should have accessible names, says the W3C about using ARIA. They can also have descriptions. Names and descriptions can help your users figure out which elements they are interacting with, and what they are for. In this post I will explain implicit and explicit labelling methods and discuss how to future-proof your labels.| Hidde's blog
In what was a truly inspiring afternoon at the client last week, we watched the English film I, Daniel Blake. It is about a carpenter of nearly the pension age, who applies for income support following a heart attack.| Hidde's blog
This week I attended the last ICONS meetup of this academic year, which had as its speaker Léonie Watson. She shared five questions related to screen readers.| Hidde's blog
This week, the 5th edition of the yearly CSS Day took place. It was preceded this year by something called Browser API Special: a full day about JavaScript APIs. | Hidde's blog
Something I thought I knew, but found out this week that I did not: the exact difference between pseudo classes and pseudo elements in CSS.| Hidde's blog
Pretty much all of my projects in recent years have involved pattern libraries: setting them up, promoting their usage and coding actual patterns. So when Jeremy Keith of Clearleft announced he would host a Patterns Day, I bought a ticket instantly. A full day of design system nerdery sounded like a great thing to travel to Brighton for. And it was definitely worthwile…| Hidde's blog
The first hour of CSS Day 2017 was truly memorable, as the very inventors of the language took the stage. They brought back memories of the early days of CSS. It was the year 1994. There were lots of documents and they needed styling. | Hidde's blog
The other day I watched a talk in which the speaker criticised PPK for trying to come up with a definition of a ‘real developer’. Many people have said it is ridiculous to frame developers with words like that. The wording is probably inapt. But is there much inherently wrong with setting standards for what a real/good/professional/sufficient way to exercise our trade is? In this post I will look into that question.| Hidde's blog
Ever since the Grid Layout spec review workshop in Amsterdam last year, I’ve been wanting to try this stuff out on a real project, in a real browser. Now that the spec is rapidly gaining browser support, I thought this blog would be a good place to practice with it. I’ve jotted down some of my findings and thoughts. | Hidde's blog
When assessing how accessible your website or app is, auditors will likely want to look at whole pages. But perhaps most of what you are working on is individual components. I mean, this is how lots of companies work nowadays. Can pattern libraries be tested for accessibility? And if so, what do we test? In this post I will address those questions and look at accessibility testing in different levels of pattern library driven development. | Hidde's blog
Yesterday I attended the Inclusive Design and Accessibility meetup (“idea11y”) in Rotterdam. The central theme of the evening, I think, was that accessible technology has the unique ability to enable people. | Hidde's blog
Last Friday, De Volkskrant exposed how much trouble the Dutch tax office has had in recent years to build software and manage its IT projects. Below I’ve listed the four main things they lack according to the article.| Hidde's blog
Last week, for roughly one hour each day, I participated in the Accessibility Design Drive, organised by Stanford University and Mozilla to make Firefox more inclusive by collaborating in diverse teams. It was a fun thing to be part of, and great to learn from others!| Hidde's blog
This morning I attended ICONS, an event to kickstart the new term of Communication and Multimedia Design, which is a course given in Amsterdam. The event was for students, but they invited others to tag along. So I did. Three speakers shared their views on what I can only paraphrase as: to do something that matters.| Hidde's blog
This week I attended Brique, a design conference by the lovely people of Fabrique in Rotterdam’s Kunsthal. It felt like a Dutch dConstruct for designers, like Creative Mornings meets This Happened. I had a great day!| Hidde's blog
I recently had a conversation with a recruiter that went more or less like this:| Hidde's blog
I wrote a post about Web Components about two years ago, wondering what kind we would need, if any. More companies have recently started adopting web components. I’m starting to get more excited about them, and think they can be very helpful to encapsulate compositions of elements.| Hidde's blog
This month is my last at Wigo4IT, and I’m excited to start new projects at Mozilla and the Dutch Ministry of Internal Affairs.| Hidde's blog
There was a time when front-end developers would frown upon (former) print designers that designed for the web. At their usage of ‘perfect’ yet unrealistic content, and their creative ideas that were impossible to build with web tech. If this frowning since has scared print designers away from web design, I hope that they return in 2018. New CSS possibilities are ending the unrealistic content problem and the generic layout problem. It’s a great time to build layouts in CSS!| Hidde's blog
If you have learned how to use Grid Layout, you might wonder what to use it for. In this post, I will give some use cases where I think Grid will excel.| Hidde's blog
Last week I was at Mozilla’s All Hands in Austin, Texas (hence the hashtag). All Hands is an all company event where the people who work for Mozilla come together in one city. Staff, but also prominent volunteers, contributors and community leaders. It’s all about sharing experiences and meeting people.| Hidde's blog
Inspired by Nienke, I’d like to share some of my highlights and learnings of 2017.| Hidde's blog
The other day I was building a form, and I was surprised how event firing works when you press ENTER on the keyboard.| Hidde's blog
For about 6 years, I have mostly stopped reading my daily paper physically, unless sipping lattes in a coffee shop. I used its app instead. In those years, they released various updates, and these updates got me thinking about what I want from a newspaper app. | Hidde's blog
Secure passwords are long and unique. Therefore, remembering them all is impossible for most human beings. Hence the popularity of password managers. If you’re building a login form, these are some tips to improve the experience for password manager users.| Hidde's blog
When building a control that toggles content in a web app, we can use aria-expanded to let the control know whether the content is shown or hidden. Expanded or not expanded. In assistive technologies (AT) that support this attribute, AT users can figure out whether the element was expanded. | Hidde's blog
In a project I worked on recently, I noticed almost everything in the page had alternative text. Sometimes this can be redundant, for example if there is already text on the page that says what the thing is. Let’s look at some examples.| Hidde's blog
At the Open Innovation team at Mozilla, I learned about Donutbot. It is a Slack bot that randomly matches people from the team to each other, so that they can then go on and enjoy donut together. They are usually just metaphorical donuts, you could totally go for bubble tea or lunch. It doesn’t even have to be together, in person. You could use video conferencing software. But if you do meet IRL, selfie-sharing is appreciated.| Hidde's blog
I love the Inclusive Design Principles and often refer to them in discussions about accessibility. I also like language, so I thought why not translate them into Dutch?| Hidde's blog
At accessibility talks, I love to show a photo of Sir Tim Berners-Lee and the words he made appear on enormous screens during the 2012 Olympics opening ceremony in London: ‘This is for everyone’. | Hidde's blog
Last week I saw Sir Tim Berners-Lee, inventor of the web and receiver of the Turing Prize, give the ACM Turing Lecture. He spoke about redecentralising the web. | Hidde's blog
To gain precise control over what styles, scripts and other assets do on your site, you can serve pages with a Content Security-Policy. What does that mean for the front-end, and for those of us building user interfaces in browsers? Well, it can be tricky to set up, but there are useful benefits. | Hidde's blog
Having been long interested in artificial intelligence, it was one of my focus areas in university, I looked for theoretical background beyond the hype. If it is also summer where you are, you may have some extra reading time, too. So, I present you: an AI reading list.| Hidde's blog
In Benjamin’s poll, the second most voted reason to avoid Grid Layout was supporting Internet Explorer users. I think it all depends on how we want to support users. Of any browser. Warning: opinions ahead.| Hidde's blog
Last week a poll about CSS did the rounds with a question about the cascade. It got me thinking about CSS and overlapping skills in front-end development. | Hidde's blog
Last week I had the chance to read New Frontiers in Web Design, the latest in the series of Smashing Books. It just came out and is full of interesting knowledge for people who work on the web in 2018. From CSS custom properties to advanced service workers to bringing personality back to the web.| Hidde's blog
Writeup of Accessibility London, September 2018.| Hidde's blog
