The fastest way to see how a website designer created something on the page you view in Safari is to look at its source code. You can follow these steps to see this information in your browser without the use of an extension.
Steps to Follow to View Source Code in Safari
- Open Safari by clicking the compass icon in your dock or on your home screen.
- Go to the website that you would like to examine.
- Choose the “Safari” menu option at the top left of your screen. Then you can choose “Preferences” from the dropdown selections. You can also use a shortcut on your keyboard by pressing the “Command” and “,” key simultaneously.
- Go to the “Advanced” icon that is in the Preferences pop-up box. You will find it at the far right, just after the “Extensions” option.
- Now go to the bottom of this pop-up box. You will want to make sure that the box next to “Show Develop menu in menu bar” is checked. Once you click on it, the new menu option should appear immediately at the top left of your screen. It should appear between “Bookmarks” and “Window” dropdown menus.
- Some people may have a “Develop” command on their top menu bar already. You can choose this option instead of going to the preferences. This result indicates your box is already checked based on the instructions above.
- When you click on the “Develop” dropdown menu, then you will see a long series of choices at your disposal. You will want to scroll about halfway down to find the selection called “Show Page Source.” Click on this option.
- You can also access the source code in Safari with a keyboard shortcut. Press the Option, Command, and U keys all at once.
- If you are using a mouse with a right-click button on your Mac, then this option can give you access to the source code as well if you click on the page.
- The source code will then load at the bottom of your browser screen. There will be a series of folders on the left that will let you see the fonts, frames, images, and more.
When you are finished viewing the source code, then click the “X” in the display box to return to the original page.
How do I view source code on Mac?
Can you view source code on iPhone?
With iOS 8, Apple introduced Extensions, which allow apps to embed functionality within other apps. To view the source of a web page, simply tap on the share button and then tap on the View Source button. The color-coded HTML source code will appear.
How do I view source code in Safari on iPad?
Now that you have created a new bookmark called ‘View Source‘, to view source of any webpage, open any site from your Safari browser, tap on the bookmark icon and then tap on the ‘View Source‘ bookmark.
How do I view source code on iPad?
How do I see code on iPad?