jsdo.it に Web safe font tester を投稿してみた
jsdo.it と言う js, html, css を共有するサイトに、css で一般的に使用される win と mac の標準的なフォントの表示を確認するツール?のコードを投稿しました。
bold, italic の on/off や font-size, color, background-color などの一部のスタイル、そして表示テキストの変更が可能です。
html5 の input type="range" を使用しているので、Safari, Chrome など対応しているブラウザの方が使いやすいと思います。Opera は何か挙動がおかしかったです。
jsdo.it のノリとは違うかなーとは思いつつ、ページ制作時などに以前から欲しいと思っていたものでもあるし、1度は jsdo.it に投稿してみようという理由をモチベーションにちゃっちゃっと作ってみました。
ご意見・ご感想など頂ければ幸いです。
ちなみに使用しているフォントは以下のページを参考にしています。
- Common fonts to all versions of Windows & Mac equivalents (Browser safe fonts) - Web design tips & tricks
- 30 Gorgeous Web Safe Fonts To Use With CSS
おまけ
ついでに Google Font API の web font を利用するバージョンも作ってるんですが、現状 jsdo.it は Google AJAX Libraries API に対応してない模様。
もともと1つの html ファイルで済むものなのでどこか別の適当なところに置こうかと思ってます。