網(wǎng)頁設(shè)計是一個多變的產(chǎn)業(yè)。就像其他所有的藝術(shù)表現(xiàn)形式，網(wǎng)頁設(shè)計經(jīng)歷了一個令人驚訝的快速持續(xù)發(fā)展。一旦愛好者樂園，它已成為一個成熟的富人中具有較強的審美和功能的吸引力。事實上，我們正在經(jīng)歷什么，可能是網(wǎng)頁設(shè)計 - 或至少是最好的時期黃金時期迄今。我們有我們的處理（對CSS3，HTML5的，字體嵌入等），一個免費提供資源，強大的設(shè)計界也大量強大的新工具（如果你需要更多的?。┛煽康腤eb標準支持的主要瀏覽器。

我們看到更好的互動設(shè)計，更美觀的設(shè)計。而我們看到更多的個人，從事和令人難忘的網(wǎng)站，太。但究竟是什么使不同？哪些新的方向是Web設(shè)計在今天的標題？有什么新技術(shù)，概念和想法正在成為重要的？在這篇文章中，我們提出關(guān)于網(wǎng)站設(shè)計的現(xiàn)狀提出一些看法。我們描述 現(xiàn)有的和即將到來的趨勢 并解釋如何網(wǎng)頁設(shè)計可能演變在今后幾個月甚至幾年。我們也將觸及我們作為Web設(shè)計者應(yīng)準備，以隨時掌握新的挑戰(zhàn)和機遇。

1。設(shè)計迪萊特

作為設(shè)計師，我們的工作是有效地溝通思想。對于每一個特定的信息，我們創(chuàng)建了一個環(huán)境中工作的消息將最好的，指導(dǎo)用戶實現(xiàn)他們的任務(wù)，贏得他們的信任或有說服力的任何我們溝通他們。當然，有無窮的方法來創(chuàng)建此背景下。其中之一是為視覺美感，驚喜，歡樂的設(shè)計，幸福 - 足以怡情，設(shè)計; 設(shè)計是令人難忘和卓越。

有吸引力的東西更好地工作，幫助重點，保持用戶的關(guān)注。增加興奮難忘的設(shè)計和品牌的產(chǎn)品，從而增加接觸。事實上，一個強大的，可靠的客戶和他們之間的關(guān)系，觀眾的情緒可能是有史以來最好的事情發(fā)生在你的事業(yè)。

Brizk設(shè)計工作室 有一個驚人的美學設(shè)計，微妙的動畫，漂亮的印刷字體和一個干凈的布局。當您在頁腳中，Twitter的一個小盒子，揭示紅色鳥翱翔。一流的設(shè)計，是一個純粹的喜悅。

雖然絕大多數(shù)的品牌仍然保持沉默，被動和客觀的，我們已經(jīng)看到更多的網(wǎng)站，很努力地從事我們的感官，無論是通過一個強有力的美感，通過詼諧的動畫內(nèi)容塊，或只是通過一個小的額外注意小在“關(guān)于”頁面設(shè)計元素。這種設(shè)計美觀，瀏覽的樂趣，但最重要的，令人難忘 - 原因很簡單，他們是不同的。通過增加愉快的個人接觸到您的設(shè)計，從你站在人群中，給游客講的東西與朋友和同事對和共享。這是一個良好的開端。

您可以引起多種設(shè)置在喜悅：在您的維護模式頁，404錯誤頁面，在你的前裝載機，和世界各地。這樣做是為了給他們一些驚喜愉快談?wù)動慰汀?/span>

邦蒂貝弗
邦蒂貝弗是一家飲料公司，擁有一個美麗的網(wǎng)頁設(shè)計。除了其微妙的懸停效果和動畫，網(wǎng)站有一些不錯的演員：如果你用鼠標向下滾動的輪子，一個小彈出的頁面手動出現(xiàn)詢問您是否需要一個升降機。印刷術(shù)是強大的，令人難忘，設(shè)計是好玩。簡單，明確和個人，該網(wǎng)站留下了強烈的積極印象。

