網站建設

北京網站建設公司湖北衆廣網絡（hbzgwl.cn）：CSS 是(shì)了(le／liǎo)不(bù)起的(de)技術，我第一(yī / yì ／yí)次用到(dào)的(de)時(shí)候，覺得這(zhè)是(shì)我做夢都想不(bù)到(dào)的(de)東西，随着 CSS3 的(de)引入，圓角，陰影，旋轉等等技術更将 CSS 帶到(dào)前所未有的(de)高度。然而(ér)，關于(yú) CSS，我們是(shì)不(bù)是(shì)已經走得太遠，本文以(yǐ)一(yī / yì ／yí)個(gè) Web 設計師的(de)角度對 CSS 的(de)一(yī / yì ／yí)些實驗性應用做了(le／liǎo)另一(yī / yì ／yí)種思考。

那些有關 CSS 的(de)前衛實驗

每個(gè)實驗都是(shì)用了(le／liǎo)不(bù)同的(de)方法，其中一(yī / yì ／yí)些，如 CSS 線圖，在(zài)現實中可以(yǐ)找到(dào)實際的(de)應用，其它的(de)，如 CSS 實現的(de) Twitter Fail Whale 圖畫，則純屬實驗，這(zhè)些實驗的(de)目的(de)僅僅爲(wéi / wèi)了(le／liǎo)說(shuō)明 CSS 能夠實現的(de)效果，并不(bù)意味着應當這(zhè)樣來(lái)做。

讓我們實際一(yī / yì ／yí)點

上(shàng)圖是(shì)用純 CSS 實現的(de)社會媒體網絡标志，很神奇不(bù)是(shì)？

就(jiù)像上(shàng)面的(de)完全基于(yú) CSS 的(de)社會網絡标志，無非是(shì)一(yī / yì ／yí)堆各式各樣的(de)線條的(de)組合，固然令人(rén)印象深刻，也(yě)算有創意，但并不(bù)實用，因爲(wéi / wèi)創作這(zhè)樣一(yī / yì ／yí)個(gè)标志可能需要(yào / yāo)幾個(gè)小時(shí)的(de)艱辛勞動，在(zài) Photoshop 中畫一(yī / yì ／yí)個(gè)同樣的(de)圖根本不(bù)費任何力氣，而(ér)且效果更好（更細膩）。

我最近讀了(le／liǎo) Faruk Ateş 的(de)文章，Pure CSS Icons： Make The Madness Stop，文中對這(zhè)一(yī / yì ／yí)做法提出(chū)了(le／liǎo)質疑，作者表示，一(yī / yì ／yí)些人(rén)開始嘗試将 CSS 當作設計工具并迅速引發大(dà)量效仿，然而(ér)，這(zhè)種做法有多少易用性可言？它并不(bù)容易集成到(dào)你的(de)設計與開發當中，也(yě)不(bù)容易調整。

Ateş 認爲(wéi / wèi)，這(zhè)種方式生成的(de)圖标的(de)可維護性也(yě)很成問題，調整一(yī / yì ／yí)個(gè)圖标原本隻需要(yào / yāo)調整像素，現在(zài)卻需要(yào / yāo)修改 CSS 定義，同時(shí)，上(shàng)述 CSS 标志的(de)設計者 Nicolas Gallagher 也(yě)表示，做這(zhè)類事情，CSS 并非最适合。

降低 HTTP 請求？

上(shàng)面這(zhè)幅圖中的(de)圖标全部用 CSS 生成，而(ér)且作者将它們拿出(chū)來(lái)賣，40個(gè)圖标賣25美金。不(bù)得不(bù)承認，這(zhè)些圖标設計得非常漂亮，作者設計這(zhè)些 CSS 的(de)初衷是(shì)爲(wéi / wèi)那些使用的(de)網站降低 HTTP 請求數，因爲(wéi / wèi)這(zhè)些圖标不(bù)需要(yào / yāo)額外的(de)圖片文件請求。然而(ér)，一(yī / yì ／yí)個(gè)小小的(de)圖标文件帶來(lái)的(de) HTTP 請求真的(de)很值得一(yī / yì ／yí)提嗎，何況，使用 CSS Sprite 技術，這(zhè)些圖标完全可以(yǐ)放在(zài)同一(yī / yì ／yí)個(gè)圖片中，靠 CSS 定位顯示，這(zhè)樣，隻需要(yào / yāo)一(yī / yì ／yí)個(gè) HTTP 請求就(jiù)夠了(le／liǎo)。而(ér)且，我實在(zài)懷疑，這(zhè)些 CSS 版的(de)圖标到(dào)底能減少多少帶寬。

本着語義化的(de)精神

必須承認，我有時(shí)候會爲(wéi / wèi)了(le／liǎo)實現某種視覺上(shàng)的(de)需要(yào / yāo)，而(ér)額外使用 DIV 或 SPAN 等标簽，這(zhè)很不(bù)語義。然而(ér) CSS 繪圖是(shì)更不(bù)語義的(de)事，CSS 的(de)真實使命是(shì)對網頁中的(de)内容進行修飾，而(ér)不(bù)是(shì)創建内容本身。網頁中的(de)圖形本身屬于(yú)内容的(de)範疇，不(bù)應該由 CSS 創建。

本文發布于(yú)北京網站制作公司湖北衆廣網絡