E1 UI Basics and Technical Essay

26 Jan 2022

My first WOD was hard to get used to, I tried it on my own first and only got as far as making the headings and paragraphs correctly. I did not know how to create hyperlinks so I watched the screencast to get familiar with what was expected. I then went back to my VS code and deleted the old version and got as far as creating the hyperlinks for each paragrpah. After getting this far I got stuck again creating the table of contents. The list and anchor was difficult at first but after doing it a few more times I got it down. I then deleted my code, restarted my screencast and got as far as creating the table of contents, adding anchors, and linking them to each paragraph. The logo images were simple to include into the code and after a few times redoing the sizes I got used to adding images. The most difficult parts for me was understanding how to link the table of contents to each paragrah, but after using the anchor and id keys a few more times I felt better and understand how the code communicates. This WOD took me about 5 tries, the act of writing code helps me understand how it is supposed to feel and I can start to see how to get creative with it.

My second WOD took fewer tries after I learned how to use the link tag to integrate the index file and the style file. After getting an understanding how the two files interact with eachother I continued to establish the fonts. This was my first major roadblock and it took me a while to understand the integration of fonts. I had to revert back to the screencast and deleted my code. Once I got better at coding in style.css I felt more comfortable changing fonts, colors, margins, and background color. I then got to the image display and changed the orientation to be on the left side of the text, this was new to me so I was glad to get that figured out with another tip from the screencast so they weren’t too close together, I used margin-right to add some spacing. Overall, this WOD taught me a lot about CSS and I feel much better about styling my documents. This WOD took me a few less tries than the first, after getting some practice I was able to do it in 3 tries. The hardest part for me was including the fonts.

My third WOD took me a while to understand, I first started with separating the paragraphs into three sections by using the div class tags, this is about how far I could go in the beginning. I then went into the screencast to figure out how to link the style.css file to the paragraphs, I learned that you need to do .right, .left, .center, this was tough for me to get down but after practicing a few more times I got it down. After getting this far I learned how to use padding to get some spacing between the paragraphs and practiced doing that by deleting my code, restarting the recording and getting back to this step. Then I deleted the Table of Contents to create a better dislay for it, I had to watch the screencast to get the navbar linked and how to create the inline table of contents. Once I got everything done a few times I then deleted it and started my screencast. It took me about 4 tries to get the entire code done correctly but now I feel that I have a better understanding how to move the paragraphs and lists around.