Analog.coop
模擬提供了一種非常的親身經(jīng)歷向旅客。當您訪問的頁面，它會顯示您所在，并告訴你誰是最親密的團隊在我們的例子中，艾倫和喬恩，誰是大約500英里以外的布里斯托爾到您（會員）。該網(wǎng)站有一個很好的復(fù)活節(jié)蛋是不是在第一眼看到的情侶。你可能想發(fā)揮與團隊的標題和照片左右。該網(wǎng)頁是有趣的探索。

Forrst
美麗的設(shè)計有吸引力的視覺元素和原始的導(dǎo)航 - 設(shè)計，管理，使良好的持久的印象。請注意如何在頁面上面積變化的背景時，瀏覽器窗口大小調(diào)整（視差效果）。在“盒子”日志是很冷靜，太。出人意料的是，形式是建立與某種原因表。

比利坦普林
在他的博客，比利坦普林集中在他生活中的小勝利。每一個職位記錄了個人的成就，顯示一個自定義設(shè)計的徽章，也是值得征服的解釋。比利整個網(wǎng)站使用這個比喻，“超級網(wǎng)絡(luò)能力說話”（敏捷的CSS，PHP的準備，IE6的增強，等等）和“英雄設(shè)計實力”（人性化的宗旨，銳意創(chuàng)新的細節(jié)，等等）。他還對網(wǎng)站上的個人投資組合。請注意好配色方案適合的主題。設(shè)計簡潔，美觀，和“成就”，是不尋常的轉(zhuǎn)折，令人難忘。

混合
混合實驗室，一個社區(qū)為設(shè)計人員和Web開發(fā)人員的博客，沒有隱藏的功能，吸引人的動畫或懸停效果顯著。相反，它有一個一致的，視覺吸引力的設(shè)計：你能現(xiàn)場豐富多彩的地點和方式往往是整個網(wǎng)站界重復(fù)？設(shè)計強調(diào)的內(nèi)容，具有個人風格。簡單美麗。

藍天簡歷
這是在寫簡歷時有一個小團隊的網(wǎng)站在設(shè)計好的不同尋常的演員夫婦：標頭包含一個基于Flash的云動畫完全符合該公司的品牌。該網(wǎng)站也有微妙的動畫和軟懸停效果。和“關(guān)于”頁面介紹了一個令人難忘的方式相當原始和每個同事。

Mailchimp
MailChimp大量采用了在其設(shè)計的各個方面猴子的比喻。最近的更新通知客戶，Mailchimp目前的ASCII動畫，告訴用戶在什么背景下發(fā)生的，這是令人驚訝的還不錯的細節(jié)不顯眼。該公司還使用個人的，友好的，甚至有時令人討厭的語言在處理用戶的需求。這是圖像的一部分，MailChimp若有所思在Web應(yīng)用程序保留。

大版本

進一步閱讀

• 52周的UX操作系統(tǒng)：設(shè)計喜悅
  這篇文章解釋了足以怡情，設(shè)計的重要性和特點，嘗試一些網(wǎng)站進行用戶的感官。
• 糖果在眼國防部長
  研究證明，有吸引力的東西更好地工作。我們?nèi)绾握J為不能脫離我們的感覺如何。下一次的老板，客戶或同事嘲笑的概念，美是很重要的界面設(shè)計，其皮珀斯點這里。
• 看起來很重要，因為我們都感覺
  論述了情感在設(shè)計和美學的重要性。

2。按鍵導(dǎo)航

作為設(shè)計師試圖使他們的設(shè)計更直觀，這是毫不奇怪的網(wǎng)站變得更加敏感。這不僅適用于用戶界面在現(xiàn)代Web應(yīng)用程序（即正變得像桌面應(yīng)用程序強大 - 而且往往更聰明），但隨著JavaScript庫的廣泛應(yīng)用，“經(jīng)典”網(wǎng)站正變得更強大和互動，也。其中一個方法，使網(wǎng)站更加敏感，通過“按鍵導(dǎo)航”，這并沒有被廣泛沿用至今。但是最近我們已經(jīng)看到更多的設(shè)計方案有效地執(zhí)行這個。對這類導(dǎo)航最流行的設(shè)置，如Flickr或FFFFound在照片的網(wǎng)站。

