タグ

ブックマーク / weblibrary.s224.xrea.com (4)

  • styleswitcher.js-スタイルシート切り替えjavascript - WEBデザイン BLOG

    アクセシビリティを考慮したWEBページを作成するときに役立つのがA List Apart: Articles: Alternative Style: Working With Alternate Style Sheetsが紹介しているstyleswitcher.js。 アクセシビリティガイドラインにも「ガイドライン2. 色だけに依存しない」という項目があり、 2.1 色によって表現されている全ての情報は、その色を再現できない環境でも得られるようにしておく(たとえば、前後関係やタグ付けなどによって)。 [優先度1] (チェックポイント2.1) 2.2 前景色と背景色の組み合わせは、色の識別が困難な人やモノクロ画面を使用している人などに対しても十分なコントラストを与えるようなものにする。 [対画像:優先度2 、対テキスト:優先度3] (チェックポイント2.2)(引用:ウェブコンテンツ・アクセシ

    sig
    sig 2009/01/23
    CSS切り替えのJavascript
  • Highslide JS-サムネール画像を拡大表示するスマートなjavascript - WEBデザイン BLOG

    サムネールをクリックすると同一ウィンドウ上に画像を表示するというjavascriptでLightbox JS・Lightbox が有名かと思います。以前からあまりスマートではないと思っていたら、スマートにしたタイプのHighslide JSが公開されていましたので紹介します。 Highslide JS-サムネールをクリックすると同一ウィンドウ上に画像を表示します。サムネイル画像をワンクリックで拡大画像表示、そして拡大画像をワンクリックでサムネイル画像に戻します。とってもスマートです。Lightbox JSよりも若干ストレスなく画像表示できます。 Highslide JS - JavaScript thumbnail viewer http://vikjavev.no/highslide/ IE 4.0・Netscape 4.79には対応していませんが、その他の最新ブラウザには対応しています

  • CSSデザインコンテストに参加してみて感じ思ったこと-WEBデザイン BLOG

    GWに画像の使用を極力控えてかっこいいCSSデザインをやってみように参加してみました。 今回のエントリーはこちらシンプルなさゆりふりかけスタイル マークアップの制限があって難しかったですね。特に"大会の参加要項"のブロックで"部門別のルール"の枠組みでのコンテンツとマークアップの絡みが面倒に感じました。内容的には同じ位置づけに感じましたが、マークアップは <h6>画像使用の制限</h6>と<p>画像は一切使用してはいけません。</p>となっている部分で、マージンが取れなかったとい点ぐらいです。 驚いたのは、自分が参加した際にはなかったエントリーでほとんど同じような成形をされていた方がいたのが驚きました。Tripletほとんど似ています。びっくりです。自分も今回の参加の狙いは、他の方のウィークポイントで差をつけようと思ったのですが、この方も同じような点に気をつけられていたのでびっくりしました

    sig
    sig 2007/05/09
  • WEBデザイン BLOG: 配色で分類表示できるCSSギャラリーサイトまとめ

    WEBデザインでベースカラーを基にさまざまなWEBデザインパターンを参考にしておきたいものです。今回は、数あるCSSギャラリーサイトの中でカラーでWEBサイトを分類表示できるサイトを選んでまとめてみました。 以下のサイトの中を使えば、配色の参考になると思います。 今回は、mixi-Webデザインコレクションコミュニティーの中で「ベビーピンクな配色のwebサイトを探してます」というトピックがたてられた。 私は以下のような書き込みをしておいた。 こんなこともあり、改めて数あるCSSギャラリーサイトの中やベースカラーを基にWEBデザインパターンを探すことができるサイトをまとめることにしました。もしものときに素早く対応できるように。 配色で選べるCSSギャラリーサイトまとめ Netcocktail http://www.netcocktail.com/ Netcocktail | WEBサイトデザ

  • 1