やさしいうぇぶ・html01

プロとして通用する技術を身につけるためのカルチャー教室です。
初心者は、お断りする場合もございますので、あらかじめご了承ねがいます。
より多くの方に、正しいWEBの知識を、持っていただき、 WEB以外の、パソコンに関する基本知識も、正しく理解していただく。
趣味の段階ではなく、プロとしても通用する技術を身に付けていただくことを、目的にしています。

更新情報
更新情報

HTML5の基本

HTMLとは、下記のようなテキストファイルです。
当然のことですが、メモ帳で製作することができます。ビルダーがないと作れないなどと、言っている人は、全くわかっていないと、思っていただければ、間違いありません！。
以下が、基本的なHTML5のテンプレートです。 Mobileにも対応できるようにJQueryMobileのFramework を読み込んでいます。

◆ テンプレートのDownload

ZIP RAR

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery Mobile Web アプリ</title>
<link href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" rel="stylesheet" type="text/css"/>
<script src="http://code.jquery.com/jquery-1.6.4.min.js" type="text/javascript"></script>
<script src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js" type="text/javascript"></script>
</head>

<body>
<div data-role="page" id="page">
  <div data-role="header">
   <h1>1 ページ</h1>
  </div>

  <div data-role="content">
   <ul data-role="listview">
    <li><a href="#page2">2 ページ</a></li>
    <li><a href="#page3">3 ページ</a></li>
    <li><a href="#page4">4 ページ</a></li>
   </ul>
  </div>

  <div data-role="footer">
   <h4>ページフッター</h4>
  </div>
</div>
</body>
</html>

ページ終了

◆ 基本テンプレート

HTML5になると、 HTML4.01のように、!DOCTYPEなどが、非常に簡素化されたことがわかると思います。

また、JQueryMobileのFrameWorkと、 CSS3でサポートされた、 MediaQueryを、読み込んでいますので、どのようなデバイスであろうとも、的確な、サイズで表示されていることに気づくと思います。

また、HTML4.01の時代から、同じですが、HTML内に、 Fontとか、Colorなどという、装飾要素がないことに気づくでしょう。
このような要素を、HTML内に書くことは、HTML4.01の時代に、推奨されていましたが、HTML5になると、より厳密に、定められるでしょう。(実際には、下方バージョンをサポートするため、問題は生じません！しかし、物事を習うには、正しく学ぶ姿勢が大切なように、 HTMLの記述を覚えるにも、同じことが言えます。)

文字の装飾（サイズ・色）・ボーダーの装飾（サイズ・色）・表示位置など、装飾にかかわる部分は、すべてCSSの中に書きましょう。 (当サイトとしては、外部CSSの記述を、強くお勧めします。)

当然のことですが、CSSもテキストファイルですから、メモ帳で、自由に編集できます。

HTMLの基本は、情報の共有から始まります。
閲覧者の環境がいかなるものであろうとも、その内容を、正しく伝えるという基本が理解できない、パソコンを使う価値がない人には、ITの、基本概念を、理解できないでしょう。

Design・デザインとは・・・

WEBがデザイン（ビジュアル）が、よくなくてはならない、と言うのであれば、その絵とか、画像だけで、正しく情報を伝えることができるのか？
それは、まるでジェスチャーで、物を伝えるのと同じことではないのか？・・・
当サイトは、デザインを、否定するわけではなく、デザインすることにより、より深い理解を促せないのであれば、それはデザインとは言えない！ということを、お伝えしたいだけです。

◆ 正しく記述しよう

当サイトは、文法にこだわっているわけではありません！
日本の英語教育のように、文法ばかりに、こだわっていては、意志が伝わらない・しゃべれない！・・・ (中・高・6年間も学習して、しゃべれない！これって何が原因？？？)
ようにならないよう、できるだけ、基本に沿った表現を行い、カタゴトでもいいから、閲覧者に、自分の意志・考えが伝わる表現をしよう！・・・ということです。