總的想法是讓用戶的鍵盤快捷方式，幫助他們執(zhí)行諸如博客文章之間航行，繁瑣的任務(wù)，通過圖像移動的幻燈片，改變當前視圖（從水平到垂直網(wǎng)格），喜歡文章和章節(jié)之間的導(dǎo)航，例如一個網(wǎng)站。按鍵導(dǎo)航在Flash為基礎(chǔ)的設(shè)計常見的，但我們現(xiàn)在看到它適用于基于CSS的設(shè)計，也。 谷歌閱讀器 是先進的按鍵導(dǎo)航最好的例子，但其他網(wǎng)站有良好的實現(xiàn)，也。

它們使企業(yè)應(yīng)用
一兩個月前，他們讓企業(yè)應(yīng)用開始作為替代傳統(tǒng)的滾動為用戶提供平穩(wěn)和先進的鍵盤導(dǎo)航。用戶可以切換使用兩頁的主要導(dǎo)航下拉菜單模式。在“鍵盤導(dǎo)航模式，”用戶使用箭頭鍵來瀏覽內(nèi)容塊之間;“返回”鍵觸發(fā)了詳細查看和“逃避”返回到首頁。由于某些原因，該導(dǎo)航再也無法使用。

圖片來源

瘋狂- ar.ch
馬克安東達門的網(wǎng)站是基于Flash的，它的導(dǎo)航是很先進的：用戶可以直接進入以“C”與“ - ”和“+”，然后規(guī)模圖像的聯(lián)系方式導(dǎo)航和排序圖像，并通過文字滾動的垂直箭頭鍵。

圖片來源

9GAG
9GAG是一個社會書簽網(wǎng)站的形象。用戶可以瀏覽到下一個和以前的圖像使用的“j”和“k”分別。目前的圖像可以被否決了用“升”（愛）：沒有鼠標滾動必要的。在這種情況下，一到網(wǎng)格視圖中，快捷將是很有用。

FFFFound！
第一次社會書簽網(wǎng)站的形象之一，F(xiàn)FFFound提供快捷跳轉(zhuǎn)到頁的頂部（為“H”），改變圖像的視圖（“V”形），瀏覽圖片（“K”版和“j”）和跳到下一個頁面（“升”）。

羊乳酪
還有一個基于Flash的網(wǎng)站，可以讓您使用左，右箭頭鍵來瀏覽一節(jié)項目，向下鍵選擇和行動的關(guān)鍵回去。

紐約時報：時代斯基默
紐約時報快速瀏覽頁面已經(jīng)非常先進的導(dǎo)航按鍵。用戶可以使用箭頭導(dǎo)航部分，放大使用“轉(zhuǎn)變，”回歸與“噸之上，”刷新“R”的文章中，用選擇當前節(jié)“1”和箭。學習的關(guān)鍵是有點費時，但一旦你有他們，在瀏覽網(wǎng)頁是容易得多。

Pictory
PictoryMag，致力于照片故事一本雜志，也有“J”的和“k”導(dǎo)航，瀏覽圖片。

CrushLovely
CrushLovely，一個單頁的投資組合，讓您使用箭頭鍵來瀏覽的網(wǎng)頁板塊。

一個生活的思考
想了生活讓用戶使用左，右箭頭，導(dǎo)航功能之間的報價。

野餐Extraterrestre
除了從最不尋常的，我們已經(jīng)看到迄今設(shè)計之一，伊萬費雷羅的野餐Extraterrestre有相當先進的按鍵導(dǎo)航。設(shè)計模仿圖文電視和做了很好的工作。所有導(dǎo)航項目可以加載使用數(shù)字快捷鍵?，F(xiàn)在的樂趣！

