ホームページの基礎知識 ホームページ制作

HTMLはプログラムではない!! プログラムとは?

投稿日:

前の講座でご説明させていただいたHTMLや、CSSだけで、どんなホームページも作れちゃう!って思ってる方も少なくないはず…

お伝えするのは心苦しいですが、実は…

HTML・CSSだけじゃ、実現できないホームページもありまして、その代表格が、ショッピングサイトだったりします。

えぇぇぇ!
ネットショップは、自分じゃ作れないの?!

って衝撃を受けてるのは、ヒヨコだけじゃないはず。

きっとこのページをご覧いただいている社長さんの中にも、ネットショップを自分で作りたい、もしくは、自社ホームページの中に、ネットショッピング機能を組み込みたいって考えていた人も少なくないはず。

ただ、残念ながら、ネットショップの構築には、プログラムの力が必須になるんです。

プ、プログラム?? HTMLだって、プログラムなんじゃないの?

そう思う方が大半だと思いますが… HTMLはマークアップ言語、CSSはスタイルシート言語と呼ばれいて、実は、プログラム(プログラミング言語)ではないんです。

この記事では、プログラムが、どんなモノなのか?どんな時に必要となるのか?について、ご説明したいと思います。

プログラムとは?

java、java script、PHP、perl、Ruby、C言語、Pythonなどなど、プログラムと言っても、多様なプログラミング言語があります。

言語によって、デキることや、表現方法も異なりますが共通して言えるのは、命令されたことに対し、条件に応じて、何らかの計算・処理を行なうことがデキると言うこと。

例えば、ショッピングサイトを具体例とすると、ユーザーが買いたい商品をカートに入れたときに、その数量や、金額に応じて、合計金額を算出しなくちゃいけません。

もちろん、その他にも、カートに入れられた商品の在庫状況と、ユーザーが求める数量を判断し、購入可能か否かを判断するなどの処理や、ユーザーが希望する支払い方法が、クレジットカードなのか、代引きなのか、振込なのかによって、ユーザーに伝えるべき情報、入力してもらう内容を変えるなども必要になります。

つまり、ユーザーが求めるアクション(命令)に対して、条件に合わせて、決められた処理・計算を行う。そして、条件によっては、表示内容を変えることができる。

それが、プログラムです。

HTML・CSSは動きのない絵画。プログラムは動きを作る。

任天堂の大人気ゲーム "スーパーマリオ"を例に、HTML・CSSと、プログラムの違いを、もう少し嚙み砕いて話をしたいと思います…

分かりやすいかどうか、初めての試みで不安ですが(笑)

まず、以下のような、お馴染みのマリオのアクションですが、これらは全てプログラムの担当分野です。

スーパーマリオのアクション例

  1. もし、Bボタンと、操作キーが一緒に入力されたら、ダッシュする。
  2. もし、Aボタンが押されたら、ジャンプする。
  3. もし、土管の上で、下ボタンを押されたら、土管の中にはいる。
  4. 獲得したコインの枚数を記録、100枚貯まったら 1UP。

これらの共通点は、" 〇〇されたら、XXする。"や、"もし、〇〇だったらXX、◆◆だったら、★★をする。"といった、状況判断・条件分岐による処理が求められること。

例えば、③もし、土管の上で、下ボタンを押されたら、土管の中にはいる。であっても、単純に下ボタンが押されたか否かを判断するだけじゃなく、土管の上にいる状態で、下ボタンが押されたのかを判断しなくちゃいけません。

④の獲得したコインの枚数を記録、100枚貯まったら 1UP。の処理で言っても、これまで獲得したコインが何枚なのかカウントするだけじゃなく、現在の保有枚数を、記録・保持しておかなきゃいけません。

そして、処理する上での大前提として、土管の適切な位置で、下ボタンが押されたら、土管の中の別のワールドに入れる。だったり、もし、コインが100枚貯まったら、1UPさせて、コインはゼロにする。といった、処理ルール(プログラム)を予め作っておかなければいけません。

