• What to Know: Samsung Galaxy Ring
  • The Samsung Phone Launch

How to View HTML Source in Safari

If you want to see how a webpage was built, try viewing its source code.

  • University of California
  • University of Washington

What to Know

  • From Safari menu, select Develop > Show Page Source .
  • Or, right-click on page and Show Page Source from drop-down menu.
  • Keyboard shortcut: Option+Command+U .

This article shows how to view HTML source code in Safari.

View Source Code in Safari

Showing source code in Safari is easy:

Open Safari.

Navigate to the web page you would like to examine.

Select the Develop menu in the top menu bar. Select the Show Page Source option to open a text window with the HTML source of the page.

Alternatively, press Option+Command+U on your keyboard.

If the Develop menu is not visible, go into Preferences in the Advanced section and select Show Develop menu in menu bar .

On most web pages, you can also view the source by right-clicking on the page (not on an image) and choosing Show Page Source . You must enable the Develop menu in Preferences for the option to appear.

Safari also has a keyboard shortcut for viewing the HTML source: Hold down the command and option keys and hit U  ( Cmd + Opt + U .)​

Advantages of Viewing Source Code

Viewing the source to see how a web designer achieved a layout will help you learn and improve your work. Over the years, many web designers and developers have learned quite a lot of HTML by merely viewing the source of web pages they see. It's an excellent way for beginners to learn HTML and for seasoned web professionals to see how others used new techniques.

Remember that source files can be very complicated. Along with the HTML markup for a page, there will probably be significant CSS and script files used to create that site's look and functionality, so don't get frustrated if you can't figure out what's going on immediately. Viewing the HTML source is just the first step. After that, you can use tools like Chris Pederick's Web Developer extension to look at the CSS and scripts as well as inspect specific elements of the HTML.

Is Viewing Source Code Legal?

While copying a site's code wholesale and passing it off as your own on a website is certainly not acceptable, using that code as a springboard to learn from is actually how many people make advancements in this industry. You would be hard-pressed to find a working web professional today who has not discovered something by viewing a site's source!

Web professionals learn from each other and often improve upon the work that they see and are inspired by, so don't hesitate to view a site's source code and use it as a learning tool.

You cannot edit webpage source code in Safari. When viewing the source code in Safari, copy and paste it into an app that can export files as plain text (like TextEdit or Pages).

The iOS version of Safari doesn't directly support webpage source viewing, but you can set up a custom bookmark that will accomplish the same task. Create a new bookmark in Safari and name it "Show Page Source" (or something similar, so long as you can identify it). Then in the address text box, copy and paste a specific javascript code , then Save . Once the bookmark is set up, navigate to a webpage that you want to vide the source of, then open your bookmarks and select the new Show Page Source bookmark to view the webpage's source code.

Get the Latest Tech News Delivered Every Day

  • How to View the HTML Source in Google Chrome
  • How to Use Web Browser Developer Tools
  • How to View the Source Code of a Web Page
  • Add More Features by Turning on Safari's Develop Menu
  • 9 Best Free HTML Editors for Windows for 2024
  • How to Inspect an Element on a Mac
  • How to Activate and Use Responsive Design Mode in Safari
  • A Step-By-Step Guide to Editing the HTML Source of an Email
  • How to View the Source of a Message in Mozilla Thunderbird
  • The Best Windows Web Editors for Beginners
  • The 4 Best Free Text Editors
  • Keyboard Shortcuts for Safari on macOS
  • What is WOFF?
  • What Is an ASPX File?
  • How to Save Web Pages in the Opera Desktop Browser
  • How to View the Source of a Message in Apple Mail

By clicking “Accept All Cookies”, you agree to the storing of cookies on your device to enhance site navigation, analyze site usage, and assist in our marketing efforts.

How to View the Source Code of a Webpage in Safari on Mac

Mahesh Makvana

Behind every beautiful webpage is a complex code called source code that serves the design and the functionality of that webpage to its users. Sometimes you may get curious and would like to see exactly what code builds a webpage. Viewing the source code of a webpage is possible in almost all web browsers, and the same applies to Safari for Mac.

Safari for Mac does allow you to view the source code of a webpage; however, it does not work like Chrome or Firefox. To view the source of a page in Safari you need to first unlock a hidden menu in the browser.

Here’s how to enable that menu and then see the source of a webpage using multiple ways.

View the Source Code of a Webpage in Safari on Mac

1. Launch Safari on your Mac.

2. When Safari launches, click on the “Safari” menu on the top followed by “Preferences…”

safarisource-pref

3. When the Preferences panel opens, click on the tab that says “Advanced”. It should be the last one in the menu on the top.

safarisource-advanced

4. Inside the Advanced tab you should see an option that says “Show Develop menu in menu bar.”

Checkmark the box for the option, and the menu should instantly be added to the menu bar in the browser.

safarisource-show

The Develop menu is now unlocked in Safari on your Mac. Here’s how you can use various options it gives you to access the source code of a webpage.

1. Using the Develop Menu

In the menu bar of Safari, you should now see a new option called “Develop” that has just been unlocked. To view the source of a page, click on the “Develop” menu and then choose “Show Page Source.”

safarisource-develop

Safari should instantly show you the full source code of the webpage.

2. Using a Keyboard Shortcut

If you plan to access the source code of a number of webpages, you may want to use a keyboard shortcut as it will be much faster than clicking an option in the menu bar and selecting another option.

safarisource-shortcut

While a webpage is open in Safari, press the “Option + Command + U” key combination, and Safari should let you see the source code of the webpage.

3. Using the Right-Click Menu

safarisource-context

If Safari is your primary browser, and you happen to be someone who is interested in viewing the codes behind various webpages, the guide above should help you do that without requiring you to leave your favorite browser.

Our latest tutorials delivered straight to your inbox

Mahesh Makvana

Mahesh Makvana is a freelance tech writer who's written thousands of posts about various tech topics on various sites. He specializes in writing about Windows, Mac, iOS, and Android tech posts. He's been into the field for last eight years and hasn't spent a single day without tinkering around his devices.

How-To Geek

How to turn on the develop menu in safari on mac.

The Develop menu lets you view page source in Safari on Mac.

Quick Links

How to enable the develop menu in safari on mac, how to view page source in safari on mac.

When you right-click on any web page in Safari on Mac, it doesn't reveal the Show Page Source and Inspect Element buttons. To see these, you need to enable the Develop menu---we'll show you how to do that.

Once you've enabled the Develop menu, right-clicking a blank space on any website will reveal the Inspect Element and Show Page Source buttons. These allow you to take a look at the source code of any website, which is useful for things like downloading images from websites and debugging code or finding out what it looks like behind any site (for website designers).

You can easily turn on the Develop menu in Safari by following a couple of steps. Open Safari on your Mac and click the "Safari" button in the menu bar.

Next, select "Preferences." Alternatively, you can use the keyboard shortcut Command+, (comma). This will also open up Safari preferences.

Go to the "Advanced" tab.

Check the box for "Show Develop Menu in Menu Bar."

Now the Develop menu will appear between Bookmarks and Window at the top.

Apart from being able to view the page source, this will allow you to access developer-focused features, such as disabling JavaScript on any website.

Once you've enabled the Develop menu, there are a couple of ways to view the page source in Safari.

Open any website in Safari and right-click the blank space on the page. Now, select "Show Page Source." You can also get to this menu by using the keyboard shortcut Option+Command+u.

If you're looking for images or other media elements from any web page, Safari makes it easy to find these. In the left-hand pane, you will see various folders such as Images, Fonts, etc. Click the "Images" folder to quickly find the photos that you need.

After selecting an image, you can view its details easily by opening up the details sidebar. The button to open this is located at the top-right of the console, just below the gear icon. You can also open this with the shortcut Option+Command+0.

Click "Resource" at the top of the details sidebar to view details, such as the size of the image and its full URL.

You can change the position of the page source console easily, too. There are two buttons at the top-left of this console, right next to the X button. Click the rectangle icon to move the console to a different side within the browser window.

If you'd like to open the page source console in a separate window, you can click the two-rectangles icon. This will detach the console and open it in a separate window.

To check out the code for any specific element on the page, you can right-click that element and select "Inspect Element." This will take you directly to the code for the element that you selected.

Whenever you're done looking at the code, click the X button to close the page source console and return to browsing on Safari. You can also check out how to view a website's page source in Google Chrome  here.

Related: How to View the HTML Source in Google Chrome

5 Ways to View Page Source on iPhone or iPad

It is quite easy to view HTML page source code on Windows PC or Mac, but you don’t always hold your computer. For iOS users, you always have your iPhone around. It would be more convenient to view page source on iPhone or iPad. Actually, you can do it without third-party apps.

In this post, I will show you 5 ways to show webpage source code on iOS devices. Sounds great? Keep reading to learn how. 

Method 1: Create a View Source Shortcut 

The first I recommend is to create a View Source shortcut that is available in Share Sheet, so you can easily access it from Safari. Shortcuts is a stock app in iOS 13 or new versions for automation. There are many amazing pre-made shortcuts that you can get from the internet. 

Here I will show you how to make one to view HTML source code step by step. You can refer to the steps below or the video.  If you don’t want to make it by yourself, you can also click this link to add it to your Shortcuts Library. 

Step 1. Open the Shortcuts on your iPhone or iPad. Tap on the “+” icon to create a new one. 

Step 2. Tap on the three-dot icon and enable the option “Show in Share Sheet”. Tap Done to go back to the new shortcut. 

Step 3. Type “html” in the search bar and drag the “Make HTML from Rich Text” action from the search results to the shortcut.

Step 4. Type “quick look” in the search bar and drag the “Quick Look” action to the shortcut. 

Step 5. Tap “Done” to save the shortcut and change the shortcut name to “View Source”.

Step 6. Go to Safari and open the web page where you want to view the source code. Tap the Safari Share button and select the “View Source” shortcut that you just created. 

Shortcuts only accept Safari web pages, so if you want view source code on Chrome or other web browsers, keep reading to find other alternative methods. 

Method 2: Safari Bookmark Trick

Another way to view source code is via Safari bookmark. You can use bookmark to run a javascript and it will show the source code of any web page. 

Step 1. Copy the script. You can go to this Github page and copy the script or copy the script below. 

Step 2. Tap your browser (Chrome or Safari) Share button and select Add Bookmark. It doesn’t matter which web page you add. You just need to create a new bookmark for further usage. 

View Page Source iPhone

Step 3. Tap on the Bookmark icon and locate the new bookmark that you just created.

Step 4. From there, tap Edit and change the new bookmark name to “View Page Source” and the URL to the script that you copied before. 

Step 5. Go to the webpage where you want to view source code. Tap the Bookmark icon and select the View Page Source bookmark that you just saved. 

Then it will display the source code of that web page. If you use Chrome, it is even simpler because you can change the bookmark URL on Step 2. 

Method 3: DevTools Extension for Safari

If you also need inspect elements, you can use a Safari extension for iPhone or iPad. There are a few of extensions that allows you to inspeact elements, including DevTools Extension, Web Inspector, and Achoo HTML Viewer & Inspector (Paid).

Let me take DevTools Extension as an example to show you how:

DevTools Extension for Safari

Step 1. Open AppStore and search for “DevToools Extension” or simply click on this link to install it.

Step 2. Once installed, go to Settings Safari > Extensions to enable DevTools Extension.

