About This Website
All of the styling and visual organization, like the assets, the container, the sidebar, the "window" borders, are hand-coded by me. The contents of these webpages - that is, the stuff you're reading right now - is done in a special way, though. I convert Markdown files into HTML, because Markdown is a lot easier, and much cleaner to write, than HTML. This allows me to add new pages with minimal effort.
As of October 2022, I use Eleventy now! I still use Markdown, but it's converted to a static website now.
What is Markdown? Markdown is a way to format text files to have special formatting, like bold, headers, or links. You might be familiar with any of the following:
- Bolding, italicizing, or underline text in a Discord message
- Writing in "rich text format". like a Google document or a Microsoft Word document
- Formatting forum posts using BBCode (which, to be honest, is more similar to HTML than Markdown)
- Reading or writing a README file for a GitHub repository
All of these things are very similar to markdown (and in the first and last cases, it IS markdown.) Trust me, writing Discord messages is way less tedious than writing HTML.
Some tools and inspirations I used when creating this site:
- Yesterweb, an online community of people dissatisfied with the current state of the internet and prefer a time where people would carve out their own little space on the world wide web. They reminded me I needed to finish this website. I'm a part of this community but under a different name (again, I have a lot)
- Early Macintosh aesthetics
- The works of graphic designer Susan Kare, who made a lot of the graphics for the first Apple Macintosh
- Hypercard and the games created in it, namely Caper in the Castro (the first LGBT video game!)
- Eliot Gardepe's Hypercard Asset Pack
zero-md, a script that converts Markdown files to HTML- MDN's "Border image generator" for all the crisp pixelated borders on this page. Pro tip: if you want the borders to be pixel-perfect, make sure the "border image width" values are the same as "border-image-slice", and use pixel units!
- Oocities, a 2009 Geocities archive. I browsed a dozen or so websites on this archive to get inspiration for this project.
- The dozens of roleplay themes on Tumblr I tried out back in the day (2015-2017 or so) which all had absymally tiny font sizes and containers smaller than a credit card. Thankfully I don't do that
- blinkies.cafe, a website that lets you generate blinkies with custom text using over a hundred different bases. The creator also made Geoblinkies, which lets you search over 6000 archived Geocities blinkies. I actually personally transcribed about 70 of these and then I had to stop because I found a blinkie made by my ex-friend's mom. I am not kidding
- Chicago FLF, a public domain recreation of Hypercard's "Chicago" font. You can see it used in the sidebar and the logo at the bottom of this window.
- I use Visual Studio Code as my text editor of choice, using the Markdown and Live Server extensions. The former provides nice autocompletion, and the latter allows me to auto-reload, and load resources in the browser.
This is vital, because a static HTML file cannot load the Markdown needed. - As of October 11, 2022, this website has been rewritten in Eleventy! Some stuff on this page has been made irrelevant by this, but it's being kept for posterity. Writing this site in pure HTML and CSS and JSS was a cool party trick, but also more effort than it was worth.