是時候讓我們來討論一下關於網頁設計的中的首屏頁面的一些設計思路了。首屏頁面是多用户初步瀏覽您的網站所接觸的 “第一視覺”，它可以説是您的整體網站設計的門面工程了。無論多用户是從桌面裝置，平板電腦還是移動裝置訪問您的網站，所有內容都是在這個頁面上會被集中體現。

所以，您在這個 “第一螢幕” 中包含的資訊是網站設計成功的關鍵。該設計關係到您的網頁設計是吸引多用户停留並做出您預期的動作，或迫使他們離開您的網站。多用户開始滾動瀏覽之前需要在螢幕上展示什麼呢？讓我們來看看。

1. 建立一個獨特的首屏

所有的網站都是開始於第一印象的。所以，您需要建立一個有影響力，能夠在第一眼就吸引多用户的網站。

首先，您可以試着最大化您的視覺體驗——通過大尺寸且高清的照片，視訊或插圖，可以有效地吸引觀眾。您所選用的影象應該是人們不想停止觀看的，它應該完全具備您獨有的元素，以便使它區別於任何其他的網站設計。

您可以將影象與幾個關鍵詞相結合，告訴多用户他們是為了什麼來到這裏以及您的網站可以提供給他們什麼內容。

這是您將它們全部放在一起所應該考慮的事情：首屏的大小尺寸必須恰好適合所有終端裝置的第一個螢幕。所以您需要對內容進行響應式縮放，以便使整個影象和所有相關的內容文字在不滾動的情況下依然能在首屏清晰可見。

2. 導航應直觀

將導航放置在邊欄或螢幕頂部的日子一去不復返了。隱藏和彈出的導航樣式目前來看已經成為大勢，也被多用户們縮認可和接受 (部分歸因於移動裝置)，所有網站設計都是可以接受這種樣式的。

但不要完全隱藏導航或使其變得難以使用。不管您對漢堡風格的導航喜歡與否，您已經不能否認這種樣式導航已經成為隱藏導航中最主要的角色。多用户已經學會了使用它，並且可以輕鬆地在頁面上找到他們想要的東西。

您需要確保將導航收起的圖示放置在多用户容易找到的位置，您可以使其比典型圖示更大以增強他的存在感 (當然，不要做太過了)，並確保導航功能完全可用。在上面 Uve 的網頁設計中，它就做了一個優秀的示範。一個突出的漢堡包選單圖示，可以擴充套件到全屏選單選項列表。最重要的是，多用户不必猜測該如何使用它。

3. 建立一個關聯點

當您在您的網頁設計工作中思考應該如何設計頁面的時候，比如首屏，最重要的是建立單個焦點或實用信息。多用户有意或偶然地訪問了您的網站，他們最先需要的是清楚這個網站到底是做什麼的。

單一的視覺概念可以幫助多用户聯想 (或關聯) 出您是誰以及您局提示在做什麼。這可以通過多種不同方式的影象或文字來實現。

雖然複雜的設計風格也可以達到這種效果，但是何不開始思考簡單的方式呢。極簡主義既是時尚的，也是傳達資訊的有效途徑。

4. 有目的的使用文字元素

想想首屏作為一本書封面，而不是小説的第一頁。

它應該包括足夠的文字資訊來幫助多用户參與到裏面。一個簡單的標題和小的文字塊通常就足以做到這一點。雖然這個內容很少，但這可能是一個需要大量工作的過程。寫作需要簡潔，對於梳理出一套清晰的文字內容可能是具有挑戰性的。

以您的網站目標為準則。為什麼多用户在這裏? 您想要他們做些什麼? 使用文字建立該關聯性並開始講述您的故事。請記住向多用户展示您的網站相對於其他的同類網站具有哪些優勢或好處。

5. 給多用户一些要做的事情

網站設計提供獨特視覺體驗的同時，也需要提供一個理由給多用户，使他們能夠儘可能久的在您的網站上停留並瀏覽資訊。所以，當您在考慮您的網站設計應該在第一屏加入什麼元素時，切記要讓多用户可以參與到裏面。

行動可以包括：

填寫表單，例如提供電子郵件地址;

設定互動遊戲;

社交媒體上分享;

為了銷售而展示流動商品;

評論或參與內容;

觀看電影或輪播圖。

您的首屏不僅僅只是需要包含其中的一個操作，同時應該完全清楚您的操作是什麼以及多用户應該做什麼。 您的網頁設計不能讓他們感到是被迫做的。

在上面 The Big Short movie 的網站中，為多用户提供了大量的資訊。視訊剪輯足以使您對電影感興趣，並且有一個按鈕來觀看預告片。您對這個真實的故事感興趣嗎? 同時，頁面上還具備一個按鈕來於專家會面。您有沒有看過它，想分享您的想法? 這有社交媒體按鈕可以馬上幫您做到這一點。從一開始就有很多方法與網站進行互動。

6. 為品牌創造空間

如果您不知道自己的網站設計是為那一類多用户準備的，那麼這個網站可能不會如您預期的那麼有作用。基於這種考慮，您的首屏應該至少包括一個標誌或能夠關聯到您網站背後的品牌形象。

品牌或公司名稱可以產生很強的關聯性和可信度。這使得網站看起來更 “真實”(這對於包含任何型別的財務或個人交易的網站尤其重要，因為多用户關心具體是誰獲得了他們的資訊) 。

一些比較知名的品牌可以擺脱以上的束縛，因為許多人可能已經知道它們。而對於較小的品牌來説，我覺得是始終有必要的，清楚地顯示標誌和風格對於多用户關聯和信任的您的網站身份很重要。

7. 減少分心

在首屏的網頁設計中，不要給多用户太多可看的或過多需要處理的內容。它應該足夠簡單，精簡以及集中。

如果您有很多內容，請在多個螢幕上有條理的逐步展示 (這可以促進多用户的參與感，並防止混亂或混亂的網站結構) 。

Melanie DaVeid 做了一個優秀的示範，通過一個簡單的視覺呈現，使您對它的其他工作感興趣。通過動畫，顏色和特殊的文字組合，在首屏就為多用户創造了獨特的感覺。

總結

當分屏式設計迴歸時尚，我們在實際的網頁設計工作中對於這一方向的設計已經發生了一些變化。最好的網站設計使用響應式設計和滾動功能 (如視差) 來為多用户建立基於螢幕的體驗。

首屏作為您的 “門户”，可以説是最重要的一屏內容了。確保建立一個有趣，可讀性強以及擁有不同於其他網站視覺的效果，將多用户帶入您的網站。