当前位置:首页> 2018

这5种网页设计已过时了!

发布者:乾学教育 发布时间:2018-5-21 122浏览

Design trends have to be used cautiously. Just as quickly as many trends come into fashion; they can fall out of favor and make a design feel dated.

设计趋势必须谨慎使用。就像许多流行趋势一样迅的速流行起来;但是他们可能会失宠,让设计感觉过时。


Don’t ignore them completely — testing out trends can stretch your creative muscles and help you create something you might not have tried otherwise. But do be aware of what’s fresh, what’s timeless, and what’s out of date! Here are five design trends that are over (or should be anyway).

不要完全忽略设计趋势 - 测试趋势可以伸展你的创造力,帮助你创造一些你可能没有尝试过的东西。 但要注意什么是新鲜的,什么是永恒的,什么是过时的! 这里有五个设计趋势已经过时(或者应该是)。


1、“复古”设计


For a while, it seemed like every design trend started with “vintage.” Vintage typography. Vintage color. Vintage textures.

The problem with the vintage styles is that the elaborate look is just too much. Characteristics of vintage elements include:

有一段时间,似乎每一个设计趋势都是从“年份”开始的。老式的版式, 葡萄酒颜色, 复古的纹理。复古风格的问题是复杂的外观太多了。在现代和简约的大趋势之下,这些复古元素已经开始让人觉得格格不入了。 复古元素的特点包括:


Rough overlays on images and type

粗糙的图像和文字


Scripts and typefaces with plenty of flourishes, swashes and tails.

带有大量装饰性笔触和花边的手写字体


Overlays to add sepia or old-style coloring to images

暗哑的配色


Highly textured backgrounds

高度纹理的背景


While none of these techniques is inherently bad, they present challenges for website design. The primary concern is readability. With so many things happening in the design, it can be more difficult for users to understand the message at a glance. 

虽然这些手法都是很不错,但它们给网站设计带来了挑战。极简风格受到大家的喜欢很大程度上是因为它们在功能性和可读性上的突出表现。相比之下,过于复古的元素常常会在直观性上不如简约现代的设计,这也是影响它流行性的一个重要原因。


2、超细字体


It might have been one of Apple’s biggest mistakes of all time – using a super thin, condensed typeface in its OS. And while Apple scaled back immediately because of readability issues, thin typefaces started popping up everywhere. And plenty of websites still use them.

这可能是苹果公司一直以来最大的错误之一 -在操作系统中使用超细字体。当苹果因可读性问题而更换字体后,超细字体字体已经流行开来,而且很多网站仍然使用它们。


Thin type is difficult to read on screens.
超细字体在屏幕上很难阅读。

From backlighting to screen size to lack of contrast between text and other elements, thin typefaces just don’t have a real place in most website projects.

超细字体虽然看起来足够优雅,但是在背景和前景色彩对比度不足的时候,整个阅读体验几乎是灾难性的。

If you are still using a font with a thin stroke or a variant that’s ultra-light or condensed, consider adjusting the typeface to the regular version. More website designers are leaning toward larger typefaces in general and bumping up the weight can make all the text in the design feel a little larger without a full makeover.

如果你的网站正在使用的文本字体是超细的版本的话,尽量先替换为同族字体中常规粗细的版本。如果你有观察过最新的网页设计作品的话,会发现现在网站字体的笔触几乎没有用超细的,而且在字号上还会设置得比以往更大。

 

3、轮播首图


How many times do you actually click on one of the images (or multiple images) in a hero image slider?

你真的回去主动点击轮播首图呢?尤其是当其中有六张甚至更多不同的高清大图的时候?


Most users don’t regularly engage with this design technique. And there’s data to back it up. The Nielsen Norman Group did a study back in 2013 that found that users ignore these sliders and that often a slider makes it more difficult to find important information.

绝大多数的用户只会是看看而已。早在2013年的时候,Nielsen Norman Group 就为此做过一项用户调研,发现即使这些首图足够大,用户也常常忽略,因为轮播图这种设计本身就很难让用户关注到其中的关键信息。


What you should do instead is plan for one key piece of content with a call to action in the hero header location. Don’t overwhelm users with multiple options. (If you must have multiple header elements, consider manually changing a single content element on a regular schedule.)

相比之下,如果将首屏的轮播图替换成单个首图,并且搭配上CTA按钮,效果会好很多。用户不再会被多个首图进行信息轰炸,而单一的选择给用户的路径也更为清晰直观。


The problem with these auto-play sliders is that you don’t know when a user will land on the content. For many users, as soon as they see something that might be of interest, it moves away to the next thing. Finding the element that was interesting is often too much work for a user to invest in and you’ve just lost that person’s attention.

