「効率的なサイト制作のためのDreamweaver活用術seminar」フォローアップ

この記事は鷹野雅弘によって執筆されました。
公開日:2011年12月12日、更新日:2011年12月31日

2011年12月11日に開催された「効率的なサイト制作のためのDreamweaver活用術seminar」のフォローアップです。

HTML5やCSS3などのスキルの獲得には下記のセミナーをオススメします。

ご質問の件

条件コメントを使ったInternet Explorer用の振り分けなど、最近のよく使われているものについて教えて欲しい。

Internet Explorer用の条件分岐

次のように記述することで、Internet Explorer用に条件分岐を行います。

<!--[if lt IE 7]><html class="ie ie6" lang="ja"><![endif]-->
<!--[if IE 7]><html class="ie ie7" lang="ja"><![endif]-->
<!--[if IE 8]><html class="ie ie8" lang="ja"><![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--><html lang="ja"><!--<![endif]-->

対応するブラウザとセレクタの関係は次の通り。

対象ブラウザ条件コメントの結果CSSセレクタ
Internet Explorer共通-.ie(またはhtml.ie)
Internet Explorer 6のみ<html class="ie ie6" lang="ja">.ie6(またはhtml.ie6)
Internet Explorer 7のみ<html class="ie ie7" lang="ja">.ie7(またはhtml.ie7)
Internet Explorer 8のみ<html class="ie ie8" lang="ja">.ie8(またはhtml.ie8)
IE9以上とInternet Explorer以外<html lang="ja">なし

HTML5対応

Internet Explorer 9より下位バージョン(IE8/IE7/IE6)でHTML5の新要素を扱うために、次のように記述します。

<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<script type="

Internet Explorerで「:first-child」「:last-child」などの属性セレクタを使う

そのため、『効率的なサイト制作のためのDreamweaverの教科書』(CS5.5対応版)のサンプルサイトでは、「ie.js」というJavaScriptを読み込んでいます(PDF)。

HTML5 Boilderplate

HTML5を扱うにあたり、必要最小限のテンプレートセットHTML5 Boilerplateが注目されています。使う使わないはともかく、解説などを一読されることをオススメします。

その他

こちらのエントリー(【HTML】最近のPCサイトに見るテンプレ要素まとめ | istis)も参考にしてください。

『効率的なサイト制作のためのDreamweaverの教科書』(CS5.5対応版)

前書の改訂版ですが、レスポンシブWebデザインに対応した作例のチュートリアルに全面的に差し替えています。

Zen CodingやレスポンシブWebデザインを使ったサイト制作の流れのチュートリアルがあります。

リンク集

スライドでの(ほぼ)出現順です。

補足

ご質問等ありましたら、takano@swwwitch.comまでご連絡ください。

『10倍ラクするIllustrator仕事術』

『10倍ラクするIllustrator仕事術〜ベテランほど知らずに損してる効率化の新常識』が2011年12月に発売されました。基本的にはプリントメディア向けですが、Web制作のパーツ作り等でも役立つポイントが満載ですので、ぜひご一読ください。

追記(12月31日):

動画が公開されました。

前半

後半

Twitter

本サイトの記事以外に、小ネタなどをツイートしています。また、マンスリーでまとめています。

『10倍ラクするIllustrator仕事術』改訂版

『10倍ラクするIllustrator仕事術』(増強改訂版)は、2011年発売の『10倍ラクするIllustrator仕事術』の改訂版。

2014年に技術評論社から発売、現在6刷。2011年版と合わせて38,000部のロングセラーとなっています。

詳しくはサポートサイトにて。

画像:『10倍ラクするIllustrator仕事術』改訂版

Illustrator CC 2018(2017年10月リリース)への対応版準備中です。全ページ書き換えていますので、2017年版を待たずに、2014年版を(も)ご購入ください。

お知らせメールへの登録はこちら

セミナー開催情報

セミナー開催情報をこちらにまとめています。

DTP Transitと無関係のものも掲載しています。お問い合わせは、それぞれのイベントの主催者までお願いします。

5つの「く」

画像:『10倍ラクするIllustrator仕事術』改訂版

DTP Transitのコアとなっている制作へ考え方「ムラなく、モレなく、直しに強く、手数を少なく、美しく」を5つの「く」としてまとめてみました。

オススメ外部リンク

Adobe Creative Stationで「知ってるようで、知らずに損してるAcrobatとPDFのアレコレ」と題して連載しています。

Adobe Creative Stationで「ベテランほど知らずに損してるIllustratorの新常識」と題して連載しました。

Adobe Creative Stationで「ベテランほど知らずに損してるPhotoshopの新常識」と題して連載しました。

オススメのスライド

お問い合わせ

リンク

このページの上部に戻る