制作環境を整えよう【初心者向け・HTMLの勉強03】

html

本格的にHTMLの勉強をはじめる前に勉強するための環境を整えましょう。

あまりパソコンに詳しくない人はブラウザにそこまでこだわりがなく、Windowsのパソコンでブラウザはエッジをそのまま使っているという人も多いかもしれませんね。

HTMLの勉強01~02の記事ではメモ帖を使っていましたが、それでは非常に使い勝手が悪いので、コードを書くためのテキストエディタをダウンロードしましょう。

ブラウザ

Windowsの規定のブラウザはMicrosoft Edge(エッジ)ですが、Google Chrome(グーグル クローム)が使いやすいので、規定のブラウザをクロームにすることをおすすめします。

ブラウザは下記よりダウンロード
https://www.google.com/intl/ja_jp/chrome/

テキストエディタ

ぼくはAdobeのDreamweaver(ドリームウィーバー)を使っていますが、Dreamweaverは有料ソフトなので、無料ソフトをおすすめします。

おすすめの無料ソフト3選

無料ソフトでも有料のものと同じぐらい性能の良いものがありますので紹介します。

テキストエディタの機能としてコードの補完機能やスニペットがあると重宝します。

標準機能で搭載されていない場合でも、プラグインなどで追加できることがありますので、詳しく知りたい方は検索してみてください。

Sublime Text

特徴

  • 海外製のフリーテキストエディタ
  • キャッチコピー「恋に落ちるテキストエディタ」
  • ハイライト表示
  • grep機能
  • プラグイン
  • HTMLのコード補完機能

https://www.sublimetext.com/

Atom

『特徴』

  • クロスプラットフォーム(Windows・Mac・Linuxでも使える)
  • 拡張機能が豊富
  • コードの補完機能が優れている
  • ユーザインターフェースのデザインがよい
  • 使いやすい
  • 起動が早い

https://atom.io/

Visual Studio Code

『特徴』

  • Microsoft製のエディタ
  • クロスプラットフォーム(Windows・Mac・Linuxでも使える)
  • 早くて軽い
  • デバッグ機能内蔵
  • 拡張機能搭載
  • カスタマイズ性が高い
  • ユーザインタフェースが使いやすい

https://code.visualstudio.com

データの保存場所

パソコンに詳しくない人はデータをデスクトップに保存してしまいがちかと思いますが、データはCドライブに保存するか、新しくDドライブなどを準備してそこに専用のファルダを作ることをおすすめします。

フォルダ名はwebなどとすることが多いかと思います。

※なぜ、デスクトップに保存しないかと言うとデスクトップにデータが増えるとパソコンの起動が遅くなるからです。デスクトップはスッキリさせておきましょう。

まとめ

ブラウザとテキストエディタが用意できれば、あとはデータを保管する場所を決めましょう。

それができれば、本格的なHTMLの勉強に移ります。

※作業はローカル上で確認するので、サーバーへのアップロードなどは行いません。

タイトルとURLをコピーしました