2012-02-29 5 views
7

webfontキットをgzipする方法の例を挙げることはできますか?ジェネレータはこのコードを私に提供しました...何が変わりましたか?gzip @ font-faceの例は?

@font-face { 
    font-family: 'DesigersBold'; 
    src: url('desib__-webfont.eot'); 
    src: url('desib__-webfont.eot?#iefix') format('embedded-opentype'), 
     url('desib__-webfont.woff') format('woff'), 
     url('desib__-webfont.ttf') format('truetype'), 
     url('desib__-webfont.svg#DesigersBold') format('svg'); 
    font-weight: normal; 
    font-style: normal; 
} 

答えて

9

あなたはApacheを使用しており、httpd.confにアクセスできますか?もしそうなら、gzip圧縮はすでに有効になっていますか?

あなたはこのラインを探すことができます:

AddOutputFilterByType DEFLATE 

それとも

SetOutputFilter DEFLATE 

それはかつてのなら、あなたは以下のMIMEタイプを追加することができるはずですので、指示とパラメータが1のように見えます以下。ここに宣言されたMIMEタイプは、.EOT,.TTFおよび.SVGです。私はmime.typesのファイルを私のApache confフォルダに入れました。私は信じています.WOFFはすでに圧縮されているので、gzipにする必要はありません。

AddOutputFilterByType DEFLATE application/vnd.ms-fontobject application/x-font-ttf image/svg+xml 

後者ディレクティブSetOutputFilterが、それが中に記載されているコンテナ内のすべてのファイルをgzips。この場所はあなたのフォントファイルが含まれている場合、クライアントに配信するとき、彼らはすでにgzipで圧縮されなければなりません。

+0

私のサーバーはApacheを使用していますが、私は共有ホスティングを行っているので、httpd.confにアクセスすることはできません。代わりがありますか? –

+3

.htaccessファイルを使用/作成し、サーバ上でmod_deflateが有効になっているかどうかを確認できます。 次の情報を貼り付けて、httpヘッダーで確認して、コンテンツがgzipされているかどうかを確認できます。 'AddOutputFilterByType DEFLATEテキスト/テキストテキスト/ htmlテキスト/プレーンテキスト/ xmlテキスト/ CSSアプリケーション/ x-javascriptアプリケーション/ javascript' – waynethec

+0

@waynethec AddOutputFilterByTypeまたはSetOutputFilterディレクティブがhttpd.confファイルにない場合は、それはどこに追加できますか?どこにでも追加できますか、それともどこに置くか慎重にする必要がありますか? – user961627

0

サーバがtext/plainのとしてこれらの応答を処理し、ちょうどDEFLATEがプレーンテキスト/に設定されている場合、プレーンテキスト/のように圧縮されます、いくつかのパラメータ(偽)を送信します。

@font-face { 
    font-family: 'DesigersBold'; 
    src: url('desib__-webfont.eot?v=1'); 
    src: url('desib__-webfont.eot?v=1#iefix') format('embedded-opentype'), 
     url('desib__-webfont.woff?v=1') format('woff'), 
     url('desib__-webfont.ttf?v=1') format('truetype'), 
     url('desib__-webfont.svg?v=1#DesigersBold') format('svg'); 
    font-weight: normal; 
    font-style: normal; 
} 

ちょうどうまくいきます!