全国対応!まずはご相談ください 電話番号0120-55-4682

簡単ホームページ作成ツールならAMS

【初心者向き】ホームページのhtmlソースを表示させる方法

2021/7/21

【初心者向き】ホームページのhtmlソースを表示させる方法

ホームページを制作するときに使うプログラム言語のことをhtmlといいます。

ライバルサイトやきれいなレイアウトのホームページをみていると、どのようなhtmlソースで書かれているのか調べてみたいことがありますよね。

初心者のかたでも簡単に、そのhtmlソースをサクッとみることができます。

ページのソースを表示

ブラウザMicrosoft EdgeやGoogle chromeを使っている前提で説明します。

  1. htmlをみたいホームページにアクセスします
  2. そこで右クリック>「ページのソースを表示」コマンドをクリック

そうすると新しいウィンドウが開いて、そこにhtmlの記述が表示されます。

※ショートカットキーは ctrl+U

※プログラム言語で書かれているファイルのことを「ソースファイル」といいます。ホームページの言語htmlで書かれているファイルをhtmlソースといいます。

ページ内検索を使って詳しくみる

表示されたhtmlソースはコードとテキストだけの羅列でぱっとみ見づらかったりします。

ブラウザのページ内検索コマンドを使い、任意のhtmlタグを検索したり、気になった部分のテキストで検索することで見たかった部分を探しやすくなります。

スタイルシートと合わせて立体的にみてみる

ホームページはhtmlで見出しや段落など文書構造をマークアップするもの、スタイルシートはレイアウトやデザインをするものです。

ただ「ページのソースを表示」させるだけでなく、スタイルシートはどのように記述されているのかを同時にみることができるツールも用意されています。

  1. htmlをみたいホームページにアクセスします
  2. そこで右クリック>「検証」もしくは「開発者ツールで調査する」コマンドをクリック

そうすると同じウィンドウ内で表示が切り替わり、左にホームページ画面、中央にそのページのhtmlソース、そして右にはスタイルシートが表示されます。

このツールを使うことで、htmlソースだけでなくそこで使われているスタイルシートでの記述もみれるのでより立体的に分析することができます。

参考になれば幸いです。

ホームページでお困りならAMSにお任せください。

  • 制作会社の選び方がわからない。
  • どの制作会社も費用が高額で手が付けられない。
  • 今のホームページが簡単に更新できなくて困っている。

などホームページでお困りではありませんか?
弊社AMSでは効果のある高品質なホームページを格安で制作いたします。
まずは料金やプラン内容、制作実績などを下記の画像をクリックして ご覧ください。

copy1696235529_banner_agency.png
キーワードでコンテンツを検索
sidebanner_ams.gif
AMSコンテンツ
AMSニュースアーカイブ
サイトPR.png
sidebanner_manual.gif
sidebanner_contact.gif

会社概要

社名 株式会社AMS
本社 石川県金沢市問屋町2丁目99番地
代表者 代表取締役 若林 雄一郎
会社HP https://amsstudio.jp/
お気軽にご相談ください
0120-55-4682
【受付時間】月〜金9:00〜18:00 ※祝日除く