Web制作

【Webのことが分からない人向け】Webサイトの制作に欠かせないコーディング・プログラミング言語

【Webのことが分からない人向け】Webサイトの制作に欠かせないコーディング・プログラミング言語

Web・インターネットは日常生活に溶け込み、ビジネスにおいて欠かせない存在になりました。
今やWeb・インターネットに触れずに何かのサービスを利用することのほうが少なくなっています。

しかし、Webやインターネットがどういう仕組みであなたにサービスを提供しているのか、知っていますか?
ほとんどの人は、クリックしたときになぜページが切り替わるのか、よくわからないままサービスを利用しています。

普段はそれでもいいですが、いざWeb・インターネットを通じてサービスを提供する側になったとき。つまり仕事でWeb・インターネットにかかわるとき、まったくわからないままではいけません。
専門分野はディレクターやプログラマー、デザイナー、外注業者に依頼するにしても、最低限の仕組みを理解しておくことは非常に重要です。

ざっくりとでも仕組みを知っておくだけで、「Webやインターネットで何ができるのか?」「費用感やスケジュールは適切か?」などが分かり適切なビジネス展開ができます。また、プログラマーとのコミュニケーションがスムーズになることで、外注に出した場合も望んだサービスが実現されやすくなります。

では、Web・インターネットでサービスが提供できるのはなぜなのか?
様々な技術が組み合わさってサービスが提供されるわけですが、今回は「コーディング・プログラミング言語」をご紹介します。

これからプログラミングを学んでいきたい方はもちろん、Web・インターネットをビジネスに活用される方はぜひご覧ください。

プログラミングとコーディング

Web制作に欠かせないスキルとして、プログラミングとコーディングがあります。

デジタル用語辞典によると、プログラミングとは「コンピューターに処理を行わせるためのプログラムを、プログラミング言語を用いて作成すること。または、プログラムの仕様の設計からテストまでの一連の工程のこと。」となっています。

一方、コーディングとは「プログラムを書くこと、もしくは、文字や画像、音声などのデータを特定のコードに置き換える(符号化する)こと。前者は、仕様書や流れ図(フローチャート)に沿って、ソースコードを記述していくことを指す。後者は、エンコードと呼ぶのが一般的。」となっています。

何やら難しく感じますが、ざっくり言ってしまえば、コンピューターに指示を与え何かを完成させる一連の流れをプログラミングといい、一連の流れの中でプログラム言語を用いて指示を記述することをコーディングといいます。
このようにコーディングはプログラミングの一部であり、プログラムを完成させるためにはHTMLやCSS、JavaScriptといったプログラミング言語を習得する必要があります。

プログラミング言語の種類

プログラムを完成させるためにはコーディング能力が必要であり、プログラミング言語を使いこなせる必要があることがわかりました。この章ではWeb制作でよく登場するプログラミング言語について解説していきます。

いろいろな種類の言語がありますが、どれか1つだけで1つのサービスが出来上がるということはほとんどありません。様々な言語を目的によって駆使して、1つのサービスが作り上げられています。

(1)HTML(Hyper Text Markup Language)

Web制作においてWebページを表示させる根本となるのがHTMLであり、Web制作をするためには必ず押さえておく必要がある言語です。
HTMLはマークアップ言語と呼ばれており、Webページに表示させる文章を構造化するための記述方法です。<と>で囲まれたタグと呼ばれる記述を用いて記事の見出しを書いたり、画像を貼り付けたり、表を作成します。

(2)CSS(Cascading Style Sheets)

CSSはHTMLで記述されたWebページのスタイルを決めるためのプログラミング言語です。

HTMLは文章を構造化してWebページを作成しますが、必要最小限の装飾しか施されていないため、利用者にとって使い勝手の良いWebページとは言えません。CSSはこのWebページに装飾を加えることで利用者にとってわかりやすいWebページを提供しています。

例えば、Webページに表示される色、サイズ、レイアウトなどのスタイルやプリンタなどの機器に出力するスタイル、音声で読み上げられるときの再生スタイルなどが該当します。

人間に例えるとHTMLが人体を構成する骨格、CSSが見た目を整える皮膚のような役割を担っているとイメージするとその違いがわかりやすいでしょう。

(3)JavaScript

HTMLとCSSがあればWebページを作成できますが、HTMLとCSSは静的な記述しかできないため、Webページに動きをつけることができません。Webページに動的な効果を与えることができるプログラミング言語がJavaScriptになります。

例えば、JavaScriptを使用することで、アコーディオンと呼ばれるクリックしてコンテンツを表示させたり、チェックボックスをクリックすることでコンテンツを表示させることができます。

このような特定の条件で動作させることはイベントと呼ばれており、上記以外にもマウスでカーソルを合わせたり、フォームに何か入力させたり、テキストが選択されたりなど様々なイベントが用意されています。

