Web Interface Guidelines

Week 279 was posted by Charanjit Chana on 2023-02-27.

I'm always on the lookout for some advice on how I can make iterative improvements to my various projects and this week I stumbled across the Web Interface Guidelines by Rauno Freiberg. A solid list of details that all add up to make good interfaces for the web.

Broken down into neat sections, you can find advice on the following aspects of front-end interfaces:

  1. Interactivity
  2. Typography
  3. Motion
  4. Touch
  5. Optimizations
  6. Accessbility
  7. Design

There's a lot of common sense sprinkled throughout, but HTML started off without a lot of the elements and attributes we have now. Right now, Can I Use... shows fantastic support for something like the "required" attribute (> 98%) and yet I wasn't sure until I checked that it was the case. I'm just so conditioned to the "IE6 doesn't support it" state of mind.

It's a small thing, but being able to offload this type of interaction to the browser makes so much sense on the web today. It breeds consistency and predictability for when mistakes are made.

One that stuck out to me, that isn't already handled by the browser was around form submissions:

I know the mechanics are unlikely to be simple and maybe it's too reliant on client-side code (it can be achieved already through JavaScript), but I do wish something like this was supported by browsers. I don't think I've written any code to work this way in over a decade because the internet is generally so fast that it's not an issue but as I generally try to make things fast and lightweight, I shouldn't put usability and accessibility aside for situations where a form submission might not complete instantly.

Good Gear Club will probably be improved first thanks to these tips. Sitejoy is overdue some content and a bit of attention so will be second in line.

If I'm honest with myself, I know that 1 Thing A Week has been neglected a little over the past few years from a HTML and CSS point of view. I have some non-radical ideas, but nothing I've had the time to get stuck into. I hope to get to them by the end of the year and get them all implemented.


Tags: guidelines, interface, web


Tweet WhatsApp Keep Upvote Digg Tumblr Pin Blogger LinkedIn Skype LiveJournal Like