このように、プログラムを使うことで、〇〇された時に、どうするのかと言った処理ルールを定義し、その決められたルール通りに、処理を繰り返させることができるんです。

HTMLや、CSSも見た目はプログラムのように見えますが、このような計算能力はなく、あくまでも視覚的表現、ページ構成を伝えるための言語ということです。同じようにスーパーマリオを例にすれば、マリオを描くことはできますが、プログラムのようにマリオに動きを与えることはデキないんです。

ちなみに、プログラムを使った動きのあるホームページを、動的なサイト、HTML、CSSだけで作られた動きのないホームページは静的なサイトと呼ばれるから、覚えておきましょう。

ホームページでプログラムが必要になるのは、どんなとき?

冒頭でご説明した通り、ネットショップがプログラムを必要とするのは、イメージが湧くかと思いますが、その他、どのような機能・場面で、プログラムの力が必要になるかと言うと、

プログラムを必要とするホームページの機能例

  1. 会員登録機能
  2. ログイン・ログアウト機能
  3. お問い合わせ・コンタクトフォーム

①会員登録機能では、氏名(漢字とフリガナ)、年齢、性別、メールアドレス、電話番号、住所などの入力を求めることが一般的に多いかと思いますが、ユーザーさんの中には、こちらが意図しない間違いをしてしまうことも起こりえます。

例えば、氏名のフリガナを、ひらがなで入力してきたり、メールアドレスの欄に、電話番号を入力してきたり… または、必須入力項目としてるのに、入力漏れがあったり。

そういった、ユーザーが入力してくれた情報が、こちら側が求める情報・書式であるかを判別する上でも、プログラムの力が必要です。もちろん、入力内容に不備があれば、アラートを出し、もう一度、確認・入力を促すアクションも、プログラムの処理によるものです。

また、②ログイン・ログアウト機能などは、プログラムの力が必要とされる典型的な機能。入力された IDと、パスワードがキチンと合致しているか否かを判定し、合致していれば、個人の専用ページが見れるけど、合致していなければ入れない。単純な話ですが、この処理が正しく行われないと、個人情報漏洩につながってしまいます。

今や、インターネットの世界で当たり前に使われている機能も、実は、ブログラム無しでは実現できないモノなんです。

どんなホームページ作成ソフトでも、プログラムまでは書いてくれない?!

当サイトが推奨するホームページ作成ソフトだけでなく、ホームページビルダーなど、世の中には数多くのホームページ作成ソフトが売られています。

が、残念ながら、どんなホームページ作成ソフトであったとしても、さすがにプログラムまでは書いてくれません。

ホームページ作成ソフトは、あくまでも初心者さんが簡単にホームページを作るためのツールであって、作成できるのは、静的なサイトのみ

ネットショップなど、プログラムを必要とするホームページを作りたいと思ったら、別の方法を模索しなくちゃいけません…。

WEB業者に頼んだら、超高くなるし… 自分で勉強してもできるかどうか…って不安になった、そこの社長!

安心してくれ。初心者さんが、簡単に、低予算でネットショップを開業する方法もあるんだぜ!

次の講座
初心者でも、簡単&低コストで、ネットショップを開業する方法

どんなホームページ作成ソフトでも、プログラムまでは書いてくれない?!でお伝えした通り、ホームページ作成ソフトが対応できるのは、HTMLとCSSまで。 つまり、ネットショップなど、高度なプログラミングが ...

メルマガ始めました!

産地直送
店舗集客アップに役立つ情報を、WEB業界からダイレクトにお届けする、ディースケのメールマガジン雨天決行は、もちろん無料です(笑)
ディースケが、WEB業界の現場から、店舗集客に役立つ情報を、お届けしちゃうWEBマガジン…
その名も"雨天決行"

雨が降ろうと、槍が降ろうと、頑張る社長さんのために、ブログじゃ言えない 訳ありノウハウや、お勧めツールなど、情報盛り沢山(予定)

無料登録はこちらから

-ホームページの基礎知識, ホームページ制作

Copyright© セルフサービスホームページ , 2019 All Rights Reserved.