如何讓搜索引擎自動送流量上門 |
發(fā)布時間:2016-11-01 文章來源: 瀏覽次數:3048 |
Claudio Guglieri 在紐約廣告公司 B-Reel 任職總監(jiān),他撰寫了本網站設計培訓指南,旨在匡助您了解設計網站布局的全過程。 開始講述設計網站布局的主題之前,我想先分享自己多年從事設計工作中看到的一些常見錯誤,尤其是“網站設計培訓”中所述的實習生和新手們的通病。 本文羅列了打造完美網站布局的步驟,旨在涵蓋開始新項目前以及項目設計過程中的各項應知應會,適合數字廣告公司內就職的所有網站設計師新人閱讀。 以下原則不僅包含各種設計細節(jié),還提供了常規(guī)工作流程,從而匡助您精彩地完成工作。遵循這些原則,您很快就能上手,設計出專業(yè)的網站布局。 01. 先在紙上收拾整頓思緒 initial sketch 世界各處城市插圖系列簡筆 此條顯然很重要,但是我常常發(fā)現一些設計師會跳過這步直接使用 Photoshop CS6 而不去思索他們需要解決的題目。設計的目的在于解決題目,而這些有待解決的題目無法通過漸變或暗影效果得到解決,而是需要完美的布局和清楚的結構。想一想內容、布局和功能,然后再開始上暗影效果。 02. 從頂層框架草圖入手 UX sketch 草繪基本的框架將匡助你解決 UX 題目,并組織布局結構 假如我要做一個項目的外觀和感覺,第一件事就是先建一個頂層框架,可解決所有設計題目。框架是指內容附近的 UI,有助于執(zhí)行操縱并進行瀏覽。其中包括導航和各類組件,例如邊欄和底欄。 假如你從這點著手設計,則設計主頁以外的部門時,布局內容將了然于心。 03. 為 PSD 添加網格 grid 以 10 像素基線繪制的 978 網格示例 這步操縱非常簡樸。在 Photoshop 中著手設計任何內容前,你需要創(chuàng)建一個合適的網格。這一步的道理眾所周知,假如你沒有這么做,我可以斷言,最后的設計老是無法盡善盡美。 借助于網格,你能鋪排不同部門的布局結構;還能指導你按照特定屏幕尺寸要求進行設計,并能匡助你創(chuàng)建相應的模板,以便符合間距和其他設計題目。 04. 選擇排版樣式 typography 根據常規(guī)經驗,一個網站布局中所用字型最好不要超過兩種 了解不同的字型和配色是項目開發(fā)階段的工作。我建議一個網站中所用字型不要超過兩種,不外實際上,還需取決于你可用的色系?傊,所選字體需便于閱讀大量文字,且與標題和操縱相映成趣。大膽勇敢使用大字體,并在使用字型時保持整體一致性和生動感。 05. 選擇主題顏色 colours 使用有限的色階和色調以免產生視覺疲憊 選完要使用的一系列字型后,你應開始研究 UI、背景和文本該用什么顏色。關于顏色,我建議在處理常規(guī)用戶界面是用色及色調需簡潔。 根據元素功能在設計 UI 時保持一致性非常重要。想想 Facebook、Twitter、Quora 和 Vimeo 之類的網站布局。除 UI 外,插圖或圖形細節(jié)部門只要沒有干擾組件功能的話,在用色方面也沒什么限制。 06. 劃分布局 B-reel homepage 網站結構越簡樸,用戶瀏覽時就越利便 網站各個部門都需要施展各自的作用。對于用戶而言,每個部門都有各自存在的理由,并能得到相應的終極結果。布局需要匡助夸大其內容著重顯示該部門最重要的信息。實際上,一個頁面并不需要太多調用按鈕,因此每個內容都應推動到終極“我可以在此實現什么目的”。 思索一下,你可認為一個簡樸的目標構想到的最簡樸的布局,并開始添加所需組件。最后你會驚喜的發(fā)現簡潔也并非易事。 07. 重新思索已建內容 search button 我們真的還需要一個搜索按鈕嗎?在大多數情況下,謎底是不。 作為設計職員,我們構建了用戶瀏覽互聯網的方式,需要采取多少步驟才能執(zhí)行一個簡樸的操縱以及網站的復雜性都是由我們來決定的。我們一直都在遵循一些設計模式和慣例,由于它們切實有效,但有時候只是由于沒人有足夠的時間進行衡量或者重新思索。重新思索組件上已建的交互模式,并看看是否可以進行改進,這點至關重要。 08. 自我挑戰(zhàn) 我鼓勵每位設計職員不要墨守成規(guī),而是在每個項目長進行自我挑戰(zhàn)。并非每個項目都要求立異,因此,需要我們自己決定是否要增加一些交互設計相關的內容。好比,各種自我挑戰(zhàn)可能包括使用新的網格系統、創(chuàng)建新的組件,或者甚至包括一些小挑戰(zhàn),諸如避免混合模式或者避免使用特定的顏色。 09. 留意細節(jié) game work in progress 正在進行的游戲項目:細節(jié)視圖 這條也算是須生常談了,但并非始終在成品中得到應用。根據項目的概念,“關注點”也會有所不同。 可以注重小型交互、意想不到的動畫或審美感慨感染,例如按鈕上的小漸變或是背景盒子附近的微妙筆畫之類。但是總的來說,假如你樂在其中,這種感慨感染非常重要,而且非常天然。 10. 當真對待每個組件,就當參加設計比賽 video component 注重每個組件,一加一大于二 我必需承認這并不是我首創(chuàng)的理論。過去曾在 Fantasy Interactive 上聽到這種說法,當時我就震動了,這句話如斯明確中肯。每個組件都需單獨設計,使其卓絕超凡。有時候,設計師會將一些部門歸為最不重要的內容,終極并不會對其引起正視。 11. 進步設計作品清楚度 blurry pixels 避免泛起像素恍惚的現象,嘗試準確設置筆觸效果和背景之間的對比度或背景顏色 除美學考量之外,有些共同的題目需要予以避免,從而創(chuàng)造出一個干凈準確的作品。嘗試進步設計清楚度時應留意以下幾點:梯度條帶、恍惚的邊沿、字體渲染選項(部門字體取決于字體大小,最好在特定的渲染模式下查看)以及與背景融合的筆觸效果。 以上列出了一些基本留意事項,但實際上需要留意的題目還有良多。務必以整體視角檢查設計,看看是不是都非常完美,然后再單獨分析每個組件還有什么題目。 12. 收拾整頓 PSD 假如你通過 Photoshop 進行設計,那么這點至關重要(結合網格使用)。不管項目有多大,有多少設計師介入其中,你都需要保證文件干凈。這樣就能保證不同部門都能輕松導出,從而進步設計流程的速度,并能處理與其他設計師共享的文件。 13. 設計最好的情況,但為最壞的情況做預備 Clear app 謹記不同設備和尺寸大小上如何讓你的設計施展作用 作為設計師,我們的工作就是通過不同的限制解決題目。網頁設計過程中,會碰到各種限制,包括概念和技術題目以及內容相關的題目。 我們需要創(chuàng)建一個網站,其不僅可以在理想狀態(tài)下運行,同時也可以在最糟糕的環(huán)境下運行。例如,用戶可使用相稱小的屏幕查看網站,此時網站上的內容看起來支離破碎。 但是,鑒于我們展示設計作品的目的,我個人強烈建議為其創(chuàng)建最佳環(huán)境。因此我們將要顯示最理想的內容量,同時以最佳瀏覽器尺寸進行展示,也就是用戶最常用的環(huán)境。 14. 陷溺于設計,因愛生恨 假如你鉆研設計,我保證你已經干過這種事。只要完成一項設計就會倍感自豪,設計已經成為糊口的一部門了。還會截圖,與其他設備比較,將其設為桌面背景,甚至打印出來掛在墻上。 整個過程中,我達到某個臨界點,終極產生厭惡;我開始發(fā)現各種缺點和錯誤,然后進行修改。不喜歡自己以前的設計是成熟的表現,也就是說,你終極發(fā)現自己的題目。 15. 與客戶交流前避免鋪張?zhí)鄷r間設計概念 提交交互概念或設計外觀與體驗時,你需要確保你和客戶盡快同步。初始概念通過審核后,你可以稍作放松,然后開始設計。 但是假如提交后初始概念后,并未深得客戶的歡心,你就應該收集各種反饋,以便第二次提交的概念方案能夠符合客戶的要求。 16. 和你的開發(fā)者成為摯友 developer Rafael Mumme 開發(fā)者創(chuàng)意十足,而且熱愛自己的工作,和你一樣。但是他們并非老是在項目一開始就介入其中,而且大多時候,他們都是在概念設計敲定之后才開始介入設計的,因此他們的創(chuàng)意工作就遭到了扼殺。這種流程是錯誤的;一些非常優(yōu)秀的想法主意都是開發(fā)團隊提出的。分享你的概念,你會驚喜地發(fā)現他們會把它變成更加美觀、更加便于設計。 17. 展示:說明時請將受眾想象為四歲兒童 展示作品和設計作品一樣重要。使用錯誤的展示方式,可能會埋沒優(yōu)秀的設計或者使其慘遭淘汰。謹記,受眾第一次看到你的設計時,并不了解你了然于心的各個重點。 18. 肯定自己的創(chuàng)意,但不要成為其奴隸 了解何時宣傳自己的創(chuàng)意,或是了解團隊或客戶何時會產生不合,這里存在一個小小的臨界點。作為設計師,你需要堅信自己的設計,但是你也應樂于接受他人意見,快速改變自己的創(chuàng)意以及展開后續(xù)調整。不要健忘條條大路通羅馬。 19. 開發(fā)過程中跟進設計 假如您在廣告公司中工作,你必需明白,固然你剛剛完成的一個項目已經投入開發(fā),你不得不參加另一個新項目的設計,這是家常便飯。大家普遍以為 PSD 和樣式表提交后就萬事大吉了,這是分歧錯誤的,實在一切還剛剛開始。 假如你真的關心自己的設計和交互理念是否完全貫徹,可以實時與開發(fā)者友人溝通,并盡量提供匡助,以便達到至臻至美的效果。 20. 逐步正在設計的作品 style sheets 與大家分享樣式表和正在設計的組件 作為設計團隊的一員,我們不僅但愿看到終極的成品,同時也想看一看正在設計的作品。有時候,出于種種原因,項目最優(yōu)秀的部門可能會被忽略,然后一直存放在歸檔文件夾中。項目完成并獲得客戶/制作方認可后,可以著手進行改善,如有可能,可以創(chuàng)建案例研究,分析設計中的作品以及終極并未采用的作品。這有助于匡助拓寬團隊知識,同時你也能收集寶貴的反饋意見。 Claudio Guglieri 目前在紐約國際電子廣告公司 B-Reel 就任藝術總監(jiān)。之 前在 Fantasy Interactive 任藝術總監(jiān),負責領導和制作客戶端交互體驗,如 Google、EA CNN、Nikelodeon、History Channel、Range Roverand Microsoft。如有任何題目,可 @claudioguglieri。 |