对于绝大多数的用户而言,他们会看到自己感兴趣的内容就会点击。这些自动轮播的多图首屏所带来的一个直接的问题就是在于,你根本不知道用户会点击哪张图片,用户因此可能会错过他们感兴趣的内容,如果他们愿意探索,轮播图带给他们的工作量又会相对较大,也就是说这种设计本身就容易失控。

Instead opt for a highly interesting photo or video. Consider a cool animation or illustration. Don’t try to cram six different messages into one website location. It’s not something you’d try to do anywhere else in the design, so why is it so common on the homepage?

选择一个覆盖面较广的高清大图、插画或者较短的背景视频,相比于6个轮播图所带来的效果会更加直观有效,也更加富有凝聚力。


4、高清视频背景


Full-screen movie style video can be engaging, but it doesn’t work for the way many users digest web content.

全屏电影风格的视频可以吸引人,但它不适用于许多用户消化网页内容的方式。


The trend leans toward more high-resolution viewing. That works great for users on large screens with super-fast internet connections. For everyone else, the experience falls flat with lagging load times, video glitches or moving content that’s not viewable on mobile devices.

更重要的问题在于,现如今对于媒体素质的要求越来越高,当你使用视频背景的时候,它必须是高清的。对于桌面端用户而言,在光纤加持下,等待几秒加载一个高清视频背景并没有太大压力,可是对于移动端用户而言,这个视频媒体就是个超重的媒体内容了。视频背景的体验会非常令人着急。


These are all problems you don’t want to have because they can impact whether users stick around to interact with the content or not.

这些都是您不想出现的问题,因为它们可能会影响用户是否坚持使用。

The other problem with heavy video content is sound. Too many sites rely on video that has an audio component that ties everything together. While audio works some of the time, not all users will want to listen to a video. (Think of how many people are surfing the web at work; they probably don’t want the person next to them to hear an auto-play video running.)

Scale back on big video or design it so that it isn’t the only first impression the website makes. A long loading animation is not a substitute for loading quickly.

高清视频背景给用户带来的问题不止是这一点。许多时候,视频所带来的附加媒体就是声音,但是在很多场合下,用户是不想也不愿意听到声音的。有的直接是因为设备原因,无法播出音频。不论是何种原因,用户的需求和实际的体验无法真正对接起来。


A dive into your website analytics will tell you whether heavy video is working or not. But a better option of most websites is to include a lightweight video on the homepage that provides a glimpse into the content and allow users to click into a more immersive video experience.

尽量让视频背景不要成为网站体验的唯一支撑,或者主要的设计元素。使用它来营造第一印象,最终所导致的结果,其实很难说。


5、超多的图标

Stop going crazy with icons in design projects.

在设计项目中停止疯狂的图标。


While a great set of icons can be a useful tool, only use them when they are commonly understood and serve a purpose. Just packing the design with icons to create visual elements isn’t useful.
虽然一套很棒的图标可以成为一个有用的工具,但只有在通用的理解和服务的目的下才能使用它们。 用图标打包设计来创建视觉元素是没有用的。


Most websites only need a handful of icons – for social media, shopping carts, search, etc. And they don’t have to be big or fancy. A simple set of solid icons is enough.

大多数网站只需要少数几个图标 - 用于社交媒体,购物车,搜索等。而且它们不必是大的或者花哨的。 一组简单的图标就足够了。


Remember why you are using icons in the first place. They serve as commonly understood directional cues for users. Icons shouldn’t be a dominant part of the design; they should be subtle, simple and almost fall into the background.

记住你为什么使用图标。 它们作为用户最容易理解的提示。 图标不应该是设计的主要部分; 他们应该是微妙的,简单的,差不多融入背景的。


While oversized icons were fun for a while, the biggest issue was that the trend was severely overused. It seems like every site that didn’t have good images or video was using an icon-based design. Everything started looking too similar because of the nature of icons; they are designed to have universal meaning.

必须承认,图标很好用,但是现在我们所看到的大量图标都是处于被滥用的状态,而非合理的运用,这导致图标最终沦为了视觉装饰。不过,这种局面最终还是得到了改善。


结论

Make sure to pay attention to your designs when it comes to trendy elements. Use them sparingly and with classic design pieces so that your projects don’t get dated in a hurry.

谈及时髦和流行的元素的时候,我们一定要多留一个心眼。勇于尝试新事物,也要密切关注它是否已经开始过时。这样才能让你的设计项目恰到好处。

热门文章

南京苏州各大高校寒假时间表新鲜出炉(文章)免费

乾学原创课程26已学习