HTML&CSS ホームページ入門

HTMLとCSSの動作に必要なツールを用意しよう

こんにちは!世界一やさしいパソコン教室講師の白川和子です。

初めてホームページを作ろう!と思って本などを見ていると「HTML」や「CSS」という用語が出てくると思います。

「HTML」や「CSS」は、皆さんが普段見ているインターネットのページを作ってインターネット上に載せる(公開する)ためのプログラムの一つです。

Webデザイナーを目指す方にも必要な知識の一つです。

今回は初めて触れる方にもわかりやすくHTMLとCSSを使うために必要なものをご紹介します。

といっても難しくはなく2つのツールがあれば動かせます。

HTML&CSSに必要なもの

  1. テキストエディタ
  2. ブラウザ

まず初めに「HTML」と「CSS」について覚えましょう。

本番環境(インターネットを使って誰でもページを見ることができるように公開すること)にするには「レンタルサーバー」などの契約が必要になります。

必要なもの1:テキストエディタ

白川和子
テキストエディタは、HTML・CSSなどのプログラミング言語を書くための便利ツールです。こんな感じでコードを書いていきます。

コードを書くには「テキストエディタ」を用意しましょう。

無料で使えるものも多くあるので、いろいろ試して自分が使いやすいものを見つけてくださいね。

私が、いつも使っているのは「Visual Studio Code」です。

おすすめ

Visual Studio Code

書いたコードをブラウザでプレビューできる便利エディタ。

コードの間違いも教えてくれるので、初心者さんにも使いやすいです。

Visual Studio Codeのダウンロード方法

Visual Studio Codeのダウンロードページからソフトをダウンロードします。

ダウンロードボックスの横の↓をクリックするとOSが選択できます。MacならOS Xをクリックしましょう。
Windowsの場合、Downlode for windowsをクリックすれば、最新のOSでダウンロードされます。

インストールが済んだら、起動してコードを打っていきましょう。

必要なもの2:ブラウザ

書いたコードの見た目の確認には、Googleなどのブラウザを使います。

白川和子
ブラウザは、Googl、Safari、edgeなど、いつも使っているブラウザでOKです。

さっそくはじめましょう!

HTML&CSSに必須の2つがインストールできたらさっそく始めてみましょう。

次の記事ではHTMLとCSSの書き方を解説します。^^

  • この記事を書いた人

世界一やさしいパソコン教室

Web、PC講師27年 | Webデザイナー | Webサポート | Webコンサル | Webデザイナー育成講師 | Office系ソフトの講師 | DX業務改善アドバイザー | ライター | HSP・エンパス体質専門 ココカラ気功 秘書・広報 Webやパソコンを楽しくマスターできるマンツーマンレッスンを行っています。レッスンは、1回~可能です。悩んでいるより私に聞いて解決しちゃいましょう^^お気軽にお問い合わせください。

-HTML&CSS, ホームページ入門