网页设计简约
重点 (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.mzph.cn/news/276105.shtml
如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!