IT初心者向け|Webの仕組み・URL・DNS・サーバー・セキュリティを体系的に解説

インターネットの仕組み インターネット
この記事は約7分で読めます。

初心者がよく遭遇するWebの仕組み・セキュリティ・躓くポイントの解説

運営者
運営者

この記事では、下記の悩みを解決します。
・URL・DNS・ブラウザの役割が理解できる
・Webサイトが表示される仕組みがイメージできる
・サーバーの種類と特徴がわかる
・HTTPS・認証方式・Cookie の基礎が理解できる
・WordPress や SPO(SharePointOnline)で初心者が躓く操作が解決できる
・Web管理の基本的なセキュリティ対策がわかる
上記を実体験を元に画面を使って分かりやすく解説します。

IT初心者の方でも、この記事を読みながら進めるだけで
“Webの基本構造と安全な使い方” が理解できるように構成しています。

Webの基本構造(URL・DNS・ブラウザ)

Webページが表示されるまでの流れ(初心者向け図解イメージ)

ブラウザに表示されるための実際のプログラムのやり取りなどを私自身が勉強したことをノウハウとして記載しました。参考にしていただければ幸いです。

Webサイトの仕組み①
Webサイトの仕組み①
Webサイトの仕組み②
Webサイトの仕組み②

①PCよりURLを入力してアクセスする。リクエストする。
例)「http://www.aaa.bbb.co.jp」
②DNSサーバに「このURLの住所(IP)を教えて」と問い合わせる。
③DNSサーバから回答「IPアドレス」が届きます。
④ブラウザがそのIPのWebサーバにアクセスします。
⑤Webサーバから画像や文字が表示されます。
⑥ブラウザが、届いた設計書を基に部品を組み立てる。

Webを構成する3つの技術

HTML:骨組み
CSS:装飾
JavaScript:動き

サイトの構成(引用:WEBSTS)

サイトの速度

Webサイトのスピードチェック(外部サイトへ)

URLとドメインの基礎

URLの構造

例:https://www.goshin-skill.com/blog/

  • https:通信方式(プロトコル)
  • www:ホスト名
  • goshin-skill.com:ドメイン
  • /blog/:サブディレクトリ

独自ドメイン

ここでは、「ドメイン」とは?及び役割や種類などをだれでも理解できるよう、解説しています。
ご参考になれば幸いです。
独自ドメイン:世界中に1つだけの「Web上の住所」。
住所がなければ郵便物(メール)が配送されないように、ドメインがなければWebサイトは表示されません。

参考
レンタルドメイン:新規に有償(1,000円/月)で個人で取得。(6コア程度が推奨されている。)
中古ドメイン:第3者が1度利用したもの。設定はすべて引き継ぐ。

ドメインの種類

  • 独自ドメイン:自分専用(例:goshin-skill.com)
  • サブドメイン(共有ドメイン)blog.goshin-skill.com のように用途ごとに分ける。(無料ブログで提供)
  • サブディレクトリgoshin-skill.com/blog/ のように階層で分ける。ドメイン(住所)の中の部屋。
  • マルチドメイン:1台のサーバで複数ドメインを運用

DNS(Domain Name System)サーバ

ここでは、サイトの仕組みで欠かせないについて、DNSサーバの役割など一言で解説しています。
ご参考に見ていただけるとありがたいです。

DNSはインターネットの電話帳です。

ドメイン名(文字)とIPアドレスを関連付けして管理しているサーバ。(10進数のIPアドレスと文字列を関連付けしたもの。)

インターネットの仕組み(サーバー)

サーバー(コンテンツを提供する側)

ここでは、私も初期のころイメージがわきませんでしたので参考に記載します。
サーバとは何?
サーバーにはどのような種類があるの?
の悩みのお役に立てれば幸いです。

サーバー:一戸建て住宅に例えると、土地のようなもの。
レンタルサーバ:土地をレンタル(借用)する。

サーバーの種類と特徴

レンタルサーバー
・月額で契約し複数人が1台のサーバーを利用する。(シェハウスのイメージ)
 共有サーバー
 ・複数のユーザーが1台のサーバーを共有するサービス。
 ・小規模なウェブサイトや個人ブログなどに向いている。
 専用サーバー
 ・1つの契約につき、1台のサーバーを独占して利用できるサービス。
 ・自分でサーバ構築しOS、ソフトなどを設置しているため自由度が高いが専門知識が必要。
 ・アクセスが多い大規模なウェブサイトに向いている。
 VPS(仮想専用サーバー)
 ・1つのサーバーを、複数の仮想サーバーに分けて利用できるサービス。
 ・中規模サイトや、マルチプレイ用のゲームサーバーなどに向いている。
 クラウドサーバー
 ・必要なサーバーのリソースを設定して利用できるサービス。
 ・ウェブサイトやデータの共有、サービスの開発やテスト環境など、さまざまな用途に利用できる。