Step 3. Open Safari and visit any web page that you want to inspect. Tap on the AA icon from the address bar and select DevTools Extension.

Step 4. You will see a gear icon on the page. Tap on it and you will see the Developer Tools like on Desktop browser. When done, you can always click on the gear icon again to close Developer Tools.

Method 4: A Nice Broswer That Spports View Source

Via Browser is a nice browser for iPhone and iPad that allows you to view page source and inspect elements. It is also available for Android, so you can also use it to view page source on Android . Once you have the browser, you can tap the three bars icon on the bottom right and select Tools > View Source. It will open a new tab with the source code of your current page.

Via Browser iOS

In additional, Via browser enables you to run userscripts and change user agent. As you know, some web apps only works on Desktop. If you use Via browser to change user agent to MacOS or Windows, then you can use Desktop web app on your iPhone or iPad.

Method 5: View Source App for iOS

You can also download a dedicated app for viewing HTML source code. For that, I recommend the free app View Source , which is designed for iPhone. Once you installed this app, you will see an option View Source in your Web Browser (Safari or Chrome) Share Sheet. You can simply tap on it to see the source code. 

View Source App

In addition, it can also work as a standalone app. Within the app, you can input any webpage URL and the app will load its source code automatically. 

These 5 methods all work great on iOS devices. You can use any of them to view page source on iPhone or iPad based on your preference. For me, I prefer the Shortcuts method because Shortcuts allows you to customize it for all kinds of possibilities. 

1 thought on “ 5 Ways to View Page Source on iPhone or iPad ”

Thanks for this, shortcut now created, most useful.

Leave a Reply

Your email address will not be published. Required fields are marked *

OS X Daily

Tips & Tricks

Troubleshooting, how to view page source in safari on mac.

Safari for Mac

Viewing a web pages source code in Safari, and other web browsers, is a fairly routine activity for many people who work with the web for a living or even as a hobby. Unlike some other browsers, to view page source in Safari you must first enable a developer toolset for the browser to be able to access the view web page source feature.

This tutorial will demonstrate how to view a web pages source in Safari on Mac OS. This applies to all versions of Safari and MacOS.

How to View Page Source in Safari for Mac

Here is how you can view a web pages source in Safari on MacOS:

  • First, enable the Safari Develop menu by going to the Safari menu, choosing “Preferences”, going to “Advanced” and checking the box to enable the developer menu

Enabling the Develop menu in Safari for Mac allows you to view pages source

  • Next, in any Safari window, navigate to the web page whose source you wish to view and inspect
  • Pull down the “Develop” menu at the top of the screen and select “Show Page Source” from the menu options

How to view page source in Safari on Mac

  • The web web pages source will appear on screen in the web inspector Sources section, a web developer toolkit built into Safari

Viewing page source in Safari for Mac

Aside from viewing page source, you can also use the Develop menu to accomplish many other web useful tricks and developer tasks, including disabling Javascript and clearing Safari cache amongst myriad other functions and capabilities that are geared towards advanced users and developers, like finding embedded files in pages .

How to View Page Source by Keyboard Shortcut in Safari on Mac

After you have the Develop menu enabled in Safari, you can also use a keyboard shortcut to quickly view any web page source in the Safari browser for Mac:

  • Navigate to the web page you wish to view the page source for
  • Press Command + Option + U keyboard combination to view the page source

The keyboard shortcut for viewing page source will open the web inspector tool, just like accessing it from the Develop menu.

If you’re an advanced user of Safari, enabling the Develop menu is likely one of the first things you do when you launch the browser for the first time.

For what it’s worth, the Chrome browser and Firefox browsers also have similar web element inspector capabilities, but obviously we’re focusing on Safari for Mac here.

The Developer functions in Safari for Mac are not available for iPhone or iPad (yet anyway), but if you’re interested in gaining source viewing options on the mobile side you can use this javascript trick to view page source in iOS and ipadOS versions of Safari.

Do you have any handy tips or tricks associated with viewing page source or the developer toolset in Safari? Share your thoughts, tips, and experiences with us in the comments.

Enjoy this tip? Subscribe to our newsletter!

Get more of our great Apple tips, tricks, and important news delivered to your inbox with the OSXDaily newsletter. 

You have successfully joined our subscriber list.

.

Related articles:

  • How to Turn Off Split Screen in Safari for iPad? Exiting Safari Split Screen in iPadOS
  • How to Take Full Page Screenshots in Safari on iPhone & iPad
  • How to “View Source” from Safari on an iPad or iPhone
  • How to Customize Safari Start Page on Mac

» Comments RSS Feed

I appreciate how you made achieving this goal simple and clear. Out of all the search results I reviewed on this subject the information is the only one that has value. Thanks

I learn something from more than 90% of what you send me in your newsletters. My wife and myself are 70yrs old and we aren’t very computer literate. We both have MacBook Air laptops. They are new and running macOS Catalina 10.15.7 We are reluctant to upgrade to macOS Big Sur. I’m collecting everything I can find that you print about Big Sur. Once we’re comfortable, I think we may try it. I’m writing to thank you for what you do for us and you ask for nothing. ThankYou! ~Peter~

Leave a Reply

Name (required)

Mail (will not be published) (required)

safari view source shortcut

Subscribe to OSXDaily

Subscribe to RSS

  • - Fix Step Count in Health App Updating Slowly on iPhone
  • - How to Change Apple Watch Faces by Swiping
  • - How to Boot Into MacOS Recovery in UTM on Apple Silicon Mac
  • - How to Change Default Notification Sound on iPhone
  • - Where is Health App for Mac? Can I View My Health Data on Mac?
  • - iOS 17.3 Update for iPhone Available to Download Now
  • - MacOS Sonoma 14.3 Update Available to Download Now for Mac
  • - Apple’s “1984” Macintosh Commercial Ran 40 Years Ago Today
  • - Release Candidates for iOS 17.3, iPadOS 17.3, macOS Sonoma 14.3, Available for Testing
  • - Amazon Sells Apple Watch Series 9 for $329, Despite Apple Watch Sales Ban Beginning Again

iPhone / iPad

  • - How to Disable Journaling Suggestions on iPhone
  • - How to Use Voice with ChatGPT on iPhone
  • - Fix M2 MacBook Air Running Slow with a Simple Settings Tweak
  • - How to Install macOS Sonoma in a Virtual Machine with UTM
  • - Fix “Could Not Connect to Apple Watch” Error on iPhone
  • - How to Restore & Reopen All Closed Tabs in Safari on iPad

Shop on Amazon to help support this site

About OSXDaily | Contact Us | Privacy Policy | Sitemap

This website is unrelated to Apple Inc

All trademarks and copyrights on this website are property of their respective owners.

© 2024 OS X Daily. All Rights Reserved. Reproduction without explicit permission is prohibited.

iGeeksBlog

How to View Source Code of a Webpage in Safari on iPhone and Mac

Web pages are generally written in HTML (HyperText Markup Language) or comparable markup language. Web browsers have to get along with a number of web resource elements like images, scripts, stylesheet and more to show the web page. Ever wanted to view the source code of any webpage in Safari on your iPhone or Mac?

Turns out, you can easily access the HTML source code of any webpage in Safari. Once you have enabled your device, you are just a few clicks away from accessing it. Here is how it works.

How to View Source Code of a Webpage in Safari on Mac

How to enable develop mode in safari on mac.

To access the source code in Safari on your Mac, you need to first enable Develop Mode.

Step #1. Open Safari on your Mac and click on Safari → Click on Preferences.

Click on Preferences in Safari on Mac

Step #2. Next, click on the Advanced tab → Check the box next to Show Develop menu in the menu bar .

Check Show Develop Menu in Menu Bar in Safari on Mac

A new tab named “Develop” will now appear in the menu bar.

How to Show/View Page Source Code in Safari on Mac

There are three ways you can access page source code of a webpage.

  • Just right-click on a page and select “Show Source Code”. Now, check out the source code of the page in the new window

Right-click in Web Page and Click on Show Page Source

  • On the web page, you need to press the Option/Alt+Command+U keys at once

View Web page Source Code in Safari on Mac Using Keyboard Shortcut

  • While viewing any web page, select Develop in the Menu bar and choose “Show Source”

View Page Source Using Develop Menu on Mac

How to View Webpage Source Code in Safari on iPhone and iPad

There are quite a few iOS apps that let you view the source code of any webpage in Safari on your iOS device. But, I find “Source” very handy in letting you access HTML source of any web page.

How to Enable Safari Extension on your iOS device

Step #1. First off, you need to download “Source” on your iOS device . It’s priced at $0.99.

Step #2. Now, open Safari and tap on the Share button in the toolbar.

Tap on Share Button in Safari on iPhone

Step #3. Next, you have to scroll right to the end and tap on More.

Tap on More in Safari Sharesheet on iPhone

Step #4. Now, Make sure to enable Source. Then, tap on Done at the top right corner to confirm.

Access/View Webpage Source Code in Safari on iPhone and iPad

Once you have enabled Safari extension, you can easily access the source code of any web page.

Step #1. Launch Safari on your iOS device.

Step #2. Go to any web page.

Step #3. Next, tap on the Share button.

Step #4. Now, tap on Source. Now, check out the source of the page.

Tap on Source in Safari Sharesheet on iPhone

Wrapping Up

Except for developers and some curious people, I don’t think many folks would show a lot of interest in viewing the complex source code of any web page. What do you say?

Readers like you help support iGeeksBlog. When you make a purchase using links on our site, we may earn an affiliate commission.  Read Disclaimer .

' src=

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Save my name, email, and website in this browser for the next time I comment.

This site uses Akismet to reduce spam. Learn how your comment data is processed .

  • Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar
  • Skip to footer

How to See the Source Code of a Website (Easy Methods)

Easy methods to view the source code of any webpage on a PC or a MAC using any of the popular web browsers.

Alex Chris

  • Academy Login
  • Online Courses
  • Get Free eBooks

It’s always useful to know how to view the source code of your website or any website. It’s a skill that can prove very handy when working on your SEO, troubleshooting problems, or just curious to see what the HTML source code of a website looks like.

In this post, you’ll learn easy methods on how to see the code of any website on any platform. Let’s get started.

How to view the HTML source code of a website on a Mac

To view the source of a website on a Mac using Safari, navigate to the page you want and use the following keyboard shortcut: Option+Command+U.

Alternatively, you can right-click anywhere on the page and select “Show Page Source” from the dropdown menu.

Google Chrome

To view the source code of a website on a Mac using Chrome, navigate to the page you want and use the keyboard shortcut: Option+Command+U.

Digital Marketing Training

You can also right-click on the page and select “View Page Source” from the dropdown menu.

View Website Source Code Using Chrome on a Mac

When using Firefox on a Mac, the keyboard shortcut to view the source code is: COMMAND + U

How to view source code on a PC

When using Google Chrome on a PC, you can view the source code of a website by using the keyboard shortcut: CTRL + U.

View Source Code Using Chrome on a PC

When using Firefox on a PC, the keyboard shortcut to view the source code is: CTRL + U

When using Opera on a PC, the keyboard shortcut to view the HTML source code of a page is: CTRL + U

Microsoft Edge

The keyboard shortcut to view the source code of a page when using the Microsoft Edge browser on a PC is: F12 & CTRL+SHIFT+I

How to view the HTML code of a particular page element?

Instead of viewing the HTML code of a whole page, you can view the code of particular page elements using the INSPECT ELEMENT option available in all popular browsers like Google Chrome, Firefox, and Safari.

