国内でトラフィックランキング1-20位周辺のサイトの、body要素に対するfont-family指定方法を調べた。 /* yahoo.co.jp */ body { font-family: "MS PGothic", "Osaka", Arial, sans-serif } /* google.co.jp */ /* google.com */ /* youtube.com */ body { font-family: arial, sans-serif } /* fc2.com */ body { font-family: Verdana, Helvetica, "ＭＳ Ｐゴシック", "MS P Gothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif, /* Meiryo */; } /* facebook.c
2011年の後半あたりから文字や文字組に興味を持ち始めました。元々、大学時代に文字についての勉強をちゃんとできていなかったことが、ある種のコンプレックスのように感じていました（今もそうです）。そのうえで「デザイナー」という肩書きを持っていることを嫌って、名刺にデザイナーではなく「制作」とわざわざ入れたこともありました。 そんなこんなで過ごしながら今年読んだ本が「文字をつくる―9人の書体デザイナー」と「文字講座」という本でした。どちらの本にも文字がどんなふうにできたのか、どんな想いでできたのかといったことが書かれていて、非常に面白かったです。それから書体や文字組に関する本を読んだりして少しずつですが勉強している毎日です。 最近では電子書籍が少しずつ読めるようになって来ました。私もiPhoneで読んだり、iPadで読んでみたりしています。私もWebに関する仕事をしているので、最近ではWebの文
ノーブルリージュ! - TAMAMI（MF文庫J） ロゴタイプ : 麗雅宋（ダイナコムウェア） 作者名 : A1明朝（モリサワ） ニーナとうさぎと魔法の戦車 - 兎月 竜之介（集英社スーパーダッシュ文庫） ロゴタイプ : ゴシックMB101（モリサワ） タイトル欧文 : Bodoni（Giambattista Bodoni） イラストレーター名 : Helvetica（Max Miedinger / Eduard Hoffmann）
35はアラフォーらしいのでアラフォーです。10年前にはまったく苦ではなかった11px程のサイズはもうアレですね。そんなこんなで「もう16px以下はダメじゃないの？」というSmashing Magazineの記事は興味深く読ませてもらいました。12pxにtext-shadowプロパティとか殺す気か！ みたいな。 印刷物との比較あたりでは横に並べて比較して「同じ！」とか言ってますけど、ディスプレイと印刷物では目からの距離が大きく違うと思うのでさすがに暴論気味な気がします。また「サイトの製作依頼者の金を無駄遣いしてるよ！」みたいなお金の話からスタートする所がもにょもにょ。 こういったアクセシビリティ的な観点に加えて、世の潮流としてタッチデバイス向けに様々なパーツが巨大化していることもありますし、今後は16px前後が主流になっていくことは間違いなさそうです。日本語においてはline-heightに
ルイヴィトンやゴディバと言ったブランドのロゴは、何故高級そうに見えるのでしょう。高級なブランドだという認識があるからでしょうか。 ルイヴィトンのロゴは、フツラという何処にでも見かけるフォントを使っているのだそうです。でも、普通に組んだだけだと「なんか変」実は「ある工夫」をする事によって高級感というか「王道感」を出しているのだそう。 『フォントのふしぎ ブランドのロゴはなぜ高そうに見えるのか？』は、”ヒラギノ明朝やAXISフォントの欧文を設計した。日本における欧文書体設計の第一人者（wikipediaより）”である小林章氏が、フォントにまつわる様々な薀蓄をフォントの事を知らない人にも楽しく読んで貰えるよう心をくだいた一冊といえます。毎日のように目にしながら、あまり知らないフォントに関する様々な薀蓄を楽しく読める一冊が『フォントのふしぎ ブランドのロゴはなぜ高そうに見えるのか？』です。 まえが
Get a Periodic Table of Typefaces for yourself! Options, options, options... We've got nice prints for sale down below as well as other options you may be interested it. Please scroll on down to see all the awesome options you've got. Plus, have a look at the cool stuff other people are doing with the design! Finally, there have been many questions and comments about the creation of the design and
Discover legacy content from linotype.com, preserved for your reference. All about Akko The new Akko and Akko Rounded from Akira Kobayashi – Industrial, friendly, fancy Akira Kobayashi has been working as Type Director at Linotype since 2001 and, in the meantime, has reworked and enhanced many major typeface families. He has collaborated with Adrian Frutiger on Avenir® Next and with Hermann Zapf o
Webフォント(@font-face)や均等割付(text-align: justify;)、日本語と英語の間のスペース調節(text-autospace)などCSS3では文字や文章に関わる表現力も大きく向上している。とはいうもののないものはないので、親要素の幅にちょうど収まるようにフォントを拡大、つまりimg要素にwidth: 100%;を指定した時のようにはCSSではできない(少なくとも思いつかなかった)。というわけでふんだんにjQueryを利用したJavaScriptでどうにかしてみた。 Demo: Resize Font Based on Content Width #6 フォントレンダリングの関係上、Firefoxの方が綺麗なのでスクリーンショットはFirefoxで撮影した。 $(window).load(function () { var start = $.now(); $(
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
2010年は電子書籍元年と言われる中、以前と比べて文字と画面表示の関係について色んな所で議論されるようになった。iPhoneやiPadと次々に新しいデバイスが発売され、画面上で奇麗に表示されるフォントの存在は欠かせない。折りしも、お馴染みのヒラギノにUDフォントシリーズが追加されたのも今年の出来事である。そのヒラギノUDについて今回運良く、大日本スクリーンの三橋洋一氏、字游工房の鳥海修氏、ヨコカクの岡澤慶秀氏、SHOTYPEの岡野邦彦氏に直接お話を聞かせて頂くことが出来た。 どのような経緯でヒラギノUD開発に至ったのですか？ 三橋氏 (以下敬称略): ヒラギノの新書体の企画を練っていた2007年の後半頃、UD (Universal Desgin) を冠した他社のフォントが世の中で徐々に使われ始めていました。でも、そもそも基本書体と呼ばれるカテゴリーの書体は、読みやすいように考えて作られてい
学参書体が使われた、とある新聞広告に端を発した議論。 そもそも学参書体ってなに？ 教科書体とはどう違うの？ 学参や教科書以外に学参書体を使うとなぜいけないの？ じゃあ教育現場では、どんな書体が使われていけばいいんだろう。 どんどん広がる書体談義をまとめました。 続きを読む
2010-05-17 更新: Opera 10.5 ではイタリックとボールドともに有効ですが、ボールドの太り方がやや弱いようです。 2009-12-21 更新: Firefox でイタリックまたはボールドを指定すると Menlo でレンダリングされない問題は修正されています。Opera ではイタリックとボールドは無効ですが、Menlo のレギュラーでレンダリングされるようになっています。 Mac の Snow Leopard には新しい等幅 (固定幅) フォント Menlo がインストールされている。なかなか美しいのでさっそく CSS で使ってみようと思ったんだけど、どうも挙動がおかしいので検証してみた。 まずはじめに以下の CSS を試してみる: code { font-family: "Menlo", "Courier", monospace; } そのレンダリング結果はこのとおり:
前回の記事 では CSS で Mac 向けに等幅フォントを指定する際の注意点を取り上げ、Menlo と Monaco はあまりおすすめできない、Courier が無難、と結論づけた。しかしそこでは Courier とその改訂版である Courier New について検証していなかったし、それに Windows 環境をまるで考慮していなかった。そこで今回は前回の補足として、CSS で等幅フォントを指定するベターな方法をさらにしつこく探ってみたい。 ではまず Courier と Courier New の Mac でのレンダリングを確認してみる。少なくとも v10.3 (Panther) 以降の Mac OS X にはどちらのフォントもあらかじめインストールされている。以下は Mac OS X v10.6 (Snow Leopard) + Safri 4.0 でのスクリーンショット: Cour
最近，電子書籍（EPUB，HTML5/CSS）がらみで日本語組版についての議論があちこちで行われている。TeX Forumでも鎌田先生がkoTeXは日本語LuaTeXへの先導役になるか？で書いてくださっている。鎌田先生からはその後Twitterでもいろいろお教えいただいた。 和文組版の話は拙著［改訂第5版］LaTeX2e 美文書作成入門の第13章にも少し書いてあるが，Asian TeX Conference 2008の私のスライドから少し切り貼りして復習しておく。 Macの画面がWindowsより美しい理由の一つはヒラギノ書体にあるが，Pagesなどでヒラギノ明朝で横書きするとなぜかしっくりこないと鎌田先生は嘆かれる。PagesやKeynoteの画面をよく見たら，縦組用の文字が横組に使われている！ ヒラギノ明朝は縦組と横組でかなの字形がかなり違う。［2010-07-25追記：下のコメント「
Make a note of it: Web tech, montaineering, and so on. Note: この記事は、3年以上前に書かれています。Webの進化は速い！情報の正確性は自己責任で判断してください。 フォント指定や行間、約物といった、文字周りのノウハウです。デザインというより技術的なまとめ。SWFObjectとかsIFRといったFlashネタを除けば、Webの文字は全部CSSでできるんだから... コーダこそタイポグラフィを意識すべし。看板みて書体言い当てるとか変態的な域まで達せずとも、原則だけ覚えとけばプロトタイプが様になるんだし。 オールドスタイル数字 アンパサンド（“＆”） スモールキャップ ハイフンとダーシ 各種スペース 合字 約物 約物はぶら下げる :beforeと:after 見出しのサイズ 初期フォントサイズ 行間の調整 余白の調節 各国の日付表記
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
