View-Source

A great way to learn website development is to see it in action. All internet browsers allow viewing of a site’s core code, which allows visitors to explore how other devs are making their sites.

One invaluable way of doing this is “view-source,” or viewing the site’s source code. This way of snooping shows the code exactly as it was delivered from the server to the browser, which has its pros and cons:

• Quick and easy view; legible and exact.
• May “catch” invalid code, and show what needs correcting.
• Does not show how the DOM actually built the page.

Chrome

In Chrome:

1. Right click in an empty area of the page.
2. Select “View Source.”

Firefox

In Firefox:

1. Right click in an empty area of the page.
2. Select “View Source.”

Safari

To inspect code in Safari, you first turn on the developer tools:

1. Open preferences.
2. Go to the advanced tab.
3. Select “Show Develop menu in menu bar.”
4. Right click in an empty area of the page.
5. Select “View Source.”

Internet Explorer, Edge

It is very difficult to develop for and with these products. It is recommended you use one of the browsers above for the duration of the course.

development browser source view website