編碼技術(shù)和教程

請注意，當實施你的設(shè)計按鍵導(dǎo)航，請確保您定義的快捷方式不會與通用的瀏覽器快捷鍵，操作系統(tǒng)快捷鍵，屏幕閱讀器的快捷方式或用戶定義的快捷鍵沖突。這聽起來可能比簡單的。像往常一樣，廣泛的測試（有精明和新手用戶）實施前將幫助你找到你的快捷方式問題。這是安全的假設(shè)上的箭頭鍵，“J”型和“k”組合和“逃避”的關(guān)鍵是安全的。另一方面，使用“控制”，“Alt”鍵和“移”鍵不建議。

此外，認為這是額外的（因此可選）功能，將不會提供給用戶誰在他們的瀏覽器禁用JavaScript的按鍵導(dǎo)航。因此，強烈建議你提供一個次要的，不是小學，導(dǎo)航層鍵盤導(dǎo)航。下面，你會發(fā)現(xiàn)一些有用的技巧，教程和實施你的設(shè)計按鍵導(dǎo)航參考。

• 使用jQuery添加鍵盤導(dǎo)航
  本視頻中介紹了如何實現(xiàn)鍵盤導(dǎo)航移動滑塊向后和向前。該演示和代碼都可用。
• 如何創(chuàng)建按鍵導(dǎo)航使用jQuery
  本教程介紹了如何實現(xiàn)按鍵導(dǎo)航，瀏覽網(wǎng)站的部分。
• 先進的導(dǎo)航按鍵與jQuery
  你可以使用鼠標來選擇鏈接，但你也可以使用箭頭鍵（即向上和向下）瀏覽列表中。這個腳本是位高級由于額外的功能，當用戶將鼠標懸停和結(jié)合按鍵。
• 在JavaScript中使用鍵盤快捷鍵
  在這篇文章中，您將學習如何使用JavaScript的鍵盤快捷鍵，有和沒有jQuery框架。
• 如何建立一個與鍵盤導(dǎo)航網(wǎng)站：密碼為HTML
  本文探討了如何添加鍵盤導(dǎo)航網(wǎng)站使用JavaScript的一些簡單的線條。首先，您將創(chuàng)建一個簡單的主題，在Photoshop中，然后轉(zhuǎn)化為一個工作網(wǎng)站，提供鍵盤功能，它跳頁。

插件和有用的資源

• js中，熱鍵：跨瀏覽器的Javascript的jQuery插件可連接鍵盤事件
  該jQuery.Hotkeys插件可以讓你輕松地添加和刪除代碼中的任何地方鍵盤事件的處理程序，它支持幾乎任何鍵組合。綁定和解除綁定的熱鍵組合需要一行代碼。
• 鍵盤導(dǎo)航的jQuery插件
  鍵盤導(dǎo)航的jQuery插件，提供了網(wǎng)頁元素被導(dǎo)航能力，并通過鍵盤上的箭頭鍵激活。
• 熱鍵：可編程鍵盤快捷鍵與原型js中圖書館
  熱鍵提供的功能類似的訪問，但關(guān)鍵屬性，為更多的鍵盤驅(qū)動的接口細粒度控制讓許多增強功能。
• 檢測擊鍵：參考表
  檢測用戶的擊鍵原來是一對事件處理的專業(yè)機構(gòu)。這頁的詳情更惱人的一些問題，包括強制兼容表。

3。平面設(shè)計的影響

而喜悅的設(shè)計主要是意想不到的喜悅和涉及到的設(shè)計，現(xiàn)代的Web設(shè)計人員對旅客留下深刻印象往往走一步，實驗與他們工作的基本細節(jié)，產(chǎn)生更多的創(chuàng)造性和獨特的布局。事實上，一個沒有被專家看到了傳統(tǒng)印刷的網(wǎng)頁設(shè)計技術(shù)日益增長的影響力。他們往往體現(xiàn)在所謂的“藝術(shù)指導(dǎo)的”博客文章（或“blogazines”），即每一個博客帖子有一個獨特的設(shè)計和精心制作的。

