Hi, I'm Ethan Hawksley and I've been making even more changes for hawksley.dev recently.
When my blog post did well on Hacker News and got featured in TLDR Dev, I implemented an email newsletter signup form as a more readily accessible alternative to my RSS and JSON feeds. I'm using Kit as the backend, and you can even sign up without needing JavaScript enabled!
I've been renaming some of my online accounts, so my GitHub is now github.com/ethanhawksley and the site repository has moved to github.com/ethanhawksley/ethanhawksley.github.io
My GitHub profile README is now hooked up to the deployment of my site, so every time I publish a new post, my profile will adjust accordingly.
The theme toggle script has been consolidated to window._getTheme and window.setTheme to reduce duplication across my code without impacting performance adversely.
And finally, I'm now using compressed JPEGs for my OG image previews instead of PNGs, since I was previously having issues with preview images being too large to embed successfully.
🚀It's me, Ethan Hawksley, and I've just finished pushing out another large update to my site hawksley.dev!
I've written a new blog post, all about how you can add JSON-LD to your own personal websites to improve how crawlers see them: hawksley.dev/blog/json-ld-explained-for-personal-websites It uses lots of examples from my own site, so you can easily copy-paste and edit to fit your own site.
I've also now added my photo to my website too! It's in all the link previews, and on my home page. However, I was intentionally really careful when I added it. To maximise performance, I used the AVIF image format, with a PNG fallback. I've also inlined a low-resolution base64 AVIF directly into the html of my home page, so that it instantly loads in when you visit, and a higher quality AVIF loads on top of that once the page has finished loading. I'm really happy with how it turned out, the image is only 2.5KB!
After some careful rearranging of my home page, it also fits in just under the size requirement for the first TCP packet group at 14KB, meaning it only requires one round trip with cloudflare for it to load. My PageSpeed Insights score is still 100/100/100/100
🚢🔥I'm back with a fresh batch of improvements to hawksley.dev my personal site!
I'm Ethan Hawksley on most platforms, but to make me easier to find I created hawksley.dev/elsewhere where I've listed all my profiles in one location, with rel="me" so search engines know I'm the same person.
I've switched over to logical units (inline and block) instead of physical (width and height), and added dir="ltr" to my html to aid internationalisation down the line.
Fixed a flash of white that chromium-based browsers would occasionally experience whilst navigating the site.
Now using astro-compress to minify the resultant site so it's even smaller
Also set up stylelint to run on save so my css stays in an idiomatic order.
And finally my print styles have been improved so if you do Ctrl+P on my site, it should look nice!
My GitHub is github.com/ethan-hawksley and you can check out my repository at github.com/ethan-hawksley/ethan-hawksley.github.io it's fully open source!
🔥🚢Hey! I'm Ethan Hawksley from the UK and I've been working on my personal site and blog for a while now, and I think it's finally at a point I'm happy to ship properly.
Why: I wanted somewhere to write my blog posts and show my work that actually reflects me technically, instead of just a LinkedIn profile.
How: It's built with Astro for zero-JS by default and proper MDX support. I put real effort into a couple places I've not seen many others doing.
IBM Plex fonts subsetted with pyftsubset to just the unicode ranges I'm using.
Full JSON-LD structured data representing myself and my site fully programmatically.
Light & dark mode support with no initial flash of white and js-less fallbacks.
Syntax highlighted code blocks with copy buttons.
WCAG AA compliant accessibility
Support for plenty of web standards, such as openpgpkey, security.txt, WebFinger, and llms/llms-full.txt
100/100 PageSpeed score
Where: hawksley.dev and the blog at hawksley.dev/blog
🚢
🔥
