所在位置:主页 > 网页设计 > 网页设计教程 设置网页步骤

网页设计教程 设置网页步骤

发布时间:2023-10-27 11:56来源:www.sf1369.com作者:宇宇

网页设计教程 设置网页步骤

1、打开PS,新建空白文档,名称设置为“某某工作室”,从预设大小下拉列表中选择“1024 x 768”,模式设计为“RGB颜明裂链色”,内容设置为“白色”,点击“好”按钮完成文档的创建工作。

2、新建一名称为“框架”的图层,利用该图层实际整个网页的整体布局。首先选择“矩形选择工具”,然后将矩形的宽度设置为1024,高度设置为80,在文档的上下两侧各框选一部分内容并填充为黑色,从而使整个网页呈现“宽屏幕”效果。

3、在背景图层的上方新建一新图层,并命名为“背景颜色”。点击“矩形选择工具”,设置“宽度为400,高度为768,然后在窗口的左侧框选一部分内容,填充一种深绿色。然后点击“矩形选择工具”,设置“宽度为624,高度为768,然后在窗口的右侧框选一部分内容,填充一种浅绿色。填充两种颜色饱和度有一点差别的颜色,目地是产生较为明显的对比。

4、在“框架”图层之上再新建一图层,名称为“主体元素”。打开一张事先准备好的百合花图片,双击“背景”图层将其转换为“图层0”,点击“魔术棒”工具,在图片白色区域内点击,选择白色区域后,按下DEL键删除白色区域。然后拖放图片到图层“主体元素”上。

5、然后选择“矩形选择工具”,设置“宽度为624,高度为768,然后在窗口中选择花朵右侧的一部分内容,并调整其亮度和对比度,使花朵的左右两侧呈现明显的对比。对该页面进行细节的调整,增加一些导航栏,信息提示内容和版权信息等内容,最终制作完成的页面。

6、选择“切片”工具,然后对内容进行切激孙分。切分的好处是有利于文件在网络上传输,同时在用切片工具划分内容时最好将需要被文字内容替换的部分进行独立分割。分割完成后的效果。

7、找到保存文件的位置,打开某某工作室.html文件,然后在内容区域内源滚点击鼠标右键,选择“查看源文件”,就会发现对应的网页内容已经生成。至此,利用PS设计网页内容完成。

网页设计怎么制作?怎么能够设计出简单易用的网页?

老实说,在网页设计这件事上,简单的设计往往要比复杂的更好。简单易用的界面更容易被用户掌握,也更容易把新用户变成活跃用户。面对复杂的需求,许多设计师总是不由自主地向复杂的方向设计网页,那么如何简化一个复杂的网站呢?事实上,想法并不复杂。诀窍是根据用户的目标重新审视整个路径,消除阻碍用户实现目标的障碍。

而且今天我们要谈的10种简化网页设计的技巧都是围绕这一思路来推进的。不管你是在设计一个全新的网站,还是在简化现有的网站,这10种简化技巧都是值得尝试的。学习网页设计,就可以来,推荐大家学习课程:web网页UI设计从入门到实战~

网页设计制作设计简单易用网页的技巧:

1、注重做行为召唤设计。

站点中的每一个设计都应该是有目的的,并且都相应地迎合用户的某种行为或需求,这一点显而易见。它还可以作为设计行为召唤的基础。指导用户的文案、按钮和链接都应该清晰、明显,而且不能让用户忽略。

2、简化分页。

您设计的网页需要分成很多页吗?差洞这几页有没有必要分开?你们可以重新考虑一下。把多页面的内容简化为可管理的块,不要让用户为了查看内容而多点击,把相关内容保存在一起,便于用户集中阅读和浏览。移除过期、过时的内容和信息、小插件以及第三方的信息都整合到相应的块中,不要分散放置。

3、统一配色方案。

尽管许多颜色的确很吸引虚吵枯人,但也容易使人产生噪音。尽量把颜色控制在2-3色范围内,这样可以让您尽可能好地控制整个图案的配色。假如你想使你的配色尽可能简单,那么你可以用单一的颜色,你会发现这简单的色调搭配非常漂亮,用不多的颜色就能减少用户的心理负担,特别是在你整个视觉设计很和谐的时候。

4、采用标准导航设计方案。

尽管隐藏式导航看起来很酷,非传统的创造性导航也是非常棒的,但这些导航模式对用户来说并不友好。背离传统设计尽管很容易记住,但在使用经验上,往往比较难。为你的站点提供更方便使用的标准模式导航。最为常见的导航模式,是在页面顶部放置一个导航条,通常有3到8个不同的选项,当然,不要选择复杂、全面的、10年前的大型导航菜单,除非你是京东淘宝这样的大型零售电商。

5、采用80/20原则。

切记,网站中20%的内容会触发用户80%的操作,这就意味着内容应该被优先考虑,一些界面元素,比如行为召唤和行为召唤按钮,将是引导用户交互的重要部分。

记住这一点,设计的重点应该放在这20%的内容上,而其余80%的内容是根据需求来调整的。这个20%的元素通常是最能吸引用户点击的内容:按钮、图片和行为召唤文字。

假如你对20/80原则听起来很熟悉,那么你可能在别处听到过它,它是由经济学家VilfredoPareto提出的,该原则几乎适用于所有的领域,这就是所谓的Pareto原则,或几条重要规则。

6、有目标使用UI元素。

每个UI元素,如图标、图片等都在整个设计中发挥了作用,一些元素的使用是有规律可循的,不要仅仅因为某些元素看起来很酷,或者只是为了“有”而加进去,最好是通盘考虑,在适当的地方,合理使用UI元素。

7、仔细选择字体。

字型与排字都遵循少即是多的原则。最为易读的字体,往往有标准的外观造型,笔锋匀称,朴实而不需要多余的装饰。一套完整的字体通常有多种字重和可选择的样式,而不必再找别的字体来搭配。而且在排字的问题上,文章要和背景有充分的对比,当你设计一个网页时,经常使用两套字体,一套应用于网页主体,另碰桥一套用于显示网页标题。

8、增大文字尺寸。

当排版设计时,你要在适当的时候增加文字尺寸。当我们每天都能看到越来越大的屏幕,我们需要让用户看到我们提供的信息,而不是堆砌更多的内容,而是合理地增加文本的大小。

尽管这种要求在移动端设计上并不明显,但根据实际情况,适当提高字体大小可以使文本的可读性得到明显提高。显然,放置在首屏的关键字要明显,吸引用户滚动,而不是把所有内容堆在首屏。

9、创建可读的文案。

字体设计可以从视觉上控制内容的复杂性,而文字可以控制信息传递的复杂性。实际上,二者同等重要。每一个词汇都应该与视觉保持意义和信息的一致性。写作就像视觉一样,需要反复推敲。站点是可传播的、可阅读的媒体,因此,文章和内容都应该简洁,介绍,并且高度可读。您可以根据网站的风格,采用对应调性的文案。

10、打破常规。

有些时候,规则是用来打破的,但如果你想使设计简单化,那么你在设计的时候,应该有意识地打破一个规则,但只能有一个。

假如你需要使你的设计在简单的同时又不能总是照章办事,那么打破一条规则是让你不走寻常路的最快方法。这样可以使你的设计显得不那么普通,但也可以遵循,打破太多的规则会使访客感到混乱。

总而言之,我们在进行网页设计的过程当中,其实有时候未必说复杂的网页就能够获得用户的喜欢,相反简单的网页更为通俗易懂、简单明了~我们在网页设计的过程,最好是遵循简单明了的最初开始~