[B! Webフォント] fujis_aのブックマーク

無料で使える明朝体の日本語WEBフォント | Web技術Tips | ホームページ制作のDOE【横浜】

これまではホームページで明朝体を使いたいときは、従来のようにWindows用、Mac用と別のフォントを指定して、別のフォントとして表示させてきた気がします。（例えばWindowsではHGS明朝E、Macではヒラギノ明朝 Pro W6など） WEBフォントを使うとこういった異なるフォントを表示させるということもないのですが、筆者が知っている実践で使えそうな日本語WEBフォントといえばGoogleが提供しているNoto Sansフォントくらいで明朝体のWEBフォントは知りませんでした。ということで明朝体の日本語WEBフォントについて調べてみます。 WEBフォントを探してみる以下はいくつかの明朝体フォントをまとめて提供しているサイトです。 TypeSquare 明朝体だけでも19種類から選ぶことができます。無料で登録ができ、月間1万PV、ドメイン1つ、フォント1つという制限はありますが、通

fujis_a 2016/08/12

リンク

日本語ウェブフォントでサイトを明朝体表示。CSSフォント指定

デザインにおいてフォントは重要です。しかしウェブ上では日本語フォントはデフォルトのものか画像に置き換えているのが現状です。今回は、とくにウェブに向いていないと言われている日本語ウェブフォントの「明朝体」でのデザインについて無知なりに解説してみたいと思います。ちなみに当ブログは「フロップデザインフォント」を使用してます。 webフォントとは、CSSで指定したフォントを表示する方法です。閲覧者が指定したフォントを持っていなくても制作者サイドでサーバーにアップしておけば表示可能になるのです。しかし、これにはいくつか問題があります。日本語フォントは容量が重いため表示に多少の問題がある。サーバーにアップするという行為自体が禁止されている。など実際にはいくつかの壁があります。ただ今後はこれらの状況も変わってくると思います。 1.Winodws 8.1、OS X Maveric

fujis_a 2016/08/12

Webフォント

リンク

モリサワとさくらインターネットが協業し、無料でのWebフォント導入を実現 | さくらインターネット

モリサワとさくらインターネットが協業し、無料でのWebフォント導入を実現〜WordPressで簡単に利用でき、SEOやユニバーサルデザインへの配慮を支援〜デジタルフォントや組版用ソフトウェアの開発を行う株式会社モリサワ（本社：大阪市浪速区、代表取締役社長：森澤彰彦）と、自社運営のデータセンターでインターネットインフラサービスを提供するさくらインターネット株式会社（本社：大阪市中央区、代表取締役社長：田中邦裕）が協業し、「さくらのレンタルサーバ」利用者に向け、モリサワのWebフォント提供を開始いたします。また、Web制作者を対象としたイベントを7月27日（水）に開催いたします。モリサワとさくらインターネットのコラボレーションにより、「さくらのレンタルサーバ」にてWordPressをご利用いただく際、モリサワのWebフォントサービス「TypeSquare」で提供中の書体の中から、30

fujis_a 2016/06/29

Webフォント

リンク

ウェブ・フォントの読み込み - Weblog - Hail2u.net

ウェブ・フォントも完全に行き渡り、今はどう効率的に配信するかについて多くの時間を割くようになった。Google Fontsの低め安定路線を見限り、TypeKitやFonts.comへ鞍替えする人々も増えた。それと同時に自前でホスティングする人々も徐々にその数を増やしており、どれが最適解なのか一応の結論が出るにはもう少しかかるだろう。まず、ウェブ・フォントの読み込みにおいてどのようなアプローチがあり、どのようなメリット、そしてデメリットがあるのだろうか。 TypeKit等に頼るにしろ、自前でホスティングするにしろ、もちろん最終的にはウェブ・フォントをブラウザーに送りつける必要がある。読み込みとはまさにその部分の話だ。話がややこしくなるので、多様な実装を意識した安全な書き方などについては触れない。普通に@font-face定義を利用 @font-face定義をただ普通に書く場合のメリットは、

fujis_a 2015/01/09

Webフォント

リンク

「Fonts.com Web Fonts」でWebフォントを使う｜LabPad （ラボパッド）

demo Monotype Old English Text W01 Helvetica W01 Bold Copperplate Gothic LT W01 31 BC memo 作業内容 Webフォントサービスとして、以前「Google Font APIを使ってみる」を書きましたが、今回はオンラインフォントショップFonts.comが運用するFonts.com Web Fontsを試してみます。現時点（10-08-02）での特徴としては以下になるようです。クラウド型フォント埋め込みサービス Linotype、Monotype、ITCの3社のフォントも利用可能対応はIE4～、FF3.5～、Safari3.1～、Chorome4～、Opera10～（iPhone、iPadは非対応）利用可能な書体数2279（Coming Soonも含めると4752） β版（本サービス開始時にはフリート

fujis_a 2014/04/24

リンク

もうアイコン画像はいらない！ Webフォントを使って、iOS風タブバーとアイコンを作成する方法

こんにちは、鴨田です。最近、アイコンがセットされたWebフォントを使うことで、画像を使わずにアイコンを表示するという手法が流行っていますね。すごく興味はあったのですが、なかなか使う機会もなく、便利そうだなと思っていただけで、今まで使ったことがありませんでした。しかし、先日、とある案件でやっと使う機会に恵まれたので、やり方をご紹介いたします。 (プロトタイプだけ作って、結局プロダクトとしては使いませんでしたが・・・) 最近話題になっていたこちらのサイトがとても便利です。 Fontello - http://fontello.com/ 使いたいフォントを選択します。ここでは、「Entypo」フォントから5つ選択します。選択が終わったら、上部のタブから「Edit codes」をクリックします。アイコン画像の上部のバーをクリックして、アイコンに割り当てる文字列を決めます。英語で頭