Web技術

HTML5のフォームの例

HTML5のフォームのサンプルがいくつか紹介されています。
今まで以上に、URLや色、値の選択をリッチなUIで選択できるようになるようです。
http://codezine.jp/article/detail/5652

ブラウザ機能の確認

Modernizrを使ってブラウザーの機能を調べるには
http://www.buildinsider.net/web/modernizr/01

CSS３の対応度合
http://caniuse.com/#search=css3

CSS関連

floatを解除する手法

floatの回り込み制御の解除について
http://kojika17.com/2013/06/clearfix-2013.html

CSSの読み込み速度を向上させる

CSSの読み込み速度向上策として、下記の3点が挙げられます。

1. CSSをインライン化する
2. セレクタを見直す
3. HTTPリクエスト数を減らす

詳しく説明したサイトがありますので、ご紹介します。
http://www.aiship.jp/knowhow/archives/20531

個人的には「セレクタを見直す」という点を初めて知りました。
CSSのセレクタは、子孫セレクタ（記述右側のセレクタ）のほうから検索されるとのこと。私はてっきり親セレクタ（記述左側のセレクタ）から探しているものだと思っていました。
速度向上のためにも、今後意識していきたいところです。

CSSテキストシャドウのサンプル紹介サイト

http://kachibito.net/web-design/css3-text-shadow-sample.html
http://html5-css3.jp/useful/text-shadow.html
http://worpre-lab.com/design/text-shadow/
http://www.nxworld.net/tips/text-shadow-styling.html

IE 開発者ツール

JavaScriptのデバッグでブレークポイントがかからない場合

記述しているJavaScriptが構文エラーを起こしているときは、ブレークポイントがかからない（黄色の三角アイコンが出てその位置で停止できなくなる）
JavaScriptの構文エラーを直せば、ブレークポイントに処理をひっけることができるようになる。

画像のロスレス圧縮

参考サイト：http://www.aiship.jp/knowhow/archives/14615

画面サイズを確認できるサイト

レスポンシブウェブデザインで、パソコンやスマホ端末それぞれで、ブラウザ画面のHeightとWidthを把握したいときに、便利なサイトを見つけました。
http://www.shurey.com/js/samples/1_tips10.html

このページで、各端末での画面サイズを数値で把握することができます。
JavaScriptでのプロパティで、どのような値をとれるのかもまとめられていて便利です。