设计网页需要哪些步骤

时间:2022-04-28 10:49:55 辅助设计与工程计算 我要投稿
  • 相关推荐

设计网页需要哪些步骤

  如果大家想做一个自己的网页,那么就要学习网页设计的知识啦!以下是小编精心准备的设计网页需要哪些步骤,大家可以参考以下内容哦!

  步骤1

  一、网页设计阶段

  1.网页主题选择

  设计一个网页,最重要的是选择好网页的主题内容,一般都是选择自己所需要的内容来进行设计。需要注意的是:所选择的设计主题一定要有自己的特色,能够从众多网页中脱颖而出。

  2.结构规划

  在选择好网页主题后,就需要开始规划网页中的结构了。需要清楚的是:根据网页主题明确规划目标,合理设置网页的结构。这其中,还需要注意网页中内容的设置,要全面结合主题和页面具体内容规划结构。

  3.素材收集

  这是需要花时间多考虑的一步,前期的主题和结构规划好之后,就要根据需求来开始收集素材。收集的素材大致包括:文字、图片、声音、动画、视频等,同时,可以通过书籍、报刊、杂志、网络等途径搜索到需要的素材。

  二、网页制作阶段

  制作网页的部分,主要需要设计人员运用Dreamweaver、PS等软件制作,设计人员可以根据自己的洗好选择一款熟悉的制作工具。同时,在制作过程中可能也有收集加工素材的部分,这就需要看制作过程中的需求,来合理安排。

  三、后期检测阶段

  网页设计与制作完成后,步骤基本完成。后期,还需要设计者对于网页进行全面检测,包括所设计网页中内容的合理性、科学性,网页中链接的正确性以及根据实际情况做适当的调整。

  在网页的设计与制作过程中,以上的环节缺一不可。为了保证所设计网页的合理性与整体美观性,设计人员还需多多注意设计过程中的每一个细小环节,做好每一个步骤。

  步骤2

  一、确定主题

  网站主题就是你建立的网站所要包含的主要内容,一个网站必须要有一个明确的主题。特别是对于个人网站,你不可能像综合网站那样做得内容大而全,包罗万象。 你没有这个能力,也没这个精力,所以必须要找准一个自己最感兴趣内容,做深、做透,办出自己的特色,这样才能给用户留下深刻的印象。网站的主题无定则,只要是你感兴趣的,任何内容都可以,但主题要鲜明,在你的主题范围内内容做到大而全、精而深。

  二、搜集材料

  明确了网站的主题以后,你就要围绕主题开始搜集材料了。要想让自己的网站有血有肉,能够吸引住用户,你就要尽量搜集材料,搜集得材料越多,以后制作网站就 越容易。材料既可以从图书、报纸、光盘、多媒体上得来,也可以从互联网上搜集,然后把搜集的材料去粗取精,去伪存真,作为自己制作网页的素材。

  三、规划网站

  一个网站设计得成功与否,很大程度上决定于设计者的规划水平,规划网站就像设计师设计大楼一样,图纸设计好了,才能建成一座漂亮的楼房。网站规划包含的内 容很多,如网站的结构、栏目的设置、网站的风格、颜色搭配、版面布局、文字图片的运用等,你只有在制作网页之前把这些方面都考虑到了,才能在制作时驾轻就 熟,胸有成竹。也只有如此制作出来的网页才能有个性、有特色,具有吸引力。如何规划网站的每一项具体内容,我们在下面会有详细介绍。

  四、选择合适的制作工具

  尽管选择什么样的工具并不会影响你设计网页的好坏,但是一款功能强大、使用简单的软件往往可以起到事半功倍的效果。网页制作涉及的工具比较多,首先就是网 页制作工具了,目前大多数网民选用的都是所见即所得的建站系统软件(前面提到的网站管理系统)。除此之外,还有图片编辑工具,如firework 、Photoshop等;动画制作工具,如Flash等;网上有许多这方面的软件下载,你可以根据需要灵活运用。

  五、确定网站内容

  1、首先确定你要制作的网页的主题,就是你建这个网站的内容是什么。

  2、确定你的网页的阅读对象,就是你的网页是准备给那些人看的。

  3、选择制作网页的工 具软件,比如PageAdmin系统、shopex系统、discuz系统这些,当然还有很多优秀软件,大家可以在以后慢慢接触到。

  4、如果你作好了页 面,就需要考虑你的网页放到什么地方发表,也就是平常我们说的发表空间,我们学校的用户网络中心已经申请好了空间,大家可以直接使用(有发布空间的标志是 你有了FTP 账号,这个需要申请),也可以按我前面说的把自己电脑配置为服务器(需安装IIS等软件,这个自己百度一下)。

  六、制作网页

  材料有了,工具也选好了,下面就需要按照规划一步步地把自己的想法变成现实了,这是一个复杂而细致的过程,一定要按照先大后小、先简单后复杂来进行制作。 所谓先大后小,就是说在制作网页时,先把大的结构设计好,然后再逐步完善小的结构设计。所谓先简单后复杂,就是先设计出简单的内容,然后再设计复杂的内 容,以便出现问题时好修改。在制作网页时要多灵活运用网站管理系统后台功能,这样可以大大提高制作效率。

  七、上传测试

  网页制作完毕,最后要发布到Web 服务器上,才能够让全世界的朋友观看,现在上传的工具有很多,推荐LeapFTP软件,你可以很方便地把网站发布到自己制作的网站存放服务器上。网站上传以测试完毕就可以把你的网址告诉给朋友或客户,让他们来浏览。

  八、推广宣传

  网页做好之后,还要不断地进行宣传,这样才能让更多的朋友认识它,提高网站的访问率和知名度。推广的方法有很多,例如到搜索引擎上注册、与别的网站交换链接、加入广告链等。

  九、维护更新

  网站制作要注意经常维护更新内容,保持内容的新鲜,不要一做好就放在那儿不变了,草扑建站整理发布,只有不断地给它补充新的内容,才能够吸引住浏览者。

  步骤3

  1、明确设计的方向

  首先我们应该明确我们在为哪些用户做设计,了解这些用户,以此分析出相应的功能、交互方式、风格。

  其次还要理解公司的战略,比如:假如已经有同类产品流行于市场,差异化就是公司必须要考虑的,拾人牙慧者必死。公司对市场的决策也是要参考的,否则设计可能与市场定位产生冲突,要修改的还是设计,毕竟设计是服务于商业。

  2、假定不同的方案,通过对比分析修正设计

  我们在做设计时通常会有很多想法,这些想法凭空不容易比较分析,最好能画出草图来,便于对比、讨论,通过对不同想法的分析,最终得出较满意的方案。

  3、能预见设计方案所产生的效果

  这点更多靠设计师对用户、市场的认识。有丰富的设计经验,很多设计经验都是从碰壁中逐渐总结出来的,合理的用户研究方法可以为设计提供很多依据。设计经验可辅助把握设计的质量,对市场的认识,决定对发展方向的把握。

  4、做好“相对满意”的设计,而不可能是最优

  我们在针对用户时,产品不可能对所有用户都最满意,只能优先于中间用户,同时设计的期望受到成本、技术等等限制,所以只能让设计方案“相对满意”。

  5、保证设计方案相对平衡

  为了保证设计方案的可行性,很多时候我们要综合用户需求、使用环境、开发条件、经营目标等相关因素做平衡。作为设计师在保证可行的前提下,让“用户满意度”最大化。

  拓展:网页优化问题

  框架结构

  有些搜索引擎(如FAST)是不支持框架结构的,他们的“蜘蛛”程序无法阅读这样的网页。

  页面结构

  DIV+CSS是网页美工必须了解和掌握的一门技术,互联网是属于web2.0的时代,主流的网站都采用DIV+CSS结构。

  DIV+CSS即是样式和数据分离,利于搜索引擎读懂网站页面,提高网页收录数量,最主要是方便管理和维护网站。

  图像区块

  除AltaVista、Google和Northern Light(现已停止公共搜索服务)明确支持图像区块链接外,其他引擎是不支持它的。当“蜘蛛”程序遇到这种结构时,往往会感到茫然不知所措。因此尽量不要设置Image Map链接。

  特效链接

  我们经常看到有些网站为导航链接加上了特效,如点击某个项目会展开下层链接等。这些效果一般通过Java Script实现,视觉上非常新颖,但在“蜘蛛”程序的眼里则没那么诱人,相反它无法解读这种链接。为了让搜索引擎顺利检索到你的网页,建议还是牺牲掉一些花哨的东西。

  FLASH

  虽然FLASH制作的网页视觉效果较好,但搜索引擎对此却不太感冒,个案表明这一类的网站很难被百度搜索引擎索引。明智的做法是提供FLASH和非FLASH网页两种选择,这样即增加了网页的观赏性,又照顾到了搜索引擎的情绪。

  加密网页

  除非你不希望搜索引擎检索你的网页,否则不要给你的网页加密。

  网页容量

  包括图像在内的网页字节数最好不要超过50K。体型庞大的网页下载的速度慢,不仅会让普通访问者等得心急如焚,有时也会使“蜘蛛”程序感到不耐烦。

  拓展:网页设计小贴士

  选用富有冲击力的图片元素

  设计任何网站类型,恰到好处又吸引眼球的图片总是非常重要的。虽然读者通常只关注网站的内容,但吸引人的相关图片也可以起到对内容补充的作用,同时也增添了美感。不过,在网页中使用图片元素时,不管它是静态还是动态图片,都要注意颜色的搭配。颜色使用过多容易造成视觉混乱,使用单一颜色往往会产生强烈的视觉冲击。

  小心使用页面空白

  毫无疑问,简洁的网页设计成功的先决条件之一就是做到整洁有序。设计师在网页中熟练地添加flash动画,视频,3D图形等多种元素的同时,不过应尽量避免过度使用这些元素。如今,大家都经常使用各种便携式设备浏览网页,因此也应该充分考虑到移动网络用户的需求。在网页设计中,应该小心,准确地处理页面的边距和空白。但是,空白间距过多会让网站失去吸引力。因此维持设计过程中的流动性非常重要,切勿过度使用。

  开启你的像素眼

  任何与设计的相关工作,小细节都发挥大作用。网页设计也不例外。想要成功设计出简洁的网站,你需要“第三只眼”来监控这些小细节。网站的边框,投影,高光和纹理等元素容易让浏览者印象深刻,但设计师们往往却忽略了这些小细节。在某些情况下,忽视动画和图片的优化问题会影响到网页图像质量。为了设计出最佳的网站图片,可在Photoshop中启用“对齐到像素”(Snap to Pixels),对图片进行适当的优化。网页中内容排版错乱时有发生,这会从视觉上降低内容的吸引力,影响读者阅读。

  选用合适的字体

  简洁的网页设计成功离不开排版,排版应该获得和图片同样的重视。虽然可供选择的字体很多,设计师要考虑的方面很多,比如说,目标客户和客户公司的性质。为网站页眉和内容选用合适的字体是必不可少的,无衬线字体(sans serif)和有衬线(sans serif)字体通常会为设计带来良好的效果。除此之外,你还可以结合其它字体,专为孩子和女性打造网站。

  为你的网站选择合适的配色方案

  任何网站的设计都离不了合适的配色方案,这对创建一个整洁干净的网站同样适用。坚持使用淡色和非彩色的投影对成功设计一个简洁网站大有裨益。浅色的投影可以帮助用户把焦点转向网站内容。标志使用黑色和较深的投影,网页中的页眉和导航元素使用浅色背景,这些都是不错的案例,并没有规定在简洁网页设计中不能使用大胆的颜色,但是这样的颜色要小心,克制地使用。有时候,网站有必要使用深色背景色来吸引某些目标用户。比起渐变色,有些网站更钟爱纯色。如果你的网站非得要使用纹理和渐变色,也不要用得太过火。

  导航栏与可用性

  你对网站设计满意时,认为一切都趋于完美,这时,你可以通过实际试用来测试它的使用性。不妨站在局外人的角度,客观地对网站作出评价。在网站发布之前,你可以询问一下跟网站设计无关的人的看法。保持网站导航的直观性,避免使用的导航元素让初次访问者和技术新手产生挫败感。

  拓展:网页设计的禁忌

  关于外观的禁忌

  1 不要先决定网页的外观,然后强迫自己甚至是强迫别人去适应它。应该从网站的浏览者、网站要传达的信息以及网站的发展目标考虑,设计出一个最适合的网页架构。

  2 不要每页都采用不同的背景图片,以免每次转页都要花时间去下载。采用相同的背景色及近似的按钮都能增加网页一致性,树立统一的风格。这也是最基本的网站VI设计(视觉识别系统)。

  3 不要把图片的白色部分当作是透明的颜色,要知道别人的操作系统是并不一定会将底色设为白色的。解决的方法是把网页的底色设为白色。而最好的方法是用图片编辑工具为图片设置好透明底色。

  4 底色或背景须与文字颜色形成明显对比,方便阅读。若你的网页里有较多文字,不妨在这方面下多点功夫,力求让浏览者能舒适阅读你的文章。

  5 每页的排版不要太疏或用太大的字,尽量避免看网页的时候要作很大的卷动。

  6 太长的一页要使用内部链接,聪明的网页设计者不会让浏览者在看网页时太多卷动。常见的内部链接例子如 FAQ、或名词解释。

  7 在17寸显示器尚未普及的时候,不要以 800x600 以上的像素设计网页。因为这常常会导致设计上的判断失误。因此,无论你有再大的显示器,能上再大的分辨率,将显示器设置成 800x600的显示模式是适当的。 -

  8 不要于每页插入太多的广告牌。相信你也不会喜欢贴满广告的网页。什么广告交换、点钱Banner、弹出窗口,还有时下最流行却又最讨厌的浮动广告,还是少放为妙。至少,当我看到的时候,是会第一时间按右上角的“X”的。

  关于操守的禁忌

  1 不要抄袭别人的创作。网络上的所有资料都是公开的,但都有版权的,若想引用别人的作品,不妨先征得同意,一般作者都只要你注明出处,对于电脑方面的东西,大多数朋友都是热情而慷慨的。更不要下载了别人的网站后,当作是自己的放在网上,这样做的结果是使所有人都知道你是个剽窃者。

  2 引用 Newsgroup、BBS、或其他非电子传媒的文章,切记要注明原作者名称及文章事源,若引用别有的网页更要通知网主。尊重版权,避免官司,利人利已。

  3 不要利用网页散布谣言、中伤他人,网络虽然难管理,但本着道德良心,都应洁身自爱。维持良好网络环境,要靠大家努力,从我做起。

  4 不要将别人的网页变成你的框架中的一个窗口,这样不仅为浏览者带来不便,令人的网页更丑陋,而且也侵犯了别人的版权,解决方法是采用链接中的 target 参数,如 target="_top" ,或是target="_blank" 从新窗口打开网页等。若重视访问者的感受请从每一细节做起。

  5 不要将别人正在使用的搜索引擎、表单及计数器等放到自己的网页中,这样做会扰乱其正常运作、增加该服务器的负荷,除非该主人表示可以连到他的 cgi-bin 或 JavaClass。

【设计网页需要哪些步骤】相关文章:

面试进门礼仪的步骤有哪些11-20

蝴蝶酥的做法步骤有哪些02-15

绿茶小子的做法步骤有哪些02-24

黄油曲奇的做法步骤有哪些02-14

怎样网页设计03-30

网页设计总结11-09

网页设计报告07-31

舒芙蕾的做法步骤有哪些12-25

网络创业的最基本步骤有哪些09-01