勤学思培训网RMOYRF
  • 终于懂了网页设计基础知识

    网页设计基础知识

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

    [图片0]

    (1)内容和功能决定表现形式和界面设计

    常常有人凭借电话的几句交流或者QQ上的几句聊天,甚至是一张句话的小纸条,就开始做一个网站设计。做一个良好的网页设计,你需要了解客户的东西很多,比如:

    1、建站目的(是主推产品还是平品牌,是主要注重SEO还是用户交互等)

    2、网站类型

    3、栏目规划及每个栏目的表现形式及功能要求

    4、主色调、客户性别喜好、联系方式、旧版网址、偏好网址

    5、根据行业和客户要求,那些要着重表现

    6、是否分期建设、考虑后期的兼容性、是否要开发其他语言版本

    7、客户是否有强烈的建站欲望

    8、你是否能在精神意识上控制住客户

    9、面对你未接触的技术知识,你有底吗?

    等等…

    当你把这些内容都了解清除了时候,你的大脑中就已经给这个网站有个全面而形象的定位了,这时才是有的放矢去做界面设计的时候了。

    (2)界面弱化

    一个好的界面设计它的界面是弱化的,它突出的是功能,着重体现的是网站业提供给使用者是主要什么。这就涉及到浏览顺序、功能分区等等。

    要让访客在秒内就能把握网站的行业性质,1秒内就知道该从哪个地方开始使用这个网站,能点一次的,绝不点第二次。当然上面说的是大多数功能性网站,对于宣传展示性网站,诸如加特效的或Flash网站,可能就不得不花哨一些,但不能太过分。网站不是动画片,在效率越来越高,社会心理越来越浮躁的中国,人们的耐心越来越小,心理承受能力越来越低。效果可以体现意境,点到为止。

    (3)模块化和可修改性强

    模块化不仅可以提高重用性,也能统一网站风格,还可以降低程序开发的强度。这里就设计一些尺寸、模数、宽容度、命名规范等等知识了,不再冗述。

    无论是架构还是模块或图片,都要考虑可修改性强。举个简单的例子,logo、按钮等,很多人喜欢制作图片,N个按钮就是N张图片。如果只做3-5类按钮的背景图片,然后用在网页代码里打上文字,那么修改起来就简单了,让程序员自己改字就可以了。然而网页显示的字体是带有锯齿的,一般即能清晰又保证美观的字体字号有几类:

    宋体12px |宋体12px粗体|宋体14px |宋体14px粗体|黑体20px | verdana 9px | Arial Black 12px+ |

    (4)创意是可耻的,分析能力远比创意来的重要

    设计界动辄就大谈什么“创意”,我要说的是,还没有搞清目的意义和内容,还没在技术制作上臻于完善的基础上,用创艺和特效来迷惑客户和访客是可耻的。一个网也设计者的分析能力远比创艺来的重要。

    网页设计的实战经验技巧

    (一)网页配色基本概念

    (1)白纸黑字是永远的主题,谁都说不出不好来。

    (2)网页最常用流行色

    兰色——蓝天白云,沉静整洁的颜色。

    绿色——绿白相间,雅致而有生气。

    橙色——活泼热烈,标准商业色调。

    暗红——宁重、严肃、高贵,需要配黑和灰来压制刺激的红色。

    (3)颜色的忌讳

    忌脏——背景与文字内容对比不强烈,灰暗的背景令人沮丧!

    忌纯——艳丽的纯色对人的刺激太强烈抗议,缺乏内涵。

    忌跳——再好看的颜色,也不能脱离整体。脱离群众是自取其辱!

    忌花——要有一种主色贯穿其中,主色并不时面积最大的颜色,而是最重要,最能揭示和反映主题的颜色,就象领导者一样,虽然在人数上居少数,但起决定作用。

    忌粉——颜色浅固然显的干净,但如果对比过弱,整得苍白无力了,就象病夫一样无可救药。

    蓝色忌纯,绿色忌黄,红色忌艳。

    (4)几种固定搭配

    蓝白橙——蓝为主调。白底,蓝标题栏,橙色按钮或ICON做点缀。

    绿白兰——绿为主调。白底,绿标题栏,兰色或橙色按钮或ICON做点缀。

    橙白红——橙为主调。白底,橙标题栏,暗红或桔红色按钮或ICON做点缀。

    暗红黑——暗红主调。黑或灰底,暗红标题栏,文字内容背景为浅灰色。

    (二)网页设计理念

    (1)内容决定形式

    先把内容充实上,再分区块,再定色调,再处理细节。

    (2)先整体,后局部,最后回归到整体。

    全局考虑,把能填上的都填上,占位置。然后定基调,分模块设计。最后调整不满意的几个局部细节。

    (3)功能决定设计方向

    看网站的用途,决定设计思路。商业性的就要突出赢利目的;政府型的就要突出形象和权威性的文章;教育性的,就要突出师资和课程。

    网页设计基础知识之服务器与浏览器

    •B/S模式(Browser/Server,浏览器/服务器)

    •URL:(统一资源定位符,Uniform Resource Locator)也被称为网页地址,是因特网上标准资源地址

    •格式为:协议,域名(主机名),文件路径,文件名。

    [图片1]

    •例如: 协议://域名/文件路径/文件名

    •.cn/ts/

    WWW (World Wide Web ),万维网是一个资料空间。在这个空间中由一个全域“统一资源标识符”(URL)标识。这些资源通过超文本传输协议http(Hypertext Transfer Protocol)传送给使用者,由遍布在Internet 上的称为 Web 服务器的计算机组成。

    •HTML: 超文本标记语言,即(HypertextMarkup Language),是用于描述网页文档的一种标记语言。

    •HTTP: 超文本传送协议 , 是一种通信协议,它允许将 (HTML) 文档从 Web 服务器传送到 Web 浏览器。

    •URL:统一资源定位符(URL,英语UniformResourceLocator的缩写)也被称为网页地址,是因特网上标准的资源的地址。

    •网页:web服务器上供客户端用户浏览的文件

    •网站:一系列网页的组合,拥有相同或相似的属性并通过各种链接相关联。

    •主页:网站的第一个页面

    网页设计基础知识之理论题

    1.网页制作流程不包括________。 答案:D

    A.网页的结构设计

    B.资料的收集与整理

    C.网页上传与发布

    D.申请域名

    2.网页布局的常用方法不包括使用________进行布局。 答案:D

    A.表格

    B.层叠样式表

    C.框架

    D.表单

    3.在DreamweaverCS4中,超级链接主要可以分为文本链接、图像链接和________。 答案:C

    A.友情链接

    B.控制链接

    C.锚记链接

    D.用户链接

    4.制作网页时,关于可以采用的图像文件格式,正确的描述是:________。 答案:D

    A.仅可采用JPG格式

    B.仅可采用GIF格式

    C.仅可采用PNG格式

    格式、GIF格式和PNG格式都可采用

    5.以下描述正确的是________。 答案:D

    A.静态网页指没有动画效果的网页

    B.动态网页至少有一种动画效果

    C.浏览者与服务器可通过静态网页进行交互

    D.动态网页文件含有HTML之外的程序代码

    6.一个网站可以通过________将很多的网页链接在一起。 答案:C

    A.文字

    B.超媒体

    C.超链接

    D.图像

    标记用来标识一个HTML文件中的表格。 答案:D

    A.〈p〉〈/p〉

    B.〈body〉〈/body〉

    C.〈html〉〈/html〉

    D.〈table〉〈/table〉

    代码〈imgsrc="name"〉表示________。 答案:A

    A.添加一个图像

    B.排列对齐一个图像

    C.设置围绕一个图像的边框的大小

    D.加入一条水平线

    9.定义HTML文件主体部分的标记对是________。 答案:C

    A.〈table〉……〈/table〉

    B.〈img〉……〈/img〉

    C.〈body〉……〈/body〉

    D.〈title〉……〈/title〉

    标记是用来标识一个HTML文件的。 答案:C

    A.〈p〉〈/p〉

    B.〈body〉〈/body〉

    C.〈html〉〈/html〉

    D.〈table〉〈/table〉

    11.在DreamweaverCS4中,要在当前网页所在的窗口或框架中打开链接,目标窗口设置应该为________。 答案:C





    12.使用Dreamweaver CS4时,当网页既设置了背景图像又设置了背景颜色,那么________。 答案:A

    A.背景图像覆盖背景颜色

    B.背景颜色覆盖背景图像

    C.产生一种半透明的混合效果

    D.相互冲突,不能同时设置