webに関する研究ノート

4 min read読了の目安(約4400字

こんにちは。スネオです。
前回は以下の記事を書いて質素でショボいwebページを作りました。

https://zenn.dev/suneo/articles/1e2822a0ac5c3f

今回は自分の研究ノート的な感じでwebについて書いていきます。。

静的ページと動的ページ、非同期通信

静的ページ

元から出来上がっているWebページをサーバーからクライアントpcに送るだけ。
何回アクセスしてもページの内容が変わる事は無く、サーバー側の処理が無いためサーバーの負担が軽い。ページ全体が読み込まれるまでユーザーは待たないといけない。

筆者が作った以下の質素なwebページは完全に静的ページですね。何百回アクセスしても質素なページのままです(笑)

茶番劇1:ジャイアンリサイタル
ジャイアン「これから俺が開くイベントは永遠とジャイアンのリサイタルだ!」
スネオ  「エー!変わる事は無いの?」
ジャイアン「無い!」

動的ページ

クライアントからのリクエスト(要求)に対して、サーバー側がプログラムに従ってファイルを処理・生成して送信。
ページにアクセスしたタイミングや状況によって、ページの内容が変わる。Google検索で見つかるだいたいのWebページは動的ページになっているのではないでしょうか?
サーバー側で処理をする性質があるので、静的ページに比べるとサーバーの負担が高くなる。

動的ページの例:

名前 概要
アクセスカウンター 最近のwebページにはあまり見かけないと思います。webサイトに今まで何回アクセスがあったかをカウントしてくれる物。昨日サイトに訪問した時はカウンターが5だったのに、今日はカウンターが100になっているといった感じ
あいさつ文 アクセスした時間帯によってページが切り替わる。4時~11時までは”おはようございます”と表示。12時から17時までは”こんにちは”と表示。18時から3時までは”こんばんは”と表示
掲示板 BBS(Bulletin Board System)と呼ばれる事がある。掲示板には文章(記事、自分の感想、意見…)が投稿でき、投稿内容がwebページに表示される。何か書けば書くほど文章が溜まっていく。投稿した内容はデータベースに保存される。代表的な掲示板サービスは5chがある
箱庭諸島 CGI(Common Gateway Interface)と呼ばれるWebサーバー上で動く技術を使った自分の島を開発するシミュレーションゲーム。かなり古いゲームではあるが、思いついたため記載

茶番劇2:ジャイアンリサイタル
ジャイアン「俺様のイベントはリサイタルしかやらないと言っていただろ?けどよ、状況に応じて俺様が開くイベントを変える事にしたぜ。空き地に10人以上集まったらジャイアンシチューを食べる会、30人以上なジャイアンリサイタルを開催するぜ」

非同期通信(Asynchronius Communication)


Ajax(Asynchronius JavaScript + XML…Ajax)とも呼ばれる。この非同期通信を使う事により、webページの一部をプログラムがリアルタイムに更新してくれる。静的ページや動的ページの場合は、サーバーからのレスポンスを待っている間も他の作業ができる。

非同期通信の例:

チャット

ネットワークに繋がっている人同士でリアルタイムで文字でコミュニケーションが取れるシステム。

Google検索での検索候補

入力した物に応じて検索候補が自動的に表示される。

GoogleMaps

ユーザーにドラッグ&ドロップしながら見る場所を変えていくと、自動的に次の場所を読み込んでくれる。わざわざwebページ全体を更新するといった作業は必要無し。

フロントエンドとバックエンド

よくweb系の求人などで見かける言葉ですね。webの開発にはフロントエンドもバックエンドも欠かせないです。

名前 概要
フロントエンド Webサイトにアクセスしたユーザーの目に見える部分、ユーザーが直接触る部分を作っていく。ユーザーにとって使い勝手の良いUI(ユーザーインターフェース。ボタン配置や表示とか)の設計、アニメーションといった見た目を作っていく。
バックエンド Webサイトにアクセスしたユーザーの目に見えない部分を作っていく。Webサーバーとデータベースのやり取り、ログインシステム、サーバー導入といった事を担当していく。
フルスタック フロントエンドとバックエンド両方をやる

インターネットにはどういったWebサイトがあるのか?

これまでwebサイトの事についてあまり気にしてなかったので、調べて見ました。

分類 概要
ポータルサイト Webサイトの入り口。ポータル(Portal)とは玄関、入り口の意味。大規模なサイトが多くて、利用者数の多いサイトだと一日何十万回のアクセスがある。ポータルサイトから各自で提供しているサービス(会員登録、メールサービス、占い、ゲーム、記事、 天気予報…)にアクセスする事ができる。ポータルサイトの例としてはYahoo!JAPAN、MSN JAPAN、infoseek、excite、ソニーグループのサイト、goo、がある
動画共有サービス サーバーに動画を投稿できるサービス。Youtube、ニコニコ動画、DailyMotionといったものがある
ECサイト 電子商取引サイト(Electronic Commerce)。複数企業がたくさん集まって商品を売るモール型EC、1つの企業のみが商品を売る独立型ECに分かれる。モール型ECにはAmazon、楽天市場、Yahooショッピング。独立型ECにはNintendo Store、PlayStation Store、Joshin webショップなどがある。
ブログサイト Blog。文字や写真を使って記事を書いて投稿するサービスである。多くの人は日常の出来事や個人的な感想を書いたり個人的な日記として書いている。掲示板のように書けば書くほどデータが溜まっていく。ブログサービスには、Amebaブログ、gooブログ、ライブドアブログ、はてなブログ、LINEブログ、gooブログ、exciteブログ、noteなどがある
SNS SNSはSocial Networking Serviceの略。人同士が繋がって、写真、文字、絵文字を用いてコミュニケーションをしていくサービスである。コミュニケーションはもちろん、情報の拡散能力に優れるため宣伝や何か作品をアピールしたりなどに使える。主にTwitter、facebook、Instagram、TikTok、pixivなどなどある。筆者が見た感じだと、多くのユーザーは複数のSNSを連携させながら使っていくイメージがあります
ナレッジコミュニティ 英語でknowledge communityと書き、知識を共有し、新たな知恵を生み出す共同体という意味。ユーザーが疑問に思っている事を質問したり、逆に他ユーザーの質問に対して回答をするサービス。主にYahoo知恵袋、Quora、OKWave、教えて!goo、がある。また、Wikipedia、ニコニコ大百科、アンサイクロペディア、ピクシブ百科事典、いろんなゲームのwikiなど百科事典系サイトもナレッジコミュニティに該当する。さらにQiita、Zenn、CrieitのようなITエンジニア向けの知識共有サービスも該当する
キュレーションサイト おすすめの店10選、おすすめFPSゲームまとめ!…みたいな感じでテーマを絞ってネット上の情報を収集してまとめているサイト。NAVERまとめ(運営終了)、MERY、RETRIP、食べログまとめ、Twitter呟きをまとめたtogetterなどがある
情報サイト なんていう分類のサイトかわかりませんが、特定のテーマをメインに情報を提供しているサイト。ゲームやハードウェアに関する情報を取り扱う4Gamer.net、F1や全日本スーパーフォーミュラ、SUPER GTなどレースの情報について取り扱っているautosport web、アーティストのインタビューや曲の音楽情報を取り扱うReal Soundとかある。あまり思いつきませんでしたが、他にもたくさんの情報サイトがある事でしょう

いろいろ列挙しましたが、これらほぼ全てアクセスしたタイミングによってページの内容が変わりますよね。いつの間にか新しい記事や動画が投稿されていたりなど、動的ページだらけでございますね。