おはこんばんにちは!ノボルです。
ブログなどのWebサイトって、それぞれパーツの名称とかあるの?
レイアウトの構造はサイトによって違うけど、よくあるパーツの名称はあるよ!
そこで今回は、よくあるWebサイトのパーツの名称について解説します!
最低限知っておけば、Web制作やブログ運営をより円滑に進めることができます。
![](https://www16.a8.net/0.gif?a8mat=35UA5A+FRZJW2+3GWO+60H7L)
よくあるWebサイトのパーツの名称
Webサイトでよくあるパーツの名称は以下の通りです。
![](https://onishi-noboru.com/wp-content/uploads/2020/01/67-1-scaled.jpg)
今回は、僕のブログを例として挙げていますが、他の種類のWebサイトも基本的には似通った構造であることが多いです。
パーツの説明
上記の例で出てきたパーツの説明をしていきます。
ヘッダー
![](https://onishi-noboru.com/wp-content/uploads/2020/01/67-2-1024x112.png)
Webサイトやブログの上部にあり、別ページへ移っても表示されるパーツです。どんなサイトなのかをユーザーに知らせる役割を持っています。
グローバルナビゲーション
![](https://onishi-noboru.com/wp-content/uploads/2020/01/67-3-1024x42.png)
Webサイトやブログの各ページへ案内する為のメニューです。
コンテンツ
![](https://onishi-noboru.com/wp-content/uploads/2020/01/67-4-1024x465.png)
テキストや画像など、コンテンツを表示する部分です。
サイドカラム
![](https://onishi-noboru.com/wp-content/uploads/2020/01/67-5-690x1024.png)
メインカラム以外のカラムを指します。サイドカラムには、広告や関連記事などが設置されます。
RSS
![](https://onishi-noboru.com/wp-content/uploads/2020/01/67-6-1024x574.png)
記事などのアイキャッチ画像やタイトルを表示する部分です。
フッター
![](https://onishi-noboru.com/wp-content/uploads/2020/01/67-7-1024x74.png)
Webサイトの最下部にあり、基本的にヘッダーと同じ役割です。ヘッダーに戻らなくても各ページにアクセスできるようにするために使われます。
その他のよくあるパーツ
アイキャッチ
![](https://onishi-noboru.com/wp-content/uploads/2020/01/67-8-1024x383.png)
へーダー下に画像として配置されることが多い部分です。ユーザーが最初に目にするビジュアルであり、どんなサイトなのか伝える大切な部分です。
バナー
![](https://onishi-noboru.com/wp-content/uploads/2020/01/67-9.png)
広告など、別ページへのリンクが貼られる部分です。
サイドバナー
![](https://onishi-noboru.com/wp-content/uploads/2020/01/67-10.png)
Webサイトやブログののサイドバー(サイドカラム)に配置されるバナーです。
テキストリンク
テキストにリンクを貼ったものです。クリックすると別のページへ飛びます。
ぱんくずリスト
![](https://onishi-noboru.com/wp-content/uploads/2020/01/67-11.png)
ぱんくずリストは、ユーザーがサイトのどの場所にいるのか伝えるための機能です。下層ページが多いサイトでは重要な機能です。
SNSボタン
![](https://onishi-noboru.com/wp-content/uploads/2020/01/67-12-1024x79.png)
TwitterやFacebookのボタンです。ユーザーが記事やコンテンツを報を共有・拡散するために使われます。
ページング(ページネーション)
![](https://onishi-noboru.com/wp-content/uploads/2020/01/67-13-1024x197.png)
記事が長くなってしまう場合などに、複数のページに分割しリンクを並べて表示する機能です。
最後に
今回の記事では、よくあるWebサイトのパーツの名称について解説しました。
最低限必要なパーツを頭に入れておけば、Web制作やブログ運営をより円滑に進めることができます。
最後まで読んで頂き、ありがとうございました(o^^o)
![](https://www14.a8.net/0.gif?a8mat=35UA5A+FRZJW2+3GWO+60OXD)
![](https://onishi-noboru.com/wp-content/uploads/2020/01/article62-thumbnail-160x90.png)
![](https://onishi-noboru.com/wp-content/uploads/2019/12/article43-thumbnail-2-160x90.jpg)
![](https://onishi-noboru.com/wp-content/uploads/2019/12/DevTools-thumbnail-160x90.png)
コメント