So-net無料ブログ作成
検索選択

So-net ブログ で Webフォント を 使う

Firefoxだとクロスドメインの関係でWebフォントの読み込みが難しいのですが、So-netブログでは拡張子偽装がOKみたいなのでFirefoxでも問題なく利用出来るようです。

方法は簡単で、Webフォントとして利用したフォントの拡張子を.pngや.mp3などに変更してSo-netブログのサーバにアップロードするだけ(画像は1MB、音声動画は5MBまでなので使用するフォントによって変更)。

現状、TrueType、OpenType、WOFFはMIMEタイプの定義が無いので拡張子が画像とか音声動画でも利用可能です(将来的にはわかりませんが)。

ファイル管理画面でのプレビューだとパスが異なるので記事投稿画面で貼り付けたパスを利用します。記事投稿画面では相対パスになっているのでCSSで絶対パスに書き直します。

CSSはこんな感じです。IEは無視しているのでEOTは用意していません。M+ FONTSは今のところウェイト毎で分かれているので太字に使用するフォントのfont-weightを400(標準)にしておく必要があります(Firefoxは太字+太字にしてしまうので)。

@font-face{
  font-family:"mplus-2p-light";
  src:local("mplus-2p-light"),
  url("http://mattintosh.blog.so-net.ne.jp/_images/blog/_1be/mattintosh/mplus-2p-light-woff.mp3") format("woff");
}
@font-face{
  font-family:"mplus-2p-medium";
  src:local("mplus-2p-medium"),
  url("http://mattintosh.blog.so-net.ne.jp/_images/blog/_1be/mattintosh/mplus-2p-medium-woff.mp3") format("woff");
}

body{
  font-family:mplus-2p-light,sans-serif;
}
h1,h2,h3,h4,h5,h6,b,strong{
  font-family:mplus-2p-medium,sans-serif;
  font-weight:400;
}


本当はmigmixとかを使いたいけどWOFFにしてもファイルサイズが大きいのでM+を使わせていただいています。

M+ OUTLINE FONTS | DESIGN
http://mplus-fonts.sourceforge.jp/mplus-outline-fonts/design/index.html 続きを読む

アメブロからお引越し

2011年末のアメーバブログ(通称アメブロ)の不正アクセスもあり、愛想が尽きたので引越ししてきました。

暫くブログを書くことを辞めようかとも思ったのですが普段の情報をまとめておくところが無いことが不便でした。


ここ数日はmixiページとFacebookを利用していました。

mixiページは一部を外部公開することが可能ですが新着(Facebookで言うタイムライン)と基本情報のみしか公開が出来ません。それ以外のコンテンツはmixiへのログインが必要になるので不便でした(肝心のウェルカムページに相当するホワイトボードがログイン必須ではお話にならない)。

また、日記(Facebookで言うノート)はHTMLはもちろん文字装飾も使えず、画像も長辺640pxが限界。タイムラインの更新も出来ないので投稿時間を新しくするには新しく記事を投稿しなくてはいけませんでした。


Facebookはと言うと、ノートを使うことになるのですが、太字など一部の文字装飾が可能です。ノートに画像を添付することも可能ですがサイズがページ幅に固定されてしまうので画像を拡大することが出来ません。画像の保管場所としても使用したかったのですが720pxが限界のようです。

ポストした内容をTwitter等に投稿するのもやはり不便。


やはり情報をまとめるにはブログサービスがいいということになり、新しいブログサービスを探し始めました。

候補は以前使っていたJUGEM。動作も軽く、JavaScriptも使える。本文に広告が入る以外は比較的使いやすかった印象です。ただ、画像のアップロード制限がちょっとひかっかりました。一番自由度が高いのはFC2だと思いますがドメインにサーバー番号が入ってしまうのが不便。

比較サイトを見てみるとライブドアもなかなか良さそうでした。5年前くらいに使ったことがあるのですが当時はあまり使いやすいという印象がなかった気がしますが、恐らく自分にそれほどの知識がなかったからでしょう。

でもどうせなら使ったことがないところを試してみたいと思ってSo-netブログの評価を見てみるとなかなか良さげ。HTMLやCSSも編集可能でスクリプトも使える。Amazonや楽天のIDも登録出来るのでこれは便利かな〜と。


まぁでも今回はあまり日記的なものは書かずに記事数を抑えて書いていこうと思います。


ちょっと画像アップロードテスト。

RawTherapee 4.0.6 - Tone Mapping and Lab

RawTherapee 4.0.6 - Tone Mapping Strength 2.00 続きを読む