accessibility maxxing
This commit is contained in:
parent
6c9294f0a0
commit
f18a342ae5
64 changed files with 320 additions and 205 deletions
|
@ -9,11 +9,11 @@ avatar: /assets/img/art/sundae_glistening.png
|
|||
|
||||
<time datetime="{{date|ISO}}">{{date|readable}}</time>
|
||||
|
||||
<p aria-label="Post warning">WARNING: BORING NERD TOPIC AHOY</p>
|
||||
<section aria-label="Post warning">WARNING: BORING NERD TOPIC AHOY</section>
|
||||
|
||||
I had mentioned on my Neocities profile that I would look into re-writing my website fairly soon right after pushing an update out. Took a bit longer than I would've liked honestly, but it's here!
|
||||
|
||||
Actually, it had been mostly finished for a while (since July 1), but I hit a couple of roadblocks (mainly date conversion) that demoralized me from working more on it at the time, as well as some lifestyle changes, like spending less time on the PC and exercising often.
|
||||
Actually, it had been mostly finished for a while (since July 1st), but I hit a couple of roadblocks (mainly date conversion) that demoralized me from working more on it at the time, as well as some lifestyle changes, like spending less time on the PC and exercising often.
|
||||
|
||||
**The most notable things about my site re-write off the top of my head are:**
|
||||
* converting page elements into `.json` data tables
|
||||
|
@ -22,18 +22,18 @@ Actually, it had been mostly finished for a while (since July 1), but I hit a co
|
|||
|
||||
### I have <s>no</s> some idea what I'm doing
|
||||
|
||||
For starters, porting a website (at least one that's paw-written by yours truly) to a static site generator like {% ai "https://11ty.dev/"%}Eleventy{% endai %} was definitely something, having only dabbled with editing `.html` and `.css` files without hosting a local server.
|
||||
For starters, porting a website (at least one that's paw-written by yours truly) to a static site generator like [Eleventy](https://11ty.dev/) was definitely something, having only dabbled with editing `.html` and `.css` files without hosting a local server.
|
||||
|
||||
Initially I went looking around for a base (as to not start from complete scratch) to use and found {% ai "https://github.com/5t3ph/smol-11ty-starter"%}Smol 11ty Starter by 5t3ph{% endai %} and set it up.
|
||||
Initially I went looking around for a base (as to not start from complete scratch) to use and found [Smol 11ty Starter by 5t3ph](https://github.com/5t3ph/smol-11ty-starter) and set it up.
|
||||
|
||||
I was **very eager** to start working on it, and because I decided to do so late at night, I didn't consult any documentation and thus felt like it would be impossible to learn {% ai "https://mozilla.github.io/nunjucks/"%}Nunjucks{% endai %} (one of the [templating languages](https://www.11ty.dev/docs/languages/) used in Eleventy) got upset, settled down and slept.
|
||||
I was **very eager** to start working on it, and because I decided to do so late at night, I didn't consult any documentation and thus felt like it would be impossible to learn [Nunjucks](https://mozilla.github.io/nunjucks/) (one of the [templating languages](https://www.11ty.dev/docs/languages/) used in Eleventy) got upset, settled down and slept.
|
||||
|
||||
### You're telling me that Java scripted this?
|
||||
|
||||
|
||||
I still don't understand JavaScript that well, got stumped on a couple of things, and as a result I took some time off working on the re-write.
|
||||
|
||||
Regardless, I had ported over the base layout and most pages, which would be around 90% of the work done within the first couple of days. The last 10% that was left being: having to tackle date conversion with {% ai "https://github.com/moment/luxon" %}Luxon{% endai %}, setting custom filters for Eleventy to use them and forgetting to port a few page elements to `.json` data tables.
|
||||
Regardless, I had ported over the base layout and most pages, which would be around 90% of the work done within the first couple of days. The last 10% that was left being: having to tackle date conversion with [Luxon](https://github.com/moment/luxon), setting custom filters for Eleventy to use them and forgetting to port a few page elements to `.json` data tables.
|
||||
|
||||
Currently, my filters are handled really shittily, but they work whenever I build my site.
|
||||
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
---
|
||||
description: I heard you like rewrites, so we put rewrites in your rewrites, so you can rewrite while you rewrite
|
||||
date: 2025-06-25
|
||||
blurb: <p>i hate luxon</p><p><a href="/assets/img/blog/luxon.png"><img src="/assets/img/blog/luxon.png"></a></p>
|
||||
blurb: <p>i hate luxon</p><p><a href="/assets/img/blog/luxon.png"><img src="/assets/img/blog/luxon.png" alt="Collage of various cartoon characters from different media wielding a pistol pointed at Luxon, collectively saying 'Sorry Luxon but your documentation sucks, so die' to which Luxon replies with 'I understand'"></a></p>
|
||||
avatar: /assets/img/art/sundae_lick.gif
|
||||
---
|
||||
## {{page.fileSlug}}
|
||||
|
@ -13,11 +13,11 @@ I haven't worked on much of anything the past 8+ months, and out of the blue, I
|
|||
|
||||
It's now [open source](https://bunsin.space/forgejo/sundae/website) under <abbr title="Creative Commons Attribution-NonCommercial-ShareAlike 4.0">CC-BY-NC-SA 4.0</abbr>!
|
||||
|
||||
Besides that, a lot is new, actually. For starters, I ported the site over to a fresh build of {%ai "https://github.com/11ty/eleventy/releases/tag/v3.1.0"%}Eleventy 3.1.0{%endai%}, which was way easier than I expected, [since I originally started from a base](/blog/break-time#i-have-no-some-idea-what-i'm-doing).
|
||||
Besides that, a lot is new, actually. For starters, I ported the site over to a fresh build of [Eleventy 3.1.0](https://github.com/11ty/eleventy/releases/tag/v3.1.0), which was way easier than I expected, [since I originally started from a base](/blog/break-time#i-have-no-some-idea-what-i'm-doing).
|
||||
|
||||
I figured out that standard `markdown` doesn't implement header links (without manually adding in inline `html` headings with `id` attributes), so I ended up switching to {%ai"https://github.com/markdown-it/markdown-it"%}markdown-it{%endai%} and {%ai"https://github.com/valeriangalliat/markdown-it-anchor"%}markdown-it-anchor{%endai%}.
|
||||
I figured out that standard `markdown` doesn't implement header links (without manually adding in inline `html` headings with `id` attributes), so I ended up switching to [markdown-it](https://github.com/markdown-it/markdown-it) and [markdown-it-anchor](https://github.com/valeriangalliat/markdown-it-anchor).
|
||||
|
||||
I switched to using {% ai "https://date-fns.org/" %}date-fns{% endai %} aswell, instead of {%ai"https://github.com/moment/luxon/"%}Luxon{%endai%}. This library is just way better documented, for someone that still sort of struggles with JavaScript.
|
||||
I switched to using [date-fns](https://date-fns.org) aswell, instead of [Luxon](https://github.com/moment/luxon/). This library is just way better documented, for someone that still sort of struggles with JavaScript.
|
||||
|
||||
Here's a snippet of my time filters in my `eleventy.config.js`:
|
||||
|
||||
|
@ -42,8 +42,8 @@ I've changed them to be more minimal, mimicking Windows desktop entries with the
|
|||
|
||||
If you'd like to implement the shelving for your own website, you can find the source files in the [old branch](https://bunsin.space/forgejo/sundae/website/src/branch/old).
|
||||
|
||||
<section><a href="/assets/img/blog/shelf.png"><figure><img src="/assets/img/blog/shelf.png"><figcaption>How the shelving featuring my personal favorite games and music looked before.</figcaption></figure></a>
|
||||
<a href="/assets/img/blog/media.png"><figure><img src="/assets/img/blog/media.png"><figcaption>How it looks now.<br>Note: the cut-off in the middle is meant to showcase the light and dark theme.</figcaption></figure></a></section>
|
||||
<section><a href="/assets/img/blog/shelf.png"><figure><img src="/assets/img/blog/shelf.png" alt=""><figcaption>How the shelving featuring my personal favorite games and music looked before.</figcaption></figure></a>
|
||||
<a href="/assets/img/blog/media.png"><figure><img src="/assets/img/blog/media.png" alt=""><figcaption>How it looks now.<br>Note: the cut-off in the middle is meant to showcase the light and dark theme.</figcaption></figure></a></section>
|
||||
|
||||
I largely wanted to move away from it because, I mean... it's all a huge `css` crime, and I just wanted something less flashy, really.
|
||||
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
description: Working with Linux
|
||||
date: 2024-06-22
|
||||
modified: 2025-09-09
|
||||
blurb: <p><a href="https://blog.codinghorror.com/the-works-on-my-machine-certification-program/"><img src="/assets/img/blog/works-on-my-machine.png"></a></p><p>whatever i'm using might not necessarily work for you</p>
|
||||
blurb: <p><a href="https://blog.codinghorror.com/the-works-on-my-machine-certification-program/"><img src="/assets/img/blog/works-on-my-machine.png" alt="Shiny golden stamp with text 'Works on my machine'"></a></p><p>whatever i'm using might not necessarily work for you</p>
|
||||
avatar: /assets/img/art/sundae_glistening.png
|
||||
---
|
||||
## {{page.fileSlug}}
|
||||
|
@ -10,9 +10,9 @@ avatar: /assets/img/art/sundae_glistening.png
|
|||
|
||||
<section aria-label="Addendum">
|
||||
|
||||
With Microsoft announcing that {%ai"https://support.microsoft.com/en-us/windows/windows-10-support-ends-on-october-14-2025-2ca8b313-1946-43d3-b55c-2b95b107f281"%}Windows 10 will stop being supported after October 14, 2025{%endai%}, I highly recommend looking into Linux if your device is on Windows 10 and you don't want to buy a whole new device that meets the system requirements of 11.
|
||||
With Microsoft announcing that [Windows 10 will stop being supported after October 14, 2025](https://support.microsoft.com/en-us/windows/windows-10-support-ends-on-october-14-2025-2ca8b313-1946-43d3-b55c-2b95b107f281"), I highly recommend looking into Linux if your device is on Windows 10 and you don't want to buy a whole new device that meets the system requirements of 11.
|
||||
|
||||
Here's {%ai"https://kde.org/for/w10-exiles/"%}a handy resource{%endai%} if you aren't sure how to proceed.
|
||||
[Here's a handy resource](https://kde.org/for/w10-exiles/) if you aren't sure how to proceed.
|
||||
|
||||
I'm not paid or anything to mention this, I just think **we shouldn't have to put up with capitalist bullshit to continue using a device.**
|
||||
</section>
|
||||
|
@ -37,17 +37,17 @@ So... the hardest part about moving is, well, how would I move to Linux? There's
|
|||
|
||||
### Decisions
|
||||
|
||||
I went to set up a virtual machine to understand what I'd want out of a "new" operating system, so I tried out {%ai"https://fedoraproject.org/#editions"%}Fedora Workstation{%endai%} at first and it felt pretty seamless, I didn't have to use the terminal for much of anything.
|
||||
I went to set up a virtual machine to understand what I'd want out of a "new" operating system, so I tried out [Fedora Workstation](https://fedoraproject.org/#editions) at first and it felt pretty seamless, I didn't have to use the terminal for much of anything.
|
||||
I tinkered with it for a couple of days before deciding to look up system/media installers for Linux distributions (that are able to be run on Windows) and coming up empty-handed, cluelessly thinking that somehow only Windows manages to offer one.
|
||||
|
||||
...Until I found {%ai"https://wiki.debian.org/DebianInstaller/Loader"%}Debian's System Installer for Windows (win32loader){%endai%}, which I tried running under a Windows 11 virtual machine to see if it would fail to install, and it didn't!
|
||||
...Until I found [Debian's System Installer for Windows (win32loader)](https://wiki.debian.org/DebianInstaller/Loader), which I tried running under a Windows 11 virtual machine to see if it would fail to install, and it didn't!
|
||||
So I just went ahead and installed it over my actual Windows partition (backing up my documents prior).
|
||||
|
||||
<aside>{%ai"https://www.ventoy.net"%}Ventoy{%endai%} is able to <a href="https://www.ventoy.net/en/faq.html">boot from a HDD/SSD</a> if you are willing to sacrifice one (temporarily) to install it on there.
|
||||
<aside><img src="https://www.google.com/s2/favicons?domain=https://ventoy.net" alt=""><a href="https://www.ventoy.net/en/faq.html">Ventoy is able to boot from a HDD/SSD</a> if you are willing to sacrifice one (temporarily) to install it on there.
|
||||
|
||||
<b>I didn't know this</b>, and I've hardly seen anyone bring up solutions, besides off-handed suggestions about using a flash drive—and every guide basically centering around that notion, but a flash drive is <em>not necessary.</em></aside>
|
||||
|
||||
I would <u>not recommend</u> installing {%ai"https://www.debian.org"%}Debian{%endai%} to anyone new to Linux whatsoever, or with the method I used.
|
||||
I would <u>not recommend</u> installing [Debian](https://www.debian.org) to anyone new to Linux whatsoever, or with the method I used.
|
||||
|
||||
Here's a little anecdote:
|
||||
|
||||
|
@ -63,11 +63,11 @@ If anything, at least I got some experience with the terminal, which I thought i
|
|||
|
||||
Besides Debian, so far I've tried:
|
||||
|
||||
* {%ai"https://fedoraproject.org/"%}Fedora{%endai%}
|
||||
* [Fedora](https://fedoraproject.org)
|
||||
_(Aforementioned in a virtual machine. Overall very solid, might come around to using it again)_
|
||||
* {%ai"https://manjaro.org/"%}Manjaro{%endai%}
|
||||
* [Manjaro](https://manjaro.org/)
|
||||
_(Tries too hard being beginner-friendly, needed to tinker to get my Nvidia GPU to work) as of v24/Wynsdey_
|
||||
* {%ai"https://endeavouros.com/"%}EndeavourOS{%endai%}
|
||||
* [EndeavourOS](https://endeavouros.com/)
|
||||
_(Works out of the box with my Nvidia GPU, minimal issues)_
|
||||
|
||||
And out of them, Endeavour has been the most comfortable experience for me, so far.
|
||||
|
@ -82,19 +82,19 @@ It's personally been no cost to me with the hobbies I have, keyword: <u>personal
|
|||
Here's a few programs I used before switching over, that didn't/won't have a Linux port:
|
||||
|
||||
|
||||
* {%ai"https://notepad-plus-plus.org"%}Notepad++{%endai%}, replaced by {%ai"https://vscodium.com/"%}VSCodium{%endai%}
|
||||
* {%ai"https://getpaint.net/"%}paint.net{%endai%}, replaced by {%ai"https://www.gimp.org"%}GIMP{%endai%}
|
||||
* {%ai"https://www.foobar2000.org"%}foobar2000{%endai%}, replaced by {%ai"https://deadbeef.sourceforge.io/"%}DeaDBeeF{%endai%}
|
||||
* {%ai"https://www.nvidia.com/en-us/geforce/geforce-experience/shadowplay/"%}Nvidia ShadowPlay{%endai%}, replaced by {%ai"https://obsproject.com"%}OBS Studio{%endai%}, which I achieved by toggling "Enable Replay Buffer" in the Output settings and setting up keybinds associated.
|
||||
* [Notepad++](https://notepad-plus-plus.org), replaced by [VSCodium](https://vscodium.com/)
|
||||
* [paint.net](https://getpaint.net/), replaced by [GIMP](https://www.gimp.org)
|
||||
* [foobar2000](https://www.foobar2000.org), replaced by [DeaDBeeF](https://deadbeef.sourceforge.io/)
|
||||
* [Nvidia ShadowPlay](https://www.nvidia.com/en-us/geforce/geforce-experience/shadowplay/), replaced by [OBS Studio](https://obsproject.com), which I achieved by toggling "Enable Replay Buffer" in the Output settings and setting up keybinds associated.
|
||||
|
||||
... that being said, the programs that I do miss using from Windows are:
|
||||
|
||||
* {%ai"https://getsharex.com/"%}ShareX{%endai%}
|
||||
* [ShareX](https://getsharex.com/)
|
||||
_(screenshotting utility)_
|
||||
* {%ai"https://www.voidtools.com/"%}Everything by voidtools{%endai%}
|
||||
* [Everything by voidtools](https://www.voidtools.com/)
|
||||
_(fast file search/indexer)_
|
||||
|
||||
<aside>If you are curious about what kind of programs Linux offers, take a look at {%ai"https://apps.kde.org"%}KDE apps{%endai%}, {%ai"https://apps.gnome.org"%}GNOME apps{%endai%} and {%ai"https://flathub.org/"%}Flathub{%endai%}.</aside>
|
||||
<aside>If you are curious about what kind of programs Linux offers, take a look at <img src="https://www.google.com/s2/favicons?domain=https://kde.org" alt=""><a href="https://apps.kde.org">KDE apps</a>, <img src="https://www.google.com/s2/favicons?domain=https://gnome.org" alt=""><a href="https://apps.gnome.org">GNOME apps</a> and <img src="https://www.google.com/s2/favicons?domain=https://flathub.org" alt=""><a href="https://flathub.org">Flathub</a>.</aside>
|
||||
|
||||
ShareX is by and large the most useful tool for taking screenshots and packed with some miscellaneous multi-purpose tools inside, both [Spectacle](https://apps.kde.org/spectacle/) and [Flameshot](https://flathub.org/apps/org.flameshot.Flameshot) felt a bit lackluster in comparison.
|
||||
Despite that, I've been using Spectacle and it's pretty good if I look past that.
|
||||
|
@ -104,7 +104,7 @@ Everything by voidtools is just muscle memory as a result of Windows's slow sear
|
|||
|
||||
### GAMING
|
||||
|
||||
Linux can run a ton of games with {%ai"https://www.protondb.com/"%}Proton{%endai%}
|
||||
Linux can run a ton of games with [Proton](https://www.protondb.com)
|
||||
I'm not super knowledgeable about its inner workings, so I'm not gonna try to sound like I do.
|
||||
|
||||
...yeah I don't have much to say about this at the time of writing, I've basically been shuffling 3 games whenever I do play something lately. It's not been bad so far!
|
Loading…
Add table
Add a link
Reference in a new issue