Improving At HTML!
Introduction
Hey there! Atlas here, just wanted to leave a little update about the website. For more updates, be sure to visit the Website Updates category.
The Vision
Although this website was originally set up using a WordPress template, I knew I wanted to add some unique elements to it. More specifically, designing it to resemble a wiki page. I drew a lot of inspiration from Fandom pages because they were a key tool in the communication between me and Ace. As like minded as we are, it’s hard to describe a game to someone that hasn’t played it.
Links… They’re Everywhere!
That’s where hyperlinks come in. When a character, location, or quest is mentioned, a link will be embedded in the title. This allows us to connect all of Parallax’s elements together, making sure Ace and I are on the same page (literally). But personally, I didn’t like the default color scheme for these links, so I decided to change it.
Decorations
While I’m certainly not a professional web designer, I used to practice learning HTML by creating my own website about superheroes. I discovered this amazing website called w3schools, and I used their section about Text Decoration to remove the underline from a link, change its standard text color, and change its text color when the mouse hovers over it. I’ve always enjoyed it when buttons darken when you hover over them, so I chose to do that with the text.
Since WordPress pages doesn’t treat the code section of individual pages as a standard HTML layout (with a head, body, and style tags), I used the Customization menu to add additional CSS.
To the left, you’ll see that there’s four tags split into two groups. The top two are for a standard link that isn’t interacted with. The bottom two are the same color, but darker, and they’re used for when the mouse hovers over the link or is clicked.
Next, I had to import the CSS into each HTML page. I did this using a “<div>” command and attaching the style to the tag. To keep everything formatted correctly, I placed the opening tag at the very top of the page, and the closing tag at the bottom.
This allowed me to create custom div tags that I then applied to individual links throughout articles. The changes are shown below.
Standard Link |
Link when interacted with |
Reflection
All-in-all, the pages felt more real and personal because I’m the type of person who can’t settle on just one theme. I’m still learning HTML, but this much I do know: if I put up with Ace’s crazy ideas, he’s gotta put up with my aesthetic obsession!
Thanks for Reading!
~ Atlas from Atomic Rush Studios
“Rushers Stick Together”