書評:Web Designing 2012年11月号

Web Designing (ウェブデザイニング) 2012年 11月号 [雑誌]

特集1:「CSS+α」マルチデバイス対応テクニック

CSS3による表現を中心にしたテクニックなのでIE対応を中心に考えないと行けないPC向けサイトで使用するのには適さない。-ms-transitionですらIE10以降でないと使用できないので。あくまでスマートフォン向け用のテクニック。LESSについても書かれているがLESSはJavaScriptが使用できないと無効化されてしまうので使いどころがあまりない。SassはLessの代わりになるがLessはSassの代わりにはならないので個人的には使用するべきではないと思う。

特集2:ローカルで生きるためのWeb仕事

地方で働くクリエイターの特集。今では地方でも高速回線が使用できるところがほとんどなのでネットの格差はだいぶ縮まったが地方だとどうしても人、セミナー、書籍などの物理的な情報に触れる機会がすくなくなってしまうので進んで地方で働こうという人はこの業界では少ない。

jQuery Lab._jQueryベストプラクティス

jQueryを書く上でのよりよい書き方を紹介。特に以下の5つは超重要。

CDNからjQueryが読み込めなかったときの別サーバーからの読み込み

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script><script type="text/javascript">// <![CDATA[
!window.jQuery && document.write('<script src="jquery-1.8.3.min.js"><\/script>');
// ]]></script>

 

DOM Ready後の実行

<script type="text/javascript">// <![CDATA[
$(function(){   alert("hoge"); });
// ]]></script>

 

DOM Readyの解析完了後の実行(body閉じタグ前に記述)

<script type="text/javascript">// <![CDATA[
(function($){   alert("hoge"); })(jQuery); //本書P123の03では下記のように記述されているが //これは間違った書き方です。 //(function($){ //  alert("hoge"); //})(jQuery);
// ]]></script>

 

コンテンツ読み込み後の実行

<script type="text/javascript">// <![CDATA[
$(window).on("load", function(){   alert("hoge"); });
// ]]></script>

 

jQueryのカプセル化

<script type="text/javascript">// <![CDATA[
(function($){   var hoge = 777; })(jQuery);
// ]]></script>

 

WD Webマスター足立裕司のリニューアル覚え書き

CSS3で最適化されたディテール表現と非対応ブラウザ対策について書かれている。ちなみにP17のRGBa未対応ブラウザのCSS3背景色の透過表現の記述は間違っている。正しくは以下の通り。

.alpha {
  background-color: rgba(0,0,0,.5);
  filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr=#50000000,endColorStr=#50000000);
}

 

最近はWeb Designingの誤記をよく見かける。コードなどは1文字違うだけでも動かなくなってしまうことがあるので出版前によくチェックしていただきたい。

Web Designing (ウェブデザイニング) 2012年 11月号 [雑誌]
Web Designing (ウェブデザイニング) 2012年 11月号 [雑誌]

カテゴリーbook