使用するソフトウェア

Webページを見たり，書いたりするために幾つかのソフトウェアが必要になります．まず最初に，各自のPCに使用するソフトウェアを用意しなければなりません．

Webページを閲覧するためのソフトウェアです．WindowsにはEdgeというブラウザがはじめから入っているので，それを使用してもらえば構いません．

インターネット上には，他にも様々なブラウザが存在し，多くのものが自由にダウンロードして個人のPCで使用できるようになっています．したがって，他のものを使用してみたいとか，お気に入りのものがある人はそれを使って下さい．

Webページの実体は，普通の文字によって書かれたファイルで，特別なものではありません．
従って，Webページ作成用のソフトウェアのような特別なものを用いなくても作成することができます．

ここでは，エディターと呼ばれる入力した文字をそのまま保存する単純なソフトウェアを用いて作成することにします．
単純といっても，最近のエディターにはホームページを作成する時に便利な機能の付いたものがあります． この授業ではそういったものの一つである「VSCode(Visual Studio Code)」 を使用します．

この授業では，VSCodeを使用しているとして説明しますが，他のものを使用したい場合は，それでも構いません． ただし，その場合，使用法などは各自で調べて下さい．

はじめに，Visual Studio Code（以降VSCode）を各自のPCにインストールします．教室のPCには既にインストールされているのでこの作業の必要はありません．自分のPCで作業をしたい場合は各自のPCにインストールをしてください．

1. Edge や FireFoxなどのブラウザを使って，https://azure.microsoft.com/ja-jp/products/visual-studio-code/にアクセスします．
2. 「今すぐダウンロード」をクリックします．
3. 表示されたページから，自分のPCに合った「 User Installer」を選び（最近のPCならば，Windowsの64bitです），ダウンロードします
4. 自分のPC上にダウンロードされた「VSCodeUserSetup-x64….exe」をダブルクリックすれば，インストールが始まります．
5. その後に現れる窓の選択は，ほとんど「次へ」でOKです．自分のPCのデスクトップにソフトのアイコンを作りたければ，途中で，「デスクトップ上にアイコンを作成」という選択肢が出るので，前のボックスにチェックをつけて下さい．
6. あとは，インストールして完了です．
7. インストール完了後，自動的にVSCodeが起動するので，以下のようにして日本語などの設定をして下さい．

1. VSCodeが起動していなければ，スタートメニューの中から VSCode のアイコンを探してクリックするか，デスクトップ上のショートカットアイコンをダブルクリッククリックします．
2. 最初に使用する時に，次のようにして日本語が使用できるようにします．
   1. viewを選択
   2. command palette を選択
   3. configure display languageを選択
   4. localeをenからjaに書き換える
   5. 画像参照
      1. 「拡張機能」：左側にある四角いアイコン（extension）をクリック
      2. 検索窓に「Japanese」と入力．
      3. 下に表示された「Japanese Language Pack for Visual Studio Code」をクリックし，右の窓に現れた説明から「インストール」をクリック
      
   6. すべてが終わったら再起動する（再起動するかどうかの窓がでるので，「Restart」）
3. HTMLを記述する時に役に立つ拡張機能もインストールしておきます．
   次の３つをextensionの中から検索してインストールします．
   • open in browser 2.0.0：作成したHTMLファイルを簡単な操作でブラウザに表示．
   • HTMLHint：HTMLファイルを作成中に簡単な文法チェックをしてくれる．
   • CSSTree validator：CSS（スタイルシート）の文法をチェックしてくれる．
4. ファイルを作る．「ファイル」メニューから「新規ファイル」を選択する．
5. 文字はキーボードから入力します．
6. 作成したファイルは，「保存」しなければ無くなってしまいます．保存の仕方は，
   1. 「ファイル」メニューから「保存」を選ぶ．
   2. 最初に保存する場合は，ウィンドウが現れます．「名前」にファイル名を入力し保存場所を決めて，「保存」ボタンをクリックします．
      一般に，ファイル名は何でも良いのですが，ホームページの場合は，半角英数字で一繋がりで，最後に「 .html 」をつけることにします．（つまり，filename.html のようにします．）

詳しい使い方は，メニューバーの「ヘルプ」を見ましょう．

日本のコンピューターは，キーボードの英数字（半角文字）を直接入力する場合と日本語（全角文字）を入力する場合の二通りの文字入力ができるようになっています．

• キーボードがどちらの状態に鳴っているかは，「通知領域」に表示されます．
• 「A」が出ている場合は，半角入力モードで，キーボードの英数字が直接入力されます．
• 「あ」が表示されている場合は，日本語を使用することができます．
• 日本語モードと半角（英語）モードの切り替えは，キーボード左上隅の「半角／全角キー」で切り替えられます．

1. 日本語入力モードで，ローマ字を入力すると画面にひらがなが出力されます（下線付き）．
2. この状態で，「スペース」キーを押すと漢字に変換されます．
3. 最初の漢字の候補が違っているときはもう一度「スペース」キーを押すと，候補の一覧が現れるので，正しい漢字を選びます（「enter」キーを押す）．この状態では，まだ下線がついています．
4. もう一度「enter」キーを押すと確定されます．（下線が消える）

stuサーバー上にある各自の登録「ホームディレクトリー」にある「public_html」というフォルダーにHTMLファイルを置くと，インターネットにホームページが公開されます.

ファイルをサーバーに送るには，「WinSCP」というプログラムを使用します．

インストール

使用法

設定

---

自分のホームページを見る

---

扉のページへ｜上へ｜前のページ｜次のページ