1限目
学科 HTML/CSS基礎②
ファイル管理について
2限目
学科 HTML/CSS基礎②
Webページ制作実践
3限目
学科 HTML/CSS基礎②
Webページ制作実践
4限目
学科 HTML/CSS基礎②
Webページ制作実践
5限目
学科 HTML/CSS基礎②
本日の講義のまとめ
ファイル管理
名前の徹底

日付_fail形式
名前は基本半角英数字
半角と全角のスペースはエラーに繋がるので入力は必ず半角で行う。
設定は以下
↓


半角に印が入る。
今回は全角表示にする

保存
上の段→8N
下の段→何もせず
保存

デスクトップの新しく作ったファイルに保存
fここまで書いたらデスクトップのフォルダに保存


htmlのファイルとなり青字になる。


右クリック→プログラムから開く


タブで3-8行までTABキーで動かす
(タブを揃える)


マック・ウィンドウズ共通でUTF-8で保存
テラパッドはUTF-8Nで保存する



4行目に
<meta name=”description” content=”説明文”>
5行j目に




セーブしてないと*つく

なぜTabキーを打つか?→開始タグと閉じタグで囲われているところは入れ子構造になっているから。親と子、孫で区別するため。
→インデントをそろえる、と言う。
タイトル→

本文


BODYの中を作っていく




■順序のないリスト



インデントを揃えて

■順序のあるリスト



ul →unorder line
ol → oder line

↑これは先生のMACのファイル(見本)



DIV→WPでいうブロック
P→段落
DIVタグの補足→Pタグ
H1タグ→1つのサイトで1つのみ
H2タグ→1つのサイトで複数ある場合もある


意味→H1タグで属性はクラス、属性値は””
★親子関係
①HTML(親)
②headとbodyタグはHTMLから見て同じ階層=(子)(兄弟という)
③metaタグ・ULはHTMLから見て孫タグ
HTML=検索エンジン=パトロールしているbotのため
なので適切に使われたタグやルールを正しく記載しないとGoogle上で順が下がる。順位に直接関わる。
CSS=見た目(カラーや装飾、レイアウト)=見やすい方が人が訪れるが検索順位にはHTMLほど重要ではない。(見た目は相対的に感覚の違いがあるため)
HTMLの構成は歴史的に論文の構造を模倣している。
見出し、補足のパラグラフ、リストなどの構造も同じ。
→書籍や新聞やウィキペディアの構造も同じ
リセットCSS
その論文から引き継いだ構造をいったん崩してカスタマイズするための作業がリセットCSSという。
→27にも授業で扱っているのでそちらも参照★