標準尺寸的網站：特點，要求和建議

網站技術開發 - 一個非常多面的過程。 然而它的所有階段可以分為兩個主要部件 - 的功能和外護套。 或者，如在介質網站管理員分別求結束和前端。 誰在web開發工作室買了他們的網站，人們往往天真地認為，有必要只注重功能性，這將是一個正確的決定。 但是，這是一個非常，非常罕見的情況屬實，通常在beta測試階段的項目，初創企業。 平面設計和用戶界面的其餘部分只是有義務遵守Web開發標準和舒適。

面向界面設計師，或設計者第一基石 - 是網站佈局的寬度。 畢竟，這是必要提請接口她。 直覺上有兩種方法 - 要么做出單獨的佈局每一個流行的屏幕分辨率，也可以為所有地圖創建站點的一個版本。 這兩個選項是錯誤的，但首要的事情。

在你永遠需要的部位像素標準寬度

在此之前的適應性佈局質量的現象的發展一直是一個網站的發展與成千上萬個像素寬的。 這個數字被選定為一個簡單的原因 - 該網站被放置在任何屏幕上。 並有一定的邏輯關係，但是讓我們假設一個人仍然是在桌面上至少HD顯示器。 在這種情況下，你的佈局會顯得細小條在屏幕上，這裡的一切都在一個樁成型的中間，並在巨大的非空間的兩側。 現在讓我們假設一個人從在寬度800像素的屏幕平板來到你的網站，並在設置檢查“顯示網站的完整版。” 在這種情況下，您的網站也將顯示不正確，因為根本不適合在屏幕上。

從這些方面考慮，我們可以得出結論，對於佈局的固定寬度，我們只是不適合，你想找到另一種方式。 讓我們來分析每個屏幕寬度的獨立構思佈局。

佈局於各種場合

如果您選擇的策略為所有屏幕尺寸在市場上創造的佈局，那麼你的網站將是最獨特的互聯網。 畢竟，今天這是根本不可能覆蓋設備的整個範圍，企圖使每個選項的具體設置。 但是，如果你專注於最流行的顯示器分辨率和屏幕設備，這個想法是很好的。 它唯一的缺點 - 財務費用。 畢竟，當設計師界面設計師和編碼器將被迫5或6次，以完成同樣的工作，該項目將花費不成比例原本種植以預算價格。

因此誇版本不同屏幕的豐富的可除了網站，odnostranichniki其目的 - 賣一個產品，一定把它做好。 好吧，如果你不是那些登陸之一，多站點，它突出的另一個原因。

網站最流行的尺寸

在兩個極端之間的妥協是佈局的三個或四個繪圖 屏幕尺寸。 其中一個必須是用於移動設備的佈局。 其餘的需要被改編為小型，中型和大型的桌面屏幕。 如何選擇網站的寬度是多少？ 下面我們提供服務未經登記HotLog統計五月2017年，它向我們展示了設備的不同屏幕分辨率的普及的分佈，以及在這一指標變化的動態。

從表中可以了解如何確定要使用該網站的大小。 此外，可以得出結論，目前最常見的格式是在1366屏幕由768個點。 這些屏幕安裝在預算的筆記本電腦，讓他們的知名度是很自然的。 下一個最流行的是全高清顯示器，這是電影，遊戲的黃金標準，並因此創建站點佈局。 此外，在我們看到表允許移動設備360°×640像素，以及桌面的各種實施方式和移動屏幕之後。

設計佈局

所以，分析統計後，我們可以得出結論，該網站的最佳寬度有4個變化：

1. 版本的筆記本電腦，擁有1366像素寬。
2. 全高清版本。
3. 800像素的寬度尺寸佈局在小型桌面監視器顯示。
4. 手機版的網站-寬360像素。

假設我們決定要使用的源代碼生成的尺寸為網站的內容。 但是，這樣的項目將仍然是昂貴的。 因此，考慮更多的選擇，這時候不使用固定的寬度。

做一個靈活的佈局

目前，我們只需要調整屏幕的最小尺寸的另一種方法，以及網站的龐大規模會問個百分點。 在這種情況下，接口元件，如菜單，按鈕和標誌，可以在絕對項中定義，著眼於以像素為單位的屏幕寬度的最小尺寸。 與內容塊，與此相反，將按照每屏幕區域的寬度的百分之指定拉伸。 這種方法允許檢測不到該網站的大小作為設計師，打這個細微的人才制約。

