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 allowing visitors to explore how other developers make 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 the menu bar.”
4. Right-click in an empty area of the page.
5. Select “View Source.”

Internet Explorer, Edge

To inspect code in Edge:

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

development browser source view website