网页设计中常出现哪些问题

网页设计中常出现哪些问题

当用户看到在屏幕上出现的表格时,他们的第一反应通常是“现在需要从鼠标切换到键盘了”。如果此时能将光标显示在第一个需要填写的区域内,用户操作起来就会感到更加便利。下面介绍网页设计中常出现哪些问题,希望对您有所帮助。

网页设计中常出现哪些问题

1、多级行为召唤

Call To Action, 通常被称为行为召唤,一般指的是引导用户做你想让他们做的事情,注册帐号,点击按钮,等等。在网站页面中,主要的行为召唤应只有一个主要的,要知道选择强迫症患者比你想象中的多很多,如果没有主要的、单一的行为召唤,用户会感到困惑,并需要较长的时间来做决定,再采取行动。当然,还有一部分用户会直接关闭页面走人。

将所有内容都摆到页面上,和什么都不放是一样的效果。移除多余的部分,筛选出最重要的东西摆上去,让用户做最重要的事情。无论是注册还是打开购买链接,把最具有吸引力和最有意义的按钮摆在最显眼的位置上,专注于最主要的事情吧。

2、对齐和留白的问题

留白,这个我们在说过,很多次了,在这里在说一下,对齐和留白。说留白和间距是一门艺术也不为过。留出足够的空间,又不让视觉元素周围的间距太多以至于过于稀疏,这是设计中最难控制的部分之一。优设有太多的文章介绍留白和排版的技巧,但若你不想记那么多复杂的技巧,给你推荐一个简单有效的方案:第一,要确保所有元素都合理而得体地组合到了一起,第二,在这组元素之外给出足够的留白。

3、不专业的文案

要写好文案并不是一件简单的事情。但是不论如何,你需要通过网站将你需要表达的内容呈现出来,特别是当你是想通过网站卖东西的时候。在这种情形下,你需要让你的文案易于被理解,精心校对,确保内容的正确性和准确性,不要有拼写错误。

4、可读性的问题

如果无法让人看清,再优秀文案都无法拯救你的业务。许多细小的细节会影响网站文本的阅读性,直接或者间接地影响你精心准备的内容,让它们难以被读者流畅地感知到。

要解决可读性问题,值得注意的问题很多。行高过低会让文字难于被阅读,太小的字体对于许多用户都是障碍,阴影、斜体等效果也常常会影响可读性(尤其是中文,繁体中文这种情况更严重),色彩对比度没控制好更是灾难性的。这其中有些问题虽然算不得太严重,对于多数用户也许不会造成太多障碍,但是这会让用户对你的专业性产生怀疑。

5、一致性的问题

你应该始终保持产品和品牌的一致性,从品牌设计、网站设计到社交媒体、包装和广告,都应该具备品牌识别度。

不过在实现这些远大的目标之前,先退一步来看,你有必要让网站本身先与自身保持一致性。你的网站字体的样式是否保持了一致?LOGO上的品牌用色与网站的配色方案是否对应?网站的各个元素的阴影样式是完全一样,还是“看起来很相似”?通常情况下,你只需要仔细清理你的CSS样式表,就可以解决许多一致性的问题。

6、已访问过的内容用不同颜色显示

如果网站不能显示出用户已经察看过的内容,用户在浏览网页时便会多出很多麻烦。相反,如果用户访问过的内容都能被清晰地标出,他们便不会错误地多次点击同一个链接了。对用户来说,一个网页上往往存在不止一个链接,如果没有特殊的方式显示已访问过的内容的话,他们很难记住哪些链接是自己已经点击过的,哪些没有。针对这个问题,可以使用不同的颜色来区分已访问和未访问的内容。已访问内容的显示颜色与未访问内容的颜色应该接近但又略有不同。例如,用紫色来标注已访问的内容不失为一种可行的办法,因为与蓝黑色相比较,紫色给人一种“消退”的感觉,用户会有“这个链接我已经点击过了”的印象。

7、填写表格时光标自动显示在输入区域

当用户看到在屏幕上出现的表格时,他们的第一反应通常是“现在需要从鼠标切换到键盘了”。如果此时能将光标显示在第一个需要填写的区域内,用户操作起来就会感到更加便利。这样的话,他们就省却了“移动鼠标–点击输入框”这一步骤,而可以直接在表格内填写内容了。谁不希望填写表格时更简便一些呢?

8、为图标添加自动提示问题

在网站中,图标可以优雅而简洁地将某个特定的动作信息传达给用户。但是要牢记,不是所有用户都能立刻明白图标所代表的意义。因此,当用户将鼠标置于图标之上时,随即显示关于这一图标所代表的功能就显得尤为必要。有了这个细节,网站的新用户即便不明白图标的含义,也不会因胡乱点击而导致错误了。

常见的网页设计错误

