How I made my website: HTML resources, credits, inspiration
Posted: 07-10-2025
Expand for wittering about neocities and the state of social media
A few years ago I started surfing Neocities. I wasn’t having fun online any more, the social media I used had become a depressing landscape of commerce. I missed the days where the internet was a hideout for freaks and nerds to talk about their hobbies and make art and videos, without feeling the pressure to monetise their existence there – or even seeing it as an option. Neocities was a glimpse back into this, personal websites as a pure and uncringing display of passion. And surfing sites on Neocities was actually fun. I wanted to make a website too.
I got my boyfriend to teach me the basics of HTML and CSS – but even if you don't have someone to teach you, I think picking up the basics online isn't too hard. The wonderful thing about HTML is that you don't need to know everything before you can get started – in fact, I doubt there are many people at all that know everything. It really clicked for me and I enjoy it so much. I continued to learn through inspecting the HTML of other people's sites and googling, mostly. Here are some of the resources I use in the making of my site:
Coding resources:
VISUAL STUDIO CODE: The software I write my HTML and CSS in, with the skin Rosely Light which I think is gentle and pretty
MDN WEB DOCS: My go to resource for HTML and CSS terminology, I'm here CONSTANTLY
CSS TRICKS GRIDS AND FLEX BOX: Great visual cheat sheets about grids/flexbox which are basically the foundation of every part of my site
BOX SHADOW CSS GENERATOR: Useful visualiser for box shadow CSS which I often visit to get my head around things
CSS BACKGROUND PATTERNS: I used this to generate css for the background patterns on my site, which I then edited through trial and error.
ELEVENTY: I'll admit, this is a bit more complicated and I don't fully understand what I'm doing. I use this to insert the header/footer so I don't have to edit every page individually, and to structure my blog. If you're a beginner I wouldn't recommend using this unless you have someone to help you with it like I did.
Other Resources:
The main font used on my site is Bit Regular, a pixel font I made myself that you can download for free here if you want to use it! I made the font using bitfontmaker2 if you want to try your hand at making your own pixel font.
The title font I use on my portfolio page is JMH Cthulhumbus Arcade by Jorge Morón.
Background images from Betty's Graphics
Inspirations:
miniSUPER Sticker Club: I'm a long time fan of MilkBBI and I love what Justin Wallis has done with this project. Beautiful sleek yet nostalgic design. As a side note I really like their artist interviews too.
Bennizone: I'm super inspired by Benni's site!! I think the influences on my site are obvious. Although I've started with a pretty stripped back/formal portfolio, I definitely want to make this place more fun and playful, and Benni's site really inspires me on that front too!
Kyu: Although Kyu's site has gone through a lot of changes since the design that first inspired me, I'm really into their design sensibility in general.
Humanfinny: Finny's site makes me feel so nostalgic, they nailed the look. Really gorgeous and rich site!
Fossilfruits: Wait... isn't this my own site? Yeah, this is my first neocities page! I link to a bunch of other sites I like on there, and in general it's my space to play and experiment. I kind of want to remake the whole thing, or blend my two sites together...