Webデザイン 入門講座

ホームページ制作にあたり勉強すべきコンピュータ言語は?【ホームページ制作入門講座】

2019年12月24日

世の中のPCを含めた電化製品は、様々なコンピュータ言語でプログラミングが施されて動いています。ホームページも同様に、コンピュータ言語の一つによって構築されています。

今回は、そのコンピューター言語について【ホームページ制作入門講座】として解説していきます。

この記事は、動画バージョンでも解説しておりますので、動画で学習されたい方は以下のリンクより閲覧下さい。

コンピュータ言語とは?

コンピュータ言語とは、コンピュータを制御する為の文法であり、主に数字と英語と記号で構成されています。日本語は一切ありません。

様々なコンピュータ言語があり、「C」「Java」「Java Script(ジャバスクリプト)」「PHP(ピーエイチピー)」「HTML(エイチティーエムエル)」「CSS(シーエスエス)」「MySQL(マイエスキューエル)」などが挙げられます。

コンピュータ言語の種類

コンピュータ言語といっても種類があり、「プログラミング言語」や「マークアップ言語」、「スタイルシート言語」などがあります。

プログラミング言語とは

プログラミング言語とは、ユーザーの指示に合わせて動作をプログラムしていく言語です。「ボタンを押したらAが走り出す」みたいな事ですね。

「C」「Java」「Java Script」「PHP」などがあります。

マークアップ言語とは

マークアップ言語とは、コンピュータ上で文章を構築するための記述形式で、文字をマークアップ(タグというモノで囲う)していく事です。

主に、ホームページ制作の際に使用されるモノで、「HTML」があります

スタイルシート言語とは

スタイルシート言語とは、ウェブ上で、文章を装飾するためのスタイルシートを記述するための形式です。

主に、「CSS」があります。

データベースを操作する言語

その他にも、データベースを操作する言語に「MySQL」というものがあります。

データベースとは、字の如く、データを保管しているモノになるのですが、例えば、会員情報やブログ記事、パスワードなんかがデータベースに保管されたりします。

ホームページ制作に必要な言語は?

ホームページに必須になる言語は、マークアップ言語である「HTML」とスタイルシート言語である「CSS」になります

「HTML」でマークアップされた言語を、「CSS」で装飾する事で、綺麗なウェブサイトを構築していく事が可能です

しかし、場合によっては、動的にページを制御する(ボタンを押せば、動く。データベースからデータを呼び出す。みたいな事)為に、「Java Script」「PHP」「MySQL」などを利用したりします。

「Java Script」の特徴

「Java Script(ジャバスクリプト)」は動的なサイトを演出するために使われるプログラミング言語で、ホームページにもよく利用されます。

例えば、「何秒後にこのメッセージが出る」みたいな事から、アコーディオンメニュー(ボタンを押せば、ずらっとメニューが表示される)、タブメニュー(ボタンタブを押せば、表示内容がページ移動なしで切り替わる)、スライドショー(指定した時間で画像が切り替わっていく)などが挙げられます。

上記であげた例は「CSS」だけでも実装できる場合があったりしますので、どちらの言語を採用しても良いのですが、状況や目的に応じて利用のしやすさが変わってくるでしょう

「PHP」の特徴

「PHP(ピーエイチピー)」も、柔軟にプログラミングをしていく事ができる言語です。

「PHP」はホームページ制作に多く採用されますが、その理由はデータベースからデータを取得するための「MySQL」を操作する事ができる事でしょう

「ホームページにデータベース???」と、初心者の方はよくわからない話に聞こえてくるかもしれませんが、「HTML」は、あくまで文章をタグで囲っているだけに過ぎませんので、データベースにアクセスする事はできません

データベースにアクセスできないとどうなるか?WordPressのように、ウェブブラウザからログインするだけで、誰でも簡単にブログの記事を投稿したりする事ができなくなります。もしもデータベースを利用しないでブログ投稿サイトを作ると、1記事投稿するだけでも、いろいろな箇所のコード変更する必要が出て、非常に煩雑で、現実的な作業ではなくなります

そういった背景がありますので、ホームページ制作の代表であるWordPressは「PHP」で実装されデータベースを利用する事で、誰でも簡単に管理・投稿できるようになっており、「このボタンを押せば、この記事を吐き出す」といった動的な構造になっている訳です。

「MySQL」の特徴

