Bookmark
How to think about HTML responsive images
https://danburzo.ro/responsive-images-html/, posted Apr '24 by peter in css development graphics howto html reference webdesign
Here’s how I made sense of responsive image content, progressing from simpler to more complicated — and then back to simple.
Bookmark
Tree views in CSS
https://iamkate.com/code/tree-views/, posted 2022 by peter in css development howto html webdesign
A tree view (collapsible list) can be created using only HTML and CSS, without the need for JavaScript. Accessibility software will see the tree view as lists nested inside disclosure widgets, and the standard keyboard interaction is supported automatically.
Bookmark
h-feed - Microformats Wiki
https://microformats.org/wiki/h-feed, posted 2021 by peter in development html rss standard webdesign
h-feed is a simple, open format for publishing a stream or feed of h-entry posts, like complete posts on a home page or archive pages, or summaries or other brief lists of posts. h-feed is one of several open microformat draft standards suitable for embedding data in HTML.
Bookmark
HTTPWTF | HTTP Toolkit
https://httptoolkit.tech/blog/http-wtf/, posted 2021 by peter in communication development webdesign
HTTP is fundamental to modern development, from frontend to backend to mobile. But like any widespread mature standard, it's got some funky skeletons in the closet.
Some of these skeletons are little-known but genuinely useful features, some of them are legacy oddities relied on by billions of connections daily, and some of them really shouldn't exist at all. Let's look behind the curtain:
Bookmark
axe-core: Accessibility engine for automated Web UI testing
https://github.com/dequelabs/axe-core, posted 2021 by peter in automation development free opensource software testing webdesign
Axe is an accessibility testing engine for websites and other HTML-based user interfaces. It's fast, secure, lightweight, and was built to seamlessly integrate with any existing test environment so you can automate accessibility testing alongside your regular functional testing.
Bookmark
Gradient Magic - Fantastic and Unique CSS Gradients
https://www.gradientmagic.com/, posted 2020 by peter in css design graphics html webdesign
Gradient Magic is the largest gallery of CSS Gradients on the web, with new and exciting gradients added every day.
CSS Gradients are fancy patterns created via CSS, primarily used to add color or patterns to a website. They have many benefits over images, including being easier to work with and much smaller in size.
Bookmark
Wired Elements
https://wiredjs.com, posted 2020 by peter in css development free opensource webdesign
A set of common UI elements with a hand-drawn, sketchy look. These can be used for wireframes, mockups, or just the fun hand-drawn look.
Bookmark
Hostnames and usernames to reserve - Geoffrey Thomas (geofft)
https://ldpreload.com/blog/names-to-reserve, posted 2020 by peter in development howto list reference security webdesign
If you're setting up a service where people can register their own usernames to be used as a hostname (
username.example.com
), email address (username@example.com
), or URL path (example.com/username
) within your domain, there are some common names you should avoid letting the general public register.
...
This is a list of all the names I know that should be restricted from registration in automated systems. If you know of others, please let me know and I'll update this page.
Bookmark
Self-Hosting Google Web Fonts | Mario Ranftl
https://google-webfonts-helper.herokuapp.com/fonts, posted 2020 by peter in css google online typography webdesign
From author's notes:
Let’s get this straight: The effort to host Google web fonts on your own server is immense! First of all you need to download all
.eot
,.woff
,.woff2
,.ttf
and.svg
files, then copy them onto your server and finally paste a CSS snippet.Sounds easy? Well it could be, if Google would actually provide any direct links to download these files and a customized CSS for self-hosting them. To fix this problem without using font generation services like Font Squirrel, I decided to publish a little service called google-webfonts-helper.
Bookmark
Google AMP lowered our page speed, and there's no choice but to use it - unlike kinds
https://unlikekinds.com/article/google-amp-page-speed, posted 2019 by peter in business crapification development google webdesign
According to Google’s own Page Speed Insights audit (which Google recommends to check your performance), the AMP version of articles got a performance score of 80. The non-AMP versions? 86. Mind you, the AMP versions are hobbled - unauthorised javascript interaction is forbidden by Google, so you can’t vote or comment in place - it’ll kick you to the full version of the page. This is the fruit of weeks of labour converting the site: a slower, less interactive, more clunky site.