セキュリティの基礎(認証方式・HTTPS・Cookie)

認証方式(一般的なWebサイトの認証方式)

ここでは、一般的なWebサイトでの認証を初心者にわかりやすく解説しています。参考になると幸いです。
Basic認証:Basic認証が設定されたページにアクセスすると、ID・パスワードを要求するダイアログボックスが開く。Basic64形式でエンコードされサーバに送信される。受け取った情報を事前に設定しておいたユーザ情報と照合する。ID/パスワードは暗号化されない。

Digest認証:Basic認証に比べ送信形式がハッシュ関数になる。セキュリティ面で少しBasic認証より高い。

Form認証:設計者が独自で作成した認証。セッションの概念が利用されサーバ側でのIDの比較が適用されます。SSL/TLS通信。

HTTPSとHTTP

暗号化された通信プロトコルと非暗号化通信プロトコルの違いです。
https:暗号化済み。(推奨)
http:非暗号化。

Cookie

ここではCookieとキャッシュが、間違いやすいため初心者でも理解が深まるよう解説しました。ご参考にしていただければ幸いです。
キャッシュとは、別物です。
・Cookieとは、Webサイト側が将来必要であろうと思われる情報をPC端末等に書き込む。(個人情報を一時保存)
・キャッシュとは、再読み込み速度を早くするための一時保存です。

Web操作で初心者がつまずくポイント(WordPressとSPO)

WordPressのカテゴリーとタグ

実際の記事にカテゴリーを付ける目安として5記事程度が1カテゴリーとなるようにする。
しかし個人的には、無理にカテゴリーを増やす必要はありません。(ユーザ第一で考えましょう。)

一度カテゴリーを作成するとURLも同時に作成される。

SPOに設置した、Excelマクロファイルをアクセスするため、PC上にショートカットを作成

ここでは、Excelで作成したマクロファイルをSPOにアップロードし、そのファイルを個人のディスクトップ上で開きたいときに下記方法で解決しました。ご参考にしていただければ幸いです。

①ショートカットを作成する時は、EXCELを開きファイル→情報→パスのコピーをクリックする。
②ディスクトップの新しいショートカットの作成で「ms-excel:上記でコピーしたパスをペーストするとディスクトップにアイコンができます。
③さらに上記で作成したショートカットをメールで送る場合は、ZIPファイルに圧縮しないと送れません。

Web管理のセキュリティ(初心者向け)

自身のサイトがセキュリティ上気になると思います。参考に下記に外部サイトのURLを記載しますので
検索したいURLで試してください。

VirusTotal(外部サイトへ):URLでセキュリティをチェックする。

無料でチェックできます。
お試しください。


左図の赤枠内の数字が小さいほど良い状態です。

ファイアウオールの代表的な機能

ファイアウォールの機能で代表的なものに「パケットフィルタリング」や「アプリケーションゲートウェイ」などがある。

パケットフィルタリング

パケットをあらかじめ指定されたルールにのとって通過させるか否かを判断する機能。
どのサービスは(プロトコルとポート番号で区別される)、通過させるかを判断することになる。

アプリケーションゲートウェイ(プロキシサーバ:代理サーバ)

外からはプロキシサーバしか見れないので、不正アクセスの標的になる事を防ぐ。

WAF(Web Application Firewall)

Webアプリケーションに対する外部からのアクセスを監視する。(脆弱性を悪用した攻撃からWebサーバを保護する。)
WAFには通信を暗号化したり復号化する機能はありません。よってWebサーバの前でSSLアクセレータ(暗号化/復号化を行う。)の後に設置する。

まとめ:Webの仕組みは「住所・土地・家」のイメージで理解できる

URL(住所):例)http://www.goshin-skill.com/
DNS(住所録):ドメイン(文字)とIPアドレス(数字)
サーバー(土地):占有サーバー、レンタルサーバー、仮想サーバー、クラウドサーバー
ブラウザ(建築職人):WebサイトをPCで見るソフトです。
HTML/CSS/JS(設計図と部品):Webサイトを構築・作成するためのプログラム言語の一部です。

この流れを理解すると、Webの仕組みが一気にクリアになります。

最後まで閲覧くださりありがとうございました。私も最初個々の役割などイメージできなくまた操作に苦慮した点など記載しました。少しでもお役に立てれば幸いです。

タイトルとURLをコピーしました