(追記:本記事は、游ゴシックをWindowsで綺麗に表示するためのベストプラクティスを示すことを目的にしたものではありません。ご了承ください) (追記:Macの代替ウェイトの表示は仕様に沿っているというご指摘を受けましたので、すこし表現を変えました) 先日投稿した「Windowsで游ゴシックが汚いのは、どう考えてもWebデザイナーが悪い?」には、思ったよりも大きな反響をいただき、ありがとうございました。 私の記事に対して検証をしてくださったりご指摘をいただいたりといったリアクションも多く、大変ありがたく思っています。 特に参考になったのは、下記の2つの記事です。 ありがとうございます。 Windows で游ゴシックが細字になってしまう件は誰が悪いのかについて CSS 仕様から考えてみる | WWW WATCHRe : Windowsで游ゴシックが汚いのは、どう考えてもWebデザイナーが悪い
特に見出しやアンカーテキストに使用されるアンダーラインですが、普段何気なく使っていますよね。でもアンダーラインを引く方法はいくつかあります。一体どの方法が一番いいのでしょうか?ここでいくつかの方法とその長所/短所を紹介していきたいと思います。 HTMLやCSSでアンダーラインを引く各方法の長所と短所 (1) text-decorationを使ったアンダーライン 「text-decoration」はアンダーラインを引く最も簡単な方法です。小さなフォントでもきちんと見えますが、フォントを大きくするにつれ見苦しくなります。 一方で、最大の問題点はカスタマイズ性を欠くことです。適用するテキストにはすべて同一の色とフォントサイズを指定し、スタイルを変更することができません。 【良い点】 利用しやすい ベースラインの下にアンダーラインを引ける iOS Safariではデフォルトでディセンダー(小文字の
こんにちは!最近、2年間お世話になったアンドロイドスマホを、最新版のアンドロイドスマホに機種変更したつむぎです。 電話がかからなかったり、画面がフリーズしたりで、かなりお仕事に影響が出ていたスマホくん。 で、思い切って最新型のAQUOSフォンをGET! 最新型のAQUOSフォンくん、この2年の進化にはすさまじいものが! 動作の滑らかさ、電話機能もストレスなし、おまけにバッテリーも長持ちといいことづくめで、ホントに変えてよかった!!!と実感している今日このごろ。 ただ1点だけ、困ったことが。。。 横幅サイズ固定の自分のサイトをスマホで見たら、ところどころ文字が大きくなって、残念なデザインに! 原因は、最近のスマホに搭載されているユーザーお助け機能。 CSS(スタイルシート:サイトのデザインを定義)の文字表示の設定は無視して、勝手に見やすい大きさに変わっていたのです。 つむぎのサイトは、手紙の
本文や見出しなどのフォントサイズをスマホ時やデスクトップ時で変える時、通常はMedia Queriesでスクリーンサイズごとに文字サイズを指定していると思います。 ここで紹介するフォントサイズの指定方法はちょっと新しいアプローチで、最初にベースとなるフォントサイズを設定し、スクリーンサイズが大きくなるにつれ、Viewport Unit(ビューポートの単位)で加算してサイズを大きくします。 Viewport Unit Based Typography 以下、各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。 Viewport Unit(ビューポートの単位)とは? フォントのサイズ指定のためのビューポートの使い方 他の文字の要素をビューポートで指定 縦のリズムとモジュラースケールをビューポートで指定 フォントサイズの指定の精度をアップする さらに精
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く