更新しやすく見やすいホームページ作り!階層の原理

無料ツールソフトの使い方ホームページの作り方Hpで集客する方法グーグルサービス
 
初めてのHP作成の動画高齢者のホームページの作り方よくある質問
 

更新しやすく見やすいホームページ作り!階層の原理

これが無ければ始まらない!階層の原理と基礎知識

ホームページの階層構造

ホームページ作成の作業では、よく「最上階層にアップロードする」という言葉を耳にします。最上階という言葉があるという事は、その下に幾重にも階層が存在するという事です。

 

ホームページをアップロードするために欠かせないソフトがFFFTPです。ファイルの階層の位置は、このFFFTPを開いた画面のアドレスバーで確認できます。

 

このコンテンツでは、「FTPソフト」「アップロードするホームページフォルダ」と最後に「実際のホームページ」を使って、ホームページの階層について解説します。

 

レンタルサーバーの階層を知る・・イコールそれがURL

ホームページを公開するには、レンタルサーバーと契約し、ホームページファイルをサーバーにアップロードしなければなりません。

 

FFFTP

そのためのソフトがFFFTPです。

 

下記画像「FFFTP]の右側の [サーバー側の領域] が自分が借りているサーバーのフォルダ内であり、ココにホームページファイルをアップロードします。

 

また、下記画像の アドレスバー を確認する事で、サーバー側の階層を知る事ができます。

 

FFFTPの画面解説
FFFTP-0

 

通常レンタルサーバーを借りると、サーバー内のひとつの部屋であるフォルダが自分専用に使えます。このフォルダを「home」と呼びます。アドレスバーでは、その下に自分の「FTPアカウント」が表示され、その中にwwwフォルダがすでに作成されています。

 

これを一行にまとめると、home/アカウント/となります。(下記画像右上のアドレスバー)その下の階層にwwwフォルダが見えています。下記画像でwwwフォルダをダブルクリックし、その中にホームページのファイルをアップロードする事になります。

 

※ 私のアカウント情報になりますので、アドレスバーの一部は赤色で隠しています。
※ 下記画像はFFFTPでサーバーに接続して、最初に表示される画面です。

 

home/アカウント
FFFTP-1

 

wwwフォルダとは、World Wide Web の略で、ある一定のルールに従う事によって、このフォルダの中で、Webページを公開できる場所であるとお考え下さい。wwwフォルダ内では、HTMLという言語によりホームページが公開できるって事です。

 

それではwwwフォルダダブルクリックして開いてみます。そうしますと下記画像ではアドレスバーが、現在の階層home/アカウント/wwwに変化します。現在このwwwフォルダの中には複数のホームページをアップロードしている事がわかります。

 

そして、それぞれのホームページが、それぞれのフォルダとして見えています。下記画像で青色に反転しているのが当サイトで、フォルダ名をsoftsateとしています。

 

このフォルダの中に、当サイトのファイルがすべて格納されている訳です。次にこのフォルダをダブルクリックして、その中身であるホームページファイルを見てみます。

 

home/アカウント/www
FFFTP-2

 

書き画像ではindex.htmlという青色反転しているファイルが見えてきました。このファイルが当サイトのトップページです。アドレスバーはhome/アカウント/www/softsateになりました。wwwフォルダ内softsateというフォルダを開いているという事です。

 

home/アカウント/www/softsate
FFFTP-3

 

上記画像で見えているアップロードされたファイルを、デスクトップ上に置いている状態が下の画像です。このソフトランキングというフォルダの中に、当サイトのホームページファイルがすべて格納されています。このフォルダをダブルクリックして中身を確認します。

 

ホームページフォルダ

 

そうしますと、ホームページファイルが見えました。これらのファイルを全選択して、先ほどのFFFTP画面のhome/アカウント/www/softsateフォルダの中に転送します。これがアップロードという作業です。

 

ホームページファイル

 

