今天小編給大家從多方面解讀公司LOGO設(shè)計為什么一定要SVG格式。
SVG是什么
什么是SVG？SVG可縮放矢量圖形（Scalable Vector Graphics）是基于可擴(kuò)展標(biāo)記語言（XML），用于描述二維矢量圖形的一種圖形格式。SVG是W3C制定的一種新的二維矢量圖形格式，也是規(guī)范中的網(wǎng)絡(luò)矢量圖形標(biāo)準(zhǔn)。SVG嚴(yán)格遵從XML語法，并用文本格式的描述性語言來描述圖像內(nèi)容，因此是一種和圖像分辨率無關(guān)的矢量圖形格式。簡單的說他就是一個可伸縮矢量圖形(Scalable Vector Graphics)，在瀏覽器中采用繪圖技術(shù)。
接下來我們來看看使用iconfont和使用SVG做出來的圖標(biāo)有什么差異：
chrome瀏覽器下效果
火狐瀏覽器下效果
IE9瀏覽器下效果
上面的demo分別在不同瀏覽器下的效果，第一行用的是iconfont實(shí)現(xiàn)，下面三行都是用的SVG實(shí)現(xiàn)的圖標(biāo)，只是調(diào)用SVG時的方法不同：第一行是用inlineSVG，將SVG直接寫在html中來使用，第二行是用的img標(biāo)簽去調(diào)用SVG，第三行用樣式的background來調(diào)用SVG文件。從Chrome和FF下的顯示效果，我們看到SVG畫的ICON的質(zhì)量確實(shí)是比iconfont要好，iconfont做的圖標(biāo)，我截圖后放大后看到線的邊緣發(fā)虛了，這是因為字體渲染的原因?qū)е拢贔F下也是發(fā)虛，只是不那么明顯。在IE9+下的效果上我們看到IE對SVG的支持性著實(shí)差的令人無法直視，IE10，IE11效果和IE9幾乎一樣（真的是坑爹）。
公司SVG格式LOGO設(shè)計優(yōu)勢
1.體積小，可壓縮
與同類圖片相比，在體積上有優(yōu)勢，同時作為一種XML文件，對gzip的壓縮支持度好。同一個LOGO，別人的要幾兆，而SVG的LOGO，只要幾十KB，這就是差距
2.矢量，清晰
可以任意改變大小，不會影響圖片質(zhì)量。小到網(wǎng)站favicon，大到高鐵廣告牌，svg格式的LOGO可任意改變大小，圖片永遠(yuǎn)保持清晰，毫無影響效果。
3.可交互
可對圖形元素進(jìn)行操作。
4.支持高清屏
高清屏對展示內(nèi)容要求很高，因為svg格式的圖片是任意改變大小的，因此他完美支持于各類高清屏，完美展現(xiàn)，毫無馬賽克。
5.SVG可讀性好
由于SVG采用的是XML的語法，圖形的里的文本內(nèi)容可以被瀏覽器，搜索引擎和讀屏軟件讀取，所以本身具有可讀性好，如果網(wǎng)站LOGO使用svg格式圖片，更有利于SEO，對無障礙友好等特點(diǎn)。
當(dāng)今設(shè)計logo非常方便，網(wǎng)絡(luò)上有各式各樣的logo設(shè)計在線生成器，并且免費(fèi)下載，但是免費(fèi)下載的logo格式一般是jpg、png等，唯獨(dú)中國設(shè)計之窗在線設(shè)計平臺提供svg格式的logo下載。
聽完小編給大家解讀完公司LOGO設(shè)計為何要SVG格式以后，你一定對SVG格式的圖片有了深入了解，尤其是svg格式的公司LOGO，因為它的應(yīng)用是最廣的。