The process is straightforward. Open the page in a new browser window and then highlight a section of the page using the mouse.

Right-click and then select INSPECT from the dropdown menu.

This will open the developer tools and show you the HTML code associated with the particular element or page section.

Here is a quick demo of how to do this using Google Chrome.

How to download an entire website source code?

To download a website’s HTML source code, navigate using your favorite browser to the page, and then select SAVE PAGE AS from the FILE menu. You’ll then be prompted to select whether you want to download the whole page (including images) or just the source code.

The download options are common for all browsers.

Web Page, Complete:  Downloads the page source code and all images, CSS files, and js script associated with the particular page. All files are saved in a folder. This is useful when you need to download the images together with the HTML code.

Web Page, Single File:  Downloads the page in MHTML (short for MIME HTML). This is a form of HTML that includes both the website’s code and any external resources.

Web Page, HTML Only:  Downloads the HTML and any other elements (like embedded Java Script Code) found in the body of a page.

Why is important to know how to view a website’s source code?

There are many use cases where you might want to check the source code of a website, the most common are:

Check for the occurrence of H1 tags – Best SEO practices indicate a page should have only one H1 tag . To check if this is the case with your website, you can navigate to one of your posts, and using any of the methods described above, you can view the HTML source code of the page. You can then search for <h1> and see if there is more than one H1 tag on the page.

Check if links are nofollow – One of the ways to find out if a link has the nofollow tag added (which makes it less important for SEO rankings) is to view the HTML code of a page and check for the occurrence of the word ‘nofollow’ within the <a></a> element. You can do this to check the links on your website or any other website.

Optimize your website for speed – A good reason for analyzing your website’s source code is when optimizing your page speed . As a starting point, you can view the HTML of a page and try to identify elements (including JS and CSS files) that can be removed to make the page size smaller and faster to download. Then with the help of other tools (like Google’s PageSpeed Insights ), you can continue optimizing your code further.

Key Learnings

It’s very easy to view or save the source code of a webpage. The process is the same for all browsers. The first step is to navigate to the page you want and then you can view the HTML using a keyboard shortcut.

You can optionally download the code in a text file. To view the HTML code of a particular page element, use the INSPECT function that is part of the developer’s tools.

Alex Chris

Alex Chris is a digital marketing consultant, author, and instructor. He has more than 18 years of practical experience with SEO and digital marketing. Alex holds an MSc Degree in eCommerce and has consulted with Fortune 500 companies in different industries. He blogs regularly about SEO and Digital marketing, and his work has been referenced by leading marketing websites. Connect with Alex on Twitter and LinkedIn .

Ultimate Course Bundle

Reader Interactions

Leave a reply cancel reply.

Your email address will not be published. Required fields are marked *

safari view source shortcut

About Reliablesoft

Online training.

safari view source shortcut

The Tech Edvocate

  • Advertisement
  • Home Page Five (No Sidebar)
  • Home Page Four
  • Home Page Three
  • Home Page Two
  • Icons [No Sidebar]
  • Left Sidbear Page
  • Lynch Educational Consulting
  • My Speaking Page
  • Newsletter Sign Up Confirmation
  • Newsletter Unsubscription
  • Page Example
  • Privacy Policy
  • Protected Content
  • Request a Product Review
  • Shortcodes Examples
  • Terms and Conditions
  • The Edvocate
  • The Tech Edvocate Product Guide
  • Write For Us
  • Dr. Lynch’s Personal Website
  • The Edvocate Podcast
  • Assistive Technology
  • Child Development Tech
  • Early Childhood & K-12 EdTech
  • EdTech Futures
  • EdTech News
  • EdTech Policy & Reform
  • EdTech Startups & Businesses
  • Higher Education EdTech
  • Online Learning & eLearning
  • Parent & Family Tech
  • Personalized Learning
  • Product Reviews
  • Tech Edvocate Awards
  • School Ratings

10 Questions To Get Acquainted With Your Online Students

Best books for your children, public universities are failing the public, institutions must change how they handle sexual assaults, indications that your university is on the verge of shutting down, an age-by-age approach to disciplining your children, common elements of instructional systems design, great education leaders solicit feedback, great education leaders are instructional leaders, great education leaders are accomplished mediators and negotiators, how to view html source in safari.

safari view source shortcut

If you’re a web developer, designer or just a curious individual, you may find the need to view HTML source in Safari, one of the most popular web browsers. HTML source refers to the underlying code that creates a web page, and viewing it can help you understand how a page works, troubleshoot issues and learn new techniques.

Here’s how to view HTML source in Safari:

1. Open Safari and navigate to the web page you want to view the source code for.

2. Click on the “Develop” menu option in the Safari menu bar. If you don’t see this menu, go to Safari Preferences > Advanced and check the box next to “Show Develop menu in menu bar”.

3. From the “Develop” menu, select “Show Page Source”. Alternatively, you can use the keyboard shortcut Option + Command + U.

4. Safari will display the HTML source code in a new window or tab, depending on your settings. You can now view, analyze and edit the code as needed.

Some additional tips for working with HTML source in Safari:

– If you’re inspecting a particular element on a web page, you can right-click on the element and select “Inspect Element” from the context menu to view its HTML source in the Safari Developer Tools

– The Safari Developer Tools also allow you to view the CSS and JavaScript code for a web page, among other things

– If you want to edit the HTML source code, you can make changes directly in Safari, but these changes will not be saved. Alternatively, you can copy the code and paste it into a text editor or web development tool to make permanent changes.

– Be cautious when editing HTML source code, as even small mistakes can cause a web page to break or behave unexpectedly. Always back up your code before making changes and test your changes thoroughly.

In conclusion, viewing HTML source in Safari is a useful skill for anyone who works with web pages. With these simple steps and tips, you can explore the underlying code of your favorite websites and gain insights into how they work.

What Is an Expansion Slot?

How to set up a new iphone.

' src=

Matthew Lynch

Related articles more from author.

safari view source shortcut

Apple Watch Not Pinging iPhone? How to Fix the Problem

safari view source shortcut

What Is the Smartest and Safest Way to Store Your Passwords?

safari view source shortcut

The 8 Best 3D Printed Lamps

safari view source shortcut

Two Ways To Reformat Your Chromebook: Powerwash & Full Recovery

safari view source shortcut

How to Change the Default Ringtone on Your iPhone

safari view source shortcut

How to Choose a Slack Theme (or Make Your Own)

View Source for Safari on iOS with Shortcuts

I love view-source , it's a nifty super power of the web that nearly all mobile browsers are trying to kill. Not exactly sure why. View-source is what got me into web development because I could see how other people structured their pages, and at the time I started web development it was pretty much the only way to debug web pages.

I've also been using my iPad Pro whilst I am not at work for the next month or so... It's a great device, and it appears to be locked down in a way that restricts me from doing exactly what I want... this is until I found out about the Shortcuts app that is built in to iOS.

Shortcuts let you build small utilities, programs and automations that perform actions on certain user gestures like "Share a Page", or "Open an app", or "Connect to WiFi".

Now that I can share URLs to an "app", I can do a lot of things that are not really possible on mobile devices.

I created this "View Source" shortcut that you can use (if you trust me) to Share a page from Safari or Chrome and quickly view the source.

Here it is in action:

View Source in the Share Sheet

There is one major caveat. It doesn't inspect the exact instance of the page you are running, it has to the page in a 3rd party site that I built ( https://www-source.glitch.me ) / source - this means that if you are logged in, or there is any state that is shared (such as cookies) then it will not display the same content that you are viewing.

It's kinda hard to share the source code of a Shortcuts, so here is a screenshot:

View Source Code

I really hope that Safari (and Chrome) can deprecate the need for this shortcut.

Subscribe to feed

  • Sorry Safari team
  • Creating a quick launcher for Android using the web
  • Shiming Request.formData in Safari
  • Twitter is using PWA shortcuts
  • Ricky Mondello: Adoption of Well-Known URL for Changing Passwords

I lead the Chrome Developer Relations team at Google.

We want people to have the best experience possible on the web without having to install a native app or produce content in a walled garden.

Our team tries to make it easier for developers to build on the web by supporting every Chrome release, creating great content to support developers on web.dev , contributing to MDN, helping to improve browser compatibility, and some of the best developer tools like Lighthouse, Workbox, Squoosh to name just a few.

I'm trialing a newsletter, you can subscribe below (thank you!) Enter your email

RSS

CitizenSide

Viewing The HTML Source Code In Safari

Published: August 29, 2023

viewing-the-html-source-code-in-safari

Why View HTML Source Code in Safari?

Viewing the HTML source code of a webpage can provide valuable insights for developers, designers, and even curious users. Understanding the underlying code structure can help identify and troubleshoot issues, inspect elements and their properties, and gain a deeper understanding of how a website is built. Safari, the default web browser for Apple devices, offers several methods to view the HTML source code, each with its own advantages. Whether you’re a web professional or simply want to quench your curiosity, exploring the HTML source code in Safari can be a rewarding endeavor.

By viewing the HTML source code, web developers can gain a comprehensive understanding of how a webpage is constructed. It allows them to analyze the code structure, identify potential errors or bugs, and make necessary modifications. This is particularly useful when troubleshooting layout issues, debugging JavaScript functions, or optimizing website performance. With Safari’s intuitive interface, developers can easily view and navigate through the HTML source code, making the debugging process more efficient.

For web designers, viewing the HTML source code in Safari enables them to inspect the styles applied to different elements. By examining the CSS properties, designers can better understand how the visual elements are defined and styled. This knowledge is crucial when designing responsive websites, as it allows them to fine-tune the layout for different screen sizes and ensure a consistent user experience across devices. Additionally, by analyzing the HTML structure, designers can optimize the code for search engine optimization (SEO) and improve the website’s visibility in search engine results.

Even for non-technical users, exploring the HTML source code can offer a glimpse into the inner workings of a website. It allows them to understand how different elements are organized, learn about the technologies used, and appreciate the complexity involved in building a web page. Furthermore, viewing the HTML source code can help users detect any malicious scripts or suspicious content hidden within a webpage. This knowledge can be empowering, as it enhances their online security and enables them to make informed decisions while browsing the internet.

Safari provides several methods to view the HTML source code, making it accessible to users with varying levels of technical expertise. Whether you’re a developer looking to troubleshoot issues, a designer seeking to refine your layout, or a curious user wanting to delve deeper into the web, Safari’s HTML source code viewing options offer a valuable toolset for exploring the digital landscape.

Method 1: Using the Develop Menu

Safari’s Develop menu offers a straightforward way to view the HTML source code of a webpage. Here’s how to access and utilize this method:

  • Open Safari and navigate to the webpage for which you want to view the source code.
  • Click on the “Develop” menu in the menu bar at the top of the screen. If you don’t see the “Develop” menu, go to Safari preferences, select the “Advanced” tab, and check the box next to “Show Develop menu in menu bar.”
  • In the Develop menu, hover over “Page Source” to reveal a submenu of options.
  • Select “Show Page Source” to open a new window displaying the HTML source code of the webpage.
  • In the HTML source code window, you can browse, search, and analyze the code to gain insights into how the webpage is built. You can also copy and paste sections of the code for further analysis or reference.

The Develop menu is a powerful tool for developers and designers, providing easy access to the HTML source code and allowing for efficient troubleshooting and debugging. It is particularly useful when analyzing complex webpages with dynamic content, as it enables you to inspect the underlying code that generates the page’s elements.