這些網(wǎng)站的布局往往類似于印刷雜志或海報的人，以醒目的標題，多列文本，突出顯示報價，縮進文本，支持圖像，圖片的標題說明和腳注。這些設(shè)計通常堅持電網(wǎng)和有強大的，生動的版式。

設(shè)計線人：基于網(wǎng)格的網(wǎng)頁設(shè)計，簡體 有一個簡單干凈的兩列布局，明確區(qū)分開來說明文字。注意，在作者的姓名的大寫字母的頭下，亦在網(wǎng)頁上的報價設(shè)計可見。這里的內(nèi)容決定了布局。

在大多數(shù)情況下，藝術(shù)指導(dǎo)的設(shè)計是助長純粹的野心和他們的創(chuàng)造者的決心。這樣的設(shè)計主要是發(fā)現(xiàn)（自由職業(yè)者作為個人網(wǎng)站的項目成果），很少發(fā)現(xiàn)在企業(yè)設(shè)置。更廣泛的主要障礙是這些技術(shù)的采用，這種設(shè)計（或相當?shù)膶嵤┡c（X）HTML和CSS）的創(chuàng)作是費時。藝術(shù)指導(dǎo)的布局是相當困難的代碼和維護，而且往往需要內(nèi)聯(lián)CSS樣式，否則設(shè)計師將結(jié)束與聯(lián)合國在其語義類幾十個樣式表了。此外，這些頁面上整合廣告是困難的，因為他們把設(shè)計師的設(shè)計難度。因此，在目前，這些設(shè)計更多的是因為不經(jīng)常更新網(wǎng)頁，開銷適當。

如果您決定與藝術(shù)指導(dǎo)的設(shè)計性實驗，都知道，一篇文章的布局中，應(yīng)一如既往地支持內(nèi)容本身，而不是支配它。問題是，一旦你開始設(shè)計一個博客帖子，很容易重復(fù)設(shè)計的頁面元素只是因為你可以，不是因為它的內(nèi)容支配。事實上，設(shè)計界正對是否藝術(shù)指導(dǎo)的設(shè)計，只是進行的辯論“過度Photoshop處理的文章“純粹為設(shè)計而設(shè)計。

好的設(shè)計是關(guān)于有效的溝通，不能以犧牲易讀性裝飾。正如舊金山Inchauste所說，“我認為這是一個'二'樣的情況下挑選。選擇是：偉大的內(nèi)容，偉大的藝術(shù)指導(dǎo)和定期的時間表。如果您嘗試將達到三個，其中之一將開始下降短?！暗拙€：網(wǎng)絡(luò)是深受影響，設(shè)計印刷設(shè)計是美麗的，但只有當您的文章的技術(shù)支持。

關(guān)于如何做一個小人課
以獨特的布局多姿多彩，很好地說明了文章。請注意不尋常的東西？ 該設(shè)計基于表的布局。設(shè)計有一個與實際信息，圖形表格數(shù)據(jù)位的CSS布局。有時候，這對藝術(shù)指導(dǎo)的設(shè)計需要。

埃文迪恩斯莫爾：21
該網(wǎng)站海報設(shè)計。這個博客帖子很簡單，它以生動的圖片替換疲倦純文本。但是，這可能是一個缺點，太：一種基于文本的版本將更加方便用戶瀏覽。

粗體斜體：博士感覺良好
一個非常令人印象深刻的雜志一樣的布局，多列，圖像，標題和補充工具欄。如果你只看到打印出來這個頁面，你就不會承認它作為一個網(wǎng)頁設(shè)計。該網(wǎng)頁有40 科 容器。

阿路返回：經(jīng)修訂的字體堆棧
一個很長，詳細和精心設(shè)計。在藝術(shù)指導(dǎo)的設(shè)計，包括這一個，大的圖像常常被用來推動布局的邊界。這種形象通常都是800至1000像素寬，填補了整個版面的寬度。

