网页设计基础技巧

网页设计基础技巧

以下就是网页设计基础技巧等等的介绍,希望为您带来帮助。

网页设计基础技巧

一、坚持网页的朴素

一个好的网站最重要的一点就是界面的简单、朴素。

制造者们很容易掉入这样一个圈套,即把一切可能用到的网页技巧,例如:框架、表格、字体、GIF动画等等都用上,这当然是好的,但假如多了的话就会让你的访问者头昏眼花,手足无措,也不会给他们留下很深的印象。

记住,只是由于你能够创立一个效果,但并不意味着你必需创立这个效果。先问一问你本人:我在网页上参加这个技术有什么价值?能否能更好的向访问者表达我的主题?

二、简单并不等于乏味

简单的真正含义并不是愚钝和乏味。许多人会被网站多余的奇特效果所迷惑,而无视了信息的有效性。

坚持简单的真正含义就是:想一想如何使本人网站的信息与你的访问者所等待和所需求的一样。应该把技术和效果用在恰当的中央,用在有效信息上,让访问者关注他们想关注的东西。

明晰的设计+有效的技术=一个好的站点

三、理解你的读者

你不是在真空里制造你的网页,也不是作给你本人看的。假如是这样,你还不如把它放在本人的电脑里。你发布你的网站是希望某些人停下来参观它。而这些人就是你的读者。

你越理解你的读者,你的网站影响力就会越大。你的读者能否有个慢猫?那你最好应当特别的留意网页的大小;他们希望听到音乐片断吗?你就要想想网页上的音乐格式。你的读者是纺织工人?那么血红色和黑色最好不要选择;或者他们是骨灰级游戏玩家?你就要防止用温和的颜色和图案了。一个好站点的定义:经过典雅的作风设计提供应潜在读者高质量的信息。

四、五个“手指”

对一个好的网站来说,明晰的导航也是最最少的规范。应该让访问者晓得本人当时在网站中的位置,并且高兴的经过你的指引而遍览你的网站。例如,你能够做到的一件事情就是:“下一步”的选择数目尽量少,以便人们不会迷失在长长的选择项目列表中。 你晓得吗?普通人的大脑把五个或更少的项目看作一组,但是当所面对的项目超越五个,它就必需把他们划分红较小的次组来处置,所以说,坚持你的选择项归类在五组或五组以内就变得很有意义了。你的访问者可以快速的找到本人想选择的项目。

五、三次点击

对网站制造者来说,访问者就是上帝,讨好上帝的另一个办法就是让他们在获取信息时不要超越三次点击。想想,当你在访问一个网站时,点击。。。点击。。。点击。。。再点击。。。再。。。才找到你想要的信息,或者还没找到,你会怎样想呢?

加之,当你的访问者深化网站查找需求的信息最后却摸不着头脑了,会怎样办?他们肯定不会原地兜圈,他们会分开你的主页去别的中央继续冲浪,可能也就再也不会回来了。

六、 三十秒的等候时间

访问者进入你的站点后,他应该能够不费力的找到所需求的材料。有一条不成文的规律:当访问者在决议下一步该去哪之前,不要让他如今所看的页面下载的时间超越30秒钟。假如超越了这个时间,你就会开端失去你的“上帝”了。

保证你的页面有个适度的大小而不会无限制的下载。假如你的大多数访问者运用Modem的话,试着坚持总的页面大小(包括页面图像)在45K一下。

确保你的页面设计规划明晰明了,让访问者只需快速的审视就能把握你的网站导航,知道“下一步”该选择的项目。

营销型网站网页设计专业技巧

第一、在进行营销型网页设计之前,一定要看看我们为什么要做网站,做网站的目的是为了树立企业的形象,还是为了宣传产品呢,或者是为了进行电子商务,还是为了建立行业性的网站呢。建立网站的目的是企业需要,还是市场开拓的延伸呢。