使网站太混乱和混乱

现代的极简主义风格的网站今天非常流行 - 但它不仅仅是一种时尚。曾经有一段时间,当更多人被认为是更好的时候,在那里你会建立一个引人注目的Flash动画网站,并用图像和文字覆盖每一页。幸运的是,我们了解到人们对在线快速查找信息更感兴趣。在前进之前,他们对筛选混淆的主页或等待观看动画或视频不感兴趣。

底线是你的菜单应该尽可能少的选项卡。应该很容易找到,并且您应该考虑找到一些测试版测试人员,以了解他们可以在网站中移动的速度。这样,您也可以在启动之前从真人中获得反馈。

利用可怜的号召性行动(或根本没有)

使用这些测试版测试人员,您可以快速了解用户是否正在转换 - 速度有多快。例如,您可能会立即意识到您没有在首页上提供号召性用语标题和按钮。在这种情况下,你的用户无处可去。即使您确实有号召性用语,也必须经常对文字,按钮颜色,尺寸和位置进行A / B测试。这会让你了解人们对CTA的反应。热图也是这方面的优秀工具。

提高设计速度

将速度看作比设计更重要的想法可能听起来很奇怪,但如果运行速度太慢,你不会让很多访问者访问一个漂亮的网站。托管与您的网站的速度有很大关系,所以找到一个托管公司可以处理您的流量。另外,您还需要使用精心编码和轻量级的插件,扩展和主题。没有什么比选择一个主题更糟,并且意识到它与您的网站代码冲突或迫使您的网站缓慢运行。

忽视移动设备的需求

由于许多人使用移动设备在线浏览和购物,许多专家认为,您的网站的移动版本比常规桌面版本更重要。这意味着您完成的网站需要一个移动版本,当检测到较小的设备时会自动加载。这不仅会让用户在使用手机和平板电脑时更高兴,但Google会注意到移动版本并可能会提高您的搜索排名。如果您正在从主题开始工作,请确保在购买前测试移动版本。大多数开发人员声称他们有响应式设计,但这并不意味着他们看起来或工作得很好。

用太多文本填充页面

文字非常适合标题和为用户(以及搜索引擎)提供有价值的信息。然而,你最好试着用媒体和文本的组合来传达你的信息。考虑一段与视频配对的小段落,其次是一些图片,体验将会如何更愉快。将它与一个由三个或四个段落组成的主页相比较,可以清楚地看出哪一个效果最好。

网站制作中哪些问题容易被忽略

在网站设计制作中,我们常常会忽略了一些细节问题,有些问题虽然不重要,但是不可忽略,今天我们就例举一些,网站制作开发过程中常忽略的细节问题。

一、不做404页面

404页面在网站建设中是很重要的一环,他承载着良好的用户体验,404页面通常是用户访问了网站上不存在的网页,服务器返回404页面,如果没有设置404页面,就会出现死链,蜘蛛爬行这类网站时不利于搜索引擎的收录,这也会造成用户的流失。

网页设计中常出现哪些问题

二、H1,H2标签随便乱用

H标签有六种,分别是h1,h2,h3,h4,h5,h6,权重从一到六逐渐递减,在网站优化中,我们会常用到h1标签,这个标签设置好,搜索引擎蜘蛛就会按照顺序进行抓取和爬行,在一个页面中h1标签只能出现一次,而其他H标签则没有限制,可以随便用。

三、网站的标题只展示了公司的名称

在网站的优化过程中,标题的选择很重要,很多客户不注意这一点,把网站的title简单的写成公司的名称或者网站的名称,所以这就造成了资源的浪费。

四、不进行网站用户体验

对于一个网站的好坏,一个网站的排名,用户体验才是获得转化的前提,如果一个网站不注重用户体验,那么这个网站就无法得到用户的青睐,即使推广再多,无法满足用户的需求,也不能带来足够的流量,即使有流量,转化率也很低。

五、元比较更改太频繁

在网站上存在很多比如Alt属性,h1,h2等元标记,这些内容往往很长时间内不会改变,很多客户在进行网站改版的时候,把这些标记都更改了一番,其实这样做是有一种审查机制,会认为的你网站是在转移高权重页面,可能会遭到搜索引擎的惩罚。

在修改的时候,最好进行偶有层次的循序渐进的更改,不能一次全部都进行修改,搜索引擎也需要一个转变的过程。

网页排版设计的小技巧

1. 减少不同类型字体的使用

使用超过3种不同的字体让网站看起来没有结构且不专业。记住,太多的尺寸类型和风格也可能破坏任何布局。

为了防止这种情况,尝试将字体数量限制在最小限度

