Ode to Coffee
This was the first time I have used HTML and CSS to create a website, and I actually had a lot of fun creating it. I decided to make a website about how much I love coffee, and because it was a topic I am interested in, it made the process more smooth. The website started as an ode to coffee, and transitioned to an ode to Death Wish Coffee. I pulled some lines from sonnets by Shakespeare and incorporated them throughout. I added images that I found through Google image searches of coffee, and I made myself giggle throughout the process.
I encountered a few hurdles through the process, but none too serious. I ended up leaning on Google a bit more than I anticipated, but it worked out. My only unresolved issue was correctly figuring out how to center the content on the screen, and sort of just using the “text-align:center” command as a workaround. Placing three images next to one another also took me longer to figure out than I would care to admit, and the code looked a little something like this:
“<img src=”download.jpeg” style=”float: none; width: 20%; margin-right: 1%; margin-left: 15%; margin-bottom: 0.5em;”>
<img src=”5Es75EAfsnreVM7FXwN8eS-768–80.jpg” style=”float: middle; width: 30%; margin-right: 1%; margin-bottom: 0.5em;”>
<img src=”images (1).jpeg” style=”float: middle; width: 15%; margin-right: 2%; margin-bottom: 0.5em;”><p
<p style=”clear: both;”>”
I had to adjust the width and margin a handful of times to get them to show up properly aligned.
All of the tools I used on HTML/CSS were new to me, and I had to poke around on the internet to discover how to change text color and details of the like. It was a great learning process as I had to figure out how to incorporate all of the details that I had thought of into a website. After deciding on a subject matter, I opened up VScode and started with HMTL. I used pretty standard commands in HTML for the webpage, and like I said, looked up some of the proper syntax online. Using CSS was easier than I originally thought as all I had to do was use the style tag to indicate which part began the CSS.
Transferring the files into a Github repository was one of the more challenging parts, but once I did it one time slowly (read: slowly like molasses) I understood how to do it over and over again. Here is a link to my Github repo: https://github.com/JacqWal/Coffee-love.git
