勉強部屋‎ > ‎

HTML5

2012年10月28日作成
HTML5 (Hypertext Markup Language)の勉強部屋です.
2012年度の3年生向け田中哲雄セミナー(情報工学セミナーⅠ,Ⅱ)の一部(演習問題とその解説)を公開します.

演習

サンプル

  • Another HTML Lint5
    • HTMLの構文チェックツール
    • http://www.htmllint.net/html-lint/htmllint.html にURLを入力して「チェック」ボタンを押すと,構文チェックしてくれます.
    • 入力はURLだけでなく,ファイルのアップロードやテキストの貼りつけにも対応しています.
  • JSLint The JavaScript Code Quality Tool
    • JavaScriptの構文チェックツール
    • テキストエリアにJavascriptのコードを貼りつけて「JSLint」ボタンを押すと,構文チェックしてくれます.    
    • ブラウザで表示するHTML向けのJavaScriptの場合は,Assume... browerの値を「true」にします.
    • Javascriptのライブラリ,フレームワークを利用する場合は,そのライブラリまたはフレームワークのグローバル変数を「predefine global variables here」に書けば,そのグローバル変数はエラー扱いになりません.
    • Instructionsのページには,「Warning: JSLint will hurt your feelings.」とあります.確かに最初は結構効きます.
  • DropBoxでの公開
    • サンプルコードは,DropBox(ローカルのフォルダーと自動で同期するオンラインストレージサービス)で公開しています.
      • DropBoxのpublicフォルダーにhtmlファイルを置いて,そのhtmlファイルを右クリック→「パブリックリンクのコピー」でURLを取得できます.
      • サーバサイドのプログラムが不要なものなら,簡単にコンテンツを公開できます.
      • 上記の方法で取得したURLのプロトコルスキームはhttpsになっていますが,httpでもDropBoxのPublicフォルダーのファイルにアクセスできます.
    • Google Chrome ではhttpsでコンテンツにアクセスする場合,そのコンテンツ内にhttpでアクセスするコンテンツが埋め込まれていると(スクリプト,スタイル,画像,iframeなど),それらのコンテンツはinsecure contentとみなされブロックされます.
      • https://support.google.com/chrome/bin/answer.py?hl=ja&answer=1342714
      • DropBoxでコンテンツを公開し,デフォルトで得られるURLを参照するとhttpsでアクセスすることになります.そのコンテンツ内でjQueryなどのスクリプトをhttpで読み込んでいたりすると,そのスクリプトがブロックされてしまい,利用できません.
      • このことから, このサイトからDropBoxのPublicフォルダへのアクセスでは,httpsではなくhttpを利用しています.
      • ちなみに,読み込むコンテンツがhttps,httpの両方でアクセスできれば,DropBoxのPublicフォルダへのアクセスをhttpsのままにして,外部のコンテンツへのリンクを相対URLで指定するようにしてもOK.
      • src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"
        → src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"

参考文献

  • cho45(さとう):HTML5/CSS3/Javascript実践入門, WEB+DB PRESS, Vol.62, pp.9-44(2011).
    • エッセンスがよくまとめられている.
  • 園田誠:基礎から学ぶHTML5入門口座, 日経ソフトウェア, 2011.6-2011.9(連載) (2011).
  • 山田祥寛:みてわかる!jQuery入門, 日経ソフトウェア, 2011.11, pp.54-60 (2011).
    • 簡にして要.
  • Douglas Crockford著, 水野貴明訳:JavaScript: The Good Parts, オライリー・ジャパン (2008).
    • 名著.読むべし.