無料オンラインツール - インストール不要

スマホでページのソースを表示

どんなウェブページの裏側のHTMLも、スマホでそのまま確認できます - アプリもパソコンも不要。下にURLを貼り付ければ整形&ハイライトされたソースが表示されます。iPhoneとAndroidの手順は下のセクションをご覧ください。

https://
source.html

ページ速度

🖥 サーバー情報

    📄 ページ情報

      スマホでページのソースを見る

      モバイルブラウザはソースを隠しています。このツール(と下の手順)がそれを取り戻します。

      パソコンなら、ページのHTMLはキーボードショートカット一つで見られます。しかしスマホでは事情が違います。iPhoneのSafariには「ソースを表示」がなく、view-source: のURLも完全にブロックされます。一方 AndroidのChromeは view-source: に対応していますが、生のHTMLが長い1行に詰め込まれて表示され、とても読めたものではありません。

      このページ上部のツールはどんなスマホ・タブレットでも動作します。当サイトのサーバーがページを取得し、整形&シンタックスハイライトされたHTMLを返すので、小さな画面でも読みやすく、アプリのインストールもパソコンも不要です。以下では各プラットフォームの標準的な方法と、どんなときにツールを使うべきかを説明します。

      iPhone(Safari)でページのソースを表示する方法

      iOSには標準のview-sourceがないため、ウェブツールが最も手軽です。

      1. 上のツールを使う(最も簡単)このページ上部の入力欄にページのアドレスを貼り付け、「ソース表示」をタップします。Safari、Chrome、その他どのiOSブラウザでも動作し、コピーやダウンロードができる読みやすいハイライト付きHTMLが得られます。
      2. 「ソースを表示」ブックマークレットを追加する上級者向け: 小さなJavaScriptのブックマークレットをSafariのブックマークに保存し、任意のページで実行してソースを開きます。便利ですが、iOSでの設定はやや面倒です。
      3. ライブDOMはMacで確認するiPhoneをMacに接続し、設定 → Safari → 詳細 からWebインスペクタを有効にして、SafariのDevelop(開発)メニューからJavaScriptでレンダリングされたDOMを調べます。

      注意: URLの前に view-source: と入力しても、iOSのSafariでは動作しません - そのテキストを検索するだけです。iPhoneでは上のツールが確実な選択肢です。

      Android(Chrome)でページのソースを表示する方法

      Android版Chromeには標準の方法があります - さらに手軽で整形された代替手段も。

      1. Chromeで view-source: を使うアドレスバーをタップし、URLの直前に view-source: と入力します(例: view-source:https://example.com)。Chromeがそのページの生のHTMLを表示します。
      2. 読みやすい表示には上のツールを使うChromeの生表示は整形されておらず、スマホではスクロールしづらいものです。同じURLを上のツールに貼り付ければ、インデントとハイライトが施されたソースが得られ、コピーもダウンロードもできます。
      3. ライブDOMはリモートデバッグでJavaScriptで変更されたDOMを調べるには、スマホをパソコンにUSB接続し、デスクトップのChromeで chrome://inspect を開きます。

      スマホの標準表示ではなくこのツールを使う理由

      Chromeの生の view-source: に対する利点 - そしてiPhoneが標準ではまったくできないこと。

      ✓ このツール

      • 整形&ハイライト - インデント付きで色分けされたHTML
      • iPhoneでも使える - view-source: がブロックされている環境でも
      • コピー&ダウンロード - HTMLを端末に保存できます
      • アプリ不要・パソコン不要 - ブラウザだけで完結

      ⓘ 標準の view-source:

      • AndroidのChromeのみ - iPhoneでは不可
      • 生のHTML、多くはミニファイされた長い1行
      • ハイライトなし、スマホではスクロールしづらい
      • ワンタップのコピーやダウンロードなし

      同じ整形表示をノートパソコンで使いたい、あるいは専用のフォーマッターが必要ですか? HTMLビューアをお試しいただくか、各デスクトップ・モバイルブラウザでソースを表示する方法をご覧ください。

      よくある質問

      スマホでHTMLソースを表示することについてのよくある質問。

      iPhoneでページのソースを表示できますか?

      iOSのSafariには「ソースを表示」機能が標準で搭載されておらず、view-source: のURLもiPhoneでは動作しません。もっとも簡単なのは本ツールのようなウェブツールを使う方法です。このページを開き、URLを貼り付けて「ソース表示」をタップするだけです。ブックマークレットを使ったり、iPhoneをMacに接続してSafariのWebインスペクタを使う方法もあります。

      AndroidのChromeでソースを表示するには?

      Android版Chromeでは、URLバーでアドレスの前に view-source: と入力します(例: view-source:https://example.com)。Chromeが生のHTMLを表示します。ただし整形されていないため、読みやすくハイライトされた表示にはこのページ上部のツールをご利用ください。

      view-source: はスマホで使えますか?

      Android版Chromeでは使えます。iPhoneのSafariではブロックされていて使えません。本ツールはページをブラウザではなく当サイトのサーバーが取得するため、どちらでも、また他のモバイルブラウザでも動作します。

      アプリをインストールする必要がありますか?

      いいえ。これはウェブツールです。モバイルブラウザで開いてURLを貼り付けるだけで、ダウンロードやインストールは一切不要です。

      パソコンなしでページのHTMLを見られますか?

      はい。スマホでURLを貼り付ければ、デスクトップやノートパソコンがなくても、整形されたHTMLソースをその場で確認できます。

      view-source: よりもこちらのほうがコードが読みやすいのはなぜですか?

      標準の view-source: は生のHTMLをそのまま表示するため、多くの場合ミニファイされて1行に詰め込まれ、小さな画面では非常に読みづらくなります。本ツールはマークアップを整形し、シンタックスハイライトを適用するので、スマホでも読みやすく表示されます。

      スマホでHTMLをコピーしたり保存したりできますか?

      はい。「コピー」でHTMLをクリップボードに入れられますし、「ダウンロード」で端末に .html ファイルとして保存できます。

      JavaScriptで追加されたHTMLも表示されますか?

      いいえ。表示されるのは、クライアント側のJavaScriptが実行される前にサーバーが返した生のHTMLです。これは検索エンジンが最初に見るものと同じ状態です。スクリプトによって変更されたライブDOMを調べるには、デスクトップのDevToolsまたはリモートデバッグが必要です。

      関連ツールとガイド

      ウェブコンテンツ、ソースコード、SEOをさらに深く知るためのリソース。