克里斯Coyier：在野生動物園的挑戰(zhàn)
這是一個微妙的設(shè)計，大幅度，多列文本，縮進標題和腳注。從審美的角度來看，它可能是一個從書頁。

凱爾菲爾德：保持好奇
一個經(jīng)典之作。你還記得那些使用大行情和視覺效果，以創(chuàng)建文本流的舊雜志？請注意好這個標題和colophone是問號的位置。好用，簡單，新穎的設(shè)計。

過夜：是我的鞋評析
一個簡單的基于網(wǎng)格的設(shè)計，合理的文字，鞋襯線字體和漂亮的插圖。不幸的是，對齊文本仍然無法在網(wǎng)絡(luò)上看起來非常好。

亞龍舍恩：太多的按鈕
有時候，藝術(shù)指導(dǎo)的博客職位要求的東西多一點：像一個背景圖像和bakground顏色，以及一個CSS的樣式位。這個例子正正體現(xiàn)了。

粗體斜體：請勿踐踏草地
另一個多列布局顯著的例子...

粗體斜體：灰姑娘的故事
...和另外一個。印刷設(shè)計靈感處于最佳狀態(tài)。

特拉維斯尼爾森：默認開關(guān)
一個平靜，簡單，簡潔的設(shè)計自定義標題。

進一步閱讀

• 超級神奇陳木川未來發(fā)展趨勢的博客
• 該鏜博客后死亡？
  一項關(guān)于這里的藝術(shù)指導(dǎo)設(shè)計的碎雜志的文章。
• 賈森圣瑪麗亞會談關(guān)于他的反思
• WordPress的藝術(shù)指導(dǎo)插件
• WordPress郵寄造型插件
• 候WordPress的插件
• 賈森圣瑪麗亞：本印刷設(shè)計的影響
• HeartDirected
  一個藝術(shù)指導(dǎo)的設(shè)計廊。
• 獨特的外觀設(shè)計條
  另一種藝術(shù)指導(dǎo)的設(shè)計廊。

4。 Horizontalism

在過去的一年中，我們觀察到的文本為主的網(wǎng)頁設(shè)計方向緩慢轉(zhuǎn)變。不僅是設(shè)計獲得深度和現(xiàn)實主義，但導(dǎo)航的變化中。一些設(shè)計師正在增加與滑動導(dǎo)航（如傳統(tǒng)的垂直滾動 這里），通常在一個縱向和橫向兩個方向滾動，甚至單純的橫向滾動。這就是所謂的“horizontalism?！?/span>

橫向滾動條網(wǎng)站已更加困難，因為導(dǎo)航是垂直滾動鼠標設(shè)計。但是，多觸摸設(shè)備的出現(xiàn)，迫使我們重新思考這些設(shè)計的可用性問題。畢竟，無論是用戶瀏覽垂直或水平對這種設(shè)備沒有真正發(fā)揮作用。和一些插件（如 滾動 和 jScrollHorizontalPane）簡化使用戶能夠通過瀏覽使用鼠標滾輪的標準垂直水平的行動，從而縮小了學習曲線。

橫向滾動條一直在那里走了十年，但今天它認為，他們得到了一個新的環(huán)境。對水平滾動條移動可能是在一些設(shè)計者試圖提供一個較為清晰的用戶體驗。這種設(shè)計通常是經(jīng)過精心策劃和主要網(wǎng)站和詳細的投資組合發(fā)現(xiàn)將給電子商務(wù)網(wǎng)站。無論horizontalism將擴大到更多類型的網(wǎng)站仍然將在今后幾個月出現(xiàn)。

一個生活的思考
這不僅文章討論有關(guān)可讀性的優(yōu)點和缺點horizontalism，但它也有一個不錯的水平布局本身，與多個文本列。雖然方向是不尋常的第一眼，看后很愉快，舒適。

