テーマ「sincere」をリリースしました。
- 2012年1月20日(金) 22:32 JST
-
- 投稿者:
- みるく
-
新テーマ「sincere」は、「WAIproCSS Ver2.5.1 for Geeklog1.8.1」をベースに２カラムのエラスティックレイアウトを採用してます。
そして、このテーマはCSS3を使用し「プログレッシブ エンハンスメント」を取り入れてます。
(プログレッシブ エンハンスメントの説明は、@kaz_wuiさんのサイト「Website Usability Info」のプログレッシブエンハンスメント（Progressive Enhancement）という考えかたで詳しく説明されています。)
ですので、CSS3に対応していないブラウザでは単調なデザイン(ヘッダ等の背景のグラデーションが単色になる等)になりますが、情報は正しく得られるよう作成しております。
テーマ「sincere」 Internet Explorer7のキャプチャ画像です。
また、サイトロゴのフォントは、Google Font APIを使って表示してます。
(Google Font APIについては、@yhassyさんのサイト「could」のGoogle Font API で手軽に始めるフォント遊びで詳しく説明されてます。)
テーマ「sincere」も「WAIproCSS」と同様、アクセシビリティに配慮して作成しています。
このサイトはGeeklog1.7.1ですが、テーマ「sincere」のデザインを見ていただく為に1.7.1仕様のテーマsincereをこのサイトに入れております。 テーマのお試しで「sincere」を選んでいただくとテーマをご覧頂く事ができるので、参考にしてください。
続きを読む (286 ワード)
- コメント (0件)
- トラックバック (0件)
アクセシビリティ配慮型テーマ WAIproCSS 2.5.1 for 1.8.1 を発表しました。
- 2011年12月29日(木) 14:22 JST
-
- 投稿者:
- みるく
-
アクセシビリティ配慮型テーマ WAIproCSS2.5.1を出しました。
2011年12月1日にリリースされたGeeklog 1.8.1-jp-extended-1.0日本語パッケージ拡張版に入っているWAIproCSSと同じものになります。
続きを読む (46 ワード)
- コメント (0件)
- トラックバック (0件)
フォーカス時のアウトラインの役割をご存知ですか？
- 2011年12月 6日(火) 14:00 JST
-
- 投稿者:
- みるく
-
アウトラインの役割
リンクなどにフォーカスした時、アウトライン(外郭線)が表示されるのですが、このアウトラインにはどんな役割があるかご存知ですか？
アウトラインの役割を知らずに「何？この点線！じゃま」とCSSでoutline: none;と設定しアウトラインを消されているかたがいらっしゃると思うのですが、アウトラインが表示されないとキーボードのみで操作しているかたが自分が今どの位置にいるのかわからなくなってしまうんです。
リンクフォーカス時アウトラインが表示されないサイト
リンクフォーカス時にアウトラインが表示されないサイトがありましたので(ボタンフォーカス時にはアウトラインが表示されます)、アウトラインが表示されない状態で目的のページに辿り着けるか、また辿り着くのにどれだけ時間がかかり大変か体験してみましょう。私達はこのサイトの商品を購入したいとします。無事、目的の商品詳細ページまで辿り着く事ができるでしょうか？
サイトは、プレミアムバンダイ｜こどもから大人まで楽しめるバンダイ公式ショッピングサイトです。このページ内にある商品名「ふわふわでかチョッパー 新世界だぞコノヤロー！」の詳細ページ(予約ボタンのあるページ)を表示するのが目的になります。チョッパーは、アニメワンピースに出てくるキャラクターです。では、みなさんも私と同じようにキーボード操作のみで目的のページまで辿り着けるか試してみましょう。(FirefoxTabキーで移動していきます)
続きを読む (80 ワード)
- コメント (0件)
- トラックバック (1件)
iPadは手が不自由なかたにもやさしいのか？
- 2011年10月11日(火) 12:00 JST
-
- 投稿者:
- みるく
-
手足が不自由なため車椅子で生活されているAさんにiPad2を実際に使ってもらい、使えない事等ないかを教えてもらいました。
また、手がまったく使えないかたがiPad2を使うにはどうすればいいかを考え検証してみました。
続きを読む (45 ワード)
- コメント (0件)
- トラックバック (0件)
Operaでのmark要素のバグ検証確認
- 2011年10月 3日(月) 13:00 JST
-
- 投稿者:
- みるく
-
Twitterで@tomo_eさんが
ここれは…ツライ… http://www.memo.marguerite.to/WWW/%E5%B9%B3%E6%88%9023%E5%B9%B4/7%E6%9C%8809%E6%97%A5-%E3%82%AA%E3%83%9A%E3%83%A911%E3%81%AE%3Cmark%3E%E8%A6%81%E7%B4%A0%E3%81%AE%E3%83%90%E3%82%B0.html
とつぶやかれているのを見て、リンク先の記事を読んだところ「<mark>要素にCSSでdisplay: inlineと設定すれば改行してしまう事を解消できるのでは？出きるのであれば<p>要素にdisplay: inlineを設定するよりスマートでは？」と思い、各種ブラウザで検証してみました。
<mark>要素は、HTML5で新たに追加された要素です。続きを読む (31 ワード)
- コメント (0件)
- トラックバック (0件)
記事カテゴリ
- その他 (6)
- おしらせ (9)
- Geeklogテーマ (52)
- Geeklog (10)
- アクセシビリティ (31)
ログイン
オンラインユーザ
Geeklogについて
Geeklogへようこそ!
Geeklogのサポートは、Geeklog Japaneseへ。ドキュメントは Geeklog Wikiドキュメントをどうぞ。