New update de la ʙℓÅⅈℜⅇαµ ℤΩℕℰ

Au menu :
Un système de missions et d'Achievements avec 15 missions top secrètes pour les aventuriers du Web les plus intrépides
Un affichage de la dernière version en ligne avec patch note concis pour les curieux du code hihi...

https://blaireau.zone

I redesigned my blog-meets-literature site ‘Samuel Pepys’ Diary Reimagined’ with a new webfont.

I have always loved typewriter fonts but any and all digital creations lacked authenticity because on a real typewriter, due to various factors letters a never identical. The font ‘TT2020’ by Fredrick Brennan includes several versions of each letter, simulating the unevenness of the real thing quite well.

Downside: the font files are huge.

Would you be so kind as to test my site and provide me with some insight how well or badly it performs (in terms of loading times)?

(Mobile users with limited data rates, beware! The font files add up to 5.3 MiB [5.6 MB].)

https://babumenos.com/SPDR/

The font is here: https://copypaste.wtf/

Worked on the Lunatics release page CSS a little.

I had noticed that the page works very poorly on e-ink devices like my InkPad 3 Color reader's browser, because of the animated background effect, which I'm still pretty attached to.

It moves pretty slowly, but it still created updates with constant flickering as my e-reader tried to keep up.

Of course, the page is really designed to distribute or stream video, so it's normally intended for full-motion video browsers. The video is never going to work right on an e-reader.

But there's also credits and other text information on the site.

So, I looked up methods to fix this with CSS media queries, and I think it's fixed now.

It now only animates if the browser reports media type "screen" and feature "update: fast".

And this correctly suppresses animation now on my InkPad 3 Color e-reader. If you happen to have a similar device or other oddball browser, I'd be interested if the page is working for you.

Still working on honoring other parameters like "prefers-reduced-motion", "prefers-color-scheme", and "prefers-contrast". I would like to get those working as well.

Ultimately, I may add a Javascript button to change the behavior manually, but the page currently is HTML and CSS only to keep it lighter weight.

I did also test it in a text-only browser, w3m, where it looks pretty correct. Haven't tried other ones.
#LunaticsProject #WebDesign #CSS #MediaQueries #Testing

I've recently changed the style and behaviour for external links on my website. I use them a lot and while the icons I used previously to indicate external links are very clear, they make the text look cluttered to me (see first pic).

Inspired by https://thomasrigby.com (thanks @hryggrbyr !) I opted for a subtler visual difference: dotted underline for inline links and a double underline for external links. To me it looks calmer.

Also, everything now opens in the same tab, so it's up to you to open links in a new tab, if you prefer.

What do you think? Do you have any preference or do you not really care to know if a link is external or internal?

#css #indieweb #webdesign #webdev

What is green web hosting?

Where to test your current website

Where to find a directory of green web hosts in your country

https://clearcutderby.uk/what-is-green-web-hosting/

Any #liberal US-based #WebDesign folks out there that might be interested in volunteering a bit of time to help jazz up a non-profit informational political tool?

Please DM me if so.

PlayStation Store Official Website (2000)

12 principles of web #accessibility by @heydon

https://www.ncdt.nl/programma/presentatie/38/12-principles-of-web-accessibility/

Words to live / code / design by

(read it here: https://github.com/Heydon/principles-of-web-accessibility)

#Design #Guides
Writing ‘alt’ text with AI · With proper prompts, AI can simplify the process https://ilo.im/164y55

_____
#Accessibility #Images #AltText #ProductDesign #UiDesign #WebDesign #Development #WebDev #Frontend #HTML

Hey webfolk! I'm a cloud engineer who can code in several languages, both high and low level. I hand-crank my own website with a static generator and no framework (see https://www.peperell.com/) but my web design skills are severely lacking. Can anyone recommend a book which focuses on web design principles suitable for someone like me?

I'm more interested in the theory and how to apply it in a web context rather than "this is what HTML is" and "this is what CSS is" content.

Ideas welcome.

Ever wondered how architect Mies van der Rohe's "less is more" philosophy would translate to web design?

We explored the concept of a website inspired by his iconic style: strong grids, clean lines, and purposeful minimalism. The result is a masterclass in structure and clarity.

Read our thoughts: https://webheadsunited.com/what-if-mies-van-der-rohe-designed-a-website/

The best design inspiration is often right outside our windows. As we head into the heart of summer, it's a great time to think about how nature informs our digital aesthetics.

This post from Silphium Design explores stunning color palettes derived from seasonal and environmental schemes. A great resource for bringing an organic, harmonious feel to your next UI or design project.

Find your inspiration: https://silphiumdesign.com/color-palettes-nature-environmental-schemes/

Die perfekte Verbindung zwischen Instagram und Fediverse

Oft ist Insta­gram der aktu­ells­te Kanal vie­ler Orga­ni­sa­tio­nen. Dabei soll­te eine aktu­el­le Web­site die Basis jeder digi­ta­len Prä­senz sein. Wer bei­des mit­ein­an­der ver­bin­den will und dazu einen Fuß ins Fedi­ver­se set­zen will, kann das mit Word­Press tun.

https://kaffeeringe.de/2025/06/25/die-perfekte-verbindung-zwischen-instagram-und-fediverse/

We’re learning how to create and share MEDIA in our “Creating Cool Websites” summer camp! Today we are adding AUDIO with Vocaroo to our “Favorite Animals”
Google Sites, and starting our “City Travel webpage” project with Adobe Express!

https://lessons.wesfryer.com/courses/summer-2025/cool-websites

Petshop WordPress theme – Build a website for pet stores, veterinary clinics, dog training classes, animal shelters and pet hotels, dog/cat trainers, or pet caretakers. Petshop is a creative WordPress theme for Pets and Vets with a fresh and clean responsive design https://visualmodo.com/theme/petshop-wordpress-theme/
#Petshop #Shop #Pets #Animals #WordPress #Theme #Templates #Plugins #SiteBuilder #WebDesign #WooCommerce

Paleta de hoy

Seguidores—¿les cuesta elegir colores?
A mí me pasaba… hasta que probé Palette Box v2.0.0

Extrae colores + sugiere paletas automáticamente
Guarda presets, comparte códigos, exporta JSON
$2/mes o $70 lifetime
¡3 meses GRATIS! PALETTEBOXFREE3MONTH

¡Sígueme para más paletas diarias!
https://chromewebstore.google.com/detail/palette-box/dbokpdajfkdaglkgojjjocclfnilbhao
#WebDesign #UIDesign #IndieDev #ColorPalette #DevTools #ChromeExtension

今日のおすすめ色

フォロワーの皆さん、配色に悩んでませんか？
私も昔は苦戦…でもPalette Box v2.0.0で一発解決

Web色抽出＋自動配色提案
プリセット保存、コード共有、JSON出力OK
月$2 / 買切$70
3ヶ月無料: PALETTEBOXFREE3MONTH

フォローで毎日おすすめ配色紹介中！
https://chromewebstore.google.com/detail/palette-box/dbokpdajfkdaglkgojjjocclfnilbhao
#WebDesign #UIDesign #IndieDev #ColorPalette #DevTools #ChromeExtension