I was worried before I started to do my WOD 1, BrowserHistory1, since I never had experience in making a web page and did not faimiliar with the HTML language. When I was doing my WODs, it was a challenge, but I found that it was very interesting to practice and make web page. Thus, I really enjoyed doing these WODs.
BrowserHistory 1, was the first WOD I did. The final version of the web page should have a large header with several small headers, an unordered list, some paragraphs and three pictures with the right sizes. Even though I read all of the readings, it was still a challenge to applied what I learned into the practice of web page design. To set up the heading and paragraphs were easy since the html tags and the logic of putting these tags in order were very easy to understand. The “Table of contents” and the image part were difficult, and I tried them for several times. Even though I knew that the tag for unordered list, I just put the unordered list tag in my html file without putting any list tag, which caused the web page look different from the model. I was confused and could not figure out what’s wrong with that, so I watched the video and understood the process of adding a list in the html file. When I fixed it, I could understand the logic behind the list tag, which is like the dot in front of each list item. The image part was hard because of the tag and the language. I remembered I forgot the tag to insert an image in my html file in the first trial. During the second trial, I spelled the source tag wrong, which caused the image not show out, but I did good job finally, and finished everything within 10 minutes.
After I finished my first WOD and pulled my work in GitHub, I felt very happy and had a sense of accomplishment, because the feeling of solving a problem was so good! My suggestion for WOD 1 is to double check all of the html tags and make sure there is no missing words or misspelling.
When I did WOD 2, BrowserHistory 2, I gained some confidence from WOD 1 and finished it within 5 minutes by trying it for five times. Even though I redid it for many times, I could learn many new things and improve my skills in every trial. The challenge part of WOD 2 was my browser could not refresh the new update in html file. Even though I clicked the refresh button in the browser, nothing was updated. At first, I just doubted my work and kept checking my html tags and other things for many times. When I was sure that my html tags and the language were corrected, I tried to think another reason to cause the page not update. Since I dropped the html file in my browser, it had something new there. Then I guessed it maight caused by the browser’s refresh function. I googled how to force the browser to refresh and found out the short cut to do so. After I forced the page to refresh, all of the changes came out. This was very useful and help me a lot when I did the WOD3.
The last WOD was BrowserHistory 3, which was about reorganizing the images, paragraphs and listed items. I did not spend too much time to reorganize the paragraphs and images, but I was struggle in the navigation bar. Without watching the video, I did not know how to create the navigation bar, so I checked the CSS elements from W3 School webpage and found out that CSS did have this function. Even though i saw the navigation bar’s sample css code, and tried it on my own css file, nothing came out. When I watched the video, I realized that I should identify the table of contents in my html file first, then use the navigation css code in the css file.
Although I still had to watch the video to figure out the right way to finish WOD3, I suuguests to try it by yourself first, which will help you understand the logic and remember the correct way to finish the task.
At the end, I want to say I really learned a lot from WODs, and good luck for your WODs.