開講式の海馬

海馬の確認

  • 「聞く→見る→書く」これを繰り返します
  • このとき「感情のスイッチ」を入れないこと（いやだなぁ〜と思いながらやっていると、ほんとうに嫌になります。）
  • 学生が英単語を覚えるように、そらで出てくるまで繰り返しましょう。
  • SEOはどうでもよいのですが、上位表示することの意味とソースコードの関係性は毎日解説します
  • 初心者だからできないではなく、「やってみること」
パソコンでやるべきこと
  • 能力の覚醒と整理
  • 授業のデータを保存する「フォルダー」を作成
  • テキストエディターを準備する
  • Gmailアドレスを取得する
記述する

この段階では、複雑な意味やルールは存在しません。

  • 生まれたの赤ちゃんは、世界が何であるのか知らないし、知るすべもありません。
  1. テキストエディターを起動する
  2. 新規ファイルを作成する
  3. 所定の場所に保存する
  4. 記述を始める


読みながら入力してみる

  • 「アングルブラケット（lesser than）」→「エイチティエムエル（html）」→「アングルブラケット（greater than）」
<html>

</html>


このとき、

  • 保存する拡張子：「.html」
  • 所定の場所：Cドライブ直下に管理フォルダーを作成して保存する
  • 保存する名前：基本的に自由。日付名のフォルダー管理をするとわかりやすい

箱の中の必要な２つの要素を記述する

  • 〜 は、そのルールで記述するための「箱」
  • 〜 ブラウザに内容のルールを伝える（ブラウザでは不可視）
  • 〜 閲覧者に内容の意味を伝える（ブラウザでは可視）
<html>
<head>

</head>

</html>


次に

<html>
<head>

</head>
<body>

</body>
</html>



ここまではHTMLの「箱」を作る記述のため、表示する内容はありません。
このあと必要な要素を記述していくことになります。


HTML5で記述

  • 経験者は、HTML5で記述
  • この内容には「section」は入れる必然はありませんが、ひとかたまりのグループという意味で囲みました
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>【HTML5_A01】</title>
</head>
<body>
<section>
<h1>日記</h1>
<time datetime="2012-11-16" pubdate="pubdate">2012年11月16日</time>
<p>今日は、連休に行きたい旅行先をピックアップした。</p>
<ul>
<li>別府温泉</li>
<li>大分県別府市</li>
</ul>
</section>
</body>
</html>