はじめに
以前 HTML とか JavaScript に関する記事をいくつか書いていたのですが、肝心の「HTML/JavaScriptをどうやって勉強しているのか」について書いていないことに気づいたので、この記事で公開したいと思います。試行錯誤中なので、この記事は随時更新されます。
基本方針
基本方針は単純で、「技を盗む」です。もちろん、CSS のデザインは盗みません。「この部分は JavaScript で書くとこのように効率化できるんだ」「こういう便利なプラグインがあるんだ」「<head>
の部分はこうすればいいのか」というのを勉強していきます。
すぐに簡単なHTMLコードを作ってみよう
以前の記事で紹介したHTML変換サイトを使えば、すぐにHTMLコードを生成できるので、MS Word と対比しながらHTMLの書き方が分かります。
-
https://wordtohtml.net/
(有料の Pro 版もあります) https://wordhtml.com/
実例を見てみよう
時々、ソースコードが公開されていなくて揉め事になることがあります。
しかし、HTMLにおいてソースコードが公開されていないということはあり得ません(ソースコードが公開されないのはウェブサイトが非公開の場合です)。ウェブサイト上で右クリックして「ソースを表示」を選択すれば(もしくはブラウザ上でCtrl+U
とすれば)すぐにソースコードが見えます。元のサイトとソースコードを対比して書き方が学べます。
ウェブサイトを試作してみよう
これまで、「HTML/JavaScript を勉強したけどウェブサイトは作らない」という方に何人かお会いしました。知識は活用してこそ身につくものなのでぜひ試作しましょう。以前の記事で紹介した Google Sites ならサイトの公開範囲を制限できるので他人の目を気にせず試作できます(もちろん無料です)。
エディタを使おう
HTMLはメモ帳よりもいろんな補助機能が使えるエディタで書くべきだと思います。HTML向けで無料で使えるものですと
- Visual Studio Code (Microsoft が開発)
- Sublime Text
- Brackets (Adobe が開発)
等があります。これらを比較した記事を書いているのでこちらもご覧ください。
たくさんお金をかける必要はない
もちろん端末とインターネット接続が必要なので全くお金がかからないわけではないのですが、高価で分厚い教科書を買う必要はないですし(買うにしても古本屋で十分、ただし古すぎる本には要注意)、専門学校や職業訓練学校に通う必要はありません(以前こちらで書きました)。
参考文献
「HTML辞典」が手元にあったら便利かもしれません。JavaScript 関連ですと、Eloquent JavaScript が著者自身によって無償公開されています。