Mike Foskett @webSemanticsUK

Mike Foskett websemantics.uk London, England Joined July 2016

Tweets

113
Followers

48
Following

38
Likes

40

Mike Foskett @webSemanticsUK

2 years ago

Test browser image format .avif and .webp support, with .jpg fallback [Performance] Examples: HTML image, CSS background-image, and a JS generated image. Displays the most performant supported image format for page load speed. codepen.io/2kool2/pen/NWL…

0 0 1 35 0

Mike Foskett @webSemanticsUK

2 years ago

One details element open at a time - An accordion A progressively enhanced accordion using the details element and a small piece of vanilla JavaScript. codepen.io/2kool2/pen/poO…

0 0 0 22 0

Mike Foskett @webSemanticsUK

2 years ago

Accessible tab navigation to meet WCAG 2.1 An example of an ARIA accessible responsive tab control. "tabs" can be positioned, it's progressively enhanced, keyboard accessible, and responsive. No external dependencies, written in vanilla ES6. codepen.io/2kool2/pen/Jja…

0 0 0 19 0

Mike Foskett @webSemanticsUK

2 years ago

Flex-wrap detection Detects when a flexbox wraps and applies a 'wrapped' class to the flexbox and any wrapped flex items. It uses a resize observer instead of media queries, and avoids the need for minimum or maximum widths or complex calculations. codepen.io/2kool2/pen/eYP…

0 0 1 17 0

Mike Foskett @webSemanticsUK

4 years ago

New version of Fluid-Responsive Property Calculator is now live for critique. Final stage before replacing the old "font-size" version: websemantics.uk/tools/fluid-re…

2 0 0 0 0

Mike Foskett @webSemanticsUK

4 years ago

A bookmarklet to help meet WCAG 1.4.12 Text Spacing success criteria: codepen.io/2kool2/pen/LYz…

0 0 0 0 0

Mike Foskett @webSemanticsUK

4 years ago

I've updated the Fluid-responsive property calculator: codepen.io/2kool2/pen/por… The updated feature list is at the bottom of the pen. Any, and all, feedback appreciated. I'm hoping to publish later this week.