第二、营销型网页设计必须要多整合公司的资源,确定网站的基本功能。在进行网页设计的时候,也得根据整个公司的需要和计划来确定网站的功能类型。比如,企业型的营销网站、应用型的营销网站、商业型的营销网站、电子商务型的影响网站等等。并且整个企业网站也包含了企业形象型或者是产品宣传型,网上营销型的网页设计、客户服务型的网页设计、电子商务型的网页设计等等。

作为营销型页面主要目的之一就是吸引消费者目光,增加点击率,而新颖大胆的设计可以让人有点进去的欲望,从而可以吸引更多的人去了解页面的内容,达到营销的目的,在短时间内就可以让人记住。

既然是为了吸引人的眼光的页面,简单的内容不管是什么样人群都可以有清楚的认识,这样就可以达到让其他人了解产品,从而可以在看了页面之后有购买的欲望,也可以让使用者达到很好的宣传的效果。

营销型网页设计的技巧有很多种类型,只有掌握一定的技巧才可以有更好的创造价值,达到宣传的目的,为企业创造更多的价值,带来更多的财富,达到很好的推广和宣传效果。

第三、在制作营销型网页设计的时候,我们还需要明确自己做网站的目的,并且要确定网站的功能才是。不仅如此,企业内部网的建设状况和网站的可扩展性才对。

网页设计版面布局步骤

一.草案

新建页面就象一张白纸,没有任何表格,框架和约定俗成的东西,你可以尽可能的发挥你的想象力,将你想到的"景象"画上去(我们建议您用一张白纸和一支铅笔,当然用作图软件photoshop等也可以)。这属于创造阶段,不讲究细腻工整,不必考虑细节功能,只以粗陋的线条勾画出创意的轮廓即可。尽你的可能多画几张,最后选定一个满意的作为继续创作的脚本。

网页设计基础技巧

二.粗略布局

在草案的基础上,将你确定需要放置的功能模块安排到页面上。(注:功能模块我们在"首页设计-引子"中提过,主要包含网站标志,主菜单,新闻,搜索,友情链接,广告条,邮件列表,计数器,版权信息等)。注意,这里我们必须遵循突出重点、平衡谐调的原则,将网站标志,主菜单等最重要的模块放在最显眼,最突出的位置,然后在考虑次要模块的排放。

三.定案

将粗略布局精细化,具体化。(靠你的智慧和经验,旁敲侧击多方联想,才能作出具有创意的布局。)

网页框架完成后,下一步就是做成适应网页框架的背景图,可以用PS将整图切割成4部分(图1)(这里你可以根据自己的构思,进行切割)背景图1为LOGO区域,(LOGO制作)背景图2为过渡区,也可以把1-2区域合并为一个区域,本人的意图是为了减少LOGO区域背景图的文件的大小,背景图3为文章区,这里应注意图片上下的衔接,因该区域的高度是根据文章内容而定的,背景图4为网页的底部。

简单的网站设计规则

1.工作每页设置一个目标

一个简单设计的开始,从项目的目标和网站每一页的具体目标开始。每个页面都应该引导用户使用一个动作,不包括导航和页脚。这可以是任何东西,从点击链接,输入信息,观看视频或玩游戏。但是每个页面都应该关注单个用户的操作或转换。太多的事情会让用户不堪重负。他们可能忽略了应该完成哪些行动,并可能做出不那么理想的选择。计划设计,使每个页面引导用户达到一个目标。每一个可操作的按钮上面的滚动和下面的滚动在同一页面上应该做同样的事情。这种一致性可以帮助用户理解为什么他们在你的站点上,以及他们应该做什么;这些选择的简单性使设计变得简单而引人入胜。

2.坚持两个类型的家庭

有这么多的设计准则,为一个项目推荐了三种字体。你可以用两个健壮的类型家庭来简化这个问题。寻找一个类型的家庭,包括多重的重量,在常规的和大胆的或黑色的选择之间有大量的对比。为了更有才华,选择一个显示选项,其中包括一些你可以在超大标题中使用的替代字符。然后你所要做的就是混合和匹配从一个体字体和显示字体,以获得大量的字体组合,为整个设计。使用两种类型的家庭,就像你选择了更多具有特定重量或风格的特定用途的选择一样。您将发现这可以帮助您创建一个可读性高且易于使用的排版工具,这很容易管理并且具有视觉一致性。