「MySQL(マイエスキューエル)」は今まで紹介してきた言語とは全く雰囲気が違うモノで、テキストエディタでの操作は行えません。コマンドラインと呼ばれるものに、命令(コマンド)して、データの構築・取り出しを行っていきます。

WordPressの投稿記事は、ダッシュボードから視覚的に見えているので勘違いするかもしれませんが、大元のデータとしては、全てこの「MySQL」のデータベースに保管されていますダッシュボードから見えている記事は、あくまで「MySQL」のデータベースの記事を見やすくしているだけに過ぎません

ですので、初心者の方はピンとこないかもしれませんが、サーバーに上げている対象ディレクトリファイルの中に投稿記事を探したところで、データは一つもありません

そして、ホームページに多く採用される理由は、ログイン機能、投稿記事管理、会員サイトの場合は個人情報などを扱えるからでしょう。

ホームページ制作に勉強すべき必要な言語

つまり、ホームページ制作には、まず「HTML」で文章をマークアップし、「CSS」のスタイルシートで色やバランスの調整を行います。

そして場合によっては、ユーザビリティーを上げるために、「Java Script」を利用してハンドリングや、見やすさを改善し、「PHP」と「MySQL」を利用する事で記事投稿を容易にし、ログイン機能をつけたりします。

各言語の難易度

私が体感した、言語の習得難易度を紹介します。

  • HTML:
  • CSS:
  • Java Script:
  • PHP:
  • MySQL:

はっきりいって、「Java Script」「PHP」などの本格的プログラミング言語は難しいです。独学で勉強するなら、かなりの時間と忍耐力が必要になります。

しかし、「Java Script」は絶対に導入しなければならない訳ではありませんし、WordPressの場合、「PHP」と「MySQL」に関しては、基本的には製作者側で何かを追加で記述していかねばならない事はありませんし、初期の状態をそのまま使えば問題なく使用できます。むしろ、「PHP」や「MySQL」は繊細なので、何も触ってはいけません

ですので、ホームページ制作に必須であり、逆にこれだけやっておけば大丈夫というのは、「HTML」と「CSS」のみになりますので、初心者の方は、まず徹底に「HTML」と「CSS」のみをマスターしましょう

くれぐれも中途半端に「Java Script」や「PHP」、「MySQL」から勉強したりしてはいけません。

「Java Script」の勉強ポイント

しかし、「HTML」と「CSS」に慣れてくると「Java Script」も使いたくなってくるでしょう。

「Java Script」はインターネットに色々ソースが落ちてますので、基本的にはそれらを拾って、読み込ませる事さえできれば、ウェブデザイナーとしてはとりあえず十分だと思います

「Java Script」を自作するのは、初心者の方にはとてもじゃないですが、ハードルが高過ぎます。

「php」の勉強ポイント

また、WordPressは「PHP」で実装されていますので、根本的なカスタマイズをしたい場合は「PHP」の操作が必須になります

しかし、WordPressでのカスタマイズ範囲の「PHP」は、WordPress Codexという、WordPressのカスタマイズ専用サイトにて詳しく紹介されたりしており、限定的な範囲になりますので、中級者以上になってからそういったものを参考にカスタマイズしていきましょう。

「MySQL」の勉強ポイント

「MySQL」に関しても、根本的な理解は難しいので初心者の頃から本格的に勉強する事はおすすめ致しません

ただ、サーバーによって様々ですが、Xserverなどでは、「phpMyAdmin」という、「MySQL」を視覚化し簡単に操作できるクライアントツールを用意してくれていますので、そちらの操作だけできれば十分かと思います。

まとめ

いかがでしたでしょうか?

コンピュータ言語には様々ものがありますが、ホームページ作成に必須なのは「HTML」と「CSS」になります。

ホームページを運用していく中で、「Java Script」「PHP」「MySQL」などを併用していく事も出てくると思いますが、そういったプログラミング言語の根本的な理解は非常に難しいので、要点だけおさえて勉強していく事がおすすめです。

ちなみに「HTML」と「CSS」はプログラミング言語と比べると、遥かに簡単でわかりやすいので、2.3ヶ月も触っていれば、ある程度は理解できるようになりますので、取得難易度は低いと思われます。

完全無料のクリエイター育成講座開催中!

人物イラストの無料ダウンロードサイト公開中!

人物イラストの無料ダウンロードならMIDO-KICHI

-Webデザイン, 入門講座

Copyright© デザイナーブリッジ , 2020 All Rights Reserved.