CSSのfont-familyで游ゴシックを指定すると、Windowsで細くなってしまう問題の原因と解決方法を中心として、最近の日本語フォント事情をまとめました。 CSS Nite LP47 Coder's High 2016にてお話した内容です。 昔からマークアップエンジニアを悩ませて…
まちを歩くと、なにかとめにつく「HG創英角ポップ体」。ポスターや看板などあらゆる場所でみかける。 たまに、シリアスな注意書きの看板に、にぎやかでたのしげな雰囲気のポップ体がつかわれたりして、おもしろ写真としてネットで話題になったりする。 そんな「HG創英角ポップ体」をつくったひとはどんなひとなんだろう？
「15億人の人々のためのフォントソリューション」、これはなかなか大胆なものを！ パソコンを使って紙やらwebやらをデザインする人の間で話題になりまくっている書体をご存知でしょうか？ googleとAdobeとで呼び方が違うので、ちょっとややこしいのですが、ここはグラフィックデザイナーぽく和名で呼びましょう。 源の角ゴシックことSource Han Sansです。 Source Han Sans「さん」をつけたい気分 ダウンロードは以下より。追記：ダウンロード先を変更しました。 Source Han Sans – Browse Files at SourceForge.net Source Han Sans の入手方法について – M59のブログ ▲この辺。 無料で使える書体は今までいくつもあったし、Macの人はもともと入っている「ヒラギノ」がなかなか和文・英文とわず優秀なので、フォントを（
2014年7月16日に、Google と Adobe がリリースした Noto Sans（Adobe からは Source Han Sans という名称でリリース）というオープンソースのフォントファミリーは「日本のWebデザイン史上に残る画期的なフォント」だと思ったので記事にしました。 これまでの問題 ウエイトの不足 普段Webデザインなどの仕事をされている方でないとあまり気にすることはないかもしれませんが、たとえば Android は、アプリによっては下記のように日本語部分と英数字部分で大きくウエイト（フォントの太さ）が異なることがありました。 ※この画像は、Nexus 7（Android 4.4）で Twitter 公式アプリを表示した時のものです。 Nexus 7 では Chrome ブラウザーなどでは日本語・半角英数字ともに丸ゴシックで表示され、ウエイトもおかしくないのですが、アプ
最早至る所で見聞きするフラットデザイン。Appleを初めGoogleや各ウェブサービス、アプリケーションのUIでもどんどん取り入れられています。ご存知の通り凹凸が無く巧みに配色を考えられた美しいデザインで、しばらくトレンドとなる事は間違いないでしょう。 そこでやはり気になるのがフォント。こだわりだせば切りが無いものですが、一度これというものに出会うとデザインの基盤として大活躍してくれます。 今回Webで見つけて早速持っているMac全てにインストールしたフォントはこちら。 M+ FONTSの紹介 M+ OUTLINE FONTS はコンピュータなどでの個人利用をはじめ、商業目的での利用、フォント内容の改変、改変後の再配布にも制限の無い、自由なライセンスで公開しているアウトラインフォントです。 海外のフォントはかっこいいのがたくさんありますが、結局英数字だけなので日本語を使用したい場合はバラン
そのままやってみたのですが、できませんでした… どうすればいいのでしょうか^^; $ brew install https://raw.github.com/sanemat/homebrew-font/master/ricty.rb ######################################################################## 100.0% ==> Downloading https://github.com/yascentur/Ricty/archive/3.2.1.tar.gz Already downloaded: /Library/Caches/Homebrew/ricty-3.2.1.tar.gz ==> Downloading http://levien.com/type/myfonts/Inconsolata.otf Alre
無料・商用利用可！おしゃれで個性的な装飾系フォントキャッチコピーや見出し、ちょっとした装飾に使える英字フォントを紹介します。どれも無料で商用利用もできるなんてすごいですねー！個性的すぎて読みづらいものも多いので、読んでほしい部分や本文には不向きです。大きくどどーんと使っちゃいましょう！ Costura クロスステッチ刺繍風のおしゃれフォント。加工するとさらに刺繍っぽくリアルに表現できそう。 Leafy glade 英語の本を読んでいたら、よくこんなフォントが文頭の一文字に使われています。 ZERB 角ばったシェイプがかっこいいですね。アウトラインバージョンもあります。 Griffin ワンピースのペローナちゃんと思い出す、ダークかわいいフォント。 Kingthings Gothique アニメチックなようなエスニックなような、なんとも個性的なフォント。 Heavy Data 直線＋角丸の組
追記：最初、うっかり「2013冬」って書いてしまったんですけど、ほんとは「春」と書かなきゃいけませんでした（汗）*1 とりあえず今、CSSのfont-familyでフォントを指定するならば、これで決まり（一番下の追記も参照で）。 font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;CSSのfont-family指定、「あえてフォントを指定しない」っていうやり方もアリですが、いろいろな事情でそうも言ってられません。とりあえず今現在の最適font-family指定を考えてみたところ、上のようになりました。 指定順序、入れたフォント、入れてないフォント、すべてに意味があります。 以下説明。 ヒラギノはProではなくProN。 OS Xの和文標準フォ
今回、WEBCRE8.jpの優さん企画の#LOVEFONT Advent Calendar 2012というイベントにお誘いいただきました。 愛するフォントの魅力を語る・詳しくなくても構わない、と優しい声をかけていただいて勇気がでたので、私も参加させていただくことになりました。 今回の企画、Advent Calendarと#LOVEFONTについては、WEBCRE8.jpさんの記事をご覧ください。 2012年、今年こそはAdvent Calendarに参加しよう！！ ｜WEBCRE8.jp#LOVEFONT ｜ WEBCRE8.jp#LOVEFONT Advent Calendar やさしさゴシックって…？その名の通り、やさしい雰囲気の「やさしさゴシック」。 好きなポイントはいろいろあるのに、そのフォントについて知っていることは、とても少なかったので調べてみることにしました。 やさしさゴシッ
アップルが好んで使う3大フォントと言えばミリアド（Myriad）、ルシーダ・グランデ（Lucida Grande）、ヘルベティカ・ノイア（Helvetica Neue）...ですが、最近これに新たな仲間が加わりました。 一番下にあるのがその｢アヴェニール（Avenir）｣―OS X Mountain LionとiOS 6に同時に現れた書体なので、次のiPhoneでもきっとコレお見かけしますよ！ 以上のサンセリフ書体には共通項もありますが、書体ごとに見た目も違えば役割りもかなり違うんですよ。これは知ってるようで意外と知らないかも。 ミリアド（Myriad） 2002年アップルがコーポレートフォントに採用したのが｢ミリアド（Myriad）｣。 それまではセリフ書体ギャラモンのアップル版｢アップル・ギャラモン（Apple Garamond）｣でしたよね。eMacより前に出たMacintosh、P
Windows上でフォントを綺麗に表示するソフトとして、現在はgdi++ Helium版やgdipp、ezgdiというソフトウェアがよく使われています。 これに対して最近、同じgdi++派生であるMacTypeというソフトがなかなか良さそうだと注目されるようになり、gdi++ユーザの間では、「gdi++ Heliumを越えたのではないか」、「MacTypeのほうがより詳細に設定ができる」などと話題になっています。 しかし、MacTypeの情報の多くは中国語であり、日本ではまだあまり知られていないソフトウェアのようです。 そこで今回は、日本語でMacTypeのインストール方法とその特徴について紹介したいと思います。 目次 1. サンプル2. MacTypeの特徴2.1. 64bitアプリケーションに対応！2.2. 設定作成ツールが付属！2.3. プロセスごとの適用状況確認ツールも付属！2.4
サービス終了のお知らせ NAVERまとめは2020年9月30日をもちましてサービス終了いたしました。 約11年間、NAVERまとめをご利用・ご愛顧いただき誠にありがとうございました。
プログラミング用フォント Ricty は、英字フォント Inconsolata と日本語フォント Migu 1M を合成させた、美麗な等幅フォントで、エディタでの利用に向いている。しかし、ライセンスの関係で TrueType 形式での配布がなくなり、自分で材料を用意しなくてはならなくなった。Ricty は利用したいけどこういう UNIX っぽいことには明るくないという私にような人だって数多くいるはずであるから、参考にしたい方もいるだろうと考えて、覚書を残しておく。 環境 MacBook Air 11″ (Mid 2011) OS X 10.7 Lion XCode インストール済み 材料を用意する Inconsolata のウェブページから OpenType 形式のファイルをダウンロードする M+とIPAの合成フォント のウェブページから Migu 1M の TrueType 形式ファイル
ありそうでなかったWebデザインギャラリー だったのでご紹介。Googleでも提供して くれている、Webフォント。日本語では なかなか難しいですが、英語圏ではかなり 一般化してきている印象です。そんな Webフォントを上手く利用したWebサイト を収集しているギャラリーです。 Know The Font: 3 Typography Inspiration Sitesという記事の中で紹介されていたWebデザインギャラリーです。ありそうで無かったですね、このギャラリー。良いインスピレーションが得られそうです。 Webフォントを取り入れたWebサイトのデザイン例です。まだ数は少ないですけど使い方は参考にしたいので覚えておきたいギャラリーですね。SEO的にも画像よりテキストのほうが良さそうですしね。 個別ページです。使用してるWebフォントも書いてくれています。親切ですねー ブックマークレットで
MaxOSX(Lion) にしたので、Rictyをインストールしようと思ったら、なんかビルドしないといけないようになっていたので、そのやり方と簡易インストールスクリプトをメモっとく。 前提 MacのOSはLion homebrewインストール済 sudo つかうよ インストール インストールスクリプトはGistにしておいたので、下記コマンドを叩けばおわり。fontforgeのインストールとか結構時間かかるので気長にまっててね(はーと) curl -O https://raw.github.com/gist/1228270/377a9cd1dfed1c28549acecac918e865c6ad0e54/install_ricty.sh chmod 0755 install_ricty.sh sh install_ricty.sh sudo使ってるから途中で、自分のローカルマシンのID/PA
最近、フォント名を知らないデザイナーが増えてきていると思うんですよね。 実は使ってるんだけど、どのフォントを使っているか意識していなくて、「これ何のフォント？」と聞くと、「ちょっと待ってくださいね。調べます。」という会話を良く耳にするようになったような気がします。「会社のPCに入ってたー」みたいなノリでしょうか。 というわけで、今日は僕がWEB屋をやってきた中で、「最低限、これは知っておいた方がいいんだろうな」と思ったフォントを幾つかご紹介。 英文フォントを中心に、色々有名どころを総当りしていきます。主に僕が仕事で使ったことがある物を中心に紹介していきますね。（順不同、のつもりで僕の好きな順） Helvetica 世界中のデザイナーに愛されるデザイナーフォントと言えばやっぱりHelveticaですよね。 元はスイスのデザイナーによって作られたフォントでMacだと標準フォントのひとつになって
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く