免费观看又色又爽又黄的小说免费_美女福利视频国产片_亚洲欧美精品_美国一级大黄大色毛片

高級網(wǎng)站設(shè)計中的圖像優(yōu)化撰寫

2019-04-23    分類: 網(wǎng)站設(shè)計

高級網(wǎng)站設(shè)計中的圖像優(yōu)化撰寫


網(wǎng)站質(zhì)量圖像始終是在使用盡可能小的文件大小同時提供良好圖像質(zhì)量之間的平衡行為。直接從您的數(shù)碼單反相機上嵌入照片可能看起來不錯,但它會減慢您的網(wǎng)站負載的速度,而過度壓縮的圖像可能會提高您網(wǎng)站的速度,但會損害設(shè)計和整體審美。


網(wǎng)站建設(shè)


文件類型以及何時使用它們

我們在網(wǎng)站設(shè)計時使用三種圖像文件類型:.jpg .png和.svg。

JPG最適合用于風(fēng)景,風(fēng)景或人物等照片。對于內(nèi)容中的圖像,例如博客文章圖像,我們的目標(biāo)是20-70kb。較大的背景照片可以達到500kb,但200kb是一個很好的平均值。

JPG是有損的(它們在每次導(dǎo)出時重新壓縮并降低圖像質(zhì)量),并且它們不能很好地管理漸變。如果圖像中有漸變,有時可以將圖像分成兩個切割,以便您可以使用CSS漸變在單獨的背景中渲染漸變。

PNG最適用于徽標(biāo)和圖標(biāo)等資源,因為它們支持透明度,因為徽標(biāo)和圖標(biāo)通常使用更有限的調(diào)色板 - 因為PNG通過減少顏色數(shù)量來實現(xiàn)壓縮。

PNG可能是有損耗的,但我們通常使用無損,這意味著每個像素都可以精確保存而不會降低調(diào)色板的質(zhì)量,從而獲得更高質(zhì)量的圖像。

SVG具有最好的質(zhì)量,并且由于其可擴展性而被用于矢量藝術(shù)。我們經(jīng)常將它們與徽標(biāo)一起使用,但是,SVG確實為瀏覽器創(chuàng)建了更多的工作,并且在頁面加載時會產(chǎn)生遲緩,因此圖像的質(zhì)量應(yīng)始終與其復(fù)雜性相平衡。


優(yōu)化技術(shù)

優(yōu)化JPG

我們用于背景面板的圖像,我們將尺寸設(shè)置為1600x1200px。對于內(nèi)容照片,例如插入博客文章中的圖像,我們將尺寸限制在200-800px寬之間。

調(diào)整到最終分辨率后,將使用好質(zhì)量在Photoshop中輸出圖像。每次我們壓縮圖像都會失去一些保真度,所以我們更喜歡單獨使用ImageOptim進行壓縮,而不是讓Photoshop進行傳遞。Photoshop的效率顯著降低:它在質(zhì)量65下的“網(wǎng)絡(luò)保存”產(chǎn)生的圖像文件大小相同但保真度比ImageOptim的質(zhì)量差85。


網(wǎng)站設(shè)計


優(yōu)化更大的PNG

對于更復(fù)雜的圖像,如果我們使用ImageOptim無法生成15kb到50kb之間的文件,我們使用ImageAlpha。ImageAlpha用于處理從PNG 24(數(shù)百萬種顏色)到PNG 8(最多256種顏色)的PNG,將圖像從無損變?yōu)橛袚p,最終瞄準(zhǔn)具有最少數(shù)量顏色的PNG。

這種格式的損耗主要意味著對調(diào)色板進行戰(zhàn)略性改進,消除最不顯著的顏色,以產(chǎn)生仍然看起來很棒的圖像,同時降低其復(fù)雜性。


網(wǎng)站制作


優(yōu)化SVG

我們使用這個automator腳本使其在macOS中更容易使用,允許您在Finder中右鍵單擊SVG文件并通過Services菜單優(yōu)化SVG。我們經(jīng)常將字體文件用于單色矢量圖形,并使用名為Glyphs的程序。

正確優(yōu)化圖像只是我們改善網(wǎng)站性能,防止瀏覽器膨脹,減少服務(wù)器和帶寬資源使用,加快頁面加載時間,保持開發(fā)基礎(chǔ)架構(gòu)清潔并為最終用戶提供更理想體驗的另一種方式。


我們希望通過JPG,PNG和SVG文件類型,圖像壓縮和質(zhì)量工具來探索我們的經(jīng)驗,因為我們不斷完善自己的流程以完善網(wǎng)站設(shè)計

網(wǎng)頁題目:高級網(wǎng)站設(shè)計中的圖像優(yōu)化撰寫
網(wǎng)頁地址:http://m.newbst.com/news/79602.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián),是專注品牌與效果的網(wǎng)站制作,網(wǎng)絡(luò)營銷seo公司;服務(wù)項目有網(wǎng)站設(shè)計

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)

h5響應(yīng)式網(wǎng)站建設(shè)