まなびの森

WebやITに関係した学習記録です。

【イラスト図解式 この一冊で全部わかる Web技術の基本】 「2-5.URLとドメイン」を読んで

【イラスト図解式 この一冊で全部わかる Web技術の基本】
「2-5.URLとドメイン」を読んで

「イラスト図解式 この一冊で全部わかる Web技術の基本」の第2章5節についての要点、自分なりの知識の整理、この2点を述べていきます。

1.要点
URL(Uniform Resource Locator)

Webサイトの場所、インターネットやLANなどのネットワーク上にあるデータやファイルの場所とそれらの取得方法を指定するために利用される
アドレス、Webアドレスとも呼ばれる

ドメイン
IPアドレスの別名
1ドメインにつき1つの意味
同じドメインは世界中に1つも存在しない
ドメインについては以下記事参照

web773.hatenablog.com

 

2.知識の整理

  • URL構文の分解してみた

URLの構造を分解して一つ一つの役割を見ていくことで、URLが何を示しているかわかると思ったので調べてみました!

  • URL構文の分解してみた

f:id:Web773:20210628094136p:plain

URLの構造の分解(株式会社アーティス、2018)



プロトコル名「http:」
ブラウザが指定するプロトコル
通常、Webサイトの場合はHTTPプロトコルor HTTPSプロトコル
インターネットを使ってアクセスする時のルールなので絶対必要
ほかにはmailto:(メールを開くとき)ftp:(ファイルを転送するとき)がある

②ホスト名+ドメイン名(これら合わせてFQDN)「www.asobou.co.jp」
アクセスする際のサーバーを指定するために必要なもの
ホスト名 www
ドメイン名 asobou.co.jp
ホスト名とは、ネットワーク上のコンピューターにアクセスするときに使う識別用の文字列
ドメイン名とは、インターネット上のネットワークを特定するための文字列

ディレクトリ名「about」
サーバー内のフォルダ名とそのフォルダの位置を表す文字列
フォルダの中にフォルダを入れるとファイルがどんどん増えていく
その際は「/」で区切ることで階層を増やせる

④ファイル名「index.html」
拡張子のついた文字列
例でいうと、aboutフォルダの中にあるindex.htmlファイル ということ

新たにページを追加するときには、③ディレクトリ名④ファイル名 を新たに命名する

▽すごーくざっくりまとまっているのがこちら

web773.hatenablog.com

▽もっとより専門的にまとめられているのがこちら

developer.mozilla.org


3.考えたこと
シンプルな命名を心がけたい!

調べているうちに、コーダーだけでなく、ユーザーにとってもわかりやすいURL構造が必要だと感じました。

ディレクトリ名とファイル名は、コーダーに命名が委ねられることが多いです。
諸先輩方が実務で使われているような命名チートシートが流通したり、調べてもすぐ見つけられたり、名前はつけやすくなっています。
環境は十分整っていますよね!
あとはコーダーが活用し切れるかってとこですよね。。うっ!

数をこなしてこそわかることもありますが、まずは簡潔な命名を心がけたいと思います。
例えるなら、「Webページを見たことがない人でもページの修正のイメージができる!」くらいのもので!

【出典】
イラスト図解式 この一冊で全部わかるWeb技術の基本
URL とは何か- MDN Web Docs
分かりやすいURL構造を設計しよう「ディレクトリ名・ファイル名の付け方」
URL構造をユーザーと検索エンジンにわかりやすく伝える6つのポイント