デフォルトのブラウザをクロームにする
(エッジの人はクロームにしましょう)
左下のWindowsアイコン
→左の歯車アイコン
→windowsの設定
→アプリ
→既定のアプリ
→下のほうの「Webブラウザ」
→Google Chromeに設定
エクスプローラー、second.htmlの上で右クリック
→プログラムから開く
→サクラエディタを選択
既定のブラウザ以外で開くときも同様
エクスプローラー、second.htmlの上で右クリック
→プログラムから開く
→Microsoft Edgeを選択
UTF-8(ユーティーエフはち、ユーティーエフエイト)
<meta charset="UTF-8">
文字コードをUTF-8にしてねという記述
(マルチバイト文字も使うという宣言)
これを設定しないと
シングルバイトしか正確に表示されず、
文字化けする。
ざっくりいうと、半角英数字記号がシングルバイト。
それ以外がマルチバイト文字
(半角カタカナもマルチバイトになるとか)
<html lang="ja">
ラング イコール ジェイエーと読む
日本語ですよという記述
このサイトはどの言語かというのを説明
「このサイトを翻訳しますか」と出てきたりするのは、
このラングが英語(EN)だったりしたとき
さっきグーグルクロームでは文字化けしないのに
エッジでバグって表示された人がいたのはなぜか
→
クロームが気を聞かせて「これはUTF-8を入れ忘れたんだな」と考えた
エッジはそういうことをしなかった
<h1>見出しです</h1>
一番目の見出しですよというマークアップ
じゃこの終了タグだけを</h2>にしたらどうなるか?
→
これを確かめる手順:
1.サクラエディタで書き換える
2.ファイルを保存
3.ブラウザを「更新」すれば反映
(サクラエディタがブラウザを立ち上げるというアイコンはないらしい)
→実際書き換えてもエラーはでない
→なぜか
ちょっとした間違いであれば
ブラウザが勝手に解釈して表示してくれる
(chrome「間違っていてほんとは</h1>のつもりだろう」)
だから逆にエラーがでないので、
どこが間違っているか自分で突き止めないといけなくなるという、
ちょっとありがた迷惑の側面もあり
自分でもHTMLを変えてみて、どう挙動が変わるのかやってみると良い
<!DOCTYPE html>
ここから書いていくものは全部HTMLですよという宣言
ここ以下、タグが使えるようになる
グーグルクロームとエッジでみると字が違ってみえる。
ブラウザのデフォルトで決まっているフォントが違うから。
クローム:ゴシック体で表示
エッジ:明朝体で表示
CSSのほうで「どのブラウザにしてもゴシックにしてね」ということができる
これ(フォント)は『見た目』の領域なので、CSSで設定する
インデント
ソースコードを見やすくするために字下げすること
ブラウザからしたらこれがあろうがなかろうが関係ない
表示は一緒になる
タブキーでインデントするひとと、
半角スペースキーでインデントする人がいる
適当な場所で字下げをできて
見やすくできるのもプログラミングの勉強の一部
<!DOCTYPE html>
html5の書き方。別のバージョンのHTMLならここの文章がまた変わる
これはいわゆる「タグ」ではなく、
ここから先HTMLですよという宣言なので、閉じタグというのはない
<meta charset="UTF-8">にも終了タグはない
範囲を指定する必要がないタグはこういうことがある