【スマホ】ChromeでサイトのHTMLのソース表示する方法!

スマホのChromeでサイトのHTML(ソースコード)を表示する方法を紹介します。Androidでのやり方とiPhoneでは別のやり方を解説します。

コンテンツ [表示]

  1. 1スマホでChromeでサイトのHTMLのソース表示をしたい
  2. 2【Android】サイトのHTMLのソース表示する方法
  3. 3【iPhone】サイトのHTMLのソース表示する方法
  4. 3.1使い方
  5. 4その他サイトのHTMLのソース表示をする方法は?

スマホでChromeでサイトのHTMLのソース表示をしたい

ChromeでサイトのHTMLのソースを見たいときがあります。PCであればChromeのデフォルトの機能で簡単に見ることが出来ます。

あわせて読みたい
【PC】Chromeでページのソース(HTML)を表示する方法!のイメージ
【PC】Chromeでページのソース(HTML)を表示する方法!
PCのChromeでWEBページのソース(HTML)を表示する方法を解説します。ソースの表示のやり方はいくつかそれぞれのやり方をキャプチャ付きで解説します。

一方でスマホのChromeの場合は、少し工夫する必要があり、更にAndroidでは出来てiPhoneでは同じやり方では出来ないなど差異があります。

そこでこの記事ではiPhoneとAndroidに分けてWEBページのソースコードを表示する方法について解説します。

【Android】サイトのHTMLのソース表示する方法

Androidの場合はPC版のChromeのようにメニューからたどったり、ショートカットでソースコードを開くことはできませんが、以下をアドレスバーに打ち込む事でソースコードを表示することが出来ます。

アドレスバーに入力

view-source:対象サイトのURL

上記をコピーし[対象サイトのURL]の箇所をHTMLのソースコードをみたいサイトのURLに変更して使ってみて下さい。

【iPhone】サイトのHTMLのソース表示する方法

さて、iPhoneの場合ですが、やっかいな事に上記のAndroidと同じ方法は残念ながら対応していません。そこでWEBページのHTMLソースコードを表示してくれるアプリを利用しましょう。

View Source

View Source

使い方

上記のリンクからアプリをインストールをし、起動します。

View Sourceの使い方1
ソースコードを表示したいサイトを開き、Safariであれば、最下部のアイコンをタップします。
View Sourceの使い方2

メニューが表示されますので、最下部の「View Source」までスクロールし、タップします。

View Sourceの使い方3

するとアプリ内に該当サイトのソースコードが表示されます。

その他サイトのHTMLのソース表示をする方法は?

また上記で見てきたWEBサイトのソースコードの表示方法以外にもやり方があります。

下記のサイトでは、URLを入力することで対象のサイトのHTMLを表示するサービスです。

Best Online Tool to View HTML Source Code
Fetch the website's HTMl code. This site will help to view how much html code is generated for web page
Code Beautifyの使い方

使い方はシンプルで、入力欄に対象サイトのURLを入力して「View」ボタンを押すだけです。

すると対象サイトのHTMLが表示されます。

上記のやり方はPC・スマホ問わず可能です。

ぜひお試しくださいませ。

Qumeru[クメル]ではプログラミング学習が出来るカリキュラムを7月31日までの期間限定で無料で提供しています。

無料登録することで、すぐにプログラミング学習を始められます。ぜひカリキュラムをお試し下さい!

関連記事

【期間限定】全カリキュラム無料で提供中!

Qumeru[クメル]ではプログラミング学習の全カリキュラムを7月31日まで期間限定で無料で提供しています。

無料登録することで、すぐにプログラミング学習を始められます。ぜひお試し下さい!

目次