読者です 読者をやめる 読者になる 読者になる

WEBサイト制作の勉強|フェリカテクニカルアカデミー

WEBサイト制作の勉強の為の解説ブログ。東京池袋のフェリカテクニカルアカデミーでは求職者支援訓練の一環として、WEBサイト制作を学ぶことができます。

svgが表示されない場合の対処法

Webサイト制作

ベクターデータで出来ているsvgデータは背景画像で使う事でより使いやすさが増します。
background-sizeで拡大・縮小も自由で出来るので、今後ますます使われる機会が増えていきます。

しかし、サーバーによってはSVGが上手く表示されない場合があります。


webcrowの場合

webcrowの場合、無料プランで、「オプションなし」もしくは「容量増加オプション」を選んでしまうと、svgデータが認識されないので、MIMEタイプの指定が必要になります。

MIMEの設定方法

1.サーバー管理ツール内、「MIME設定」をクリックしてください。
f:id:yachin29:20160725031244j:plain


2.「MIME設定追加」をクリック。
f:id:yachin29:20160725031448j:plain


3.以下の2つを「MIMEタイプ」と「拡張子」を入力し「確定する」をクリック

MIMEタイプ:image/svg+xml
拡張子:.svg

MIMEタイプ:image/svg+xml
拡張子:.svgz



サーバーによっては「.htaccess」に以下の文を追加記述する必要があります。

AddType image/svg+xml .svg
AddType image/svg+xml .svgz