It’s worth noting that the Develop menu also offers additional options for advanced users, such as disabling JavaScript or CSS on the current webpage. These options can be valuable when testing and fine-tuning website functionality or performance.

By utilizing the Develop menu in Safari, you can quickly and effortlessly view the HTML source code of any webpage, empowering you with the knowledge to understand and manipulate the code as needed.

Method 2: Using the Keyboard Shortcut

If you prefer to use keyboard shortcuts, Safari offers a convenient way to view the HTML source code with just a few key presses. Follow these steps:

  • Press the Option + Command + U keys simultaneously. Alternatively, you can right-click anywhere on the webpage and select “Show Page Source” from the context menu.
  • A new window or tab will open, displaying the HTML source code of the webpage.
  • In the HTML source code view, you can scroll, search, and analyze the code to gain insights into the webpage’s structure and elements.

This keyboard shortcut provides a quick and efficient way to access the HTML source code, allowing you to bypass the menus and access the code with ease. It’s particularly helpful for users who prefer using keyboard shortcuts for their browsing tasks.

This method is suitable for developers, designers, and curious users who want a fast and accessible way to view the HTML source code without the need to navigate through multiple menus and options.

Using the keyboard shortcut in Safari provides a streamlined approach to view the HTML source code, presenting you with a detailed look into the inner workings of the webpage in just a few simple steps.

Method 3: Using the Right-Click Menu

If you prefer a more context-sensitive approach, Safari offers the ability to view the HTML source code directly from the right-click menu. Follow these steps:

  • Right-click anywhere on the webpage to open the context menu.
  • From the context menu, select the “Inspect Element” or “Inspect” option. This will open the Safari Developer Tools panel.
  • In the Developer Tools panel, you will see various tabs such as Elements, Console, and Network. Click on the “Elements” tab.
  • The Elements tab will display the HTML structure of the webpage, allowing you to view, explore, and make changes to the code as needed.

The right-click menu method is particularly useful for web developers and designers who want a more comprehensive set of tools to inspect and modify the code. It provides a more interactive and dynamic experience, enabling you to not only view the HTML source code but also make live changes and see the immediate results.

Using the right-click menu in Safari leverages the built-in Developer Tools feature, giving you granular control over the HTML source code and the ability to diagnose and fix issues with ease.

Whether you need to troubleshoot layout problems, inspect CSS styles, or delve into the code structure, the right-click menu method in Safari provides a convenient way to access and analyze the HTML source code of any webpage.

Method 4: Using the Inspector Tool

Safari’s Inspector tool offers a powerful and versatile way to view the HTML source code, inspect elements, and make live changes on the fly. Follow these steps to use the Inspector tool:

  • Open Safari and navigate to the webpage you want to inspect.
  • Right-click on any element on the webpage and select “Inspect Element” from the context menu. Alternatively, you can go to the “Develop” menu, choose “Show Web Inspector,” or use the keyboard shortcut Option + Command + I.
  • The Inspector tool will appear as a separate pane or sidebar, with the HTML source code displayed in the Elements tab.
  • You can explore the HTML structure by expanding and collapsing elements, revealing nested tags and attributes.
  • By hovering over an element in the code, the corresponding area on the webpage will be highlighted, providing a visual representation of the code.
  • Inspecting the Styles tab will reveal the CSS properties applied to each element, allowing you to understand and modify the visual appearance of the webpage.
  • The Inspector tool also provides additional tabs for examining the Network activity, JavaScript Console, and more, offering a comprehensive set of debugging and development tools.

The Inspector tool in Safari is invaluable for web developers and designers, providing a rich set of features to analyze and manipulate the HTML source code. It allows for real-time debugging, making it easier to identify and resolve issues with precision.

This method is especially beneficial for developers who need to closely examine specific elements, troubleshoot layout issues, or fine-tune the CSS styles of a webpage. Designers, too, can use the Inspector tool to gain insights into the structure and styling of a website, enabling them to refine the visual presentation with ease.

By utilizing the powerful capabilities of the Inspector tool in Safari, you can confidently navigate and manipulate the HTML source code, while fine-tuning the design and functionality of your webpages.

Method 5: Using Safari Extensions

Safari offers the flexibility to enhance its functionality through extensions, and there are several extensions available that can assist in viewing the HTML source code of a webpage. Here’s how to use Safari extensions for this purpose:

  • Open Safari and go to the Apple App Store or the Safari Extensions Gallery to search for HTML source code viewing extensions.
  • Install the desired extension by following the provided instructions.
  • Once installed, navigate to the webpage you want to examine.
  • Look for the Safari extension’s icon in the Safari toolbar or the browser’s menu.
  • Click on the extension’s icon to activate it and view the HTML source code of the current webpage.
  • The extension may display the HTML source code in a separate window or provide a panel within Safari.

Using Safari extensions to view the HTML source code adds flexibility and customization to your browsing experience. Extensions can provide additional features and options beyond what Safari offers by default, making them valuable tools for developers, designers, and curious users alike.

Extensions dedicated to HTML source code viewing may offer enhanced functionality, such as syntax highlighting, code formatting, and search capabilities, to help you analyze the code more efficiently. Some extensions may even provide additional tools, like debugging and live editing, to make your development or troubleshooting tasks easier.

When using Safari extensions, it’s important to choose reputable and trusted sources for downloading them to ensure your online security. Review the user reviews and ratings of the extension before installation to ensure it meets your requirements.

By leveraging Safari extensions specifically designed for viewing the HTML source code, you can enhance your browsing experience and gain deeper insights into the structure and functionality of webpages.

Avatar

Related Stories

How To View The Source Code Of A Web Page

How To View The Source Code Of A Web Page

How To Activate The IPhone Debug Console Or Web Inspector

How To Activate The IPhone Debug Console Or Web Inspector

Add More Features By Turning On Safari’s Develop Menu

Add More Features By Turning On Safari’s Develop Menu

How To Inspect An Element On A Mac

How To Inspect An Element On A Mac

HTC File (What It Is & How To Open One)

HTC File (What It Is & How To Open One)

What’s An MHT File And How Do You Open One?

What’s An MHT File And How Do You Open One?

Which Browser Should I Use For Watching Movies?

Which Browser Should I Use For Watching Movies?

What Is A Web Browser?

What Is A Web Browser?

Clean Slate: Deleting All Contacts On Motorola Razr

Clean Slate: Deleting All Contacts On Motorola Razr

Safe Removal: Taking Out The Memory Card From Motorola Razr

Safe Removal: Taking Out The Memory Card From Motorola Razr

Battery Performance: Average Use For Motorola Razr Maxx HD

Battery Performance: Average Use For Motorola Razr Maxx HD

Power-Up Guide: Turning On Your Motorola Razr

Power-Up Guide: Turning On Your Motorola Razr

Transferring Videos From Motorola Razr: Step-by-Step

Transferring Videos From Motorola Razr: Step-by-Step

Top 100 Christmas Songs for the Best Christmas Music

Top 100 Christmas Songs for the Best Christmas Music

16 Best Ad Blocker For Every Browser and Device

16 Best Ad Blocker For Every Browser and Device

Different Types of Aesthetics: 30 Outfit Ideas to Step Up Your OOTD Game

Different Types of Aesthetics: 30 Outfit Ideas to Step Up Your OOTD Game

Watch Guide: 20 Best Limited Series on Netflix

Watch Guide: 20 Best Limited Series on Netflix

Pauly Shore’s Sundance Debut: A Tribute To Richard Simmons

Pauly Shore’s Sundance Debut: A Tribute To Richard Simmons

Geek Instructor

How to View Web Page Source Code on iPhone: 5 Ways

A source code is something that every developer is familiar with. In fact, they play with source codes every day. While carrying out your work on a PC or a laptop, it is easy as a pie to check the source code of any web page or website. Just right-click and you have the option right on your screen. Similarly, when you are using an Android phone, browsers like Chrome give the option to view the source code of any web page easily.

View source code of web pages on iPhone

But this is not the case when you are working with an iPhone or an iPad. If you own an iPhone, and you get an urgent requirement to check the source code of any web page, you feel helpless and you have to go through the whole process of opening your PC, visiting that web page, and then inspecting it. This whole process is irritating and surely takes a lot of time. And at that time you wish if it was possible to inspect the same web page using the Safari browser of my iPhone.

Well, to your surprise, yes it is possible to view the HTML source code of any web page right through your iPhone’s Safari app. Although it’s not as simple as in Android phones, we have shared some tips and tricks that will help you out. So use these methods and the next time some web page fascinates you and you want to inspect it, just do it using your iPhone or iPad.

Table of Contents

1. Use Web Inspector Safari extension on iPhone

There is a new Safari extension available for iPhone and iPad which comes by the name Web Inspector. It is recently launched after the iOS 15 update. This extension is the most advanced web inspector tool that has ever made for the mobile smartphones till now. Why we are saying this is because it gives you features which are available in the desktop browser inspector tool. You can not only view the source code of a web page but also inspect particular HTML elements in the DOM, run codes in the console, check network requests and resources used by the web page and much more.

Here’s how you can use the Web Inspector extension on Safari browser to view page source code on your iPhone or iPad –

  • First, install the Web Inspector from the App Store. It is available for free and would take just few seconds to download as the size is very small.
  • Once installed, you will see the app added to your home screen. Click on it to open and then it will ask to allow Safari extension from the settings.
  • Open the Settings on your iPhone or iPad and go to Safari .

Enable extension in Safari

  • To check the source code, open the Safari app and visit the web page.

Web Inspector extension

  • If you go to the Elements tab, there you can check more details of the element such as attributes, styles, and even computed style like you see on the desktop browsers. You can also make edits in the HTML source code of the web page, apply the changes and see the live preview.

2. Create a view source shortcut for Safari

In this method, we will using Shortcuts app on iPhone to create a shortcut for viewing the source code on Safari. This is very technical method and you will need to be attentive while following the steps. To start with, first find and open the Shortcuts app and tap the plus button at the top right corner. In the next screen, give a name to your shortcut like View source or whatever you want.

After that, tap the three dots in the upper right corner which will open a pop up box on your screen. Enable the Show in Share Sheet button and click the Done option.

Set the type of content you want to receive from the Share Sheet to Safari web pages only by clicking on the Any option on the Receive command. Make sure to clear all other inputs.

Now tap the + Add Action button and search for Make HTML from Rich Text . Click on it to add it to the shortcut.

Search for another action named Quick Look using the search bar at the bottom and add it also. This is how the final page will look like –

Create shortcut for view source

Now you have successfully create a shortcut for viewing source code of any web page on Safari browser. To use it, visit the web page you want to inspect and click the share button at the bottom. Swipe it up and click on the View Source option that you created with the Shortcuts app. This will open a pop up box where you will see the HTML source code of the web page.

3. Safari bookmark trick to view page source

This is the old school method which used to the only way to view the source code on iPhone before when there are no extensions available for Safari browser. This method would require you to use a script code and save it as bookmark on Safari. Then you simply need to open the bookmark on the web page you want to inspect. Here’s a detailed guide on this method –

First of all, open the Safari browser on your iPhone or iPad and visit any web page. Click on the share button (a square with an arrow pointing upward) at the bottom. Next, click on the Add bookmark option and then save it. Now you need to go to the Bookmarks, click the Edit option and then choose the bookmark you have recently saved. Change it name to something like “ View source ” and replace the address field with the below code.

