HTML5初心者入門 Lesson1

私は独学でHTML5＆CSS3をほぼマスターしましたので、初心者に分かりやすく初心者目線でHTML5について記事を書きたいと考えました。

HTMLとは！？

日常のスマートフォンなどPCのインターネットで検索してサイトを見た事がある人しかいないと思います。

サイトの構築は、基本的にHTML言語で作成されています。（静止動画）

さて、HTML言語とは、Hyper　Text　Markup　Language（ハイパーテキスト・マークアップ・ランゲージ）を略して、HTMLと言います。

「HTMLはアップデートされ現在ではHTML5のバージョンです。」

とても簡単に作成できますので一緒の言語を書いてみましょう。

HTML言語を記述するうえで必要な物とは！？

1. PC
2. テキストエディタ

これのみで作成が出来ます。

※ウェブ上に公開する場合には、サーバーとドメインの取得が必要ですが今回はHTMLの講座ですので必要はありません。

このブログを読んでいると言う事は、あなたはWEBサイトの勉強をしたいと考えている人、若しくは、将来的にサイトの構築やWordpressでカスタマイズしたいと考えている人だと考えています。

PCを持っていると言う事を前提にレッスンを進めていきます。

次にエディタの選択です。

エディタは様々な種類があり、どれが一番いいか分からないと言う人はまずは、Windowsのメモ帳でも作成できますのでそれから練習をしてもいいと私は考えています。

えっ！？

メモ帳でも出来るのって思われた方も要ると思いますので簡単に紹介します。

まだ、レッスンには入っていませんので参考にされてください。

メモ帳での記述方法は？

簡単に説明しますね°˖✧◝(⁰▿⁰)◜✧˖°

メモ帳に最低限のHTML5を記述してみます。

この段階で覚える事は正しい記述のみです。

HTML5言語は非常にシンプルに出来ていて、ブラウザの対応もほゞ出来ている状態ですね。

以前のバージョンは、複雑で面倒な記述が多すぎたように感じています。

これだけの記述で、ブラウザでの表示を確認してみましょう✨

保存形式を変更する必要があります。

「ｔｘｔ→ｈｔｍｌ」

保存して、では観てみましょう。

「ブラウザでの表示は、上手くいきましたね°˖✧◝(⁰▿⁰)◜✧˖°」

どうでしょうか！？

メモ帳でも簡単にできる事が分かりましたでしょう✨

メモ帳を使ってもいいが問題がある

メモ帳でhtmlを作成できることが理解できたと考えていますが、実際にメモ帳で全ての記述を書くことは本当に大変で、どこが間違っているのか探すのも大変になるので、「テキストエディタの登場」です。

エディタは無料から有料まで様々

どのエディタで言語を記述すればいいか初心者の方は迷うと思います。

「私もかなり迷いました💦」

その中で出逢った無料のエディタを紹介します。

無料エディタ

１　私が最も愛するATOM(⋈◍＞◡＜◍)。✧♡

画像をクリックすればATOMのサイトに飛びます飛びます！

プラグインで自由にカスタマイズできるし、デザインが何よりも気にいっている✨

デメリットは、読み込みが遅い事ぐらいかな！？

スピード重視の人には向いていないかもしれませんね。

私は、さほど気にならないです。

２　　サクラエディタ

サクラエディタのdownloadサイトに飛びます。

無料では使いやすいと考えています。

downloadしましたが、私は気にいらなかったので、使用していません。

日本語だから分かりやすいと考えています。

３　Subliｍ Text

画像をクリックでサイトに飛びます。

Sublim Textは、有名ですね。

これもdownloadしていますが私は使用していません（笑）

プラグインでカスタマイズできますのでATOMと同じ感じですが、ファイルの読み込みがATOMより早いです。

みなさまが好きなテキストエディタを使用すれば良いと考えています。

さて、有料版の紹介をします。

有料版テキストエディタ

Dream wearver

Adobeの有料テキストエディタです。

これは、かなり使えます。

画像などの編集をしてDｗでHTMLを構築する事が簡単にできますし、全ての機能が連動できる点で言えばオススメかもしれませんが私は、持っているだけの状態ですね（笑）

Adobeはコンプリートを購入しましたがATOMの方が好きと言うだけで使用しています。

テキストエディタの選択

「テキストエディタの紹介をしました。」

次回は、Lesson2です。

HTMLを実際に記述の仕方を紹介していきます。

引き続きよろしくお願いします。

更新は不定期になりますのでご了承ください。