after 疑似要素で CSS ロールオーバー

以前、画像のCSSロールオーバーについてアクセシブルな方法はないかと考えてみたことがありました。あれから約2年、新しいサイトのHTML組んでたら、たまたま違う方法を見つけたので覚え書きしておきます。

ブラウザの対応は、おそらくafter疑似要素(contentプロパティ)に対応するブラウザなら表示されると思います。つまり、IE7以前はそもそもロールオーバーにならないってことです。まぁそこはこの際いいんです[1]

今回も画像はCSS Nite LP3の課題のものを利用させていただいています。

“after 疑似要素で CSS ロールオーバー” の続きを読む

  1. JavaScriptでなんとかするとかすれば [back]

WCAN 2009 AUTUMN レポート

画像 : WCAN 2009 AUTUMN

10月10日にWCAN 2009 Autumnがありました。今回はiPhoneやHTML5、ブランディングなどの様々なお話を聴くことができました。
会場はいつもの名古屋国際会議場で。同日に他のセミナーもあったらしく、参加人数はいつもよりは少ない感じの120名程度でした。

“WCAN 2009 AUTUMN レポート” の続きを読む

HTML5 で試しに Web ページを組んでみた (改訂版)

このエントリは、「HTML5 で試しに Web ページを組んでみた」の記事の続きです。

先日のGoogle I/Oで大きく取り上げられたように、最近HTML5のニュースが増えていて注目度が上がっているようです。canvas要素やvideo要素、オフラインキャッシュのような、アプリケーション開発におけるHTML5が主に注目されているようですが、Safari 4のウェルカムページがHTML5で描かれていたり、国内でもlivedoorのラボが積極的に採用したりと事例も増えていますね。

そこで、約半年前に作ってみたサンプルのコードを見直して修正してみました。参考にしたのは以下のページです。

“HTML5 で試しに Web ページを組んでみた (改訂版)” の続きを読む

CSS3 で新しいボックスレイアウト

先日、WCAN mini Markup Vol.10がありました。第10回を数える今回は「CSS3+jQueryを実際に使ってみよう!」というテーマで、WCAN x CSS Nite 2009 SPRINGでの益子さんのセッションを実践し紹介し合おうというものです。

僕が紹介したのは、CSS3のレイアウトに関する新しいプロパティ[1]。新しいプロパティを使うとこれからすごくレイアウト組が楽になるよね!ってことがいいたかったので、説明は他所に任せてサンプルを見ていただいくことでイメージしてもらう形にしています。

なお、今回のサンプルは一部のブラウザのみしか動作しません。オススメはSafariかGoogle Chromeです[2]

“CSS3 で新しいボックスレイアウト” の続きを読む

  1. jQueryの紹介は他の方にお任せってことで;-P [back]
  2. Chromeは一応ベータ版ですがMac版もありますよ。 [back]

WCAN x CSS Nite 2009 SPRING レポート

画像 : WCAN 2009 SPRING

先週末にWCAN x CSS Nite 2009 SPRINGがありました。今回はCSS Niteとの共催セミナーということでセッション数も多めです。テクニックから仕事効率化、ブランディングまで幅広いレイヤーのお話を聴くことができました。

毎度のごとく名古屋国際会議場で。今回も過去最多の200名超の参加があったらしいです。前回が160名程度といことでしたので、どんどん大規模になっていってますね。

“WCAN x CSS Nite 2009 SPRING レポート” の続きを読む