higeorangeのブックマーク - はてなブックマーク

Webサービスにおけるショートカットキーの原則 - Trans

Webサービスにおいてもデスクトップアプリケーションと変わらない使用用途のものが増えています。そこで使用頻度が上がるにつれてほしいなと思うのがショートカットキーです。ショートカットキーのユーザビリティよく使うソフトウェアにショートカットキーが実装されていると嬉しいものです。何度も繰り返す作業を簡単に行うことができるようになります。今までは使用頻度が高いソフトウェアはその多くがデスクトップアプリケーションでしたが、Gmailを始めとしてデスクトップアプリケーションと遜色ないWebサービスが多数現れるようになってきました。ただ、デスクトップアプリケーションと違い、Webサービスにおいてはそのショートカットキーの実装方法が共通化されているわけではありません。そこで、一度現状のWebサービスを比較し、ショートカットキーの原則を作ってみようというのがこのエントリーの趣旨です。そのために、当

higeorange 2008/12/23

リンク

TRANS - 英語圏から学ぶ、body要素に対するfont-size指定方法のまとめ

YUI Fonts CSSのfont-sizeで悩み始めてから、font-sizeってどういうのがいいのだろう、と考えていました。そこで、英語圏ではどういうふうに指定しているのが多いのだろうと、いろんな記事を読み漁ってみました。いろいろなやり方はあるにせよ、5つくらいのパターンに分けられるんじゃないかなと思うので、まとめておきます。 font-size: 100%; 主に、body要素に用いられるもの。font-sizeを100%で指定しておいて、font-sizeの指定はユーザの好き好みに合わせるというもの。ユーザビリティに配慮したり、ユーザスタイルシートを生かして読んでほしい場合はこの指定が多いようです。 font-size: 100.01%; 最近ちょくちょく見掛ける、body要素に対して100.01%を指定するというもの。これは、Re: WSG Setting Up Font Si

higeorange 2007/03/31

リンク

YUI Fonts CSSのline-height: 1.22em;の謎を解く！ - Trans

先日から、ずっと頭に引っ掛かっていたYUIのFonts CSSのbody * { line-height: 1.22em;}という指定。はてなの人力検索でも質問してみたのですが、結局分からずじまいで、仕方がなく、自分でマークアップしてテストしてみました。どうやら、id:b-windさんがおっしゃるように、この「*」全称セレクタがキーになるようです。まず、おさらい。そもそも、なぜこのline-heightに疑問を感じたのかは、このエントリー。Lucky bag::blog: line-height の値には単位なしが良いとされる理由。はてブの数からしても読んだ人多いんじゃないでしょうか。まず、このコードについて、こちらでもテスト用に作ってみました。Lucky bagさんとほとんど同じコードです。 YUI Fonts CSSのline-hight: 1.22em;は何なのか？その1。 li

higeorange 2007/03/16

リンク

Yahoo! UI Library: Fonts CSS を使うのなら、Opera には気を付けて！

Yahoo! UI Library: Fonts CSSを知ってから、CSSを書く際にfont-sizeは大体このライブラリを読み込ませてから使っています。ただし、Operaで表示する際には、気をつけたほうがよさそうな点があったので、メモしておきます。 Fonts CSSはどういう構造になっているのか詳細は分かりませんが、とりあえずクロスブラウザで同じフォントサイズを実現してくれる摩訶不思議なライブラリ。デフォルトのフォントサイズ、つまりfont-size: 100%;は13pxになっており、それからfont-sizeをパーセントで指定することによって、pxでフォントサイズを指定するような感覚で、フォントサイズを指定することができます。ただし、Operaにおいては、フォントサイズを100%以下、つまり12pxなどにするときはフォントがほかのブラウザより、小さく表示されるバグがあるようです

higeorange 2007/03/01

リンク

Podcastingなんて、もう古い?!Operaを使って、英語のヒアリングを勉強する。 - Trans

Operaユーザーには当たり前の機能かもしれませんが、OperaにはWebサイトを読み上げてくれる機能が備わっています。Podcastingと違い、どのページだって簡単に読み上げてくれる。これで、Podcastingがなくても、英語の勉強ができるかも?! 使い方まず、Operaのサイトに行って、Operaをダウンロードします。それからは通常の方法に従い、Operaを起動させてください。 Operaの上部のツールバーの「ツール」→「設定」→「詳細設定」→「ボイス」と進む。その中に「ボイスコントロールによるブラウジングを有効にする」というチェックボックスがあります。これにチェックを入れると、自動的に必要なボイスモジュールがインストールされます。これで、終わり。何やらマイクがあれば、Operaに音声を使って、命令させることもできるみたいですが、僕のPCにはそんなものは付いていない。僕として

higeorange 2007/01/25

opera

リンク

TRANS [hatena] - 印刷用CSSをまとめてみた。

以前、絵文禄のことのはさんのところで、サイトの横幅を640ピクセルにする理由――統計と現状に基づく結論というエントリーがあった。それから、ちょっと印刷用CSSに興味を持って、色々と調べてみたり、自分で書いてみたりした。そのまとめ。ちなみに、#naviがグローバルナビゲーション、#primaryがメインコンテンツ、#secondaryがサブメニュー、#footerがフッター。とりあえず、最低限やっておいたほうがよいこと。 body { font-size: 12pt; color: #000000; background-color: #FFFFFF; } a:link, a:visited { text-decoration: underline; color: #000000; } img { border: 0; } 印刷で読まれることを勘案するのなら、font-sizeはある程度