3.产品使用一致的对齐

左边,中间,甚至右边——不管你喜欢什么样的对齐方式,在整个设计中都要坚持。这包括对齐类似的项目,例如文本框和元素,它们不是相似的,而是组合在一起的。适应性在这方面做得很好,在主页滑块上的文字。尽管图片上有不同数量的文字,但每个标题都要按动作按钮。元素之间的间距也是一致的。更重要的是,这种一致的对齐方式会在滚动页面上显示其他的标题和CTA对。对齐会匹配滑块的流,滑块也会以互补的方向移动。在文本元素中,左侧和中心对齐是最常见的选项,因为它们是最易读的。对于较长的文本,左对齐是首选选项。

4.产品建立层次结构

用户不应该考虑要看什么,或者如何在设计中移动。即使是最简单的可视组合也应该有不同的层次结构。它从一个显性的视觉开始。它可以是一个图像或视频或文本显示或任何其他将产生第一印象的东西。

然后应该有一些文本,告诉用户设计和网站试图沟通的内容。这通常是一个简单标题的形式,与主要的视觉作品一起工作。第三是为用户完成的第二部分文本或操作。最后一个视觉元素是导航菜单。用户希望找到所有这些元素,并训练眼睛通过基本的顺序来移动这些元素。通过这样的方式设计使他们更容易。

5.给元素足够的空间

如果你现在还不知道,那就把它记在记忆里吧:白色的空间是你的朋友。给设计中的每个元素足够的空间。空间将有助于吸引对单个元素的注意,占用“空间”,这样你就不会被诱惑去弄乱画布,并帮助创建一个有焦点的整体设计。使用空间的诀窍是一致性。设置将围绕单个元素或文本行之间的空间的空间量的规则。如果设计最终看起来太贫瘠了,你可能需要把间隔拉回一点。当你打开设计时,你会知道间隔是正确的,并直接进入你想让用户最先看到的地方。(不确定是什么?)回到第4号——建立等级制度。

6.Amp了对比

高对比度设计元素——从颜色的选择到元素的大小——可以让一个项目的视觉效果恰到好处,即使是在最简单的框架中也是如此。对于一个流行的选择,尝试一个明亮的对比色调色板吸引用户注意。大胆的颜色会让简单的设计变得更加复杂和有趣,这是一个黑白的选择。为了充分利用对比色,选择颜色轮上的相反位置的色调和相似的饱和度。如果你喜欢这个选项,那就试试别的颜色轮吧。(你甚至可能会发现一个意想不到的新爱好,比如上面的紫色和teal组合。)

7.使用一致的图标和元素

设计的一致性是杀手设计的最好(也是最坏的)秘密之一。这是一种经常被遗忘的事情,因为设计项目充斥着多个按钮样式或社交媒体图标,这些图标与网站的其他图标不匹配。用户界面元素不应该是事后的想法。在整个项目中以相同的方式创建一个图标和用户界面元素集和规则并使用它们,这很重要。(如果你不想从头开始创建,你甚至可以购买或下载图标字体或用户界面元素工具包。)为元素选择一个颜色,使用相同的悬停动作或效果(一个元素是可点击的元素,另一个是不可以点击的元素)和基于使用的大小元素。(可以接受一个图标大小和一个超大号的选项,这些元素都是图形化的。)Praticca自动售货机使用超大尺寸的图标来提示用户信息。A +位于一个彩色图标内。除了颜色,这三个图标都是相同的。它们在鼠标悬停上都做同样的事情,当用户点击时,它们的行为都是一样的。同样的图标在网站上使用更小,以开始新的内容,并帮助用户扫描副本。

12 12 分享:

相关课程

发表评论

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

最新文章