一般来说,将字体数量限制在最小限度(两个很充足,通常一个就足够了),并粘贴相同的字体到整个网站。如果使用多个字体,请确保字体系基于字符宽度互相补充。以下面的字体组合为例。Georgia和Verdana(左)的组合具有相似的价值,配对的很和谐。比较与Baskerville和Impact(右)的配对,其中大大加重的Impact使与其对应的衬线字体没有光彩。

2. 使用标准字体

字体的嵌入服务(如Google Web Fonts或Typekit))可以为你的设计提供新鲜的和意想不到的许多有趣的字体。它们也非常容易使用。以Google为例:

选择任何字体,如Open Sans在HTML文档的中生成代码并粘贴。完成!

实际上,这种方法有一个很严重的问题:因为用户更熟悉标准字体,因此可以更快地读取它们。

除非你的网站对于自定义字体(如对品牌宣传或创建沉浸式体验)非常有吸引力,否则通常最好使用系统字体。最安全的方法是用一个系统的字体:Arial,Calibri,Trebuchet等。记住,好的排版可以吸引读者到内容中去,而不是排版本身。

3. 限制行的长度

每行拥有适当的字符数量是让文本具有可读性的关键。它不是你的设计,决定你的文本的宽度,它应该是一个可读性的问题。考虑Baymard Institute关于可读性和行的长度的建议:

“如果你想有一个好的阅读体验,应该每行约60个字符。每行拥有适当的字符数量是让你的文本具有可读性的关键。”

如果行太短,视线必须经常返回,这就会打破读者的节奏。如果一行文字太长,用户的视线将很难专注于文本。

对于移动设备,应该每行30-40个字符。以下是在移动设备上查看的两个网站的示例。第一个是使用每行50-75个字符(打印和桌面的每行最佳字符数),而第二个使是用最佳的30-40个字符。

在网页设计中,可以通过使用em或像素限制文本的宽度来实现每行最佳数量的字符。

4. 选择一个能在各种尺寸中工作的字体

用户会从具有不同屏幕尺寸和分辨率的设备访问你的网站。大多数用户界面需要各种大小的文本元素(按钮复制,字段标签,章节标题等)。选择一个能够在多种尺寸和重量上运行良好的字体以保持每个尺寸的可读性和可用性是非常重要。

确保你说选择的字体在较小的屏幕上清晰可辨!尝试避免使用草书的字体,例如Vivaldi(在下面的示例中):虽然它们很漂亮,但它们很难阅读。

5. 使用可区分字母的字体

许多字体让相似的字形很容易混淆,特别是与“i”和“L”(如下图所示)以及在字母间距较小的空间中,例如当“r”和“n”看起来像“M”。因此,在选择你的排版时,请务必在不同的文本环境中检查你的排版,以确保不会为用户造成问题。

6. 避免所有的大写

所有大写字母:意思是文本中的所有大写字母,在不涉及阅读的上下文中很好(如首字母缩略词或标识),但是当你的信息涉及阅读时,不要强制用户阅读所有大写文字。正如Miles Tinker所说,在他的具有里程碑意义的作品中,可读性的印刷,全部大写印刷与小写排版相比,大大地延缓了用户的阅读速度。

7. 行间距的重要性

在排版中,我们有一个特殊术语,用于两行文本之间的间距(或行高)。通过增加行高,可以增加文本行之间的垂直空白空间,通常提高可读性以换取屏幕空间。作为一个规则,行高应该是字符高度的30%,以提高可读性。

正如Dmitry Fadeyev所指出的那样,正确地使用段落之间的空白已被证明可以将理解提高20%。使用空白的技能在于为用户提供可消化量的内容,然后剥离无关紧要的细节。

8. 确保你有足够的颜色对比度

不要在文本和背景中使用相同或相似的颜色。文本越明显,用户就能更快地扫描和阅读它。 W3C建议对身体文字和图像文字的对比度如下:

与其背景相比,小写文字的对比度应至少为4.5:1。大文字(14pt/ 常规18pt及以上)的背景对比度应至少为3:1。

这些文本行不符合颜色对比度的建议,难以根据背景颜色进行阅读。

这些文本行符合颜色对比度建议,易于阅读背景颜色。

一旦你选择了颜色,必须要在大多数设备上与真实用户进行测试。如果测试显示阅读副本有问题,那就可以确定你的用户具有完全相同的问题。

9. 避免文本为红色或绿色

色盲是一种常见的情况,特别是在男性中(8%的男性是色盲),建议使用除这些颜色以外的其他颜色来区分重要信息。也避免单独使用红色和绿色来传达信息,因为红色和绿色色盲是最常见的色盲形式。

10. 避免使用闪烁的文字

闪烁的内容可能会引发敏感个体的癫痫发作。它不仅可以引起癫痫发作,而且对于一般用户来说,这是令人讨厌且使人分心。

12 12 分享:

相关课程

发表评论

登录后才能评论,请登录后发表评论...
提交评论

最新文章