JavaScriptはjQueryやReact、Vue.jsなど、JavaScriptから派生したフレームワークと呼ばれるよく使われる記述をまとめたものが提供されており、利用用途やその特徴に応じて利用されています。

(4)PHP

PHPは動的にWebページを作成することができるプログラミング言語です。他のプログラミング言語と比べると仕様や文法がわかりやすく、MySQLといったデータベースと連携が容易なことから、Webアプリケーションの開発などにも使われています。

これまで説明したHTML、CSS、JavaScriptはフロントサイドのプログラミング言語と呼ばれており、利用者のブラウザで処理を行い結果を表示させています。一方、PHPはサーバーサイドのプログラミング言語と呼ばれており、なんらかの処理(リクエスト)をサービスの提供元が保有するサーバで処理を行い、その結果を戻します。

例えば、利用者が問い合わせフォームに名前、電話番号、メールアドレスと問い合わせ内容を入力して完了したとします。フロントサイドのプログラミング言語ではその場でエラーチェックをしたり、アラートを表示させることができますが、入力された結果を保存することができません。

そこで登場するのがPHPです。PHPでは入力された結果をデータベースに保存することができるため、後日担当者が問い合わせ内容を確認して回答をするといったことが可能です。

フォーム以外にも掲示板やショッピングカードなど、利用者の操作によって表示内容を変更させる様々なアプリケーションで利用されています。有名なWordPressと呼ばれるCMS(Contens Management System)もPHPで作られており、ユーザーが記事を更新するたびに新着記事として表示させたり、関連記事を自動的に表示させたりしています。

(5)Java

JavaはWeb系のサーバーサイドのプログラミング言語として人気が高いプログラミング言語です。コンパイルと呼ばれる翻訳を通じて人間の言葉から機械語に変化して処理を行うため、これまで説明したプログラミング言語よりも敷居が高いかもしれません。

ただ、Javaは企業の大規模プロジェクトで多く採用されており、大規模Webシステムを携わっていく場合には欠かせないプログラミング言語と言えます。

また、JavaはWindowsやMacOS、Linuxなど動かすコンピューターに依存せず、どのようなコンピューターでも動かすことができるのが特徴です。

JavaはTwitterやEvernoteのようなWebアプリケーションやWebサービス、OpenOfficeのようなデスクトップアプリケーション、AndroidアプリケーションなどにJavaが使われています。

(6)Python

Pythonとはオランダ人のグイド・ヴァン・ロッサム氏によって開発されたプログラミング言語です。イギリスのBBCが制作した「そらとぶモンティ・パイソン」に由来しています。

Pythonは少ないコードで簡単にプログラムが書ける、コードが読みやすいといった特徴があるプログラミング言語です。最近話題となっているAI(人工知能)やWeb開発、教育分野などの幅広い分野で活用されています。

Pythonで作られたアプリで有名なものとしては、「Youtube」「Evernote」「Instagram」などがあります。PythonではAIや深層学習への利用が有名ですが、こういったWebアプリケーションの開発などにも適しています。

(7)Ruby

Rubyとは日本人のまつもとひろゆき氏が開発したオブジェクト指向スクリプト言語です。Javaのようなコンパイルが不要であり、サクサクとプログラムを作っていくことができます。

Rubyの特徴はRuby on RailsというWebアプリケーションフレームワークが有名です。Ruby on Railsを使用することでWebサイト、データベースの業務システムを効率的に開発することができ、Javaなどの開発に比べて圧倒的に早く開発をすすめることが可能です。

Rubyを使用しているサービスとしては、「クックパッド」「食べログ」などが有名です。

日本で生まれたプログラミング言語ということで、参考となる文献なども日本語で多数用意されており、英語が苦手な理系出身者でも手軽に学習できるのが特徴です。

まとめ

今回はWeb・インターネットを支えているプログラム言語をざっくりと紹介しました。
プログラムを完成させ、サービスを提供するには、プログラミングを理解し、正しいフローに沿って構築していく必要があります。その中でもコーディングには用途に応じて多彩なプログラミング言語が提供されて、どのプログラミング言語を習得していくべきか難しいところもあります。

これからプログラマーを目指す方は、何を実現したいのか、今後どのようなことをしていきたいのかを明確にして自分にあったプログラミング言語を習得していきましょう。
プログラマーを目指すわけではない方も、ざっくりと「こんなにいろんな言語があるんだ」というのだけでも知っておいてください。また、京見があれば無料でプログラミングが学べるサービスも数多くあるので、少し触ってみてください。
これからWeb・インターネットをにかかわらずビジネスを行うことはほとんどできません。少しプログラムのことを知るだけで、視野が広がるでしょう。