そして上記画像の状態、つまりホームページフォルダを開いてすぐの状態が最上階層と呼ばれます。最上階層にはフィルではなく、フォルダも確認できます。このフォルダを開いた状態が、最上階層から2番目の階層という訳です。

 

それではFFFTPに戻って、最上階から2番目以降の階層を確認し、そのアドレスがどのようになっていくのか確認していきます。

 

下記画像の最上階に存在するフォルダである homepage-creating をダブルクリックしてみます。(フォルダ名は作成ソフト内で自分で決める事ができます。)

 

home/アカウント/www/softsate
FFFTP-4

 

アドレスがhome/アカウント/www/softsate/homepage-creatingに変化しました。下記画像では、最上階の次の階層である第二階層が見えている事になります。

 

home/アカウント/www/softsate/homepage-creating
FFFTP-5

 

さらにこの第二階層の中に、 homepage-improvement というフォルダが存在します。このフォルダを開くと第三階層が見えます。下記画像、最上階層から三つ目の階層です。

 

home/アカウント/www/softsate/
homepage-creating/homepage-improvement
FFFTP-6

 

これがこのコンテンツの最終階層です。階層が深くなりすぎると閲覧者さんがホームページの中で迷子になりやすいので、通常第三階層まででホームページを構成します。

 

上記画像の状態が、、、

 
wwwフォルダの中の、
 

ホームページファイル

 
softsateという独自ドメインを取得したフォルダの中の、
 

ホームページファイル

 
homepage-creatingというカテゴリーフォルダの中の、
 

ホームページファイル

 
homepage-improvementというカテゴリーフォルダになります。

そして最終このフォルダの中のページをご紹介します。

 

(上記画像のアドレスバーを確認して下さい。)

 

最終のこのコンテンツ(フォルダ)の中にrelated-conflict-homepageという実際に記事が書かれたホームページファイルがあります。このファイルを合わせて、最上階から記述すると次のようになります。

 

softsate/homepage-creating/homepage-improvement/related-conflict-homepage

 

ホームページファイル

 

アドレスで表す場合、上記フォルダ列の前に、http://、後に、..htmlを記述します。

 

ホームページファイル

 

http://softsate.info/homepage-creating/homepage-improvement/
related-conflict-homepage.html
(これがこのページのホームページアドレスになります)

 

ホームページファイル

 

パンくずリストでは、、、

 

ホームページファイル

 

トップページホームページの作り方ホームページの改善とSEO関連競合ホームページを把握してSEO対策を施す

 

第三階層「関連競合ホームページを把握してSEO対策を施す」ページのファイル名related-conflict-homepageになります。

 

下記リンクからページを開いて、ブラウザのアドレスを確認して見て下さい。

関連競合ホームページを把握してSEO対策を施す

 

このページは当サイトのサイドバーから一発で飛ぶことができます。下記画像でフォルダ名とファイル名を照らし合わせてご覧頂きますと理解しやすいです。

 

FFFTP-7

 

従いましてD「関連競合ホームページを把握してSEO対策を施す」URLhttp://softsate.info/homepage-creating/homepage-improvement/related-conflict-homepage.htmlとなります。

 

スラッシュ [/] 階層が一つ下がる事を意味します。

 

上記の階層の原理は、どのような作成ソフトを使っても変わりなく、ホームページ作成での階層構造の基本であり、ホームページのコンテンツ構成で重要な役割を持ちます。

 

サイト作成ソフトシリウスでは、このような階層構造を自動で生成しますので便利です。また画像フォルダも自動生成しますので、管理が大変便利になっています。

 

最短ホームページテンプレートではこのような階層構造を無限に作成できます。(でも実際には第四階層は、ほとんど使いません。)

 

また、第一階層(最上階層)に画像専用のフォルダを作成して、このフォルダに画像のみを格納しておきますと、後の更新で画像管理が容易にできます。画像の枚数が増えてきた場合に、他のファイルと混じらず、特定の画像を探す事が楽になります。

 

