So to start off I created an account with Code Pen to explore the examples we were shown of coding styles into the HTML code. I used the wrench extract and followed the examples in the lesson recording to see how I could implement them myself.
Once I had gained a basic understanding of how I could implement coding the styles into my HTML code I opened up one of my posts on leeds.graphics in chrome and viewed the source code and inspected elements. I experimented with changing the colour of the page’s heading and adjusting my name on the post as shown during our lesson.
I then saved the page from Google Chrome as a HTML file and opened the code up into Visual Studio Code to start trying to create a new style for my posts on leeds.graphics. I played around with the colour of the heading and the background colour for my page as it had previously just been black text on a white background.
Once I had changed the background colour you were unable to read the body text so I changed the colour of it to white in order for it to stand out on the background again as it had done prior to me changing the background.
I liked how this style came out but the shade of blue was definitely too dark for the page so I researched a lighter blue Hex code and implemented this into the styles of my HTML code so that both the white main body text and the other darker pieces of text are both visible. Here is how my style theme came out once implemented into my page:
Here is my HTML file in Visual Studio Code with the styles implemented into the head portion of the file:
I am really happy with how the style of my HTML came out as it is still legible to read and navigate through the page whilst bringing more colour and life into the post on lead.graphics.
