Devlog 02

2026/07/25-26

Today I discovered that web design is really fun! I loved experimenting with all the different effects I could create using CSS. Honestly, I was surprised by how simple some features were to implement. For example, I hadn’t realized that changing an element’s color based on its state only requires specifying that state (like :hover or :active) before assigning the style rules. 

Completed Work

So far I have only really been polishing the home page. 
Here is a brief overview of things I have completed:

• Added two google fonts

I chose Lora as my body text as it is known for being a readable font and I really wanted to use a serif font for this website. I chose DM Serif Display as my header font because it is still serif, but distinct enough from Lora that the headers still pop out and keep the page from looking bland.

• Determined website color pallette and applied the colors to background and text (including links and their various states)

I went for a cream-colored background, with earthy tones as accents.

• Centered home page text and added a subtle glow effect to all letters using text shadow
• Formatted buttons
• Added intro animation 

It’s a little bit dramatic but was really fun and not too hard to implement. I spent some time adding a JavaScript function to allow someone to skip the animation by clicking or pressing a key as I found it a bit annoying to have the animation replay every time I went back to the homescreen.

• Polished “What I’m currently reading section” on the home page.

By doing this, I learned how useful flex boxes are for organizing content. They made it much easier to design the “Currently Reading” section on my homepage as everything aligned neatly without me having to fight with margins or positioning. Most of my time today went into experimenting with this layout. I think I’ll use a similar CSS structure when building the journal pages later on. 

Google’s search AI, Gemini, was a huge help in finding the syntax I needed quickly. However, I made sure to write all my code myself. Instead of asking AI to build entire sections of my project, I only used it to clarify specific syntax questions (like how to rotate a flex box) and then worked through the implementation on my own.

Next Steps

Before I go any further, I’m going to have to work on my organization. My indentation is inconsistent and has been making looking over my code a bit confusing!

After that, I’m going to work on the navigation, and then I am going to continue working on the CSS for the other pages. I’ll probably simultaneously work on the Javascript for certain elements at the same time - meaning my third devlog might be my last.

Thanks for reading!