DEV Community

T.
T.

Posted on • Edited on

Practicing CSS with Neocities

#css #beginners #webdev #neocities

I built a static webpage for my Neocities site using HTML, CSS, and a couple lines of Javascript to force myself to understand CSS and the box model.

The issue

I started the The Box model lesson around June 24, 2026. The lesson is short but has multiple resources for learning about and practicing the box model. For some reason, these lessons are not sticking. I read and watched each resource twice. After these reviews, I worked on a Rothko painting, did a codealong to create a HTML/CSS portfolio, and began working on a recreating the iconic nutrition facts using HTML and CSS. Nothing is sticking because I cannot layout projects using the box model without continuing to refer to my notes or online resources.

Neocities

Neocities is a website that allows users to create personal webpages that have the look and feel of the "old web". People get really creative and make beautiful looking static websites using pixelated graphics, cute cursors, and more.

I created my account. This is what a Neocities page looks like before a user begins designing their own page.

TeeTeaTe Neocities page before redesign

I decided to create a simple webpage that would allow me to practice CSS - the box model, positioning, and basic HTML as well - forms, semantic HTML tags, and more.

My site is structured with: a root directory, three additional directories, seven additional pages. I used one form and a bit of Javascript (from Google Gemini AI) on my contact page.

Pushing to Github

I'm pretty comfortable pushing to Github. I created my repository (named neocities) first. Then I pushed my root directory to that folder.

Deploying from Github to Neocities

Deploying my site from Github to Neocities was super confusing, so I'll dedicate time over the next week learning more about Devops, CI/CD, and working with Github Actions. This tutorial was easy to understand, and helped make the process simpler.

As I continue through the Foundations course and eventually tackle the Fullstack Javascript learning path by The Odin Project, my Neocities page will be my fun, carefree home online where I can show what I've learned.

What's next

My plan is to redesign my Neocities page monthly. No themes right now, so I'll redesign based on whatever inspires me at the moment. I want to add a few things so I'll list some of them:

  • counters for page views
  • a guestbook
  • responsiveness so mobile viewers can actually enjoy my page

Eventually I also want to design some free themes for Neocities users. Learning more about CSS is making me want to create and design pretty things on the web!

Come say hello!

Check out my Neocities page at teeteate.neocities.org

Please follow me there. I'm excited to meet you, and to share my learning journey over there in real time :)

And while you're at it, leave a comment and follow me on DEV.TO. Let's keep in touch!

Article credits:

Top comments (0)