ココからは秘密でお願いします。他言無用!!

フォルダ名ページ名を適切にキーワードとして記述する事で、SEO対策になります。上記の例でお伝えしている「フォルダやページの名前」は、やたら長いと思いませんか?

 

これはグーグルにホームページの性質を理解させているのです。クローラに記事の内容を予測させることが、SEO上有利であるという事です。

 

サイト作成ソフトシリウスではディフォルトでentry1最短ホームページテンプレートではpage1となっていますが、自分で適切に名前を書き換えましょう!これは非常に有効なので、誰にも教えないで下さいね!

 

(有効なのでネット上であまり書かれていません。)

 

URLというのは、フォルダ名、ファイル名である英単語小文字の繋がりになっているのですね。URLにページの意味を落としこむという事が重要なのです。

 

上記でお伝えしているURLを分解してみます。
http://softsate.info/homepage-creating/homepage-improvement/related-conflict-homepage.html

 

ドメイン名・・・softsate.info
  • soft・・・ソフト
  • sate・・・満足させる
  • info・・・インフォメーション

 

ホームページの作り方

[第一階層のフォルダ名]

 

homepage-creating

  • homepage・・・ホームページ
  • creating・・・作成、創造

 

ホームページの改善とSEO

[第二階層のフォルダ名]

 

homepage-improvement

  • homepage・・・ホームページ
  • improvement・・・改善

 

関連競合ホームページを把握してSEO対策を施す

[第二階層のフォルダの中の第三階層のページ名]

 

related-conflict-homepage

  • related・・・関連
  • conflict・・・競合
  • homepage・・・ホームページ

 

 

「URLが長くなると不利である」「覚えやすいURLで、、」とバカな事をネット上で書いている人がおられます。現在ではグーグル検索で、ページURLを英単語でひとつひとつ記述する人なんていませんよね!

 

それよりグーグルにページの意味を訴える方が有効なのです。

 

特にこれからホームページ作成に挑戦する人は覚えておいて下さい。また後でURLを変更するとページの価値[0]になってしまいますのでお気お付け下さい!

 

ちなみにページの価値をグーグルジュースと呼ぶ事があります。

 

ホームページの階層について理解しておくことは、後々必ず役に立つ事になりますので、FFFTPの構造も含め、このようなシステムであるという事を理解しておきましょう!

 

ホームページ作成での画像の扱い方に進む»

ホームページの階層とは!構成フォルダの基礎知識の関連ページ

HPの仕組み
ホームページがパソコンのブラウザで表示される原理を解説します。ホームページをアップロードして見れるようにするにはドメインを取得し、レンタルサーバーを契約する必要がありますが、これが直接ホームページが見れる原理に直結しています。
サイト構成と名称
ホームページを作成するのに、トップページにおいて最低限必要な各部の名称と機能は正しく理解しておく必要があります。ホームページの見やすさや使い勝手、SEO対策にも大きく関係する基本的なコンテンツになります。
カラムについて
カラムとはトップページの区割りであり、構成や外観のことを言います。このカラム数はホームページの情報量によって決まり、閲覧者さんのサイトの使い勝手に影響します。後で変更する事は非常に手間がかかるため、サイトの規模を当初から推測し決める必要があります。
リンクについて
リンクという機能があるこらこそホームページが成り立ち、現在ここまで発展したと言っても過言ではありません。またSEOや検索表示のされ方に大きく影響するため、グーグルのガイドラインに沿った正しいリンク付けをする必要があります。
画像の扱い方
綺麗なホームページえお作る基本!ホームページ作成で使えない画像もある!サイトのデザインの優劣は画像の使い方と鮮明度が大きく影響しますので、正しい画像の扱い方のルールを解説します。また画像加工のための必須のソフトをご紹介します。

トップページ ソフトの概要 Hp公開の方法 SEO対策基本編 アクセス解析 特典のご案内 購入者メルマガ お問い合せ