あかつきのお宿

このサイトに載っている文章を見て、何か手書きっぽい字だな〜と思っていたら、それは正しいです。

ウェブフォントの利用

IEなどでは見れませんが、うちのお宿ではウェブフォントってのを使わせていただいておりまして、以前は、正確にいうと昨日までは、こちらのサイトさんで提供されているCinecaptionというフォントを使わせていただいておりました。

昨日までは、ということは、当然今日は違うフォントなのだろうなと、世間一般の大半の探偵気質の人は推理すると思うのですが、まさにその通りです。

別にこのフォントに飽きたとか、こんなくだらないサイトにうちのフォント使ってんじゃねーよこの野郎って提供者さんから怒られたとか、そもそもCinecaptionの提供者さんはお宿の存在を知らないだろうとか、そういうことは一切なくてですね、このサイトの管理人である私の気分で？　ちょっと変えてみようかなと。

あー、うん、一切ないとか言いましたが、Cinecaptionの提供者さんがうちのサイトを知らないだろうってとこだけは、なくはないですね。ほぼ間違いなく知らないでしょう。まあそれはいいです。

新たな出会い

人は出会いと別れを繰り返すのが常でありまして、それは人と人だけにあらず、ウェブフォントにおいてもまた然りなのです。特にウェブの世界ってのは新しいものが出てくるのが早いですからね。新しい出会いというのはいくらでもあるわけです。

今回は、たぬきフォントさんで提供している、たぬき油性マジックというウェブフォントを使わせていただくことにしました。無料で使って良いよと書いてあったので、ありがたく使わせてもらってます。

Cinecaptionのフォントもかなりお気になのですが、こちらのフォントも良いですね。こういうフォント好きです。

というわけで、しばらくはこのフォントで行ってみようかなと思います。

例によってIEとか一部のブラウザではこのフォントでは見れないですが、まあ仕方ないっす。あと僕のWindowsパソコンだと、Chromeで文字が若干にじんじゃってるような気がしないでもないんだけど…何でかな？　難しいことはよく分かりません。

設定方法を改めて

Cinecaptionさんを導入するときにも一応書いたんですが、せっかくなんでざっくりと簡潔にだけ。

といっても難しいことはないんですけどね。

とりあえず、まずはフォントをダウンロードしないことにはどうにもならないので、まずはダウンロードしましょう。ダウンロードしたら、ttfとかotfという拡張子のファイルがあると思うので、それをサーバーの任意の場所に上げる。

そしたらcssにこんな感じで記述します。

@font-face {
  font-family: SampleFont;
  src:url(SampleFont.ttf) format("TrueType");
}

body {
  font-family:SampleFont:
}

urlはbackground-imageのurlなんかと一緒で、対象のフォントファイルが置いてあるパスを書きます。

ウェブフォントには『TrueType』というのと『OpenType』というのがあるらしいんですが、違いとかは調べてないのでよく分かってないです、すみません。今回使わせてもらってるたぬき油性マジックはTrueTypeのようです。拡張子がttfだとTrueTypeです。きっとTrue Type Fontだからttfなんでしょうね。

今回の説明とほとんど同じようなことしか書いてありませんが、もし参考になるようでしたらこっちの記事もどうぞ。Cinecaptionさんを設定したときのことが書いてあります。



そういう感じで、あかつきのお宿ではたぬき油性マジックさんを利用させていただいております。たぬきフォントさん、ありがとうございマジックインキ！！

また新しい素敵なフォントとの出会いがあったり、提供者さんからこんなくだらないサイトにうちの崇高なフォント使ってんじゃねーよこの野郎って怒られたりしたら、そのときは新しいフォントになると思いますが、今しばらくはこのフォントでお付き合いください。

もし「このサイトの文字、見辛くね？」って思ったら、一報ください。その場合はフォントが悪いんじゃなくて、文字サイズとか文字の色とかに問題があるはずなので、対応させていただきやんす。