1<!doctype html><html lang="en" data-theme="default"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Darek Kay â Solving web mysteries</title><link rel="preload" href="/assets/fonts/nunito-v32-latin_latin-ext-regular.woff2" as="font" type="font/woff2" crossorigin><link rel="stylesheet" href="/assets/styles.css?ver=2b7c4ade"><link rel="shortcut icon" href="https://darekkay.com/favicon.ico"><meta name="description" content="Darek Kay is a professional front-end developer and an accessibility advocate."><link rel="canonical" href="https://darekkay.com/"><meta property="og:site_name" content="Darek Kay"><meta property="og:title" content="Darek Kay â Solving web mysteries"><meta property="og:url" content="https://darekkay.com/"><meta property="og:description" content="Darek Kay is a professional front-end developer and an accessibility advocate."><meta property="og:locale" content="en"><meta property="og:type" content="website"><meta property="og:image" content="https://darekkay.com/social-cover.png"><meta property="og:image:alt" content="Darek Kay â Solving web mysteries by Darek Kay"><meta property="fediverse:creator" content="@[email protected]"><meta name="generator" content="Eleventy v3.1.0"><link rel="webmention" href="https://webmention.io/darekkay.com/webmention"><link rel="pingback" href="https://webmention.io/darekkay.com/xmlrpc"><link rel="authorization_endpoint" href="https://indieauth.com/auth"><link rel="openid.delegate" href="https://darekkay.com/"><link rel="openid.server" href="https://openid.indieauth.com/openid"><link type="application/atom+xml" rel="alternate" href="https://darekkay.com/atom.xml" title="Darek Kay"><link type="application/feed+json" rel="alternate" href="https://darekkay.com/feed.json" title="Darek Kay"><link rel="search" type="application/opensearchdescription+xml" href="/opensearch.xml" title="Darek Kay">
1<script type="application/ld+json">{ 2 "@context": "http://schema.org", 3 "@type": "Blog", 4 "@id": "https://darekkay.com/", 5 "mainEntityOfPage": { 6 "@type": "WebPage", 7 "@id": "https://darekkay.com/" 8 }, 9 "url": "https://darekkay.com/", 10 "headline": "Darek Kay â Solving web mysteries", 11 "description": "Darek Kay is a professional front-end developer and an accessibility advocate.", 12 "image": { 13 "@type": "ImageObject", 14 "url": "https://darekkay.com/social-cover.png" 15 }, 16 17 "author": { 18 "@type": "Person", 19 "name": "Darek Kay", 20 "image": { 21 "@type": "ImageObject", 22 "url": "https://darekkay.com/assets/images/avatar-2x.jpg" 23 }, 24 "url": "https://darekkay.com/", 25 "sameAs": ["https://github.com/darekkay", "https://fosstodon.org/@darekkay"] 26 } 27 }</script>
27<script>document.documentElement.dataset.theme=localStorage.getItem("theme")||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"default")</script>
27</head><body><header class="inverted relative mb-4 py-5 overflow-hidden"><div class="w-full flex flex-col md:flex-row items-center justify-between" style="max-width:935px"><a href="/" class="flex items-center text-default hover:no-underline focus:no-underline"><picture class="inline-flex"><img height="75" width="75" srcset="/assets/images/avatar.webp, /assets/images/avatar-2x.webp 2x" src="/assets/images/avatar.webp" alt="Darek Kay's picture" class="rounded-full"></picture><div class="ml-6 mr-2 md:text-left"><div class="text-5 font-bold" translate="no">Darek Kay</div><div class="text-3">Solving web mysteries</div></div></a><nav class="flex flex-wrap items-center justify-center py-5 gap-6"><a href="/" class="text-5 font-bold">Home</a> <a href="/blog/" class="text-5 font-bold">Blog</a> <a href="/projects/" class="text-5 font-bold">Projects</a> <a href="https://photos.dariuszwinkler.com/" class="text-5 font-bold">Photos</a><div class="dk-theme-picker"></div></nav></div><button class="cow absolute block bg-transparent border-0 p-0 cursor-pointer print-hidden" type="button"><span class="relative block"><img srcset="/assets/images/cow.webp, /assets/images/cow-2x.webp 2x" src="/assets/images/cow.webp" alt="Cow Easter Egg" height="100" width="100"> <span class="cow-tooltip invisible opacity-0 block absolute p-4 text-3 rounded" aria-live="polite"></span></span></button></header><main class="layout-content pb-7"><h1 class="text-center">Hello, I'm Darek Kay! <span class="wink inline-block">ð</span></h1><p class="prose">I'm a front-end developer and an <a href="/accessibility-notes/">accessibility advocate</a>, currently working at IBM. I love sharing what I know through my blog, teaching and <a href="/presentations/">speaking at conferences</a>. If you want to learn more about what I do, look at all the <a href="/projects/">awesome things</a> I'm building to make people's lives better. ð</p><p class="prose">In my free time, I enjoy <a href="https://photos.dariuszwinkler.com/">photography</a>, board games, movies and playing instruments.</p><p class="prose">Follow my latest work on <span class="inline-flex"><a href="https://fosstodon.org/@darekkay">Mastodon</a> <svg class="icon icon--mastodon h-base shrink-0 mx-2" role="img" aria-hidden="true"><use xlink:href="/assets/icons/sprite.svg?ver=1f4fa923#icon-mastodon"></use></svg> </span>and <span class="inline-flex"><a href="https://github.com/darekkay">GitHub</a> <svg class="icon icon--github h-base shrink-0 mr-1 ml-2" role="img" aria-hidden="true"><use xlink:href="/assets/icons/sprite.svg?ver=1f4fa923#icon-github"></use></svg> </span>.</p><hr><h2 class="text-center">Latest blog posts</h2><ul class="ml-0"><li class="post-list grid list-none py-3 pl-1"><span class="post-list-icon h-base"><svg class="icon icon--code-commit h-base shrink-0 mr-3 text-default" role="img" aria-hidden="true"><use xlink:href="/assets/icons/sprite.svg?ver=1f4fa923#icon-code-commit"></use></svg></span><div class="post-list-title flex items-start"><a href="/blog/sabbatical-18-great-ocean-road/" class="mr-auto font-bold">Sabbatical #18: Great Ocean Road</a></div><div class="post-list-date text-3 text-offset font-mono tracking-tighter">14 Jul 2026</div></li><li class="post-list grid list-none py-3 pl-1"><span class="post-list-icon h-base"><svg class="icon icon--code-commit h-base shrink-0 mr-3 text-default" role="img" aria-hidden="true"><use xlink:href="/assets/icons/sprite.svg?ver=1f4fa923#icon-code-commit"></use></svg></span><div class="post-list-title flex items-start"><a href="/blog/sabbatical-17-melbourne/" class="mr-auto font-bold">Sabbatical #17: Melbourne</a></div><div class="post-list-date text-3 text-offset font-mono tracking-tighter">09 Jun 2026</div></li><li class="post-list grid list-none py-3 pl-1"><span class="post-list-icon h-base"><svg class="icon icon--code-commit h-base shrink-0 mr-3 text-default" role="img" aria-hidden="true"><use xlink:href="/assets/icons/sprite.svg?ver=1f4fa923#icon-code-commit"></use></svg></span><div class="post-list-title flex items-start"><a href="/blog/sabbatical-16-kaikoura/" class="mr-auto font-bold">Sabbatical #16: KaikÅura</a></div><div class="post-list-date text-3 text-offset font-mono tracking-tighter">03 Jun 2026</div></li><li class="post-list grid list-none py-3 pl-1"><span class="post-list-icon h-base"><svg class="icon icon--code-commit h-base shrink-0 mr-3 text-default" role="img" aria-hidden="true"><use xlink:href="/assets/icons/sprite.svg?ver=1f4fa923#icon-code-commit"></use></svg></span><div class="post-list-title flex items-start"><a href="/blog/sabbatical-15-tasman-marlborough/" class="mr-auto font-bold">Sabbatical #15: Tasman-Marlborough</a></div><div class="post-list-date text-3 text-offset font-mono tracking-tighter">27 May 2026</div></li><li class="post-list grid list-none py-3 pl-1"><span class="post-list-icon h-base"><svg class="icon icon--code-commit h-base shrink-0 mr-3 text-default" role="img" aria-hidden="true"><use xlink:href="/assets/icons/sprite.svg?ver=1f4fa923#icon-code-commit"></use></svg></span><div class="post-list-title flex items-start"><a href="/blog/sabbatical-14-west-coast/" class="mr-auto font-bold">Sabbatical #14: West Coast</a></div><div class="post-list-date text-3 text-offset font-mono tracking-tighter">22 May 2026</div></li></ul><div class="w-full text-center">â <a href="/blog/" class="font-bold">View all blog posts</a></div><hr><h2 class="text-center">Featured projects</h2><div class="projects"><div class="project"><img width="250" height="177" src="/assets/images/projects/dashboard.webp" alt=""><div class="font-bold"><a href="https://dashboard.darekkay.com/" translate="no">Dashboard</a></div><div>Customizable personal dashboard and startpage</div></div><div class="project"><img width="250" height="177" src="/assets/images/projects/static-marks.webp" alt=""><div class="font-bold"><a href="https://darekkay.com/static-marks/" translate="no">Static Marks</a></div><div>Shareable bookmarks</div></div></div><div class="w-full text-center">â <a href="/projects/" class="font-bold">View all projects</a></div><hr><h2 class="text-center">Latest photo</h2><div class="w-full text-center"><div class="photo inline-flex mb-5"><img src="https://photos.dariuszwinkler.com/photo/0197/0197-small.webp" width="256" height="384" alt="A monochrome photo of a large waterfall."></div><div>â <a href="https://photos.dariuszwinkler.com" class="font-bold">View all photos</a></div></div><hr><section class="h-card" style="display:none"><span class="p-name">Dariusz Winkler</span> <span class="p-nickname">Darek Kay</span> <span class="p-note">I'm a front-end developer and an accessibility advocate, currently working at IBM. I love sharing what I know through my blog, teaching and speaking at conferences.</span> <img class="u-photo" src="/assets/images/avatar-2x.jpg" alt="" loading="lazy"> <a class="u-url u-uid" href="https://darekkay.com/">https://darekkay.com/</a> <a class="u-email" rel="me" href="mailto:[email protected]">Email</a> <a class="u-url" rel="me" href="https://fosstodon.org/@darekkay">Mastodon</a> <a class="u-url" rel="me" href="https://github.com/darekkay">GitHub</a> <span class="p-category">Blogging</span> <span class="p-category">Software Development</span> <span class="p-category">Web Development</span> <span class="p-category">Web Accessibility</span></section><h2 class="visually-hidden">Web rings</h2><p class="text-center">I'm a proud member of the following web rings:</p><div class="mb-3 flex flex-wrap justify-center text-center"><span><a href="https://fediring.net/previous?host=darekkay.com"><span aria-hidden="true">â</span><span class="visually-hidden">Previous Fediring website</span></a></span> <span class="prose mx-6"><a rel="external" href="https://fediring.net/">Fediring</a></span> <span><a href="https://fediring.net/next?host=darekkay.com"><span aria-hidden="true">â</span><span class="visually-hidden">Next Fediring website</span></a></span></div><div class="mb-3 flex flex-wrap justify-center text-center"><span><a href="https://a11y-webring.club/prev"><span aria-hidden="true">â</span><span class="visually-hidden">Previous a11y-webring.club website</span></a></span> <span class="prose mx-6"><a rel="external" href="https://a11y-webring.club/">a11y-webring.club</a></span> <span><a href="https://a11y-webring.club/next"><span aria-hidden="true">â</span><span class="visually-hidden">Next a11y-webring.club website</span></a></span></div><div class="mb-3 flex flex-wrap justify-center text-center"><span><a href="https://xn--sr8hvo.ws/previous"><span aria-hidden="true">â</span><span class="visually-hidden">Previous IndieWeb Webring website</span></a></span> <span class="prose mx-6"><a href="https://xn--sr8hvo.ws">IndieWeb Webring</a></span> <span><a href="https://xn--sr8hvo.ws/next"><span aria-hidden="true">â</span><span class="visually-hidden">Next IndieWeb Webring website</span></a></span></div></main><footer class="inverted prose py-7 text-4"><div class="mb-4"><svg class="icon icon--cow mr-3 pb-2 align-middle" role="img" aria-hidden="true"><use xlink:href="/assets/icons/sprite.svg?ver=1f4fa923#icon-cow"></use></svg> I am <span class="font-bold">
27Darek Kay</span> â a software developer, <a href="/blog/">blogger</a> and <a href="https://photos.dariuszwinkler.com/">hobby photographer</a>.</div><div class="w-full max-w-content flex flex-col md:flex-row justify-between gap-x-3"><div class="py-2">You can reach me via <a href="https://fosstodon.org/@darekkay" class="font-bold">Mastodon</a>, <a href="https://github.com/darekkay" class="font-bold">GitHub</a> or <a href="mailto:[email protected]" class="font-bold">Email</a>.</div><div class="py-2">Subscribe to my <a href="/atom.xml" class="font-bold">RSS Feed</a>.</div></div></footer>
27<script defer="defer" src="/assets/js/index.min.js?ver=3535a929"></script>
27</body></html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.