global: add alt descriptions for images

This commit is contained in:
Agahnim 2026-03-23 16:06:09 +01:00
parent 984088b827
commit 01dfdae15e
3 changed files with 22 additions and 21 deletions

View file

@ -32,31 +32,32 @@
I always liked this type of aesthetic and the mix of melancholy of comfort it brings me. I always liked this type of aesthetic and the mix of melancholy of comfort it brings me.
It feels good to bring that vibe into one of my projects. It feels good to bring that vibe into one of my projects.
<badges> <badges>
<img src="/static/assets/badges/88x31computer.gif" /> <img src="/static/assets/badges/88x31computer.gif" alt="88x31 pixel art badge with a retro computer" />
<img src="/static/assets/badges/cssisawesome.webp" /> <img src="/static/assets/badges/cssisawesome.webp" alt="Badge with text 'CSS is Awesome'" />
<img src="/static/assets/badges/queer.webp" /> <img src="/static/assets/badges/queer.webp" alt="Queer pride flag badge" />
<img width="100px" src="/static/assets/badges/skywardsword.webp" /> <img width="100px" src="/static/assets/badges/skywardsword.webp"
<img src="/static/assets/badges/transrightsnow.webp" /> alt="Cover art for The Legend of Zelda Skyward Sword" />
<img width="30%" src="/static/assets/badges/kirby.gif" /> <img src="/static/assets/badges/transrightsnow.webp" alt="Trans rights badge with text 'Trans Rights Now'" />
<img width="30%" src="/static/assets/badges/pink.gif" /> <img width="30%" src="/static/assets/badges/kirby.gif" alt="Kirby character animated GIF" />
<img width="30%" src="/static/assets/badges/trans.gif" /> <img width="30%" src="/static/assets/badges/pink.gif" alt="Pink animated pixel art badge" />
<img width="30%" src="/static/assets/badges/trans.gif" alt="Trans pride flag animated badge" />
</badges> </badges>
</box> </box>
<box id="smallbox"> <box id="smallbox">
<socials-header> Socials ! </socials-header> <socials-header> Socials ! </socials-header>
<socials> <socials>
<a href="https://github.com/naguiagahnim" target="_blank"><img src="/static/assets/icons/github.webp" <a href="https://github.com/naguiagahnim" target="_blank"><img src="/static/assets/icons/github.webp"
width="30px" /></a> width="30px" alt="GitHub logo" /></a>
<a href="https://open.spotify.com/intl-fr/artist/4BPUhsH6krKkCNFrdMZnZF?si=E3luyIf0S_yfJRmm82S5OA" <a href="https://open.spotify.com/intl-fr/artist/4BPUhsH6krKkCNFrdMZnZF?si=E3luyIf0S_yfJRmm82S5OA"
target="_blank"><img src="/static/assets/icons/spotify.webp" width="30px" /></a> target="_blank"><img src="/static/assets/icons/spotify.webp" width="30px" alt="Spotify logo" /></a>
<a href="https://www.instagram.com/agahnim_music/" target="_blank"><img src="/static/assets/icons/insta.webp" <a href="https://www.instagram.com/agahnim_music/" target="_blank"><img src="/static/assets/icons/insta.webp"
width="30px" /></a> width="30px" alt="Instagram logo" /></a>
</socials> </socials>
<img width="200px" src="/static/assets/gifs/divider2.gif" /> <img width="200px" src="/static/assets/gifs/divider2.gif" alt="Decorative divider" />
</box> </box>
<box id="newsbox"> <box id="newsbox">
<website-news> <website-news>
<img width="70%" src="/static/assets/gifs/updates.gif" /> <img width="70%" src="/static/assets/gifs/updates.gif" alt="Animated text 'Updates'" />
{% for article in news %} {% for article in news %}
<article-entry> <article-entry>
@ -66,7 +67,7 @@
<article-body> <article-body>
{{ article.body }} {{ article.body }}
</article-body> </article-body>
<img width="300px" src="/static/assets/gifs/divider2.gif" /> <img width="300px" src="/static/assets/gifs/divider2.gif" alt="Decorative divider" />
</article-entry> </article-entry>
{% else %} {% else %}
<ominous-message> <ominous-message>

View file

@ -19,18 +19,18 @@
<controls-bar> <controls-bar>
<transport-controls> <transport-controls>
<button data-action="prev" aria-label="Previous"> <button data-action="prev" aria-label="Previous">
<img src="/static/assets/svgs/skip-back.svg" width="12" height="12" alt="" /> <img src="/static/assets/svgs/skip-back.svg" width="12" height="12" alt="Skip back" />
</button> </button>
<button data-action="play" aria-label="Play/Pause"> <button data-action="play" aria-label="Play/Pause">
<img class="play-icon" src="/static/assets/svgs/play.svg" width="12" height="12" alt="" /> <img class="play-icon" src="/static/assets/svgs/play.svg" width="12" height="12" alt="Play" />
<img class="pause-icon" src="/static/assets/svgs/pause.svg" width="12" height="12" alt="" style="display: none;" /> <img class="pause-icon" src="/static/assets/svgs/pause.svg" width="12" height="12" alt="Pause" style="display: none;" />
</button> </button>
<button data-action="next" aria-label="Next"> <button data-action="next" aria-label="Next">
<img src="/static/assets/svgs/skip-forward.svg" width="12" height="12" alt="" /> <img src="/static/assets/svgs/skip-forward.svg" width="12" height="12" alt="Skip forward" />
</button> </button>
</transport-controls> </transport-controls>
<volume-controls> <volume-controls>
<img src="/static/assets/svgs/volume-2.svg" width="12" height="12" alt="" /> <img src="/static/assets/svgs/volume-2.svg" width="12" height="12" alt="Volume" />
<input class="volume-input" type="range" min="0" max="1" step="0.01" value="0.7" /> <input class="volume-input" type="range" min="0" max="1" step="0.01" value="0.7" />
</volume-controls> </volume-controls>
</controls-bar> </controls-bar>

View file

@ -1,4 +1,4 @@
<katcenkat> <katcenkat>
<img src="/static/assets/images/notfound.webp" /> <img src="/static/assets/images/notfound.webp" alt="Pink text, 404 Not Found" />
<img src="/static/assets/images/leuf.webp" /> <img src="/static/assets/images/leuf.webp" alt="A drawing depicting a cute but fat cat" />
</katcenkat> </katcenkat>