はてなブログ云云でアフィリエイトがしたい人のブログ

「はてなブログ」でアフィリエイト・ブログカスタマイズ・最適化・色々試行錯誤中!

【スポンサーリンク】

技術書読書メモ「HTML5&CSS3 レッスンブック」

HTML5&CSS3 レッスンブック

この本を読みながら気づいた点や覚えておきたい点などを記憶に定着させるため。ここでメモしてゆきたいと思います。

 

読み進めるのはこちらの本です。

2016-04-28 P14「ブラウザの準備」

ブラウザはたくさんあるように見えて実は内部でHTMLとCSSを組み立てるエンジンが動いており、そのエンジンの種類は4系統になる。

  1. Trident … インターネットエクスプローラーのエンジン
  2. WebKit … サファリ、iOS
  3. Blink(WebKitからの派生) … Chrome、アンドロイド(スマホ)、Opera
  4. Gecko … Firefox

Google ChromeでBlinkのバージョンを調べる方法は、Chromeのアドレスバーに「chrome://version/」と入力すれば表示される。

youtu.be

※(読者のひとりごと)理想を言えばひとつのエンジンに統一してほしい。

イントラネット環境ではIEが互換表示に…

P16によれば、イントラネット環境ではIEの表示が自動的に互換表示モードに切り替わる。互換表示モードはIE8相当の処理になってしまうので、「ツールメニュー>互換表示設定>イントラネットサイトを互換表示で表示する」のチェックを外す。

2016-04-28 P17「テキストエディタの準備」

書籍では、Windowsではメモ帳、Macではテキストエディットを使用。

私はAdobeの「Brackets」を利用しようと思います。

「Brackets」めっちゃいいです。コードの頭文字を数文字入れると正しい綴りで補完してくれます。「Beautify」というプラグインを入れればコード整形も一瞬です。嬉しい限り。

オープンソース | Adobe & HTML

youtu.be

(今日2016-04-28はここまで)

2016-04-30 P24「Brackets」にて「news01.html」を作成

youtu.be

Bracketsは、デフォルトで「UTF-8」のみに対応しているので、新規作成してそのまま「名前を付けて保存」すれば、自動的にUTF-8で保存。(UTF-8以外の、例えばShift-JISとかで保存するにはエスクテンションと呼ばれる追加機能を加える必要があるとのこと)

 2016-05-01 P32 「コンテンツを記述」

youtu.be

Bracketsで編集すれば、本書にある実際のWebページの確認作業を楽にこなせます。「ライブプレビュー」ボタンを押してGoogle Chromeを立ち上げ、コードを書いて保存すれば、隣に立ち上がったGoogle Chromeに結果が表示されてとてもわかり易い。

 2016-05-03 P41 UTF-8は小文字か大文字か?

metaタグの文字コード、「UTF-8」。「UTF-8」か「utf-8」か(大文字か小文字か)どちらだろう。

本書によれば、HTML5では、大文字でも小文字でもどちらでも良い。小文字で揃えるのが一般的。

ヤフートップページは「utf-8」で小文字。Googleトップページでは不明。(メタタグにcharset="utf-8"という記述がない)

ツイッタートップページは「utf-8」の小文字。でした。私も小文字にしようと思います。

ちなみになぜか本書では「UTF-8」で大文字です。