Improving the New York Times’ line wrap balancer
Web browsers don’t yet support (text-wrap: balance). Adobe and the NYTimes have offer free JavaScript alternatives. I improved the latter to suit my needs.
HTML
The HyperText Markup Language (HTML.)
The best method for embedding dark-mode friendly SVG in HTML
A comparison of the many different methods for embedding SVG into HTML webpages. Which work best with light/dark-mode, client caching, interactive mode, and more.
Don’t be shady, deploy your JavaScript source maps
Source code minification is beneficial, but the resulting obfuscation reduces trust and transparency. Source maps can help restore these and let people learn.
The difference between RDFa’s property and rel attributes
You can easily get unexpected HTML+RDFa Lite parsing results by unknowingly using it with RDFa Core attributes that just happens to also be HTML attributes.
Make native lazy-loading images load more eagerly
A tutorial on how to load native lazy-loading images earlier in Safari and Firefox. Speed up page loading while keeping visitors from seeing loading images.
Everything you need to know about Night mode in Samsung Internet
Night mode in Samsung browser explained. How it breaks page contrast and accessibility, pastelify SVG colors, and why web developers can’t do anything about it.
Take precautions when linking to outdated or incorrect information
Take some simple precautions when referencing outdated, incorrect, or misinformation via a link. Label it for human and machine readers.
Inconsistent user-experiences with native lazy-loading images
Web browsers has different priorities and user experience trade-offs in their lazy-loading image implementations. Firefox and Safari vastly different to Chrome.
Smarter reusable IPFS chunks from HTML documents
IPFS splits files into chunks. Smarter splitting points in HTML files can create more reusable/deduplicatd chunks with higher availability.
How to use AddToAny as a fallback for the Web Share API
AddToAny offers privacy-by-default content-sharing and is well-suited as a light-weight falback to the native Web Share API.
What to <link rel=dns-prefetch> and when to use preconnect
Learn the difference between dns-prefecth vs preconnect, how to work around browser bugs, and when to use which? iOS and Safari requires special attention.
Optimize your <head> metadata for better compression
Reduce the file size of compressed webpages by optimizing the order of <meta> and <link> elements in the document <head> section.
Mitigate “tabnabbing” without breaking window.open() features
Windows opened from your website can redirect the opening tab to a new destination. Mitigations break window.open() functionality like sizing and positioning.