什麼是黃金比例，以及如何使用網頁的佈局？

即使是在文藝復興時期的許多建築師和藝術家試圖給他的創作完美的形狀和比例。 若有關於這樣的比例的影響問題，他們把所有科學的皇后 - 數學。

自從古代的天由我們的眼睛感知是最自然而優雅，是因為它在自然界中普遍存在的比例發明的。 這一比例的計算公式的發現者是一個叫做菲迪亞斯一個有才華的希臘建築師。 據計算，如果大部分比例的涉及低作為一個整體提供了一個更大的，那麼這一比例將看起來很好。 但在這種情況下，如果你要非對稱分裂的對象。 這個比例後來成為所謂的黃金比例，這仍然沒有高估世界文化史上的重要性。

讓我們回到網頁設計

這很簡單 - 用黃金比例，可以設計，這將是最令人愉快的人眼的頁面。 根據黃金分割的公式計算，我們發現 無理數 1.6180339887 ......，但為了方便，你可以使用的1.62舍入值。 這將意味著我們的頁面區塊應該是62％，而整體的38％，無論什麼規模生成的源代碼，您正在使用該網站。 例如，你可以在以下方案請參見：

新技術的使用

現代科技佈局的網站讓您準確傳達設計師和設計師的想法，所以現在你能負擔得起的比在互聯網技術的黎明更大膽的想法實現。 不再需要太多的困惑在什麼應該是一個網站的規模。 隨著這樣的事情塊來臨 自適應佈局， 內容和字體動態加載，網站開發已經成為很多次更愉快。 畢竟，這些技術有限制少，即使它們。 但你也知道，但不限於，就沒有藝術。 我們建議您使用一個真正的創意的方法來設計-黃金分割。 有了它，你將能夠有效並很好地填補了工作空間，無論你在你的模板問什麼大小或網站。

如何提高工作區網站

機會是，你不會有足夠的空間，以適應小尺寸的佈局中的所有界面元素。 在這種情況下，你將不得不開始創造性地思考，或比你以前那樣更具創造性。

該網站上盡可能最大的自由空間，躲藏在彈出的菜單導航。 這種做法是符合邏輯的，不僅移動，而且在桌面上使用。 畢竟，用戶並不需要所有的時間來看看什麼對你的網站的標題 - 它已經到來的內容。 用戶希望得到尊重。

的隱藏菜單的好方法的一個例子是下面的佈局（如下圖所示）。

在上 紅色的角落 區域，可以看到一個十字架，點擊了一個小圖標隱藏菜單上，只留下用戶與網站內容。

然而，這是可選的，你可以離開導航，始終是遙遙無期。 但是，你可以把它美麗的設計元素，而不僅僅是一個對流行網站的鏈接列表。 使用除了直觀的圖標，以文字鏈接，甚至取而代之。 它也可以讓你的網站添加到您的設備上更有效地利用屏幕空間。

最佳網站 - 自適應

如果你不知道該選哪一個為網站的佈局，只為你所有。 為了節省開發成本，同時不會失去，因為糟糕的佈局對一些設備的觀眾，使用自適應網頁設計。

自適應稱為設計，看起來在不同設備上同樣出色。 這種方法可以讓你的網站是清晰，便於甚至一台筆記本電腦，至少在平板電腦上，甚至在智能手機上。 它實現了這一效果是由於自動切換到屏幕寬度的工作區域。 採用自適應樣式表的網站，你正在服用了正確的決定可能。

什麼不同版本的網站的可用性的自適應設計區別

響應式設計是從移動站點，以便在後一種情況下，用戶收到一個HTML代碼，它是從桌面不同不同。 這是從視圖優化服務器的性能，以及搜索引擎優化的角度是不利的。 此外，越難以根據不同版本的網站要考慮的統計數據。 自適應方法是缺乏的缺點。

適應性不同的設備由於通過在可用空間的傳輸塊的佈局寬度或百分比（在垂直平面內，而不是在桌面上，水平智能電話），或通過創建各種畫面的各個佈局實現。

您可以了解更多關於響應式設計，並從書本發展就可以了。