Now all the technical part is done. Whenever you want to view the source code of a web page, simply open it, go to the Bookmarks and click on the new bookmark you have created to run the script. You will then see the code all over your screen. The drawback of this method is that it doesn’t highlight the HTML elements in different colors so it become little difficult to find what you are looking for.

View source using bookmark script

4. Use Google’s webpage cache to view source

If you don’t want to install a third party extension on your phone or don’t use any method that involves script to view the source code of a webpage on your iPhone or iPad then this method is for you. Here will use the Google’s cache version of the web page to view its HTML source code.

For those who don’t know, Google save a cached copy of all web pages that are indexed on it. You can publicly access this cached version by adding cache: before the address of the web page. This is all what you have to do in this method.

Simply, open the Safari browser on your iPhone or iPad and visit the web page or website whose source code you want to view. After that, click on the URL tab and add cache: at the starting. As you visit the link, it will take you to Google’s cache page. Make sure there is no space after cache: otherwise you will land on Google search page instead. The next thing you have to do is to click on the View source option.

View source Google's cache

Please note that this method will only show the web page as it appeared the last time when Google crawled it. In the meantime, the current page could have changed so you won’t get to see the updated HTML source code with this method until the Google crawl the web page again.

5. Use View Source application

Although we have shared enough methods for this topic but this last one is for those people who wants to use a specific application for viewing the source code of the web pages on their iOS device. There is an app named View Source which you can find on the App Store. You simply need to install this app on your phone, open it and enter the URL of the web page you want to inspect. It will then instantly show the HTML source code. As simple as that!

Use View Source app on iPhone

Another feature that this app has is the direct integration with the Safari browser. When you browsing on Safari and instantly need to view the source of a web page, just click on the share button and swipe the pop up to reveal all options. You will find View Source there. Clicking on that will open a pop-up window where you will see the source code of the web page.

So these are some methods which you can use to view the page source in Safari browser on your iPhone or iPad. Out of all these, using the Web Inspector extension is the best one as it gives you other useful features also which are available on desktop browser. Other than that, you can also use Google’s cache method to quickly view the source code of any web page without installing any app or extension on your device. Let us know which method your personally liked that you will use. If you are facing any problem, feel free to share it in the comments below.

Related Posts

Fix incoming call busy problem

10 Ways to Fix Incoming Call Busy Problem [Solved]

safari view source shortcut

3 Ways to Scan Documents on iPhone Without Any App

safari view source shortcut

How to Turn Off Live Text on iPhone: 2 Ways

safari view source shortcut

How to Compress Files to a ZIP Archive on iPhone

Leave a comment cancel reply.

Your email address will not be published. Required fields are marked *

Save my name, email, and website in this browser for the next time I comment.

Looks like no one’s replied in a while. To start the conversation again, simply ask a new question.

Tuffy Nicolas

What happened to "View Source" (of web page code) in Safari 14.1.1 in Big Sur 11.4?

In older versions of Safari, under the "View" menu, there was a command called "View Source" (option-command-U keyboard shortcut) that revealed the underlying html/css/etc. code of whatever web page that was on the screen. However, after I upgraded to Big Sur 11.4, the 'View Source" menu option is gone in the recent versions of Safari, and the keyboard command no longer works.

Why was View Source removed, and how can I create a workaround to quickly view the source code of any web page being displayed in Safari, as formerly was possible?

