HTML・CSSプログラミング基礎・言語の入門

  • このエントリーをはてなブックマークに追加
  • 0

HTMLはハイパーテキストマークアップランゲージと呼ばれ、ブラウザにサイトを表示するために必要な言語です。一番基礎的な言語となっており、見出しや、段落、テキスト、フォントの大きさ、見た目などを設定する機能があります。HTMLは非常に簡単なので30分くらいで学べるものです。HTMLの入門をご紹介します。

人気記事

HTML プログラミング言語・入門

HTMLはプログラミング言語の入門としてもっとも基礎的な言語です。
しかし、ウェブサイトをいきなり作ると言っても、htmlの役割がわかりませんよね。
htmlの役割については下記のようになっています。

  • HTML ・・・ウェブサイトの文書構造を書いたもの
  • CSS  ・・・HTMLで書いた文書構造の見た目を制御する言語
  • JavaScript / PHP  ・・・ 動きやデータを制御するプログラム

文書構造がなければ、ブラウザ・サイトには表示されるものの、検索エンジンにうまく引っかからず、
検索しても自分のサイトが出てこないと言った問題がおきます。

それを正しくロボットに伝えるために必要なのがHTMLです。
一番基礎的な言語といえます。

ツイッターやフェイスブックのようなSNSを開発したいという人は、PHPやRubyといったサーバーサイド言語が必要です。HTMLを覚えたけど次に何をしたら良いのかわからないという方にはこちらを。

HTML プログラミング 基礎

HTMLは本当に簡単です。30分もあればある程度覚えることができます。
下記がhtmlの一例になっています。

タグは基本的なタグとして覚えておく必要があります。英語で言う英単語のようなものです。

HTMLはそれぞれ入れ子構造になっているため、ページの中身になるものは、bodyタグの中に入れることになります。

HTML プログラミング言語のこれまでとの違い

HTMLにはXHTML4.01, HTML5という違いがあります。これは以前までは違う文書構造で作っていたものが、HTML5となって文書構造の書き方が変わったということです。

上記している書き方はHTML5の書き方になっています。XHTML4.01で書かれたウェブサイトが見られなくなったということではありませんが、できるだけ最新のHTML5の書き方で作っておくことが推奨されています。

ロボットの読み込み方が変わっているので最新にしなければ、古いものと見なされてしまうからです。

XHTML4 の書き方とは

HTML プログラミング ソフト・エディタ

HTMLを書くときにエディターと呼ばれる入力ツールが必要になります。ブログで言う投稿画面のようなものです。そのエディターツールがあると効率的に、かつ間違うことがなくプログラミングをすることができるのでエディターを利用することをおすすめします。

Atom

atom

Atomは非常にシンプルなエディターながらプラグインなどを用いることによって、様々な機能拡張をすることができます。機能拡張ができてシンプルで使いやすいのにも関わらず、利用は無料ということで人気です

HTMLのみならず他のプログラミング言語やシェルスクリプト実行することができるので、非常によく利用されています。初心者の方から中級者、上級者の方までオススメのエディターツールです

公式サイト:https://atom.io/

Dreamweaver

Adobeというデザインツールやプログラミング補助ツールを運営している会社が出している、プログラミングエディターツールであるDreamweaver。有料となっているために、AtomやSublime textの方が無料ということで人気になってきています。

Dreamweaverは起動するのに時間もかかるので、Atomの方が軽量でおすすめです。

Sublime Text

サブライム

Atomが出てくるまでエディターツールとして一世を風靡していたエディターツールです。Atom同様プラグインで拡張できるので人気でしたが、有料会員になることをアラートで催促されるなど面倒な仕様になっていました。

今はSublime text3まで出ていますが、Atomの方がモダンなエディターとしては人気となっています。

HTML関連のおすすめ書籍

HTMLを勉強する方法として、ネットで勉強する方法や、書籍で勉強するという方法があります。ウェブデザイナーを目指すという方には本格的なプログラミング・Webデザインスクールに通うことをオススメしますが、ここでは書籍をご紹介します。

古い書籍ですが、本当に初心者に優しい基本的なところから解説してくれている書籍です。

HTMLとCSSがある程度勉強できたという方にはJavaScriptを勉強することをおすすめします。JSはウェブサイトやホームページに動きをつける役割を果たし、どのサイトでも基本的には使われています。

JSがあるとユーザーがマウスクリックしたり、スマートフォンでサイトを閲覧するときに便利な機能を作ったり様々なことができます。エンジニアになるにはほぼ必須のプログラミング言語ですね!

初心者向けhtml入門のまとめ

HTMLをかけるようになるのは、エンジニア、デザイナーを目指すための基本です。
エンジニアはもちろん、ウェブデザイナーになりたいという方だと必須ですので、1からものづくりを勉強したいという方にオススメのスクールをご紹介しておきます。

  • このエントリーをはてなブックマークに追加

この記事が気に入ったら
いいね!しよう

Rplayの最新情報をお届けします

TwitterでRplayをフォローする

カテゴリー一覧