存儲縱

㈠ 設計師必懂的PS技能：設計中的橫縱比例

圖像豐富的內容推動網站參與度，使訪問者可以細讀它們的樂趣。但是，即使只是首頁上的圖像，也要確保將所有面向視覺的內容質量最大化。因為無論您是處理照片、插圖還是視頻，拉伸、擠壓或裁剪不當的圖像，都會給訪問者留下不好的印象，並影響他們在網站上的整體體驗。

確保這些圖像正確顯示是設計的關鍵部分。確定寬、高、比，在各種設備上獲得最佳觀看效果對設計師來說既是一件苦差事，也是一項挑戰。但今天的響應式設計工具和一系列免費的寬高比計算器，可以確保圖像和視頻文件在任何地方都以最佳視覺顯示。

什麼是縱橫比?

在最基本的方式中，縱橫比是圖像的寬度和高度之間的關系。因為縱橫比反映的是圖像的比例，而不是它的大小，所以縱橫比無論大小都保持不變。

例如，正方形圖像的縱橫比為 1:1，因為其高度和寬度相同。無論圖像有多大，該比率都將保持不變。320x320px 的圖像與 1080x1080px – 1:1 的圖像具有相同的縱橫比。

對於非正方形的圖像，即各種尺寸的水平或垂直矩形，縱橫比可能會有所不同。攝影、視頻和其他，基於圖像的設計工作中使用的常見縱橫比包括 4:3、3:2 或 16:9，這是許多寬屏設備，如電視和台式計算機的基本比例。

雖然圖像的縱橫比來自其高度和寬度的關系，但該比例的多個子集也有助早汪鋒於定義圖像比例。

像素縱橫比

像素縱橫比 (PAR) 是指構成圖像的單個像素的比例。像素通常是方形的，這導致像素長寬比為 1:1。但是針對某些類型的顯示器優化的圖像也可以具有長寬比為 4:3 或類似的矩形像素。

顯示縱橫比

顯示縱橫比 (DAR) 是與設計師最相關的一種縱橫比，也是最常與通用術語相關聯的一種。顧名思義，顯示縱橫比是指圖像在各種屏幕上顯示的比例。

某些設備(例如相機和電視)具有固定的 DAR，因此為了使圖像在這些設備上顯示良好陸晌，它們需要針對特定的縱橫比進行優化。例如，要在監視器或電視屏幕上顯示的寬屏視頻的典型顯示縱橫比是 16:9。

當在這些設備上顯示具有不同縱橫比的圖像時，它們看起來會失真。數碼單反相機感測器還具有固定的顯示縱橫比，用於控制相機拍攝圖像的保存和顯示方式。

存儲縱橫比

存儲縱橫比 (SAR) 是一個縱橫比公式，專門適用於編碼的數字視頻文件。SAR 是指視頻幀大小的寬度和高度關系，它需要在所有單個幀之間保持一致，才能正確顯示完整的視頻。在常用的公式中，對於大多數寬屏視頻，SAR x PAR = DAR。

縱橫比影響UI/UX設計

縱橫比在任何涉及以正確方式捕獲和顯示照片、視頻或其他類型的基於圖像的文件項目中都發揮著重要作用。

對於攝影師來說，相機的固定縱橫比會對照片的構圖以及稍後在其他設備上的顯示產生相當大影響。對於攝像陵搏師和任何處理幻燈片、動畫和其他運動項目的人來說，縱橫比是在寬屏和移動設備上正確顯示的關鍵因素。

轉向響應式網頁設計，確保內容在所有設備上正確顯示，有助於解決為單個圖像設置縱橫比的許多問題。

但即使在這些環境中，也可能出現問題，例如無法在不影響其內容或質量的情況下調整圖像以進行顯示。一個簡單的例子是當一個長寬比為 1:1 的方形圖像需要適合網站頁面上的矩形框時。為了適應不同的圖像尺寸要求，可能需要調整比例和尺寸。

在日益由圖像驅動的數字世界中，即使看起來稍微不成比例的視頻和圖像也會導致訪問者對網站產生負面印象——而那些明顯被迫採用錯誤配置的視頻和圖像甚至會干擾網站的可用性。

比例不當的產品圖片或用戶指南視頻太長而看不清會影響訪問者的意願和他們使用網站的能力。設計師、開發人員和任何處理圖像的人都需要知道縱橫比的工作原理以及如何操縱它們獲得最佳視覺效果。為了簡化這個過程，網路上出現了許多免費和付費的縱橫比計算器。

解決方案：縱橫比計算器

藉助一些簡單的數學運算，當然可以計算圖像的縱橫比並手動調整其大小。但是在處理來自多個來源的許多圖像時，這變得效率低下。

在眾多在線縱橫比計算器之一的幫助下，您可以為多種不同格式的任何圖像確定最佳縱橫比，從而使設計人員能夠充分優化每張圖像以獲得最佳觀看效果。

在線的網址：https://www.omnicalculator.com/other/aspect-ratio#how-to-calculate-aspect-ratio

要使用該平台，您需要知道以像素為單位的圖像解析度並選擇圖像出現的環境類型。然後計算器將結果作為最佳縱橫比返回。這不單對於圖像處理、對於視頻編輯也特別有用。

圖像編輯器具有縱橫比工具

其他圖像管理工具也可以幫助獲得正確的縱橫比。Photoshop等圖像編輯器提供的模板設計時考慮了最佳縱橫比，適用於典型情況，例如設計網站橫幅、標題或社交媒體配置文件。大多數標准視頻編輯軟體還允許用戶確定和調整要作為視頻中單獨幀包含的圖像的縱橫比。

比例正確、顯示良好且性能良好的圖像是各種企業的強大工具。獲得正確的縱橫比可以使圖像無論在何處顯示都看起來不錯。無論您是網頁設計、APP設計、處理照片、插圖或視頻都可以吸引訪問者並保持他們的活躍度與留存率。

通過這種方式可以輕松確保圖像的大小和比例正確。

使用圖像填充，您可以從多種設置中進行選擇，這些設置允許您調整圖像大小或裁剪圖像，同時保留其縱橫比以實現完美定位。

想學習PS么？想入門UI設計師行業么？

PS免費教程： PS教程全套，零基礎也能學會的ps教程

UI入門學習路線： 設計師必學的18款軟體全家桶