OurType
阿與橫向的基于Flash的導(dǎo)航比利時型鑄造。內(nèi)容塊水平滑動。

榮格訴馬特
這個網(wǎng)站有一個導(dǎo)航水平的時間表。請注意，有沒有水平滾動條;旅客使用垂直滾動輪進行操作水平。

您的輔助
許多所謂的“單頁布局之一?！边@些網(wǎng)站的全部內(nèi)容是在單頁上，無論是導(dǎo)航使用鍵盤，鼠標或菜單（本網(wǎng)站使用了第三個選項）。在這里，我們有一個良好的（共同）的縱向和橫向?qū)Ш剑@示的組合 jQuery的ScrollTo插件 在行動）。

20六一
這個組合有不同類型的水平導(dǎo)航。除了“上一頁”和“下一步”按鈕，用戶也得到了在下拉菜單中選定內(nèi)容的概述。一旦他們選擇一個選項，頁面滾動水平。用鼠標滾輪導(dǎo)航水平可能會改善這種設(shè)計的實用性。

賈克斯葡萄園
此酒店網(wǎng)站導(dǎo)航有趣而獨特的水平，這是你瀏覽時觸發(fā)的葡萄酒目錄。無論是背景圖片和幻燈片的說明葡萄酒水平。簡單的CSS和JavaScript的使用。一個美麗動人的設(shè)計。

和C. L.霍洛韋
康迪斯霍洛韋的投資組合有一個很好的采取橫向布局。她的作品被放置在“墻”;水平導(dǎo)航作為一個藝術(shù)畫廊散步比喻使用。也很有趣：滾動觸發(fā)水平時，在你的鼠標懸停箭頭，沒有點擊必要的。

雅馬哈銀座
你會發(fā)現(xiàn)，隨著實驗的角度設(shè)計。有時，方向是對角...

Edpeixoto
...有時布局只是掛在空中...

的ASOS
...有時它的傾斜。請注意元素都沒有垂直線。

進一步閱讀

• Horizontalism和可讀性
• 周五關(guān)注的焦點：傾斜網(wǎng)頁設(shè)計
  一個設(shè)計展示的傾斜到一邊，避免垂直線。
• 橫向滾動網(wǎng)站：魅力和教程
• jQuery的ScrollTo插件
  這個插件可以讓用戶通過滾動滿溢元素和屏幕本身。你得到許多不同的自定義選項和多種方式來指定要在其中滾動的方向。

5。富強印刷術(shù)

印刷術(shù)發(fā)揮多年來在網(wǎng)頁設(shè)計的主要作用了。大膽，強烈，沉重的標題可以有效地傳達了一個電子商務(wù)網(wǎng)站或組合的目的，而微妙的結(jié)構(gòu)，內(nèi)容和標題幫助提高清晰度。顯然，大的變化，我們看到今天更豐富，更靈活的版式，部分可能由 @字體面對面 屬性和字體的嵌入服務(wù)，如TypeKit出現(xiàn)。豐富的排版元素現(xiàn)在可以選擇并從瀏覽器，這不是那么容易了幾年前復(fù)制。

未來是很大的，大膽的和排版。豐富的字體家庭將不僅用于頭條，但對身體的副本，使從排版印刷到網(wǎng)絡(luò)上的做法。此外，實驗設(shè)計者將更多的豐富，復(fù)雜的 襯線字體 而大膽，施加 板坯字體通過微妙的圖像支持。網(wǎng)頁設(shè)計師也增加了更多的深度與字體 文本陰影 對CSS3屬性。當然，這些細微之處是緊密聯(lián)系在一起的布局選擇。這些排版設(shè)計往往是基于網(wǎng)格和借鑒平面設(shè)計之技術(shù)，如圖片的標題說明和注解。

