For this week, we had a challenge assigned to create a website. There were several stipulations, the website needed to contain a landing page, several subpages (one for each team member), and a way to navigate between each page.
My team, Jon, Santos, and myself, worked together to create our lovely website. The most important thing I learned through this challenge was taught by Lisa Bright, one of the returning CHI Fellows. I learned that it is possible to view the HTML coding from any website, so you can see how they set up the page. Now, with her help, I have the skills to do it and I would like to share the trick with all of you! 
For Mac users, on Safari, you need to go to your Safari Preferences tab. Under this tab, choose Advanced and check the “Show Develop menu in menu bar” option. Now, when you are viewing any website, highlight a section of the page, right (or double) click, then choose “Inspect Element.” This trick will open up another window or sidebar, allowing you to view the HTML coding for the page, with that element highlighted!
Take a look at these screenshots from my team’s webpage. The first one shows that I highlighted a portion of the website header. I then chose the “Inspect Element” option and the sidebar appeared, which can be seen in the photo below.
I hope you all found this little trick helpful! It turned out to be extremely useful when our team was working on creating our website challenge.
Leave a Reply