2018可以說將會是SVG最強勢的一年。在過去的幾年中，這種格式的圖像文件變得越來越受歡迎，并更廣泛的唄使用，但是2018年其實才是它真正突破增長的時候。

這種趨勢的興起得益于高分辨率顯示器的普及和應(yīng)用，并且網(wǎng)站越來越需要閃電般的快速加載時間。聽起來SVG可能優(yōu)勢一個要“傷筋動骨”的大調(diào)整，實際上真的是這樣嗎？

SVG其實很容易使用和實現(xiàn)，并且不需要更改現(xiàn)有文件；只需將圖像轉(zhuǎn)換為SVG格式即可。以下，我們整理了一些關(guān)于SVG你需要了解的一些東西。

1.SVG是為網(wǎng)站設(shè)計“而生”的

Mozilla這樣描述它：

SVG是一種基于XML的矢量圖像描述語言。它基本上是都是標(biāo)記代碼，比如HTML，不同的是SVG中有很多不同的元素來定義你想要在你的圖像中出現(xiàn)的形狀，以及你想要應(yīng)用到那些形狀上的效果。SVG用于標(biāo)記圖形，而不是內(nèi)容。你可以使用元素用于創(chuàng)建簡單的形狀，如<圈>和<人>，更高級一些的SVG的特點包括< fecolormatrix >（使用一個變換矩陣，顏色變換）<動畫>（你的矢量圖形、動畫部分）和（適用于使用正在圖像的上個層）。
對于網(wǎng)頁設(shè)計師來說，SVG的關(guān)鍵優(yōu)勢包括SVG可以通過代碼和文本編輯器來創(chuàng)建簡單的渲染，如果是較為復(fù)雜的圖形的話，你可以通過專業(yè)的工具，比如Adobe Illustrator。SVG是一個可以輕易改變樣式和腳本的文件，并且基于矢量格式，你可以以任何尺寸塑造它們而不會變形或失真，現(xiàn)代瀏覽器幾乎都支持該格式支持。

如果剛剛接觸復(fù)雜一點的SVG的話，在最初你可能會剛到有點困難。另一個問題是，一些被降級或低版本的瀏覽器根本不能識別它是什么。

2.設(shè)計師如何使用SVG

SVG的好處之一是你可以用它做很多不同的事情。比如，SVG可用于：

· Logo；

· 背景、圖案和紋理；

· 動效；

· 響應(yīng)圖像；

· 圖標(biāo)等。

設(shè)計者可以使用SVG設(shè)計任何元素，其中矢量格式是一個最合適的解決方案，可以替換JPG、PNG和GIF等格式。

3.矢量格式規(guī)則

更多的使用SVG格式的文件其實是一種很好的機會和挑戰(zhàn)。SVG是不受分辨率影響，這是一個最大的優(yōu)勢，因為你知道你的圖像或元素不管在什么分辨率下看起來都是最好的。

使用SVG圖像的另一個好處在于，你不必為了實現(xiàn)它們而更改工作流程。如果你在設(shè)計軟件，如插圖或素描，這個過程幾乎是沒有任何不同于正常工作流程的。其中的一個問題是，你可能想把任何元素都轉(zhuǎn)換成矢量格式的文件，不過，已經(jīng)有很多人這樣做了。

當(dāng)你準(zhǔn)備使用SVG文件時，還有一個關(guān)鍵的事情要記住。為了使它們盡可能小，請務(wù)必刪除任何你不需要的垃圾。



4.基于文本的格式有利于SEO

一些精明的網(wǎng)站設(shè)計師通過使用SVG還可以為SEO帶來一點額外的好處。由于SVG在格式化中使用了實際文本，所以搜索引擎可以更好地讀取圖像。

是的，你或許說合格步驟可以直接通過添加alt信息老實現(xiàn)，但只有這么多空間的關(guān)鍵字，你究竟要如何分配和使用呢。使用SVG，你可以創(chuàng)建更多有利于搜索的圖像。

5.SVG是輕量級的

不像其他一些基于矢量的文件會占用比較大的資源和空間，SVG是純代碼的形式。這意味著它更快，更輕量，就是這么簡單。

當(dāng)你嘗試把那些漂亮的矢量插圖保存為SVG格式之前，在你走得太遠(yuǎn)之前，先檢查一下文件的大小。PNG格式的圖像大小相較于SVG來說幾乎是成倍增加的，SVG往往的文件帶澳基于路徑的數(shù)目和填充圖像。

如果SVG文件過于巨大，考慮將它導(dǎo)出為JPG或PNG格式（即使看起來自相矛盾）。事實上，大多數(shù)設(shè)計師將繼續(xù)使用混合的文件類型與圖像，我們只是希望你能更多的接觸SVG這種文件格式。

6.易于編輯

如果你習(xí)慣于在矢量繪圖軟件中繪制logo或圖標(biāo)或其他內(nèi)容，那么編輯過程對你來說沒有什么變化。

但是如果你通過編寫代碼來生成SVG的話，過程可能很痛苦，但是結(jié)果卻很驚人。只需更改文本編輯器中的代碼、坐標(biāo)或顏色，你就可以隨意進行更改，沒有什么比這個更簡單的了。


7.用SVG創(chuàng)建靜止圖像或動畫圖像



與大多數(shù)不允許你同時擁有靜止圖像和移動圖像的其他圖像格式不同，SVG允許。你可以創(chuàng)建靜態(tài)圖像或動畫，所有的工作方式都差不多。

這里有一個額外的好處，就是它有助于設(shè)計師對SVG的使用帶來一些靈感，以此來推動SVG的使用。你不必學(xué)習(xí)一種新的工具或技術(shù)，你已經(jīng)擁有了你所需要的一切。

總結(jié)

這里有一個很大的原因?qū)τ?018是SVG開始流行的一年：它很實用。

對于使用高分辨率顯示器的每個人來說，矢量格式確實是很好的方式。一切都在完美的尺度，你不必?fù)?dān)心像素問題。文件小，下載速度快，并不需要你投入很多的時間和精力，當(dāng)它涉及到你的網(wǎng)站設(shè)計的實現(xiàn)時。

現(xiàn)在你就可以開始使用SVG圖像了。