我們還注意到，設(shè)計師是延長其字體棧，添加越來越多的后備，以防字體一個指定的字體不可用。這很好，因為長寬比（或重量的字體），只要不是太不同，一些屏幕字體將出現(xiàn)更廣泛的或比其他字體更高，因此有一個較大的長寬比，這意味著有些用戶將看到您的網(wǎng)頁比別人更小的字體大小會。你可能想閱讀更多關(guān)于CSS的字體在棧 拉斯威克利的演講。

基爾安穆施泰爾
基利安穆施泰爾使用相當?shù)臄U展serif字體堆棧他的設(shè)計： 字體家庭：帕拉提諾，“帕拉提諾行型活字”，“書安蒂奎”，康士坦奇亞時代，“宋體”，襯線;。在基爾安的博客也有圖片的標題說明該職位。

extrapolish
請注意，這個網(wǎng)頁設(shè)計的一個波蘭機構(gòu)的網(wǎng)站文字設(shè)定首都大部分：導(dǎo)航菜單，介紹性文字，甚至聯(lián)系地址是在充分的首都。然而，平靜的設(shè)計，清潔和拋光。

達爾文的DNA
本網(wǎng)站已在其整個設(shè)計只襯線字體： 字體家庭：“skolar - 1”，“skolar - 2”，格魯吉亞，時代，襯線;。請注意，該文本分為列，我們并沒有看到這最后的一年。

COG'AOKE
同樣，巨大的，大膽的平板印刷術(shù)，使得一個強大的印象，從事觀眾。

TRüF
這種簡潔的設(shè)計機構(gòu)結(jié)合大膽的色彩選擇，同樣大膽的無襯線字體。

先鋒
這個網(wǎng)站結(jié)合了生動的圖像和版式嬉戲。設(shè)計看起來更像一本小冊子或超過“經(jīng)典”網(wǎng)頁海報。

科利
西蒙科利森的微妙注意最小的細節(jié)使排版字面上脫穎而出。沒有大膽的，尖叫排版這里只是清晰，美觀的設(shè)計。

圣約翰的圣經(jīng)
本網(wǎng)站顯示在其最好的襯線字體。配合主題的字體和布局完全適應(yīng)。公告有多好一個美麗的視覺設(shè)計和經(jīng)典的印刷術(shù)可以一起工作。

啤酒廠
一種類型和視覺效果不錯的組合使這個頁面顯著。但目前還不清楚為什么在頁面的標題有三個不同的字體，兩個就足夠了。

蜱對話
這能否得到任何大膽？大膽的字體大，在整個頁面與傳播大寫字母。當滾動頁面時，看到漂亮的背景效果。一個非常簡單和強大的設(shè)計。

德國SEW周刊
此博客已很好玩，對身體的邀請印刷術(shù)復(fù)制和標題科凱特（Proxima的新星），和它都可以輕松地選擇和復(fù)制。這是嵌入字體功率（TypeKit此處使用）。只有襯線字體使用： 字體家庭：“skolar - 1”，“skolar - 2”，格魯吉亞，時代，襯線;。公告文本分成列 - 再次，我們看到一種趨勢，僅此一年。

曼集團
本內(nèi)曼集團將其納入導(dǎo)航和頭版標題的品牌顏色。輕的字體和經(jīng)典，并給出了頁面的氣氛。

結(jié)論

現(xiàn)代Web設(shè)計更好，更豐富，更方便用戶使用。我們看到更好的美學為了取悅用戶體驗和視覺設(shè)計使用。從傳統(tǒng)的印刷設(shè)計技術(shù)正越來越多地應(yīng)用到網(wǎng)絡(luò)，無論是布局的技術(shù)或豐富的通用字體。橫向和對角線方向，甚至帶來新的視角，以平2 - D我們已經(jīng)看到了多年來用自己的文字為主的，基于Flash的網(wǎng)頁（設(shè)計）。

這些事態(tài)發(fā)展是對即將到來的時代，網(wǎng)頁設(shè)計，其中設(shè)計人員可以使用新的工具和技術(shù)，其最大潛力的跡象。網(wǎng)頁設(shè)計師應(yīng)該期待著激動人心和充滿希望的未來歲月。

?