文章来源：http://www.admin5.com/article/20171024/793099.shtml

　　隨著響應式設計趨勢的不斷發展，不少站長在研究響應式網站設計趨勢、響應式圖片或文本等方面很花心思，但卻常常忽略了怎樣讓網站Logo做到響應式。Logo是企業的重要標識之一，最直觀展示了一個企業的文化特色、價值取向，代表著公司的整體形象。如果網站的Logo無法做到響應式，在小屏幕等移動設備上可能會出現顯示不清的問題，這樣容易影響公司品牌形象在用戶心目中的樹立，難以發揮Logo在品牌宣傳等方面的作用。因此，怎樣做到Logo的響應式，讓它適應不同大小的屏幕、不同分辨率的設備是一個值得我們仔細研究的課題。　　在今天這篇文章中，小飛將介紹響應式Logo設計的基本原則，從眾多實例中分析(包括Twitter、Facebook、Google等知名公司)，教大家做好Logo的響應式設計。前面提到的這些公司在Logo的響應式設計方面都有著不俗的表現，設計出了很多令人印象深刻、耳目一新的Logo，也正是這些Logo讓它們在移動設備市場上的競爭優勢愈發凸顯出來，相信它們的經驗能夠給大家提供一定的借鑒意義，讓大家能夠對Logo的響應式設計有一個全新的認識。一起來看看吧!　　基本原則：簡潔性　　相比復雜的事物，人腦更能記住簡單的，品牌Logo的設計也是一樣。簡潔性是響應式Logo設計最基本的思想和原則，它也是區別Logo設計優劣的一個重要特征，很多高質、成功的品牌Logo都是簡單易懂的。　　不過簡潔性這個概念并不是最新提出的，它在響應式網站設計興起之前就已經廣為人知了。這一點我們可以看看Apple在1976年設計的Logo(下圖左側)，它結合了牛頓受蘋果落地啟發悟出萬有引力定律的故事，看上去確實很有創意，但是這個logo實在太復雜了，元素太多了。不出意外，第二年Apple就重新設計了一個Logo(下圖右側)。據說這是因為SteveJobs強烈要求設計師設計出一個更加簡單、深刻、現代化的logo。盡管Apple新設計的Logo顏色比較多彩，但在接下來的三四十年中Apple公司一直沿用了整體的形狀設計。毫無疑問，Apple的Logo是歷史上最具辨識度和標志性的Logo之一。從這我們也可以看出，logo設計中簡易性的重要，如果Logo足夠簡單，它可以輕易適用于不同尺寸的所有設備。Apple的Logo幾乎算得上是響應式設計的完美范例，盡管幾十年前它主要針對的是網站的可用性。　　　　下圖也是一個關于Logo簡潔性的栗子。左側是GreatLakesGolf的Logo，上面有很多元素(文字、線條、圖形)，一眼看上去覺得很擁擠。而且在全屏顯示時，基本元素可以看清，但是如果它縮小50%，網站上球形已經無法辨認了，這影響了品牌形象、重要信息特征的有效傳遞。而右側skype的Logo就很簡潔、干凈(主要就是字體)，一目了然，更能讓人記住，在小屏幕的移動設備上進行縮放時它也可以完美適應，就算縮小到最小比例，Logo仍能呈現為可辨認的"S"字符。這兩個網站的對比讓我們看到了簡單的Logo設計的優勢所在，簡單的Logo設計更加符合響應式網站的設計。　　　　科技行業的范例：　　Facebook　　Facebook不愧為業界領先的巨頭，它緊跟響應式網站設計的潮流，注重Logo在不同設備上的一致表現，一直在如何簡化公司Logo這個問題上不停探索。2013年，去掉了F下方的淡藍色線條，2015年，將字母a從雙層字體設計變成單層設計，其他字母也進行了不同程度的改良，字母間的空隙也有所增大。這種改變可能并不大，但改良后的Logo卻更加圓滑，給人更友好的感覺，也方便在更小、更低分辨率的設備上識別。　　　　Spotify　　Spotify是一款流行的音樂服務軟件。2006年，Spotify的Logo還是spotify幾個字母加上一些波浪的元素，整體配色為黃綠色，不過這個Logo在小屏幕上展示時波浪元素不明顯，無法突出這個音樂軟件的品牌標識。因此，2013年，Spotify對Logo重新設計，將它簡化成黑色的spotify字母以及綠色的波浪圖標。后來Logo的配色又進一步微調，統一變成更為清爽的淺綠色。Spotify為什麼要簡化網站Logo?背后的驅動力顯而易見：很多用戶開始通過手機、平板等移動設備來尋找想聽的音樂，做出響應式的網站還遠遠不夠，網站的Logo也需要靈活適應移動設備，這樣才能獲得較大的市場份額。　　　　Google　　Google在簡化Logo這方面也算得上一個典范。1998，谷歌正式成立時，公司Logo還是使用短粗的字體搭配紅色陰影，還帶有"!"，算是向當時的搜索巨頭"Yahoo!"致敬吧。接下來的十年里，谷歌的Logo一直在進行微調，去掉感嘆號，字體逐漸變修長，陰影、高光效果越來越淺。　　　　2013年，為了迎合扁平化的設計風潮，谷歌推出了新款Logo，其中最大的改變就是去掉了字母上的陰影效果。2014年，谷歌逐漸意識到單薄的襯線字體不能很好的適應響應式網站設計，所以它開始使用無襯線字體，讓Logo看上去更加簡潔，這算得上谷歌Logo很大的一次變動了。隨后谷歌又推出了緊湊版的"G"圖標，它與整體Logo的柵欄系統相同，四色的填充也確保了視覺的平衡感。從這一系列的改動之中，我們可以看出Google在Logo改動方面是比較保守謹慎的，但它一直致力于創造出更加簡單、更能與用戶互動的Logo。也正是因為Google的孜孜不倦，它才會在響應式迅速發展的今天依舊深受用戶的喜愛。　　　　其他范例：　　在科技行業公司簡化Logo設計的同時，其他領域的不少公司也開始了自己的Logo改良之旅。與將Logo簡化為單純的字母相比，它們更加傾向于一個扁平的、簡單的圖案。下圖就很好的證明了這一點，從左至右分別是Twitter，Nike，Apple，星巴克，Pinterest。　　　　接下來小飛就以Twitter為例重點分析。還記得twitter過去使用的Logo嗎?圓形的字體以及小鳥圖案，Twitter對這個Logo不斷進行微調，去掉字體的外框，小鳥圖案更加扁平化，更加簡單，但整體變化不是很大。直到2012年，Twitetr發布了全新簡化版的Logo：更光滑，顏色更藍，羽毛更少。它放棄了"Twitter"的標志字，沒有任何字體進行描述。沒有什麼比簡單的幾何圖案更加能表現Logo的簡潔性了吧!Twitter在發布這個新Logo的時候也宣稱：從今以后，Twitter就是這只小鳥，這只小鳥就是Twitter。這有利于公司建立自己的標志性象征物。　　　　看到這里可能不少人會提出質疑，認為小飛列舉的都是一些比較成功的大公司，覺得并不是所有的網站都一定要簡化Logo。小飛承認，并不是每個公司都適合扁平化圖標或是無襯線字體的Logo，但是響應式設計的潮流趨勢不可忽視。由于移動設備的不斷興起，小飛相信所有的行業最終都會以這樣或那樣的方式迎合響應式的設計。以上這些公司能夠成功不也恰好明了他們采取的舉措順應了響應式發展的潮流，簡化Logo提高了品牌標識在移動設備上展示的靈活度，Logo的響應式設計拓寬了它們的市場，從PC端到移動設備。認為Logo設計完成就不應該改動的想法已經過時了，現在Logo的響應式設計更加開放自由，從水平樣式到垂直重疊，從文字到簡單圖標，我們甚至可以改變Logo的整體配色讓它更好的適應深淺色不同的屏幕背景。　　怎樣做好Logo的響應式設計?最重要的是把握簡潔性的基本原則，簡單的Logo設計不僅可以保持公司品牌的一致性，還能更好的適應不同大小屏幕的設備。快去給自己的Logo來個變身吧!快來起飛頁自助建站平臺做一個網站吧!

關鍵字標籤：CIS設計