(I realize that I can in theory "Save As" a Safari page as a "Web Archive' and then later open that file in a web page editing program, and see the code that way, but that's too time-consuming and complicated. I just want to be able to hit a keyboard shortcut or choose a menu option within Safari itself for a quick instant view of the page's underlying code. Perhaps there is some kind of add-on or widget that restores this functionality?)

Posted on Jul 16, 2021 10:51 AM

dialabrain

Posted on Jul 16, 2021 11:14 AM

Safari > Preferences > Advanced. Enable “Show Develop menu in menu bar”. It's under there.

Similar questions

  • How do I remove tab bar in Safari in Big Sur 11.6? How do I remove tab bar in Safari in Big Sur 11.6? 653 4
  • Safari preference - header or footer no longer available MacBook Pro, Mojave 10.14.6. Since last update, Safari no longer provides footer (URL) of downloaded website. I can't find any instructions to reestablish that feature (like you can in Opera). I need the footer references. Copying them and pasting them onto the PDF is cumbersome. Do any of you experts know a way to get Safari to provide footer or header? (For some websites Opera is useless for this). Thanks imyoung 624 2
  • Safari Deleting zip files When I download a zip file using Safari in Big Sur 11.2 (and other older version of macOS), the downloaded file is automatically expanded with Archive Utility, and the zip file placed in the trash. I do not want this to happen. I have changed the preferences in Archive Utility to make it place the expanded file in the same location as the Archive and for the Archive to be left alone. This works for any zip file I open manually with the Archive Utility, but when I download a file, it automatically does what it has always done, and trashed the zip file. Why can I not make Safari not change the preferences? Does Safari even use Archive Utility? 694 4

Loading page content

Page content loaded

Jul 16, 2021 11:14 AM in response to Tuffy Nicolas

VikingOSX

Jul 16, 2021 11:27 AM in response to Tuffy Nicolas

Why questions regarding Apple product changes cannot be answered by your fellow users. No Apple product teams participate in these public communities to answer your question either.

You can select Develop Menu > Show Page Source/s and when the web inspector opens at the bottom of the browser, choose the Sources tab if not already selected, then select the third icon from the X button to detach the source view in a separate window. That is a PITA in contrast to how it used to work in previous versions of Pages. It is common sense obfuscation.

Old Toad

Jul 16, 2021 1:38 PM in response to Tuffy Nicolas

Control (right) - click anywhere on the webpage and select Show Page Source from the contextual menu.

safari view source shortcut

Jul 16, 2021 11:24 AM in response to dialabrain

Great! I had hoped it was hidden in there somewhere. Pretty sneaky hiding place, but now I've got it turned on again. Solved!

Jul 16, 2021 11:25 AM in response to Tuffy Nicolas

Jul 16, 2021 2:05 PM in response to Old Toad

FWIW, that only works if the developer menu is enabled.

Download Free

How to View Page Source on Safari

It's free and super easy to set up

Safari is a popular web browser used on both desktop and iOS devices. It offers many features that make web browsing effortless and enjoyable. One of its features is the ability to view page source. Page source is the underlying code that creates a webpage. Understanding how to view page source can be helpful for troubleshooting website issues, learning coding principles, or simply satisfying one's curiosity.

Understanding Page Source and Its Importance

In simple terms, page source is the code that creates the visual layout of a webpage. Every webpage is made up of various HTML, CSS, and JavaScript files. The page source is the foundation of how the webpage is presented to the user. It's crucial to understand page source's importance since it could help one in troubleshooting website issues.

When you view a webpage, your browser loads the page source code and interprets it to display the webpage. The HTML code defines the structure of the webpage, while the CSS code defines the style and layout of the page. JavaScript code is used to add interactivity to the webpage.

By viewing the page source, you can see the exact code that creates the webpage. This can be useful in troubleshooting issues with the webpage, such as broken links or missing images. You can also use the page source to learn how a webpage was built and gain insight into web development.

Another benefit of understanding page source is that it can help with search engine optimization (SEO). Search engines use the page source to understand the content of a webpage and rank it in search results. By optimizing the page source, you can improve the chances of your webpage ranking higher in search results.

It's also important to note that not all page source code is created equal. Some web developers may use sloppy or inefficient code, which can negatively impact the performance of the webpage. Understanding page source can help you identify and fix these issues, resulting in a faster and more efficient webpage.

In conclusion, understanding page source is an essential aspect of web development and website troubleshooting. By gaining insight into the code that creates a webpage, you can optimize the webpage for search engines, improve performance, and troubleshoot issues more effectively.

Enabling the Develop Menu in Safari

Before we can view the page source in Safari, we must first activate the Develop menu. The Develop menu provides many features for web developers and allows us to view page source with ease.

Accessing Safari Preferences

To activate the Develop menu, click on Safari in the menu bar and select Preferences. Alternatively, you can use the keyboard shortcut Command + comma (,).

Activating the Develop Menu

In the Safari Preferences window, click on the Advanced tab. Check the box next to "Show Develop menu in menu bar”.

Viewing Page Source Using the Develop Menu

With the Develop menu activated, we're now ready to view page source in Safari.

Navigating to the Desired Webpage

Open Safari and navigate to the webpage that you want to view the page source. Once the webpage has finished loading, go to the Develop menu and select "Show Page Source”. Alternatively, you can use the keyboard shortcut Option + Command + U.

Accessing the Page Source

A new window will appear, displaying the page source of the current webpage. You can view the page source by scrolling through the code. For easier reference, you can search for specific keywords using the search bar. You can also copy the page source by selecting all and copying it.

Using Keyboard Shortcuts to View Page Source

If you prefer using keyboard shortcuts to view page source, you can use Option + Command + U for macOS or Ctrl + U for Windows. This will bring up the page source in a new window, allowing you to examine the code.

Viewing Page Source on Safari for iOS Devices

Viewing page source on Safari for iOS devices isn't as straightforward as on the desktop, but it's still possible.

Installing a Third-Party App

To view page source on Safari for iOS, you'll need to install a third-party app like View Source or Source App. These apps will add a bookmarklet to Safari, which you can use to view the page source of any webpage that you're currently viewing.

Accessing Page Source on iOS

Once you've installed the app, go to the webpage that you want to view the page source. Tap on the Share button and select "View Source” or "Source”. The app will open a new window displaying the page source of the current webpage.

Analyzing Page Source for Troubleshooting and Learning

Viewing page source is not only useful for troubleshooting website issues, but it's also a great way to learn coding principles.

Identifying Common HTML Elements

By viewing page source, you can identify the HTML elements used on a webpage. This can help you understand how webpages are structured and how they're displayed to the user.

Inspecting CSS and JavaScript Files

You can also examine the CSS and JavaScript files used on a webpage. This can help you understand how the webpage is styled, how animations and interactivity are created, and how ads and analytics are integrated.

Frequently Asked Questions about Viewing Page Source in Safari

Can i edit the page source in safari.

No, the page source displayed in Safari can only be viewed. You'll need to use a code editor like Notepad, Sublime, or Visual Studio Code to edit page source.

Do I need to know how to code to view page source?

No, you don't need to know how to code to view page source. It can be helpful, but not necessary. Viewing page source is more about understanding how webpages are built and identifying possible issues.

Should I view page source on every webpage I visit?

It's not necessary to view page source on every webpage you visit unless you're troubleshooting or analyzing a particular webpage. However, it can be a helpful habit to adopt if you're interested in learning more about web development.

Can I view page source on other web browsers?

Yes, you can view page source on other browsers as well. Firefox, Chrome, and Edge all have similar features for viewing page source.

In conclusion, viewing page source can be both informative and helpful for both web developers and casual users. Safari offers multiple ways to access page source, making it accessible for everyone. Whether you're troubleshooting website issues or simply learning coding principles, viewing page source is definitely worth exploring.

Let's set you up !

Working on the web!

Student Tips

Startup Tools

Browser Glossary

Browser Tips

WebNots

Home » Tech Tips » iPhone » How to View Webpage HTML Source in iPhone?

How to View Webpage HTML Source in iPhone?

On desktop computers, you can use the developer console on the browsers to check the source code of websites. This is a very easy task when using Google Chrome browser both on Mac and Windows based computers. However, viewing source code is a lengthy process when using Safari browser on MacBook . And, that’s a kind of hidden feature with the Safari on your iPhone. If you ever wonder how to look at the HTML source code of webpages in your iPhone, here is how you can do that.

Can I View Source Code of Webpages in Safari iPhone?

The answer is no. You can’t view the source code of webpages directly on your iPhone. It also does not make sense to do such analysis with a small screen devices. However, Apple allows you to view the source code of mobile webpages and do all the Developer Console related stuffs from your Mac.

What You Need?

You need the following things to view the source code of iPhone Safari webpages on your Mac?

  • Your iPhone with the the latest iOS version
  • Lightning or USB-C connector cable
  • Your Mac computer or laptop
  • Safari browser in both iPhone and Mac

How to View Source Code of Webpages in Safari iPhone?

Follow the below steps to view the source code of webpages in Safari iPhone on your Mac.

  • Add “Develop” menu in Mac Safari
  • Enable “Web Inspector” in Safari iPhone
  • Connect iPhone to Mac
  • View source and inspect elements

Step 1 – Add Develop Menu in Safari Mac

By default, Mac Safari does not show the developer console and inspect element options. You need to manually enable “Develop” menu in order to use developer console in Safari.

  • Launch Safari and go to “Safari > Settings…” section.
  • Go to “Advanced” tab and enable “Show Develop menu in the menu bar” option.

Show Developer Features in Mac Safari

Learn more on how to add “Develop” menu in Safari and do the responsiveness testing of website.

Step 2 – Enable Web Inspector in Safari iPhone

Similar to enabling “Develop” menu in Safari Mac, you also need to enable an option called “Web Inspector” in Safari iPhone.

  • Tap on the “Settings” app and go to “Safari” settings page on your iPhone.
  • Scroll down to the bottom and tap on “Advanced” option.
  • On the next screen, you can enable “Web Inspector” option.

Advanced Safari Settings iPhone

Step 3 – Connect iPhone to Mac

Now that you have setup your iPhone and Mac. Next step is to connect the iPhone to your Mac. If you have old iPhone / Mac models, use your USB lightning cable to connect the phone to Mac. However, the latest iPhone / Mac models come with USB Type-C connector instead of lightning cable. If you have one old model device and one new model device (either iPhone or Mac), you need an additional convertor to connect your iPhone and Mac.

If this is the first time you connect your iPhone, then choose to “Trust” the device by entering your passcode. Otherwise, you will not see the webpages opened in iPhone from Mac.

Trust Mac

Step 4 – View Source HTML Code

Launch Safari browser on iPhone and open the website you want to view the source code and inspect elements.

  • Go to your Mac and launch Safari browser. Navigate to “Develop > Your iPhone Name” to view the webpages that you have opened on your phone.

Open iPhone Page in Mac Safari

  • Click on the website to open “Web Inspector” that will show the source code of the webpage opened in Safari iPhone.

iPhone Page Source in Mac

  • You can view elements, check source HTML / CSS and do all kind of analysis that you can do with Chrome Developer Tools .
  • You can select the HTML elements in Mac Web Inspector (first column) to view source code and the corresponding element will get highlighted on your Safari iPhone.

Highlighted Element in iPhone

Final Words

Note that you can also do the responsive site analysis on Safari Mac. However, selecting mobile relevant elements may be difficult in responsive design mode and Mac may not have your iPhone models by default. Therefore, using Web Inspector to inspect elements is an effective method to directly get the relevant mobile element’s source code.

About Nagasundaram Arumugham

Naga is the founder and chief content editor of WebNots. He has over 20 years of experience in technology field and published more than 2000 articles.

You also might be interested in

Create and Manage Favorites Folders in Safari iPhone

How to Create Favorites Folders in iPhone Safari?

Bookmarking is an essential routine when using browsers to keep[...]

Weebly App Center

Weebly Introduces App Center

Weebly on first of October 2015 released a major update[...]

How to Customize Dashboard App in MacBook?

How to Customize Dashboard App in MacBook?

MacOS has multiple desktop management tools like multiple desktops, Mission[...]

DOWNLOAD EBOOKS

  • SEO Guide for Beginners
  • WordPress SEO PDF Guide
  • Weebly SEO PDF Guide
  • Alt Code Emoji Shortcuts PDF
  • ALT Code Shortcuts PDF
  • View All eBooks

TRENDING TECH ARTICLES

  • ALT Code Shortcuts for Symbols
  • Fix Chrome Resolving Host Problem
  • Fix Slow Page Loading Issue in Google Chrome
  • View Webpage Source CSS and HTML in Google Chrome
  • Fix Safari Slow Loading Pages in macOS
  • Fix Windows WiFi Connection Issue
  • ROYGBIV or VIBGYOR Rainbow Color Codes
  • Fix I’m Not A Robot reCAPTCHA Issue in Google Search
  • Structure of HTTP Request and Response

POPULAR WEB TUTORIALS

  • Move WordPress Localhost Site to Live Server
  • Move Live WordPress Site to Localhost
  • Move WordPress Media Folder to Subdomain
  • Fix WooCommerce Ajax Loading Issue
  • Create a Free Weebly Blog
  • Edit Weebly Source Code HTML and CSS
  • Add Scroll To Top Button in Weebly
  • Add Table in Weebly Site
  • How to Add Advanced Data Table Widget in Weebly?
  • Up to $500 Free Google Ads Coupon Codes

FREE SEO TOOLS

  • Webpage Source Code Viewer
  • HTTP Header Checker
  • What is My IP Address?
  • Google Cache Checker
  • Domain Age Checker Tool
  • View All Free Web and SEO Tools

© 2024 · WebNots · All Rights Reserved.

Type and press Enter to search

MobiGyaan

  • Telecom News
  • Smartphone News

How To View Page Source In Safari Browser On Your Mac [Guide]

Surfing the internet using browsers is a daily routine for most of us, however, some people also view the source of the webpage. Safari browser is the default browser on Mac computers and is one of the fastest web browsers available. But to view page source in Safari, you can’t do it right away.

Browsers like Google Chrome and Firefox allow you to view the web site’s source code with a couple of clicks away, but when it comes to Safari, you can’t view the source just like that. You must first enable a developer toolset for the Safari browser and then you will be able to access the web page source feature.

Mac 3

How To View Page Source In Safari

To view page source in the Safari browser on your Mac, follow the steps. This applies to all versions of Safari and macOS.

  • Launch Safari browser on your Mac
  • Click on  Safari -> Preferences  located at the menu bar on the top.
  • Click on  Advanced  and check the box  Show Develop menu in the menu bar as shown .

This will enable the web developer toolset on Safari and with that, you access do a lot of developer tools which includes the Show Page Source.

How To View Page Source In Safari Browser On Your Mac Guide 1

Now type the website address into the address bar and navigate to the webpage you want to view the source code.

  • Go to Develop -> Show Page Source in the menu bar after you’ve checked the box in the settings.

You can also use the keyboard shortcut Command + Option + U  to view the web page source code.

  • Use Command + Option + U to view page source code.

Google Chrome and Firefox browsers also have similar developer tools, these tools are enabled by default and you can access them by right-clicking on the webpage and click on view source or inspect element.

How To View Page Source In Safari Browser On Your Mac Guide 3

Do you have any handy tricks associated with the Safari browser? Let us know.

More tips and tricks, guides, and tutorials on Mac and Windows are available on How-To Guides . For more updates on the latest smartphones and tech, follow us on our social media profiles.

  • Instagram | Facebook | TikTok

Realme Buds Q TWS earphones to soon launch in India

How to create playlists on apple music on your mac [guide].

How To Create Playlists On Apple Music On Your Mac [Guide]

  • Privacy Policy

© 2008-2023 - MobiGyaan. All Rights Reserved.

  • Team MobiGyaan
  • Work with us
  • Gaming Picks
  • Buying Guides
  • Entertainments Picks

Logo

  • Social media

How to View Page Source in Safari on Mac: A Complete Guide

safari view source shortcut

Viewing the source code of websites is a routine activity for many people who work with the web, whether for a living or as a hobby. Viewing the page source in Safari on Mac OS is quite simple.

How to View Page Source in Safari on Mac

To view a website’s source code in Safari, you must enable the developer toolkit:

  • Go to the Safari menu, select “Preferences,” go to “Advanced,” and select the checkbox to enable the developer menu.
  • Next, go to the webpage whose source code you want to see, and once there:
  • Drag down the Develop menu at the top of the screen, and choose Show Page Source from the menu options.
  • The webpage source code appears on the screen in the Web Inspector Sources section – a web developer tool built into Safari.

View a Page Source with a Keyboard Shortcut on Safari for Mac

After enabling the Develop menu in Safari, you can also use the following keyboard shortcut to view a website’s source code:

  • Go to the webpage whose source code you want to see.
  • Press Command + Option + U to see the page source.

The shortcut key opens the Web Scan tool, which is the same as accessing it from the Develop menu.

Developers can perform many other useful web tasks aside from viewing the page source with the Develop menu, such as disabling Javascript, and clearing Safari’s cache, among other functions and features aimed at advanced users and developers.

What Devices and Operating Systems Does this Guide Support?

This guide on how to view page source in Safari on Mac supports Apple devices only and is compatible with Mac OS or iOS.

Can I Use this Guide for Free?

Yes, this guide is entirely free of charge.

Final Thoughts

If you encounter any issues or have any questions regarding how to view page source in Safari on Mac, don’t hesitate to drop a comment below or reach out to us directly. It’s important to note that this guide is solely for educational purposes, and if you want to correct any misinformation about this article or suggest alternative methods, please contact us.

Related posts:

  • How to View Source in Safari on iPad or iPhone: A Step-by-Step Guide Do you want to view the source code of a...
  • How to Page Up & Page Down on Mac Keyboards: A Comprehensive Guide Are you a Mac user who misses the Page Up...
  • How to Find and Access Embedded Files in Safari on Mac with Page Resources Looking to find and access embedded files on Safari? The...
  • Show Process ID of Individual Web Page Tabs & Windows on Safari for Mac OS Learn how to easily track and identify the process IDs...
  • How to Preview Web Page Links on Safari for Mac using a Multitouch Tap Trick Have you ever been reading an article and come across...
  • Add Web Sites to Safari Favorites Page on iPhone & iPad: A Step-by-Step Guide Learn how to easily add your favorite websites to the...
  • How to Bookmark a Web Page in Safari on iPhone & iPad: Step-by-Step Guide Learn how to easily bookmark web pages in Safari on...
  • Show & Hide Notification Center Widgets in Today View of Mac OS: A Complete Guide Learn how to customize the Notification Center widgets on your...
  • How to View Timestamps in Messages on Mac OS: A Complete Guide Learn how to view timestamps on messages in Mac OS...
  • How to Play and View SWF Files on Mac: A Complete Guide If you’re a Mac user and you’ve come across a...
  • Apple How-To Guide
  • Apple Tutorial MAC

James Hogan

LEAVE A REPLY Cancel reply

Save my name, email, and website in this browser for the next time I comment.

  • All time popular

How to Insert Emojis in Excel: mastering emojis in excel

How to transfer psp videos to a memory stick, how to enable never combine taskbar buttons on windows 11/10, how to remove curses in baldur’s gate 3, monster hunter world: how to get twisted stouthorn, fixed: ‘failed to play test tone’ error, how to create images with paint cocreator on windows, baldur’s gate 3: how to use torches, how to get drives in bee swarm simulator, how to find and use monkey paw in phasmophobia, palworld: how to get high quality pal oil, elden ring: how to get serpentbone blade katana, final fantasy 14: how to get the ufo mount, final fantasy xiv: how to unlock gilded araya trial, palworld: how to get paldium fragments, lego fortnite: how to defeat brutes, how to fast travel in palworld: wing warp your way, elden ring: how to get the erdtree seal, how to capture humans in palworld, how to get dragonbone artifacts in monster hunter world, how to make copper bar in lego fortnite, how to beat sentinel boss in blade ball, how to get abducted by aliens in the sims 4, monster hunter world: how to unlock rainbow pigment, most popular, how to put circle around number in excel: 3 ways, fix: there is insufficient memory or disk space in word, fixed: ‘immersive reader not working’ issue in onenote, how to collect flying pages in hogwarts legacy.

Logo

macOS Sonoma 14.3

Released January 22, 2024

Apple Neural Engine

Available for: macOS Sonoma

Impact: An app may be able to execute arbitrary code with kernel privileges

Description: The issue was addressed with improved memory handling.

CVE-2024-23212: Ye Zhang of Baidu Security

Impact: An attacker may be able to decrypt legacy RSA PKCS#1 v1.5 ciphertexts without having the private key

Description: A timing side-channel issue was addressed with improvements to constant-time computation in cryptographic functions.

CVE-2024-23218: Clemens Lang

Impact: An app may be able to access sensitive user data

Description: The issue was addressed with improved checks.

CVE-2024-23224: Brian McNulty

CVE-2024-23208: fmyy(@binary_fmyy) and lime From TIANGONG Team of Legendsec at QI-ANXIN Group

Impact: Processing web content may lead to arbitrary code execution

CVE-2024-23209

Mail Search

Description: This issue was addressed with improved redaction of sensitive information.

CVE-2024-23207: Noah Roskin-Frazee and Prof. J. (ZeroClicks.ai Lab), and Ian de Marcellus

NSSpellChecker

Description: A privacy issue was addressed with improved handling of files.

CVE-2024-23223: Noah Roskin-Frazee and Prof. J. (ZeroClicks.ai Lab)

Impact: A user's private browsing activity may be visible in Settings

Description: A privacy issue was addressed with improved handling of user preferences.

CVE-2024-23211: Mark Bowers

Impact: A shortcut may be able to use sensitive data with certain actions without prompting the user

Description: The issue was addressed with additional permissions checks.

CVE-2024-23203: an anonymous researcher

CVE-2024-23204: Jubaer Alnazi (@h33tjubaer)

Impact: An app may be able to bypass certain Privacy preferences

Description: A privacy issue was addressed with improved handling of temporary files.

CVE-2024-23217: Kirin (@Pwnrin)

Impact: An app may be able to access user-sensitive data

Description: An issue was addressed with improved handling of temporary files.

CVE-2024-23215: Zhongquan Li (@Guluisacat)

Impact: An app may be able to view a user's phone number in system logs

CVE-2024-23210: Noah Roskin-Frazee and Prof. J. (ZeroClicks.ai Lab)

Impact: A maliciously crafted webpage may be able to fingerprint the user

Description: An access issue was addressed with improved access restrictions.

WebKit Bugzilla: 262699 CVE-2024-23206: an anonymous researcher

WebKit Bugzilla: 266619 CVE-2024-23213: Wangtaiyu of Zhongfu info

Impact: Processing maliciously crafted web content may lead to arbitrary code execution

Description: Multiple memory corruption issues were addressed with improved memory handling.

WebKit Bugzilla: 265129 CVE-2024-23214: Nan Wang (@eternalsakura13) of 360 Vulnerability Research Institute

Impact: Processing maliciously crafted web content may lead to arbitrary code execution. Apple is aware of a report that this issue may have been exploited.

Description: A type confusion issue was addressed with improved checks.

WebKit Bugzilla: 267134 CVE-2024-23222

Information about products not manufactured by Apple, or independent websites not controlled or tested by Apple, is provided without recommendation or endorsement. Apple assumes no responsibility with regard to the selection, performance, or use of third-party websites or products. Apple makes no representations regarding third-party website accuracy or reliability. Contact the vendor for additional information.

Start a discussion in Apple Support Communities

The Vision Pro’s first killer app is the web, whether Apple likes it or not

Apple rules the app world with an iron fist. now, as developers reassert their control, apple needs safari to work for its headset to work..

By David Pierce , editor-at-large and Vergecast co-host with over a decade of experience covering consumer tech. Previously, at Protocol, The Wall Street Journal, and Wired.

Share this story

A man controls Safari and other apps inside the Apple Vision Pro headset

In the days ahead of the Vision Pro’s launch, Apple has heavily promoted some of the apps destined for its spatial computing headset. Download Disney Plus and watch movies from Tatooine ! Slack and Fantastical and Microsoft Office on your face! FaceTime with your friends as a floating hologram! But it’s increasingly clear that the early success of the Vision Pro, and much of the answer to the question of what this headset is actually for, will come from a single app: Safari. 

That’s right, friends. Web browsers are back. And Apple needs them more than ever if it wants this $3,500 face computer to be a hit. Embracing the web will mean threatening the very things that have made Apple so powerful and so rich in the mobile era, but at least at first, the open web is Apple’s best chance to make its headset a winner. Because at least so far, it seems developers are not exactly jumping to build new apps for Apple’s new platform.

Historically, Apple is unmatched in its ability to get app makers to keep up with its newest stuff. When it releases features for iPhones and iPads, a huge chunk of the App Store supports those features within a few weeks. But so far, developers appear to be taking their Vision Pro development slowly. Exactly why varies across the App Store, but there are a bunch of good reasons to choose from. One is just that it’s a new platform with new UI ideas and usability concerns on a really expensive device few people will have access to for a while. Sure, you can more or less tick a box and port your iPad app to the Vision Pro, but that may not be up to everyone’s standards.

The bigger-picture reason is that Apple and its developers are increasingly at odds. Some of the high-profile companies that have announced they’re not yet building apps for the Vision Pro and its visionOS platform — Netflix , Spotify, YouTube , and others — are the very same ones that have loudly taken issue with how Apple runs the App Store. Spotify has been railing against Apple’s 30 percent cut of in-app purchases for years. Netflix got a sweetheart deal from Apple years ago to share only 15 percent of revenue but has recently been refusing to participate in the Apple TV app’s discovery feature and has long since stopped allowing you to subscribe to Netflix from your iOS device. YouTube stopped allowing in-app purchases a few years ago and even canceled subscriptions people purchased in the App Store in order to get away from Apple’s commission.

You’d think the recent end to the Apple / Epic dispute would have made things better since Apple was required to allow developers to link out to other places users can pay for apps. But Apple changed its terms to say that, actually, even if someone clicks the link and subscribes through the web, developers still owe Apple a commission. Sure, it’s 27 percent instead of 30, but that’s not likely to change anyone’s mind. The message was clear: if you sell a product through the App Store, Apple will get its cut one way or another.

All this corporate infighting has the potential to completely change the way we use our devices

But what if you don’t need the App Store to reach Apple users anymore? All this corporate infighting has the potential to completely change the way we use our devices, starting with the Vision Pro. It’s not like you can’t use Spotify on the headset; it’s just that instead of tapping a Spotify app icon, you’ll have to go to Spotify.com. Same for YouTube, Netflix, and every other web app that opts not to build something native for the Vision Pro. And for gamers, whether you want to use Xbox Game Pass or just play Fortnite , you’ll also need a browser. Over the last decade or so, we’ve all stopped opening websites and started tapping app icons, but the age of the URL might be coming back.

If you believe the open web is a good thing, and that developers should spend more time on their web apps and less on their native ones, this is a big win for the future of the internet. (Disclosure: I believe all these things.) The problem is, it’s happening after nearly two decades of mobile platforms systematically downgrading and ignoring their browsing experience. You can create homescreen bookmarks, which are just shortcuts to web apps, but those web apps don’t have the same access to offline modes, cross-app collaboration, or some of your phone’s other built-in features. After all this time, you still can’t easily run browser extensions on mobile Safari or mobile Chrome. Apple also makes it maddeningly complicated just to stay logged in to the services you use on the web across different apps. Mobile platforms treat browsers like webpage viewers, not app platforms, and it shows.

There are some reasons for hope, though: Apple recently added multiple profiles, external webcam support on the iPad, and a few other features to Safari, which at least shows Apple is aware Safari exists and is willing to give it access to some native features. It felt for years like Apple would happily ditch Safari altogether if given the choice; after all, it tightly controls everything about its platforms, and the web is an utterly uncontrollable place. But the company appears to be still invested in making Safari work. (All the Safari-focused antitrust pressure is probably helping move things along, too.)

Safari for visionOS will also come with some platform-specific features: you’ll be able to open multiple windows at the same time and move them all around in virtual space. A leaked video recently showed a user manipulating a 3D object inside of a webpage. Apple engineers said at WWDC last year that they’ve completely redesigned the tab overview for visionOS, and they’ve also made some changes so the browser works both with touch and the eye-tracking and double-pinching mechanics that are core to visionOS. Apple has been warning developers to prepare their apps for all kinds of new screen sizes and layouts, as users do wacky stuff with their headsets. The company also confirmed that it will support WebXR , a protocol for browser-based VR that can be used for some impressively immersive stuff.

Many users might mostly not notice the difference between opening the Spotify app and going to Spotify.com

Rumors have also been flying for a couple of years that Apple is going to drop its WebKit requirement for developers, which would mean other browsers could be built on other rendering engines. If and when that happens, you might be able to run full-fledged Chrome or Firefox on your Apple devices, potentially including the Vision Pro. That change, along with the increased attention on progressive web apps (PWAs) — the cross-platform, web-based apps that Android, Windows, and even Apple are starting to support more aggressively — could make your headset’s browser wildly more powerful practically overnight. With a good browser and powerful PWAs, many users might mostly not notice the difference between opening the Spotify app and going to Spotify.com. That’s a win for the whole web.

A powerful, deeply integrated desktop-class browser will make the Vision Pro useful and powerful from day one. Apple should embrace Safari, allow other desktop-class browsers, and treat the Vision Pro like the power user platform it is. No one has yet seen enough of Safari for visionOS to know if it is all of those things, though — and I’m not sure whether Apple wants it to be. Because here’s the real question for Apple: which is more important, getting the Vision Pro off to a good start or protecting the sanctity of its App Store control at all costs? As Apple tries to create a platform shift to face computers, I’m not sure it can have it both ways.

Netflix is turning into cable TV

Netflix is going to take away its cheapest ad-free plan, ford’s new 48-inch digital dashboard is a lot of android for one car, oneplus 12 review: refreshingly basic, ios 17.3 is out, adding stolen device protection for your iphone.

Sponsor logo

More from this stream Vision Pro apps: the good, the bad, and the ridiculous

Web apps: maybe not coming to a vision pro homescreen near you, netflix’s app won’t work on the vision pro, you won’t be able to use the youtube app on the vision pro, here’s fruit ninja on the vision pro..

  • Apple Watch
  • Accessories
  • Digital Magazine – Subscribe
  • Digital Magazine – Log In
  • Smart Answers
  • M3 MacBook Air
  • New iPad Air
  • iPad mini 7
  • Next Mac Pro
  • Best Mac antivirus
  • Best Mac VPN

When you purchase through links in our articles, we may earn a small commission. This doesn't affect our editorial independence .

iOS 17.3, macOS 14.3 updates patch a zero-day vulnerability that may have been exploited

Michael Simon

On Monday, Apple released the latest round of updates to iOS and iPadOS ( 17.3 ), macOS ( 14.3 ), watchOS ( 10.3 ), and tvOS ( 17.3 ), which include a few new features , a smattering of bug fixes, and some pretty important security patches. Among them is a patch for a vulnerability that may have been exploited in the wild—in other words, you should rush to install the update and patch it.

The zero-day is the first Apple has fixed this year. It affects the following models: iPhone XS and later, iPad Pro 12.9-inch 2nd generation and later, iPad Pro 10.5-inch, iPad Pro 11-inch 1st generation and later, iPad Air 3rd generation and later, iPad 6th generation and later, and iPad mini 5th generation and later, as well as Macs running Sonoma, Ventura, and Monterey, and all Apple TV models. It was discovered as part of the WebKit Bugzilla program.

Apple also released a separate Safari update for macOS Ventura and Monterey that includes the fix, among other patches:

WebKit (CVE-2024-23222)

  • Impact: Processing maliciously crafted web content may lead to arbitrary code execution. Apple is aware of a report that this issue may have been exploited.
  • Description: A type confusion issue was addressed with improved checks.
  • WebKit Bugzilla: 267134

The updates also include about a dozen other patches for Apple Neural Engine, Kernel, Safari, Finder, and Shortcuts, and several other system features, including a strange Time Zone fix:

  • Impact: An app may be able to view a user’s phone number in system logs
  • Description: This issue was addressed with improved redaction of sensitive information.
  • CVE-2024-23210: Noah Roskin-Frazee and Prof. J. (ZeroClicks.ai Lab)

Additionally, Apple released iOS 16.7.5 and iOS 15.8.1 to address a pair of zero-day WebKit flaws that were previously patched in iOS 17.1.2 last year.

Author: Michael Simon , Executive Editor

safari view source shortcut

Michael Simon has been covering Apple since the iPod was the iWalk. His obsession with technology goes back to his first PC—the IBM Thinkpad with the lift-up keyboard for swapping out the drive. He's still waiting for that to come back in style tbh.

Recent stories by Michael Simon:

  • Attention Apple beta testers: The latest iOS 17.3 version is bricking iPhones
  • Apple releases speedy update to macOS 14.2 with bug and security fixes
  • 80 reasons to update your Apple device right now

IMAGES

  1. View Source for Safari on iOS with Shortcuts

    safari view source shortcut

  2. View Source for Safari on iOS with Shortcuts

    safari view source shortcut

  3. How to View Page Source in Safari on Mac

    safari view source shortcut

  4. How to View the Source Code of a Webpage in Safari on Mac

    safari view source shortcut

  5. How to View Source Code of a Webpage in Safari on iPhone and Mac

    safari view source shortcut

  6. View Source for Safari on iOS with Shortcuts

    safari view source shortcut

VIDEO

  1. You use Safari browser?! Do this now. #shorts #applesafari #macbookpro #macios

  2. Safari View in Bandhavgarh National Park and Tiger Reserve, Wildlife Sanctuary

  3. Roaring LION safari view, Bannerghatta Zoo, Bengaluru #pleasesubscribe @thagavalpettagam6071

  4. Jeep safari view #jaisalmer #desert #visit #samdunes #adsc #enjoy #shorts

  5. Best Desert safari view, Contact us 9413787792 , #thar #desert #reels #jeep #shorts

  6. Safari için pratik ipuçları

COMMENTS

  1. Viewing the HTML Source Code in Safari

    Safari also has a keyboard shortcut for viewing the HTML source: Hold down the command and option keys and hit U ( Cmd + Opt + U .) Advantages of Viewing Source Code Viewing the source to see how a web designer achieved a layout will help you learn and improve your work.

  2. How to View the Source Code of a Webpage in Safari on Mac

    To view the source of a page, click on the "Develop" menu and then choose "Show Page Source." Safari should instantly show you the full source code of the webpage. 2. Using a Keyboard Shortcut

  3. How to Turn on the Develop Menu in Safari on Mac

    Alternatively, you can use the keyboard shortcut Command+, (comma). This will also open up Safari preferences. Go to the "Advanced" tab. Check the box for "Show Develop Menu in Menu Bar." Now the Develop menu will appear between Bookmarks and Window at the top.

  4. How to view page source in Safari browser on an iPhone?

    4,777 11 46 78 Add a comment 4 Answers Sorted by: 11 You don't need an app to inject a view source share option. Create a bookmark in mobile Safari and then edit it to include

  5. 5 Ways to View Page Source on iPhone or iPad

    Sounds great? Keep reading to learn how. Method 1: Create a View Source Shortcut The first I recommend is to create a View Source shortcut that is available in Share Sheet, so you can easily access it from Safari. Shortcuts is a stock app in iOS 13 or new versions for automation.

  6. How to View Page Source in Safari on Mac

    The keyboard shortcut for viewing page source will open the web inspector tool, just like accessing it from the Develop menu. If you're an advanced user of Safari, enabling the Develop menu is likely one of the first things you do when you launch the browser for the first time.

  7. How to View Web Page Source on iPhone/iPad: 7 Best Methods

    1. Get the HTML Source Code Using Shortcuts App This method will only work if you're running iOS 12.0 (iPadOS 12.0) and later. Here's how to create a view page source shortcut on iPhone or iPad: Open the Shortcuts app from Home Screen or App Drawer. Tap the plus (+) icon to create a new empty shortcut.

  8. How to View Source Code of a Webpage in Safari on iPhone and Mac

    Step #1. First off, you need to download "Source" on your iOS device. It's priced at $0.99. Step #2. Now, open Safari and tap on the Share button in the toolbar. Step #3. Next, you have to scroll right to the end and tap on More. Step #4. Now, Make sure to enable Source. Then, tap on Done at the top right corner to confirm.

  9. How to view HTML source code in Safari

    You may want to view the HTML source of a web page. This short tutorials explains how to view the source of a webpage: 1. Safari menu > Preferences > Advanced. 2. Check "Show Develop menu in menu bar". Close Safari's preferences. 3. Develop menu > Show Page Source OR right click your mouse and select "Show Page Source".

  10. How to See the Source Code of a Website (Easy Methods)

    Safari. To view the source of a website on a Mac using Safari, navigate to the page you want and use the following keyboard shortcut: Option+Command+U. Alternatively, you can right-click anywhere on the page and select "Show Page Source" from the dropdown menu. View Source Code on a Mac.

  11. How to View HTML Source in Safari

    1. Open Safari and navigate to the web page you want to view the source code for. 2. Click on the "Develop" menu option in the Safari menu bar. If you don't see this menu, go to Safari Preferences > Advanced and check the box next to "Show Develop menu in menu bar". 3. From the "Develop" menu, select "Show Page Source".

  12. View Source for Safari on iOS with Shortcuts

    View Source for Safari on iOS with Shortcuts May 28 2020 — Reading time: 2 minutes I love view-source, it's a nifty super power of the web that nearly all mobile browsers are trying to kill. Not exactly sure why.

  13. Viewing the HTML Source Code in Safari

    If you prefer to use keyboard shortcuts, Safari offers a convenient way to view the HTML source code with just a few key presses. Follow these steps: Open Safari and navigate to the webpage for which you want to view the source code. Press the Option + Command + U keys simultaneously.

  14. How to view webpage HTML source codes on iPad / iPhone ...

    Now you can use go to any webpage using mobile Safari (and Chrome) on your iDevice (iPhone, iPod, or iPad), tap the Bookmarks icon then tap the Show Page Source bookmark, and a new window opens displaying the source code of the webpage. Awesome and Easy! End Results to View HTML source codes And, Of Course, There's an App For That!

  15. How to View Web Page Source Code on iPhone: 5 Ways

    1. Use Web Inspector Safari extension on iPhone 2. Create a view source shortcut for Safari 3. Safari bookmark trick to view page source 4. Use Google's webpage cache to view source 5. Use View Source application 1. Use Web Inspector Safari extension on iPhone

  16. What happened to "View Source" (of web pa…

    In older versions of Safari, under the "View" menu, there was a command called "View Source" (option-command-U keyboard shortcut) that revealed the underlying html/css/etc. code of whatever web page that was on the screen.

  17. How to View Page Source on Safari

    Using Keyboard Shortcuts to View Page Source. If you prefer using keyboard shortcuts to view page source, you can use Option + Command + U for macOS or Ctrl + U for Windows. This will bring up the page source in a new window, allowing you to examine the code. Viewing Page Source on Safari for iOS Devices

  18. javascript

    2 Answers. Sorted by: 1. Choose "show page source" from the "Develop" menu. If you don't have the "develop" menu, you can enable it like so: Open Safari > Preferences, and click on the Advanced Tab: Check "show develop menu in menu bar". Resources and stylesheets etc. can be viewed on the bottom left. Share.

  19. How to View Webpage Source CSS and HTML in Safari Mac?

    Once the " Develop " menu is enabled, open the webpage you want to view the source. Similar to other browsers just right click and chose "Show Page Source" or " Inspect Element " option. This will open the Web Inspector console at the bottom of the page. Note: Web inspector can also opened using the shortcuts " Option + Command ...

  20. How to View Webpage HTML Source in iPhone?

    Go to your Mac and launch Safari browser. Navigate to "Develop > Your iPhone Name" to view the webpages that you have opened on your phone. Open iPhone Page in Mac Safari. Click on the website to open "Web Inspector" that will show the source code of the webpage opened in Safari iPhone. iPhone Page Source in Mac.

  21. How to View Page Source Code in Safari Browser On Mac

    How to View Page Source in safari* Launch Safari browser on your Mac* Click on safari preferences located at the menu bar on the top* Click on advance and c...

  22. How To View Page Source In Safari Browser On Your Mac [Guide]

    VDOMDHTMLtml> How To View Page Source In Safari Browser On Your Mac [Guide] Surfing the internet using browsers is a daily routine for most of us, however, some people also view the source...

  23. How to View Page Source in Safari on Mac: A Complete Guide

    View a Page Source with a Keyboard Shortcut on Safari for Mac After enabling the Develop menu in Safari, you can also use the following keyboard shortcut to view a website's source code: Go to the webpage whose source code you want to see. Press Command + Option + U to see the page source.

  24. About the security content of macOS Sonoma 14.3

    Safari. Available for: macOS Sonoma. ... Shortcuts. Available for: macOS Sonoma. Impact: A shortcut may be able to use sensitive data with certain actions without prompting the user. Description: The issue was addressed with additional permissions checks. ... An app may be able to view a user's phone number in system logs.

  25. The Vision Pro's most important app is Safari, whether Apple likes it

    The Vision Pro's first killer app is the web, whether Apple likes it or not. Apple rules the app world with an iron fist. Now, as developers reassert their control, Apple needs Safari to work ...

  26. iOS 17.3, macOS 14.3 updates patch a zero-day vulnerability ...

    The updates also include about a dozen other patches for Apple Neural Engine, Kernel, Safari, Finder, and Shortcuts, and several other system features, including a strange Time Zone fix: Time Zone