網頁設計簡約
重點 (Top highlight)
Minimalism is synonymous with simplicity. Not quite. As the name suggests, minimalism is definitely not about opulent design. But the assumption that minimalism is design-less and plain is also wrong. Minimalism is simple yet highly complex. Of course, there are countless definitions of minimalism. Here is one of the most apt ones:
極簡主義是簡單的代名詞。 不完全的。 顧名思義,簡約絕對不是華麗的設計。 但是,極簡主義是無設計的,樸素的假設也是錯誤的。 極簡主義既簡單又高度復雜。 當然,有無數的極簡主義定義。 這是最合適的一種:
Minimalism. A school of abstract painting and sculpture that emphasizes extreme simplification of form, as by the use of basic shapes and monochromatic palettes of primary colors, objectivity, and anonymity of style. Also called ABC art, minimal art, reductivism, rejective art. — Sitepoint
極簡主義。 一所抽象繪畫和雕塑學校,強調極端簡化形式,例如使用基本形狀和原色的單色調色板,客觀性和風格的匿名性。 也稱為ABC藝術 , 極簡藝術 , 還原 主義 , 排斥藝術 。 - Sitepoint
極簡主義如何演變? (How did minimalism evolve?)
Art and architecture before the 1920s was characterized by the playful patterns and lavish ornamentation of Art Nouveau or Art Deco. In the Arts and Crafts movement, gilding and expensive materials made for good design. This was followed by the Bauhaus era, a counter-movement originating in Germany that aimed to produce simple design with affordable means and resources. Their motto “form follows function” was influenced by the simple designs of the Dutch movement “De Stijl”. The style was often not understood by the broader public and was described as sparse or bare.
1920年代以前的藝術和建筑以新藝術運動風格或裝飾藝術風格的俏皮圖案和豪華裝飾為特征。 在Craft.io美術運動中,燙金和昂貴的材料制成了不錯的設計。 緊隨其后的是包豪斯(Bauhaus)時代,這一反動運動起源于德國,旨在通過負擔得起的手段和資源生產出簡單的設計。 他們的座右銘“形式遵循功能”受到荷蘭“ De Stijl”運動的簡單設計的影響。 這種風格通常不為廣大公眾所理解,被描述為稀疏或裸露。
A few decades later, artists rediscovered this direction and Minimalism was established. Minimalist artists asked themselves the question: How much can you strip off an object — painting, sculpture, building, furniture — without losing its essential purpose and identity?
幾十年后,藝術家重新發現了這個方向,并建立了極簡主義。 極簡主義的藝術家們問自己一個問題:在不失去其本質目的和特征的情況下,您可以剝離多少物體(繪畫,雕塑,建筑物,家具)?
“Strip everything down to its essential quality and achieve simplicity”
“將所有內容降低到其基本質量并實現簡單性”
Minimalism influenced all arts and technologies in the late 20th century. A hero of Minimalism was the German architect Ludwig Mies van der Rohe (1886–1969). He is considered a key figure of minimalism and one of the fathers of modern architecture with its clear forms. His primary principles were the reduction of architectural structures to a minimum and the use of a lot of open space. The basic principle of his work was “less is more”.
極簡主義在20世紀后期影響了所有藝術和技術。 極簡主義的英雄是德國建筑師路德維希·密斯·凡·德·羅(Ludwig Mies van der Rohe,1886–1969年)。 他被認為是極簡主義的關鍵人物,并且是其清晰形式的現代建筑之父之一。 他的主要原則是將建筑結構減至最少,并使用大量開放空間。 他工作的基本原則是“少即是多”。
Barcelona Pavilion, Barcelona, Spain. An incredible and timeless masterpiece of modern architecture from 1929. An inspiring building with extreme attention to detail and simplicity.
巴塞羅那館,西班牙巴塞羅那。 這是1929年以來令人難以置信且永恒的現代建筑杰作。這棟令人振奮的建筑特別注重細節和簡約。
From architecture to product design: Steve Jobs is often referred to as a design pioneer, yet he himself did not want to use the word design. His principles were also initially concerned with one thing: functionality.
從架構到產品設計:史蒂夫·喬布斯通常被稱為設計先驅,但他本人并不想使用“設計”一詞。 他的原則最初也與一件事有關:功能。
“Design is a really loaded word. I don’t know what it means. So we don’t talk a lot about design around here, we just talk about how things work. Most people think it’s about how they look, but it’s about how they work” — Steve Jobs
“設計是一個真正的詞。 我不知道這是什么意思 因此,我們在這里沒有太多關于設計的討論,我們只是在談論事物的工作方式。 大多數人認為這與他們的外表有關,但與工作方式有關” –史蒂夫·喬布斯(Steve Jobs)
Example from product design: Apple reduces its devices to the essentials. Obsolete buttons are not to be found here.
產品設計示例:Apple將設備精簡了。 在這里找不到過時的按鈕。
A recommendation for web designers: Planning with Mies van der Rohe and Steve Jobs in mind
網頁設計師的建議:考慮Mies van der Rohe和Steve Jobs的規劃
One could say that the principle of user experience is based on Jobs’ principles. Applied to web design this means pushing the limits in trying to find the absolute minimum of the content we need in order to convey a clear and concise message. This means leaving out everything that could possibly distract from the actual message.
可以說用戶體驗的原則是基于喬布斯的原則的。 應用到網頁設計中,這意味著在試圖找到我們需要的絕對最小內容以傳達清晰,簡潔的信息時要加倍努力。 這意味著將可能干擾實際消息的所有內容都排除在外。
Minimalism in web design results from the subtle use of fine lines, geometric shapes and short, concise texts with well-selected typography. Hidden content, accessible by clicking on abstract symbols, as well as subtle nuances and barely noticeable graphics further strengthen the minimalist character.
網頁設計中的極簡風格源自對細線,幾何形狀和簡短簡潔的文本的精心使用,以及精心選擇的字體。 隱藏的內容(可通過單擊抽象符號訪問)以及細微的細微差別和幾乎看不到的圖形進一步增強了極簡風格。
簡約網頁設計的主要功能 (Key features of minimalist web design)
1.原則1:不要害怕空白! (負空格) (1. Principle #1 Do not fear empty space! (Negative space))
When everything inessential is stripped away, empty space is left around a graphic object. It is this very space that makes minimalist design what it is.
除去所有無關緊要的內容后,圖形對象周圍會留有空白空間。 正是這個空間使簡約設計成為了現實。
When a website has an adequate amount of white space, you will get a calming, relaxing feeling. It brings peace to the room, in other words.
網站上留有足夠的空白時,您會感到平靜,放松。 換句話說,它為房間帶來了寧靜。
In minimalist design, the main purpose of the negative space is to draw the viewer’s attention to a specific point and guide him or her through the site. Some people consider the negative space just as important for the design as the content; the images, the graphic elements and the text. Nevertheless, this same freedom forces us as web designers to be more precise with the objects we choose.
在極簡主義設計中,負面空間的主要目的是將觀眾的注意力吸引到特定點上,并引導他或她瀏覽網站。 有些人認為負面空間對于設計和內容同樣重要。 圖像,圖形元素和文本。 然而,這種自由迫使我們作為網頁設計師對所選擇的對象更加精確。
2.原則#2排版就像精美的藝術品 (2. Principle #2 Typography is like fine art)
Minimalism thrives on well-selected typography. Since text is one of the few elements used to dominate negative space, it becomes much more valuable as a graphic element. In minimalist web design, in general, less text should be used. In addition, it is more likely to work with few fonts but with different font styles.
極簡主義在精心挑選的版式上蓬勃發展。 由于文本是用于控制負空間的少數元素之一,因此它作為圖形元素變得更加有價值。 通常,在簡約的Web設計中,應使用較少的文本。 另外,它更可能使用少量字體但使用不同的字體樣式。
Typography is a separate area, which will be improved by a lot of experience. However, typography is indispensable for websites.
印刷術是一個單獨的領域,它將通過大量的經驗得到改進。 但是,排版對于網站來說是必不可少的。
“Typography is the craft of arranging type with the goal to make language visible. We arrange type multiple times throughout the day; whether we are writing essays, summarizing meeting minutes or creating slides for a presentation. Unfortunately, we usually end up thinking more about what we write than how we write it. And, most importantly, how others will read it.“ — Typogui.de
排版是一種旨在使語言可見的排版方法。 我們整天安排多次打字; 無論是寫論文,總結會議記錄還是為演示文稿創建幻燈片。 不幸的是,我們通常最終會思考的不是寫方式,而是寫的內容。 而且,最重要的是,其他人將如何閱讀它。” — Typogui.de
The typeface Helvetica, the most used typeface of the 20th century, for example, is a relic from 1960, the beginning of minimalism.
Helvetica字體是20世紀最常用的字體,它是極簡主義開始于1960年的遺物。

3.原則3:明智地選擇圖像 (3. Principle #3 Choose images wisely)
To the inexperienced eye, a page can already be considered professional by selecting good images. However, images should be used rather sparsely for minimalist web design. If images are used, then each one should be carefully selected. As for the style of the images themselves, many believe that flat images or images without three-dimensional shading and lighting are a standard for minimalist design. This may be true but is not always the case.
對于沒有經驗的人來說,選擇好的圖像已經可以認為頁面是專業的。 但是,對于極簡的網頁設計,應該很少使用圖像。 如果使用圖像,則應仔細選擇每個圖像。 至于圖像本身的樣式,許多人認為平面圖像或沒有三維陰影和照明的圖像是簡約設計的標準。 這可能是正確的,但并非總是如此。
4.原則4:正確選擇顏色 (4. Principle #4 Choose colours correctly)
A common assumption is that minimalist design only works through black and white or in grayscale. But this is not the case. Although monochrome design is often used, this is not a requirement for minimalist design. Similarly, a page is not automatically minimalist just because the images appear in black and white. Traditionally, minimalist designs are based on a moderate colour spectrum, typically consisting of two or three colours. Another tactic is the use of monochrome shades of grey and another colour tone that is only used specifically for highlights and as a link or hint colour. This can also be a signalling colour.
一個普遍的假設是,極簡設計僅適用于黑白或灰度。 但這種情況并非如此。 盡管經常使用單色設計,但這不是簡約設計的要求。 同樣,頁面不會因為圖像以黑白顯示而自動達到最低要求。 傳統上,簡約設計是基于適度的色譜,通常由兩種或三種顏色組成。 另一種策略是使用單色的灰色陰影和另一種色調,該色調僅用于突出顯示并用作鏈接或提示色。 這也可以是信號色。
Another elegant solution is colour palettes in pastel shades. These have relatively high luminosity and low saturation.
另一個優雅的解決方案是柔和色調的調色板。 這些具有相對較高的發光度和較低的飽和度。
Web designers should define their colour palette at the beginning of the creative process and save it as a colour palette in the CMS software, such as WordPress. This way no deviations are risked and the entire website follows a uniform colour scheme.
Web設計人員應在創作過程開始時定義調色板,并將其另存為CMS軟件(如WordPress)中的調色板。 這樣就不會有偏差的風險,并且整個網站都遵循統一的配色方案。
5.原則#5通過結構保持一致性 (5. Principle #5 Consistency through Structure)
Minimalist websites are often highly artistic and generally, there are no boundaries to creativity. However, it is important to ensure that the website does not neglect its main task: information. The users should find their way around easily and follow a logical structure without concentrating too much. The user experience should not be hindered by the design. Maintaining a simple and very clear visual hierarchy is another essential feature of minimalist design. Here, both the high amount of negative space and the few elements within it can be an advantage. It has been proven that users navigate mainly in F-shape (from left to right, top to bottom), as demonstrated by the Nielsen Norman Group. This occurs even in mobile use, where users “scan” vertically even faster than in desktop view.
極簡主義的網站通常具有很高的藝術性,一般來說,創造力是沒有界限的。 但是,重要的是要確保網站不忽略其主要任務:信息。 用戶應輕松找到自己的出路,并遵循邏輯結構,而不必太專心。 設計不應該妨礙用戶體驗。 保持簡單和非常清晰的視覺層次是極簡設計的另一個基本功能。 在這里,大量的負空間和其中的少量元素都是一個優勢。 如尼爾森·諾曼集團(Nielsen Norman Group )所展示的,事實證明,用戶主要以F形導航(從左到右,從上到下)。 甚至在移動使用中也會發生這種情況,在移動應用中,用戶進行垂直“掃描”的速度甚至比在桌面視圖中更快。
In general, many websites work with a grid for laying out the page design. This can also be deliberately broken or exceeded to create intentional asymmetry. A good introduction to the use of grids can be found on Material.io.
通常,許多網站都使用網格來布局頁面設計。 這也可以故意破壞或超出以產生故意的不對稱性。 在Material.io上可以找到關于網格使用的很好的介紹。
Minimalist design is surprisingly complex. But when used well, it provides the perfect combination of aesthetics, usability and site speed thanks to the sparse use of images. This leads to intuitive and unrestricted user experience.
極簡主義的設計非常復雜。 但是,如果使用得當,由于圖像的稀疏使用,它提供了美學,可用性和站點速度的完美結合。 這導致直觀和不受限制的用戶體驗。
However, before starting the design phase, the following questions should be clarified: What is the aim of the planned website? Should it sell anything? If so, what? Should it inform? If so, what about? What kind of conversion should be achieved? Only once these insights have been found the creative process should begin, with constant reference to the findings.
但是,在開始設計階段之前,應先闡明以下問題:計劃網站的目標是什么? 它應該賣什么嗎? 如果是這樣,該怎么辦? 它應該通知嗎? 如果是這樣,那又如何呢? 應該實現哪種轉換? 一旦發現了這些見解,就應不斷參考發現,開始創作過程。
Today’s web designers often have to be artists and designers, but at the same time, they have to become technology specialists. But we should always remember the principles of the design pioneers:
當今的網頁設計師通常必須是藝術家和設計師,但與此同時,他們必須成為技術專家。 但是我們應該永遠記住設計先驅的原則:
“Less is more” — Ludwig Mies van der Rohe (1947)
“少即是多” —路德維希·密斯·凡·德·羅(Ludwig Mies van der Rohe,1947年)
“Form follows function” — Louis H. Sullivan (1896)
“形式遵循功能”-路易斯·沙利文(Louis H. Sullivan)(1896)
In conclusion, minimalist design can be highly aesthetic; however, if the user experience fails, users will quickly exit the pretty page.
總之,極簡設計可以具有很高的美感。 但是,如果用戶體驗失敗,則用戶將快速退出漂亮頁面。
Needless to say, there are also voices against minimalism in web design and a group of “hamburger deniers”. More about the advantages and disadvantages of minimalism and the obstacles in web design in my next article.
不用說,在網頁設計中還有反對簡約主義的聲音,還有一群“ 漢堡包丹尼爾 ”。 在我的下一篇文章中,將詳細介紹極簡主義的優缺點和Web設計中的障礙。
翻譯自: https://uxdesign.cc/minimalist-web-design-5-principles-for-minimalism-in-web-design-4a7d4be5d93f
網頁設計簡約
本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。 如若轉載,請注明出處:http://www.pswp.cn/news/276105.shtml 繁體地址,請注明出處:http://hk.pswp.cn/news/276105.shtml 英文地址,請注明出處:http://en.pswp.cn/news/276105.shtml
如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!