拡張子とは？
ファイルには様々な種類があります。その種類を区分しているのものと捉えてください。
ファイルの種類は写真や音楽や書類のカテゴリがありさらに写真は jpg、png。音楽にはmp3、wav。書類にはtextやdoc等に枝分かれします。
そのようにファイルと用途が紐付いてる事もあり、ファイルをクリックすると対応したアプリケーションで開くことができるようになっています。
この動画で解説するホームページを作成するHTMLは拡張子もhtmlになります
HTMLの詳しい解説は別の資料で行うので、割愛させていだだきます。
拡張子は慣習で多くは小文字で表記します。
またコンピュータの世界では漢字やひらがな、カタカナなど通常の日本語の文字を表現する全角文字列とアルファベット等を表現する半角があります。
ファイル名はどちらでも問題ありませんが拡張子は半角のアルファベットで書くようにして下さい。
また、プログラミングにおいては基本的に半角アルファベットでフォルダ名、ファイル名を使うのが慣習になっております。
ホームページ内の文字列の表現等を除いて全角文字列はエラーの原因になるので注意してください。
テキスト エディタとは
文字列を編集するアプリケーションです。Windowsでは「メモ帳」Macintoshではテキストエディットになります。
IDEとは
ソースコードを記述したり、そこからプログラムを起動させたりする機能が含まれたプログラミングの専用のエディタです。
正式名称はIntegrated Development Environmentで日本語では統合開発環境になります。
IDEを利用する場合はWinでもMacでも無料で利用できるMicrosoftが開発したVisual Studio Codeを推薦してますが、別途解説を用意予定です。
ショートカットとは
文字列のコピーや貼り付け、上書き保存等の定番の作業をマウスのクリック処理では無く、キーボードの特定のキーの組み合わせで実現させる仕組みです。
代表的ショートカット
Winの場合はコントロール、Macの場合はコマンドをキーボードの左下のキーと組み合わせた下記です
- コントロール(コマンド) + c
- コピー
- コントロール(コマンド) + v
- 貼り付け
- コントロール(コマンド) + x
- 切り取り
- コントロール(コマンド) + z
- やり直し
- コントロール(コマンド) + s
- 保存
覚えるコツはキーボードの左下に主に使う「cvxz」が横並びになってる事を意識する事です
コピーは「copy」の頭文字のc
その右隣のvで貼り付け
切り取りはハサミのx
やり直しはアルファベット最後のz
と覚えましょう
今回動作確認に使うソース
ファイル名：index.html
「index」は見出しという意味ですが、プログラムでは頻出する用語です。
この場合はトップページという意味合いで使われます。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTMLチャレンジ</title>
</head>
<body>
初めてHTMLでホームページ作ったよ
<h1>初めてHTMLでホームページ作ったよ</h1>
<h2>段落分けで文書構造を表現してくよ</h2>
<h3>リストを作るよ</h3>
<h4>画像も表示するよ</h4>
<h5>HTMLらしく、ハイパーリンクも設定するよ</h5>
</body>
</html>
作業中