Viewing the page source in Safari helps you inspect the raw HTML of any website, which is useful for debugging, learning, and verifying how a page is built. Safari includes built-in developer tools that make it easy to access this source without needing third-party extensions.
This guide explains how to view page source in Safari on both macOS and iOS, what you can learn from it, and common scenarios where this skill is helpful. The following sections cover related techniques and clarify typical questions Safari users have about inspecting web pages.
| Platform | Shortcut or Menu | What It Shows | When to Use |
|---|---|---|---|
| macOS Safari | Develop menu → Show Page Source or Option-Command-S | Full HTML source with line numbers | Debugging layout or scripting issues |
| iOS Safari | Share sheet → Request Desktop Site, then use inspect via Mac | Rendered page with remote inspection | Testing mobile behavior and responsive design |
| Developer Tools | Option-Command-I to open Preferences → Advanced → Show Develop menu | Enables the Develop menu for source and element inspection | First-time setup for source viewing |
Enable the Develop Menu in Safari Preferences
Before you can view page source, you need to show the Develop menu in Safari’s menu bar. On macOS, open Safari Preferences, go to Advanced, and check the option to Show Develop menu in menu bar. This step is required on both Intel and Apple Silicon Macs and takes only a few seconds to enable.
Use the Develop Menu to View Page Source
After enabling the Develop menu, navigate to any webpage and click Develop in the menu bar. From the dropdown, choose Show Page Source. The source view opens in a separate tab, displaying the raw HTML that Safari received from the server, including doctype, head, and body elements.
Inspect Elements Instead of Full Source
While viewing page source is helpful, you may want to examine a specific element’s structure. Use the Develop menu to open Web Inspector or right-click any element on the page and choose Inspect Element. This highlights the corresponding HTML in the Elements panel, making it easier to relate styles with the source code.
Remote Page Inspection on iOS Safari
iOS Safari does not offer a direct Show Page Source option, but you can still analyze pages by enabling desktop site and connecting to a Mac. Use the Develop menu on your Mac, which lists your iOS device and the open tab. From there, you can inspect elements and review the live DOM, which is especially useful for responsive testing and debugging mobile layouts.
Best Practices for Reviewing Source Code
- Enable the Develop menu once in Preferences for quick access on all sites.
- Use Show Page Source for a complete HTML overview before drilling into details.
- Combine source viewing with Web Inspector to correlate structure and styling.
- On iOS, prioritize remote inspection via a Mac for the richest debugging experience.
- Practice on familiar, public websites to learn common HTML patterns and tags.
FAQ
Reader questions
Why should I view page source in Safari instead of using an external tool?
Viewing page source in Safari gives you immediate access to the exact HTML the browser rendered, without installing additional software. It integrates with the Develop menu and Web Inspector for a seamless workflow on both macOS and iOS.
Will viewing the source affect the website or my privacy?
No, viewing page source is a read-only action that does not modify the website or send extra data. It only displays the HTML that your browser already received, so it is safe to use on any public page.
Can I search for specific keywords inside the page source view?
Yes, most versions of Safari allow you to press Command-F inside the source tab to open a search box. Use this to find scripts, meta tags, classes, or IDs quickly within the large HTML document.
How is viewing page source different from inspecting elements?
Viewing page source shows the original HTML as delivered by the server, while inspecting elements highlights the live DOM after JavaScript modifications. Use source for a full overview and inspection for targeted debugging of specific sections.