「 Web システム ってよく聞くけど、具体的にどんなものがあるのだろう?」
という疑問をお持ちの方は少なくないと思います。
そこでこの記事では、 Webシステム と Webサイト の違いを説明しつつ、
Webシステム の具体例を紹介します。

 

1. Webシステム とは?

 

2. Webシステム の例

・ グルメサイト

・ SNS(ソーシャルネットワーキング)

・ OTA(オンライン・トラベル・エージェント)

・ 地図サイト

 

3. Webシステム の仕組み

・ フロントエンド

・ バックエンド

・ データベース

 

4. Webシステム と Webサイト の違いは?

  1.Webシステム とは?

Webシステム とは、インターネット上で利用できるアプリケーションを指します。
インターネットに接続していればパソコンやスマホでいつでも利用可能です。

Webブラウザ から、URLを入力したり、GoogleやYahoo!などの検索エンジンで探したりして、Webシステム を開くことで、PCや端末に専用の アプリケーション をダウンロードをすることなく、各種 Webサービス を利用することができます。

 

2.Webシステム の例

Webシステム は Webサイト とは異なり多機能で、コメント投稿やデータ加工や動画視聴、商品購入のような双方向でやり取りを実行するサービスが使用できます。

一例として、動画視聴サイト、SNS、各種ネットバンキング、各種ECサイト、各種飲食店の予約サイトなどがあげられます。

もう少し具体的な Webシステム を使った Webサービス と、Web で得られる利用体験を見ていきましょう。

 

● グルメサイト

検索サイトで予約したいお店を調べ、表示された検索結果一覧から「グルメサイト」に掲載されている店舗ページにアクセスし、そこから席を予約する。
また、「グルメサイト」自体にアクセスし、希望条件で絞り込んで検索。
合致する店舗を選んで予約をする。

●  SNS(ソーシャルネットワーキング)

気になっていたキーワードの記事を読んでいたら、関連するSNSのタイムラインが表示されていたので、投稿主のアカウントを閲覧する。

● OTA(オンライン・トラベル・エージェント)

旅館・ホテルのポータルサイトから宿泊日、宿泊先、宿泊人数などを入力し、予約する。

●  地図サイト

ブラウザで地図サイトを開き、待ち合わせ先の住所を入力し、そこまで案内してもらう。

 

 3.Webシステム の仕組み

Webシステム は一体どのような仕組みで成り立っているのでしょうか?
Webシステム の開発を依頼する時には、しっかりと仕組みを理解しておくと、開発を発注するときに、システム 開発会社とのコミュニケーションがスムーズに進みます。

細かな流れは各 Webシステム により異なりますが、大まかな処理は以下の通りです。

上のステップと合わせて、 Webシステム を構成する、フロントエンド、バックエンド、およびデータベースについて説明します。

 

●フロントエンド

「フロントエンド」とは、 Webシステム 上でユーザーから見える部分、操作できる部分を指します。
上記のステップ1と5の処理はフロントエンドが担います。

動画投稿サイトを例に挙げると、

●動画再生エリア
●グッドボタン/バッドボタン
●コメント
●関連動画
●およびこれらのレイアウト

などが、フロントエンドの役割です。
この部分の開発内容、方法は Webサイト の開発と同じです。

 

●バックエンド

フロントエンドとは反対に、ユーザーから見えない部分、操作できない部分がバックエンドです。
バックエンドはフロントエンドの要求に対し、データを処理したり、
その結果をフロントエンドに返送したりなどを実行するのがバックエンドの役割です。
上記のステップ2から4の処理をバックエンドが担います。たとえば動画投稿サイトで関連動画が表示されるのも、バックエンドが働いているためです。
ユーザーが探している情報を適切に探し出し、フロントエンドに送るなどの役割を果たしています。

 

●データベース

データベースは、大量のデータの保管や管理を行っている機能です。
ユーザーの要求に応じて、データベースへ情報の記録や表示する役割を持ちます。
例えば、YouTube に投稿されている動画データを管理・保存するのがデータベースです。

データベースはユーザーの検索要求に応じて、保存された動画データから適切なものを検索結果として返します。

データベースを管理・操作するときに使用される代表的な言語が「SQL」です。
SQL はオープンソースとして無料公開されているうえ、ISOなどで標準規格として採用されており、多くのアプリケーションで採用されています。

フロントエンド、バックエンド、データベースでは、それぞれ異なるプログラミング言語によって構築されます。

 

 4. Webシステム と Webサイト との違いは?

ここまで読み進まれた方の中には
「 Webシステム と Webサイト と何が違うのだろう」
という疑問をお持ちの方もいらっしゃるかもしれません。

 Webシステム と Webサイト の1番の違いは「機能の多様さ」です。
 Webサイト は、 インターネット 上にある複数の Webページ を組み合わせて構成されており、基本的な機能はテキストや画像の閲覧に限られるなど、やり取りは片方向です。

一方、 Webシステム では、コメント・メッセージの投稿や、商品購入、マップの表示など、閲覧だけでなく、閲覧者が情報を送るなどの、多様な機能が搭載されており、双方向のやりとりが行えます。

このように Webシステム は Webサイト と比べ、機能の数が大幅に増える点で異なります。

一例としてよく知られる Webシステム を使った Webサービス として有名なものは、以下に挙げるようなものがあります。

SNS : Twitter 、 Instagram 、 TikTok  、 Facebook 、YouTube など
ECサイト : Amazon 、 楽天  など
情報アプリ:食べログ 、 ぐるなび 、 NewsPicks 、 クックパッド  など
業務効率化:Slack 、 Skype 、 ChatWork  など
マッチングサイト: 転職エージェント 、 マイナビ 、 メルカリ  など
OTA: 楽天トラベル 、 一休 、 じゃらん  など

どれも双方向性のやり取りが行われ、それぞれ異なる機能を持った システム です。
ここに挙げた例を見ただけでも Webシステム は Webサイト に比べてはるかに多くの機能を組込めることがイメージできます。

この記事では Webシステム にはSNSや動画投稿サイトなどがあることをご紹介し、その処理の流れについてご紹介しました。
ここまで見てきたように Webシステム の 開発 には、専門的な知識・スキルが必要になりますので、専門のシステム開発会社に依頼するのがよいでしょう。

SIA では Webシステム 開発 のご依頼を承っております。
ECサイト、マッチングサイト、予約システムなどのBtoC向け Webサービス や
社内で使用する業務用の Webシステム の実績も多数ございます。
過去の実績で培ったノウハウを活かしたご提案をいたします。
ぜひお気軽にお問い合わせください!

Accessibility Toolbar