プログラミング入門HTML5のすすめHTML5というコンピューター言語がプログラミング教育でも注目されています。HTMLはウェブサイトを表現するための言語でプログラミング的なことは行えなかったのですが、バージョン5からはJavaScriptというプログラミング言語との連携が密になり、また、CSS3という装飾技術を組み合わせることでスマホやタブレットなどサイズが異なるデバイスに対して柔軟に表示が行えるようになっているため教育現場での採用が増えています。HTML5のサンプル1簡単なタグによる見出しと本文の表現と画像表示HTML5ではタグという記述方法を用いて見出しや本文、画像などを表現します。以下にサンプルを示します。※Resultのタブを押すと結果が表示されます。Resultの部分を選択するとHTMLに対応した表示内容が出力されます。サンプルの中で使われている代表的なタグhtmlタグbodyタグh1~h6タグpタグimgタグhtmlタグやbodyタグはHTML文章全体やコンテンツ全体を囲むためのタグです。h1~h6は見出しを表すタグでh1が一番大きい大見出しになります。pタグは文章のパラグラフ(段落)を表すタグでimgは画像を表示するためのタグです。HTML5でできることWebサイトの制作Webサービスの開発スマホアプリの開発Webサイトの制作HTMLはWebサイトの制作において事実上の標準を確立した言語です。そのためWebで何かしたい人にとってHTML5は知っていて損のない技術です。HTML5を学べばWebサイトの作成や運用で役立てることができます。制作者はもちろんのこと企画やマーケティング担当の場合でもHTML5でできることは知っておくべきです。すれば制作や企画の話がスムーズになったり他のメンバーからの信頼を得やすくなります。Webサービスの開発Webサービスの表示や操作に関わるユーザーインタフェースはHTML5で作りますので、何かWebサービスを作りたい人はHTML5を学ぶ必要があります。最近ではサーバーサイド側のプログラミングでJavaScriptを使うことも可能です。最近ではHTML5でスマホアプリ開発を行うケースが増えています。HTML5は画面サイズやOSが異なった環境に対してコンテンツを配信することを得意としているため、モバイル開発に向いています。具体的にはHTML5でコンテンツを作ってCSS3でスマホやタブレット用に見た目を整えます。JavaScriptでプログラミングを行うことでモバイル向けのアプリを作成できます。HTML5によるアプリ開発はワンソースで複数OSに対応できるのがメリットです。HTML5で作成したプログラムをアプリとして動かすためにはアプリ化ツールが必要です。アプリ化のツールとしてはCordovaやMonacaという製品がよく利用されており、Cordovaはオープンソース製品のためセットアップさえすれば無料で利用できます。Monacaは商用サービスですがセットアップ不要でアプリ開発を行え、無料プランも用意されています。MonacaはCordovaによる開発をクラウドで行えるようにした製品のため、作れるアプリには殆ど違いがありません。HTML5を学ぶメリットHTML5をプログラミング教育で採用するメリットは『テキスト型』のプログラミングの中では表示に強くて『楽しい』からです。HTMLでは簡単な記述で画面上に写真やイラストを表示できますし、CSSを書けば文字のサイズや色なども変更できるため少ない授業時間でも達成感を得やすくなっています。このメリットはプログラミングを既に習得した人にとっては一見たいしたことのないように思えるかもしれません、しかし初心者にとってはコードの記述によってコンピューターの表示内容を操作できることはとても重要です。ヴィジュアルプログラミング系の言語では表示が得意なものが多いですが『テキスト型』言語の中ではHTML5がお勧めです。他のテキスト型言語で表示に強いものとしては『Processing(プロセッシング)』があげられます、こちらの言語もプログラミング入門用大学などで利用されています。テキスト型言語のスムーズな学習のために、『JavaScript』と『Processing』と『Java』とを3つ組み合わせて教えている学校もあります。HTML5を学ぶのに必要なコストHTMLとCSSとJavaScriptで3つの言語に分かれているため役割分担が行われており学習は比較的容易です。それぞれ最低限のことだけを学んでおき、必要になってから追加で機能を学んでいくスタイルをとることができます。学習リソース私が関わった入門書で『Monacaで学ぶはじめてのプログラミング』という本があり、HTML5でプログラミングを始めたい初心者にはお勧めです。この本は初心者の学習を想定して執筆段階で中学校に協力して頂き、実際に授業で実証実験をしたうえで出版しています。分かりやすい大きな文字とカラーのイラスト、それと適切なボリュームでの章立てを行うことで入門者が挫折しないように工夫してあります。Monacaの利用を前提としているため環境のセットアップなどでつまずく心配がありません。初心者のプログラミングに特化した分、HTMLやCSSは最低限しか扱っていません。表現をリッチにしたい場合には別の本やWeb上のリソースを当たる必要があります。JavaScriptによるプログラミングの基礎をもっと学びたい場合も、別の本に進む必要があります。補足コンピューター言語とプログラミング言語の違い我々人間が普段話している言語は『自然言語』と呼ばれており、その対義語が『コンピューター言語』です。コンピューターで処理しやすい、あるいは人間の課題をコンピューターに伝えやすい構造や文法を持つ言語として意図的に作った言語がコンピューター言語です。HTMLはコンピューター言語HTMLはコンピューター上で文章の構造や表組み・箇条書きや画像などの情報を表現するための言語なのでコンピューター言語です。コンピューターを活用してプログラムを実行できるものではないためプログラミング言語ではありません。プログラミング言語と呼ぶためには、コンピューターの計算能力を活用して何か役に立つようなプログラムを記述できる必要があります。JavaSCriptはプログラミング言語コンピューター言語の中でも『プログラミング』を目的として作られた言語が『プログラミング言語』です。Webの世界には当初『HTML』だけが存在しました、そしてプログラムを記述してWeb上に動きや機能を付けるためにJavaScriptという言語が後から発明されました。添い寝なら大人しい~24日目ジャスティス岡本2000年頃からジャスティスのハンドルネームで活動しています。最近は八王子市近辺に生息しています、またIT系コミュニティやプログラミング教育界隈に出没しています。