文档库 最新最全的文档下载
当前位置:文档库 › 判断一个网站设计的优劣的标准是什么

判断一个网站设计的优劣的标准是什么

判断一个网站设计的优劣的标准是什么

完美的设计是要满足用户的视觉体验和使用体验的。

满足视觉体验,漂亮的色彩混搭和界面的设计是必须的,更要将其与交互设计完美的结合,强调更好的用户交互体验。

一份好的网站设计能够最大限度的实现产品诉求,当用户在使用时,不仅有美好的视觉感受,而且能有非常方便的使用体验。所以最好的网站设计是既好看又好用,两者缺一不可。

是否充分考虑了用户的不当操作造成的烦恼。

比如输入错误信息,网络连接失败,由此设计者们是否深入的开发了类似400纠错页面的设计。这些针对性的设计能很好的解决用户在使用过程中遇到的所有问题。

简略明了的用户须知能帮助初次访问者快速熟悉网站的使用。

在网站设计创作的过程中,尽可能的将用户须知融入到每一步可能产生问题的操作中去。以期达到在第一时间解决用户产生的问题。

网站基础功能设计是否完善且有特点。

网站基本都施工明确了标准功能的配置,比如购物网站的订单管理和在线支付,企业网站的产品和服务展示等,提供访问者所需要的必不可少的使用功能是一个网站的立足之本。注意事项

在企业网站设计成发布之后,对于目标群体来分析,比如他们的生活状态、人生价值观、网络习惯以及特定需求等,如果能符合大部分目标用户的意志,那么这份设计是合格的,如果能深入挖掘出目标用户的潜在需求那就更加的完美了。

网站设计期末考试要求及评分标准

网站设计要求及评分标准 网站主题:个人网站或学习类网站 一、内容(40分): 1、网站主题要突出; 2、内容详细而充实; 3、能够清晰表达设计意图,总页面数不少于10个。 4、网页文档中无大块空白,无错别字。 二、结构(10分): 1、结构清楚合理,有统一的导航条; 2、整体结构有一定的连贯性; 3、每一页都有返回首页的标志; 4、没有空链接; 5、没有错误链接; 6、便与浏览查找。 三、版面与视觉感受(10分): 1、网站整体风格一致; 2、文字清晰,没有乱码和错位; 3、没有错误的表格; 4、按钮图片的制作美观实用; 5、色彩协调; 6、页面美观,布局合理。 四、技术要求(30分): 1、静态页面制作 (主页(index.html)、其它页面用英文或拼音缩写命名;index.html放置于站点根文件夹下,其它页面置于各子文件夹中。(5分) 2、技术应用: ①Html:Logo 导航条超级链接图片多媒体表格AP Div 行为模板框架(15分) ②Css:文本图片表格边框定位(5分) ③网站要建立不同的文件夹,将不同格式不同功能的文件分门别类的存放:如images、css 、templates、library及各子栏目文件夹等。(5分) 五、其他要求(10分): 1、建立word格式说明文件(5分) ●清楚表述网站的整体设计意图及其功能 ●列举网站设计中使用的技术 ●列举每个网页文件的名称及其功能 ●不少于300字 2、所有文件打包成RAR压缩包文件名称格式为:学号.rar,如0601100301.rar。打包后的文件大小不超过10MB。(5分) 六、上交作业邮箱 将压缩好的RAR文件(名称必须为:学号.rar))发送至jk2011qmks@https://www.wendangku.net/doc/c26306658.html, 作业提交开始时间:2012年5月7日(星期一) 作业提交截止时间: 2012年5月13日(星期日),在规定时间段内交作业加10分,逾期接收不加分,最晚在5月20日前交作业。注:2份作品如雷分部分超过30%,均为0分。 2012年4月16日 1

网页设计与制作实例教程

网页设计与制作实例教程 习题答案 第1章网页与网站基础 一、选择题 1.A 2.B 3.C 4.C 5.A 二、判断题 1.√2.×3.√4.×5.√ 三、问答题 略 第2章网页规划设计 一、选择题 1.D 2.A 3.C 4.A 5.C 二、判断题 1.×2.×3.×4.√5.√ 三、问答题 1.答:网站需求分析一般包括三个阶段的内容:网站背景分析、总体需求分析、具体需求分析。(每个阶段可再详细描述。) 2.答:可从以下几个方面来阐述网站设计的原则:①日期、时间和数字;②欢迎词; ③弹出窗口和引导页面;④新闻和公告信息;⑤网址;⑥控件;⑦链接;⑧主页内容 3.答:打开新浪网首页,分析其布局类型。(答案略) 4.答:网页色彩搭配方法可从以下两个方面去阐述:①根据页面风格以及产品本身的诉求确定主色;②根据主色确定配色。 网页色彩搭配技巧可从以下几个方面去阐述:①用一种色彩;②用两种色彩;③用一个色系;④用黑色和一种色彩以及色彩搭配忌讳的方面。 5.答:打开当当网,具体分析其规划过程。(答案略) 第3章初识网页制作软件 一、选择题 1.C 2.C 3.B

二、填空题 1.代码、拆分、设计2.文件、资源、规则3.超级链接 三、操作题 略 第4章制作网页内容 一、选择题 1.D 2.B 3.A 4.D 5.ABD 6.D 7.B 8.D 9.A 10.A 二、判断题 1.√2.√3.×4.√5.√6.√7.√8.√9.×10.√三、操作题 略 第5章设置网页超级链接 一、选择题 1.D 2.D 3.A 4.D 5. C 二、判断题 1.×2.×3.×4.√5.× 第6章使用CSS样式美化网页 一、选择题 1.B 2.C 3.C 4.B 5.A 6.D 7.D 8.D 9.B 10.C 11.A 12.A 13.C 14.D 15.D 16.A 17.A 18.B 19.D 20.D 二、简答题 1.×2.×3.×4.×5.×6.×7.√8.×9.√10.√11.×12.×13.×14.√15.√16.√ 第7章规划布局网页 一、选择题 1.B 2.A 3.B 4.B 5.D 二、简答题

Fireworks-网页设计综合实例

Fireworks-网页设计综合实例

Fireworks 网页设计综合实例 在本文中我们将帮助您亲身体验Fireworks 在网页创作中的强大功能,我们通过一个网站页面的设计过程,为您详细介绍Fireworks在网页设计的不同阶段是如何处理各种不同任务的。通过解决您所遇到的每一个具体的任务,您将对Fireworks的主要功能有一个统一的全局性的了解,同时为您在设计中如何利用Fireworks 提供一个清晰的思路。下图是这个教程完成后的外观: 我们将根据这一个典型网站其中一个页面设计流程,使您逐步学习到以下内容: 1、导入并编辑位图图像。 2、自动任务处理

3、创造矢量图形 4、创建文字 5、创建按钮 6、创建导航条 7、设定按钮属性 8、建立切片 9、创建拖拽翻转效果 10、创建弹出菜单 11、创建变形动画 12、优化图像 13、输出HTML文件到Dreamweaver 14、在Dreamweaver中进行往返表格编辑 一、设计前准备 1、网站介绍: 在教程介绍之前首先让我们来看一下我们将要完成的主要任务。这是一个服饰公司的企业网站设计,公司主要以男式服饰为主,同时也兼顾部分女士服饰。网站的主要任务是帮助浏览者了解公司的基本概况和产品信息,并作为公司的

一个展示窗口,向参观者展示企业的形象及产品系列。根据业主的要求,网站包含了企业概况、企业人才、产品展示、公司荣誉以及联系方式。我们将以此得到网站的导航结构。 2、设计指导思想: 本网站设计的指导思想是在网络上营造一 个优雅、高贵、宁静的氛围,为了体现这一主题,设计者将纹理、景深、光影、基调与有形的模特照片和静态的文字结合起来,更多的使用直线、坚硬的边缘、暗的色调来组成网站界面。页面中以较大面积的男性模特图片突出男式服饰这一 主题,以穿插的直线段体现一种服装纹理的感觉。公司的名称则以一种柔软光滑的粗倩体来表现,以打破整个页面的坚硬感,同时以白色突出企业名称,达到非常亮眼的感觉。 3、页面结构: 整个网站采用统一的结构,分为上下两个部分,上面为网站的导航条,下面左边以不同的男式服饰图片及文字标题表示各页主题。右边为内容区,以深色带条纹的图片作为背景。

计算机技能大赛评分标准

附件1: (一)、FLASH动画设计与制作 运用有关技能绘制、处理所需要的图像素材,运用FLASH设计软件,根据组委会给定的主题设计制作FLASH动画。 具体要求: (1)每所职业学校单独为一个竞赛组,每组须由2名学生组成,合作协助共同完成比赛。 (2)本次比赛时间为2小时。 (3)各竞赛组须独立完成,不得剽窃、抄袭他人作品,如经查证,取消比赛资格。 (4)比赛采用定时不定量的方法,利用大赛提供的素材,遵照制作要求和给定的主题,制作一个FLASH动画作品。 (5)制作的动画作品要求内容健康、思想积极向上。 (6)技术运用全面、含量高。 (7)充分发挥参赛者的想象力,按照要求设计制作出新颖、有特色的动画作品。 (8)组委会提供部分素材,其它素材均由参赛者自主创建。 (9)动画结构清晰、规范;色彩搭配合理、美观。 评分标准: 定时不定量,完成基本要求 30分 (脱离制作环境不能播放的影片文件不得分) 内容充实,故事情节表达完整流畅 25分 运用整体技术生动形象的展示动画效果 25分 色彩搭配合理,视觉效果良好、美观 10分 界面友好 5分 内容健康,积极向上 5分

(二)、网站设计 运用有关技能绘制、处理网页所需要的图像素材和动画素材;运用网页设计软件,根据组委会给定的主题设计网站。 具体要求: (1)每所职业学校单独为一个竞赛组,每组须由2名学生组成,合作协助共同完成比赛。 (2)本次比赛时间为2小时。 (3)各竞赛组须独立完成,不得剽窃、抄袭他人作品,如经查证,取消比赛资格。 (4)至少包含三层(除首页外至少还有两个不同页面),页面不少于6页,作品应尽量避免未使用的孤立文件。 (5)尽可能的运用你所能掌握的、系统浏览器能直接支持的所有技术、特效,并合理使用,制作出网页中的动态效果。 (6)页面布局合理、结构清晰、规范;导航美观,结构清晰;色彩搭配合理、美观。 (7)技术运用全面、含量高。 (8)网站内部文件之间的连接均要求使用“相对路径”。 (9)每个页面均要有标题(页面部分或标题栏部分)。 (10)充分发挥参赛者的想象力,要求设计出新颖、有特色的主题网站。 (11)组委会提供网站所需要的部分素材,其它素材均由参赛者自主创建。 (12)作品必须符合基本要求,根据评分标准评定最终结果。 评分标准: 1、网页内容(20分) (1)根据组委会提供的主题,集中反映某方面特色,清晰表达

网站设计期末考试要求暨评分标准

网站设计作业要求暨评分标准 网站主题:自拟。 为了体现团队合作的精神,本次期末考试为Teamwork,根据自愿公平的原则,分组自由结合,但是每组最多5个人。 要求: 一、内容(10分): 1、网站主题要突出; 2、内容详细而充实; 3、能够清晰表达设计意图。 二、结构(10分): 1、结构清楚合理; 2、整体结构有一定的连贯性; 3、每一页都有返回首页的标志; 4、没有空链接; 5、没有错误链接; 6、便与浏览查找。 三、版面与视觉感受(10分): 1、网站整体风格一致; 2、没有乱码和错位; 3、没有错误的表格; 4、按钮图片的制作美观实用; 5、色彩协调; 6、页面美观。 四、技术要求(50): 1 (主页、注册页面、查询页面、留言簿、后台管理页面); 2个; 3、会员注册、登录系统1个; 4、在线查询系统1个; 5、留言簿; 6、后台管理页面。 技术应用: ①Html:超级链接图片表格表单 ②Css:字体文本边框定位 ③VBScript、JavaScript :对象事件特效应用 ④asp内置对象:application session request response server

⑤数据库:ADO Access SQL 五、其他要求(20): 1、word格式作业报告一份(详细格式见模板) ●清楚表述网站的整体设计意图及其功能 ●列举网站设计中使用的技术 ●列举每个网页文件的名称及其功能 ●描述网站正确运行所需要的环境以及参数设置 ● 不少于3000字 2、报告依照模板格式书写,并使用A4纸打印以备存档; 3、所有代码文件打包成RAR压缩包,上传到FTP;文件名称格式为: 第X组.rar。 六、上交作业 将压缩好的RAR文件(名称必须为:“第X组”(例:第X组.rar))复制、粘贴到ftp://218.198.177.79, 09信管:用户名09xg 密码: 09xg 09计科1:用户名09jk1 密码: 09jk1 09计科2:用户名09jk2 密码: 09jk2 作业提交开始时间:2010年12月29日(星期二) 作业上交截止日期:2010年12月30日(星期三),逾期ftp将关闭 2010年12月9日

网页制作技术期末综合习题

网页制作技术期末综合习题 一、填空题 1.Dreamweaver MX有______种工作界面。 2.在站点中建立新的网页文件,其默认的文件扩展名为_________。 3.打开站点面板时,可执行__________菜单中的“站点”命令。 4.如果不想在段落间留有空行,可以按__________组合键。 5.为了让浏览者快速了解图像的概况,在Dreamweaver MX提供了设置__________的功能。 6.单元格内间距是指单元格内的对象与单元格__________之间的距离。 7.单元格间距是指单元格与__________之间的距离。 8.为了使所设计的表格在浏览网页时,不显示表格的边框,应把表格的边框宽度设为_______。 9.在表格的__________中可以插入另一个表格,这称为表格的嵌套。 10.表格的嵌套是指在一个表格中插入另一个表格,表格的平铺是指将不同的表格放置在网页的____________。 11.为了加快下载速度,尽量_______整个网页的内容放在一个大的表格中。 12.在_________视图中,可以使用拖动鼠标的方法在页面中绘制布局单元格。 13.在_________视图中,可以使用拖动鼠标的方法移动单元格的位置。 14.在Dreamweaver MX中,可以插入文本框的类型有单行文本框、多行文本框和__________。 15.在网页种插入文本框、单选框、多选框或跳转菜单时,要先插入空白的_________。 16.在表单中可以插入的按钮包括提交按钮、重置按钮和___________。 17.在包含框架的页面中,每个框架都显示一个________。 18.保存包含框架的页面时,如果页面中包含四个框架,要保存全部页面信息,共需要保存______个文件。每个文件的扩展名都为htm。 19.在保存框架文件时,框架的文件名必须以字母开头且________大小写。 20.浏览器在第一次装载文框架网页时,如果需要指定该框架所显示的网页文件,则要设置该框架的______________属性。21.如果链接的目标文件在本地站点中,可以使用绝对URL或相对URL,如果要链接站点以外的目标文件,则必须使用______________。 22.创建锚链接之前,必须在页面中失当的位置____________。 23.锚链接所起到的作用,就是在页面中起到________的作用,节约查找信息的时间。 24.建立与电子邮件的超链接时,在属性面板的链接文本框中输入__________+电子邮件地址。 25.在制作文本超链接时,建立了超链接德文本__________发生了变化,并且多了一条下划线。 26.使用_____________可以改变页面中建立超链接文本的显示属性。 27.使用_______________可以将格式与网页结构分离,同时可以控制多个网页稳当。 28.通过层可以非常精确地对页面中的________定位。 29.___________是指包含在另一个层中的层。 30.如果选中多个层,_______________的一个层调整柄一黑色突出显示,其他被选中层的调整柄以白色显示。 31.利用属性面板使多个层实现左对齐的操作时,选中多个层后应该在属性面板的_______文本框中输入数值。 32.默认情况下,层的__________值是按照层的创建顺序依次增加。该值大的层显示在层的上面。 33.用户与网页进行简单交互时,若不使用服务器端的应用程序,可以使用javascript脚本外还可以使用Dreamweaver MX 提供的__________功能。 34.使用时间轴面板可以设置各个____________的显示属性以及整个时间轴的播放顺序。 35._____________是动画条中为对象设置位置、大小、颜色等属性的帧。 36.用鼠标拖动动画条,可以调整其在时间轴的位置,从而可以改变对象的持续时间。 52.在文档窗口中,用拖动弹出式菜单边框位置可以设置其相对于触发对象位置,用这种方法只能确定_______________的

各单项比赛评分方式

附件2 各单项比赛评分方式 1.1、软件应用与开发类——网站设计作品评分标准 一级指标(分值)二级指标(分值) 设计内容(20)内容健康、积极向上、符合政策法规(5)与文科专业的应用相关(5) 能够清晰表达设计意图(5) 制作量要求范围内的知识体系结构完整(5) 设计结构(25)结构清晰、布局合理、整体结构有连贯性(5)导航明确、浏览方便、查找快捷、无错链(5)栏目划分与内容组织结构合理(5) 页面标题和关键字设置合理(5) 具有必要的交互功能(5) 设计艺术性(20)网站整体风格一致、色彩谐调、页面美观(5)没有乱码和错位、没有错误的表格(5) 页面元素的制作美观实用(5) 充分利用多媒体技术(5) 创意与应用(20)网页具有个性化设计风格、并具有观赏性(5) 内容有创意(5) 有在互联网上实际运营的网站并能够顺利访问(10) 技术应用(15)页面图片经过优化(5) 分辨为800*600或1024*768 (5)利用数据库技术(5) 1.2、软件应用与开发类——数据库应用作品评分标准 一级指标(分值)二级指标(分值) 功能(15)详细的需求分析(5)详细的系统设计(5)功能测试数据齐备(5) 可靠性(10)系统运行稳定(5) 考虑了数据库的安全性控制(5) 效率(10)良好的反应速度(5) 没有冗余操作和冗余数据(5) 服务质量(35)良好、简便的用户操作界面(5)完善的帮助系统和使用说明(5)

规范的业务流程(5)查询功能齐全(10)报表功能齐全(10) 适应性(30)容错性好(5) 代码易读好,易于维护(5) 系统能够在互联网上运行和访问(10)系统能够正确打包和安装(5) 能够脱离开发平台正确运行(5) 1.3软件应用与开发类——虚拟实验平台作品评分标准 一级指标(分值)二级指标(分值) 设计内容(20)能够清晰表达设计意图(5) 选题与文科专业有关(5) 设计方案合理、可行(5) 制作量范围内的知识体系结构完善(5) 虚拟平台设计(30)有一定的实用价值(5) 启发引导性强、符合认识规律、有利于激发学生的学习热情和兴趣(5)友好的人机交互界面(5) 结构清晰、布局合理(5) 体现现场场景的生动性、真实性(5) 易于推广(5) 技术性(25)操作方便、灵活、交互性强(5) 充分利用多媒体技术(5) 自设计两较大(5) 用户环境友好、实用可靠、安全(5)平台运行稳定、无故障、响应及市(5) 艺术性(25)整体风格同一(5) 色彩搭配协调、视频效果好(5) 文字、图片、音视频、动画切合主题(5)设计有创新或创意新颖(5) 整体效果印象较好(5) 2、微课(课件制作)类作品评分标准 一级指标(分值)二级指标(分值)

网页设计比赛评分标准

网页设计比赛评分标准 1、内容30 分 10分是否有明确的主题、内容 10分内容健康向上、有时代感、信息的实时性 10分创意水平的高低 2、常规技术60 分 5 分整体视觉效果:整个网站在设计上是否统一和谐 10分美工设计:页面的美工设计含量 5 分页面布局:页面的布局是否合理、美观 5 分页面易用型:用户使用时是否方便 5 分内容可扩充性:添加一个栏目或更新内容时是否方便 5 分页面兼容性:在各种浏览器各种分辨率下是否能正常运行 5 分内容充实:网站内容对用户的吸引力 3 分内容分类结构:整个网站的内容分类是否清晰完整 2 分独家内容比例:网站的内容在网上是否属于独家 3 分数据积累:是否有大量的资料性和内容积累 2 分浏览速度:浏览时额定速度 2 分可修改性:对整个网站进行修改时是否方便 3 分技术含量:网站整体的技术评价 5 分动静搭配:动与静的搭配合理,动而不乱,静而不僵 3、多媒体技术10分 10分有体现自己作品主题的风格特色的动画(flash、gif) 平面设计部分评分标准: 1 .图形图像(15分) 将创意思想以图形图像的方式,运用常见的表现手法表达出来(概括、具象、抽象、漫画、装饰、符号化),体现出一种视觉的冲击力。 2 .色彩搭配(15分) 根据自己网站的内容,运用一些符合自己页面内容的色彩,创造和谐、完整、连续的色彩效果。注意色彩带给视者的心理效应。 3 .文字设计(15分) 以汉字为主要设计元素,可以辅助一些英文,根据设计主题的需要选择合适的字体,可有多种。根据文字编排的基本规律和构成方法,促进文字信息的有效传达。 4 .版式设计(15分) 通过版式设计将你自己个人网站的信息迅速、准确地传达出来,应注重个人风格在版式设计中的体现以及统一与变化的相互关系。 5 .动画设计(15分) 至少制作一个动画。可以自由选择GIF动画或FLASH动画中的一种作为你个人网站的动画格式。动画设计元素的选择和变化要与网页主体风格一致。 6. 设计说明(10分)

网制作综合实例

网页制作综合实例 16.1制作前的准备工作 首先在E盘上建立一个文件夹(如玫瑰信使),再在其下建立images文件夹和css文件夹。将“ch16/images”文件夹下的所有图像拷贝到“玫瑰信使/images”文件夹下。 建立站点和规划目录结构、指定默认图像文件夹 主页制作前的准备工作,有定义站点和设计网站结构的目录,还有就是要将网页设计制作中需要用到的所有图像素材整理好,最好是放在站点根目录中的一个文件夹中,如images。这样便于设计制作时的选取使用,也不易造成素材的混乱。如下图: 规划站点目录结构 为站点中使用的图像文件指定一个默认图像文件夹,如下图: 设置站点中的默认图像文件夹 在站点下建立一个主页文件index.html。 16.2设置页面属性及样式 16.2.1页面属性设置 1.在站点资源管理器的本地视窗中,选择并双击已经定义的首页面文件ch16\index.asp。 2.在打开的index.asp文件的文档窗口中,选择“修改”---“页面属性”菜单项,打开“页面属性”对话框。 设置网页标题为:“家庭百科” 设置背景图像为images/bj.gif 将“左边界”、“顶部边界”、“边界宽度”、“边界高度”项均设为5。 3.设置完成后,单击“确定”按钮,确定操作返回到index.asp文档窗口。 16.2.2定义CSS样式文件 定义body样式 1.在index.htm文档窗口中,依次单击“窗口”---“CSS样式”菜单项,打开“CSS样式”面板。选择 “新建CSS样式”菜单命令。 2.打开“新建CSS样式”对话框,“类型”选择“重定义HTML标签”,在“标签”框中选择或输入 body,“定义在”选择“(新建样式表文件)”。 3.单击“确定”按钮,在弹出的“保存样式表文件为”对话框中,选择样式文件保存的路径(站点下的 CSS文件夹),输入样式文件名(这里存为css)。 4.单击“保存”按钮,在出现的样式定义对话框中选择“类型”,在“字体”下拉列表框中选择“宋 体”;在“大小”下拉列表中选择“9”,后面的单位下拉列表框中选择“点数(pt)”度量单位。 5.单击“确定”按钮,便完成对body标记的定义

Fireworks网页设计综合实例

Fireworks网页设计综合实例1 在本文中我们将帮助您亲身体验Fireworks在网页创作中的强大功能,我们通过一个网站页面的设计过程,为您详细介绍Fireworks在网页设计的不同阶段是如何处理各种不同任务的。通过解决您所遇到的每一个具体的任务,您将对Fireworks的主要功能有一个统一的全局性的了解,同时为您在设计中如何利用Firework s提供一个清晰的思路。最终完成的实际页面请看这里。下图是这个教程完成后的外观: 我们将根据这一个典型网站其中一个页面设计流程,使您逐步学习到以下内容: 1、导入并编辑位图图像。 2、自动任务处理 3、创造矢量图形 4、创建文字 5、创建按钮 6、创建导航条 7、设定按钮属性 8、建立切片 9、创建拖拽翻转效果 10、创建弹出菜单 11、创建变形动画 12、优化图像 13、输出HTML文件到Dreamweaver 14、在Dreamweaver中进行往返表格编辑 一、设计前准备 1、网站介绍: 在教程介绍之前首先让我们来看一下我们将要完成的主要任务。这是一个服饰公司的企业网站设计,公司主要以男式服饰为主,同时也兼顾部分女士服饰。网站的主要任务是帮助浏览者了解公司的基本概况和产品信息,并作为公司的一个展示窗口,向参观者展示企业的形象及产品系列。根据业主的要求,网站包含了企业概况、企业人才、产品展示、公司荣誉以及联系方式。我们将以此得到网站的导航结构。

2、设计指导思想: 本网站设计的指导思想是在网络上营造一个优雅、高贵、宁静的氛围,为了体现这一主题,设计者将纹理、景深、光影、基调与有形的模特照片和静态的文字结合起来,更多的使用直线、坚硬的边缘、暗的色调来组成网站界面。页面中以较大面积的男性模特图片突出男式服饰这一主题,以穿插的直线段体现一种服装纹理的感觉。公司的名称则以一种柔软光滑的粗倩体来表现,以打破整个页面的坚硬感,同时以白色突出企业名称,达到非常亮眼的感觉。 3、页面结构: 整个网站采用统一的结构,分为上下两个部分,上面为网站的导航条,下面左边以不同的男式服饰图片及文字标题表示各页主题。右边为内容区,以深色带条纹的图片作为背景。 下面我们将根据上述设计分析,分不同的部分为您介绍制作过程。在新建一个文件后,我们需要对我们的工作环境进行简单的设定,以符合我们的任务要求。首先需要设定工作区的面积及背景颜色,打开Modify>Ca nvas Size针对常见的800x600分辨率,我们设定工作区的长为776这可以根据需要设定,但最好不要超过778,高为515根据实际内容确定,再执行Modify>Canvas Color设定背景色为黑色。再打开View>Grid>Edit Grid 对话框,设定水平方向网格间距为10像素,垂直方向为5像素,并将网格颜色设为暗灰色以不影响观察页面,打开网格显示和网格捕捉。如下图所示: Fireworks网页设计综合实例2 一、导入并编辑位图图像。 Fireworks4带有完善的位图创建、修改和处理功能,我们可以导入外部位图文件并对它进行编辑,可以修改和删除位图中的颜色,可以向对矢量图一样增加效果。我们的工作将从层面板开始,新建一个文件后,默认的只有两个图层Web层和Layer1层,双击Layer1层,将层名改为“背景层”。如下图所示:

网页的评价标准

网页的评价标准 指标和标准 (1)创造性 ●选题和构思有独创性、有特色 ●版面和界面设计有新意 ●图标、图片、动画、视频的设计有较多的原创成分 ●文章大多数为原创内容 ●介绍新资料、新观点、新方法 (2)内容 ●内容丰富、完整 ●主题突出 ●用多种表现形式突出重点 ●文章行文流畅、易于理解 ●提供丰富的背景资料和相关参考资料,注明资料的来源和出处 ●没有错别字和繁体字 (3)导航、结构和链接 ●界面亲切友好,方便用户使用 ●网站结构清晰,采用模块化的结构,易于被用户理解 ●每一页都有明确清晰的导航 ●能够随机选择入口和出口,方便不同层次和需求的用户使用 ●提供背景资料和相关参考资料的链接,没有无效链接 ●内容易于检索 (4)制作水平 ●在动画、按钮等的设计中恰当地运用了比较复杂和高级的技巧 ●图形图片经过最优化处理,视频和音频材料经过压缩,载入迅速 ●运用菜单、图标、按钮、窗口、热键等,增强人机交互功能 ●用户可以选择是否运行或载入作品中的动画、视频、音频以及大的照片●可以选择用文本方式浏览 ●声音与画面同步 ●画面、声音无抖动、无明显的跳跃 (5)艺术性 ●界面美观 ●排版布局合理 ●图片、动画、视频色彩鲜明、清晰,生动形象 ●音乐与主题风格一致,能加强表现力 网页评价表

附录1. 美国发现频道学校推荐的学生网页评价标准(https://www.wendangku.net/doc/c26306658.html,) (https://www.wendangku.net/doc/c26306658.html,/~cfmgb/web.htm)

附录2. 缪斯奖评审表(网站设计) (https://www.wendangku.net/doc/c26306658.html,/muse/webform.html) 注:缪斯奖是授予美国博物馆作品的权威奖项,用于奖励音像作品、多媒体作品、网站设计等方面卓有成效和富有创意者。首届缪斯奖于1989年设立,最初只评选优秀的音像制品,随着技术的不断进步,评选的对象也越来越丰富。目前参加评选的作品包括音像作品、多媒体作品、网站以及博物馆中的交互性活动项目。 博物馆名称________________________________________________ 登记的题目________________________________________________ 在观看与使用被评审作品前请先仔细阅读该作品的登记表。我们要求参加比赛的人员对

《网页设计》考核方法

结课考核(期末考核) 作业提交方式: 将网站文件夹整体压缩打包,命名为:学号-姓名-网站名称,如:201615532 -王某某-环球时尚网 截止接收日期:12月10日前 选题及评分标准 完善学期初的设计,将其建设成一个至少20页的网站,按照制作水平给予学期末成绩。评分标准如下(可以将它看作网站制作的指导步骤):

附:网页制作指导规范(参考) 1、结构设计: (1)、物理结构 网站的物理结构是指网站在服务器上的目录结构。首页放在站点根目录,其他栏目网页放在各自栏目的目录中,目录只能以英文字母和数字来命名。另外,网站结构不要超过3层。 (2)、逻辑结构 网站的逻辑结构是指网页之间相互联接的拓扑结构。它是建立在网站的目录结构之上的,但可以跨越目录结构。 网站的逻辑结构一般有两种形式:树状链接结构、星状链接结构。 本次竞赛采用树状结构。要能够有效的组织起网站的内容,方便用户使用。 2、网站形象设计 网站内容的丰富性固然重要,但简洁明快、独具特色、保持统一的风格能够使浏览者产生深刻的印象,因此,设计内容与形式有机结合的“特色”才是网站成功的关键。 (1)、网站的标志设计 网站的标志可以是中文、英文字母、符号、图案,可以是动物或者人物等。标志的设计创意来自你网站的名称和内容。 本次竞赛要求参赛者自制一个符合自己站点主题要求的标志。 (2)、网站的标准色彩设计 网站给人的第一印象来自视觉冲击,确定网站的标准色彩是相当重要的一步。不同的色彩搭配产生不同的效果,并可能影响到访问者的情绪。本次竞赛要求网站的标准色彩不超过3种。标准色彩要用于网站的标志,标题,主菜单和主色块。给人以整体统一的感觉。至于其它色彩也可以使用,只是作为点缀和衬托,绝不能喧宾夺主。适合于网页标准色的颜色有:蓝色,黄/橙色,黑/灰/白色三大系列色,要注意色彩的合理搭配、美观。本考点亦是得失分的关键点之一。 (3)、网站的标准字体设计 网站的标准字体是指用于标志,标题,主菜单的特有字体。一般网页默认的字体是宋体。如果参赛选手想用其他字体也可以,但是不要在一个站点里运用多种字体。 (4)、网站的宣传标语设计 网站的宣传标语是网站的精神和目标的体现,可以用一句话甚至一个词来高度概括。可以用FLASH来体现也可以用图片来实现。 3、页面要求: (1)、控制页面的总规模。要想把网页做得精彩,内容必定要丰富,但不要把所有的

网页设计制作员竞赛方案

2013年上海市职业技能竞赛 市级一类竞赛 网页设计制作员 决赛方案 上海市职业技能竞赛组织委员会 二○一三年五月

目录 1. 简介 (1) 1.1项目名称 (1) 1.2项目说明 (1) 2. 决赛内容 (1) 2.1技能模块内容及要求 (1) 2.1.1模块一:网站总体设计 (1) 2.1.2模块二:网页设计制作 (2) 3. 评分标准 (3) 4. 安全规定 (3) 5. 材料与设备 (3) 5.1基本设施清单 (3) 5.2参赛选手自备的材料、设备和工具 (4) 5.3竞赛场地禁止使用的材料和设备 (4)

1. 简介 1.1项目名称 网页设计制作员 1.2项目说明 本竞赛项目内容以网页设计制作员(三级)国家职业标准为参考,竞赛内容由2个操作技能模块组成,决赛时间为3小时。 本方案是对上海市一类技能大赛决赛内容的框架性描述,正式决赛内容要求以决赛题为准。 2. 决赛内容 本方案所描述的内容在一般情况下为决赛内容,如参加竞赛的人数较多,则操作技能需进行复赛,复赛内容可参照本网页设计制作员(三级)的二类竞赛内容。 2.1技能模块内容及要求 本项目技能模块分成网站总体设计和网页设计制作2个模块,时间合并计算为3小时。 2.1.1模块一:网站总体设计 1.网站创意设计: (1)网站需求分析; (2)根据网站主题设计网站用户体验(UI) (3)分析和量化网站用户体验的四个关联要素; (4)根据文档规范要求编写网站设计方案;

2.网站结构设计: (1)根据网页功能需求设计网站层次结构; (2)根据文档规范要求编写网站层次结构设计文档;3.网站视觉设计: (1)设计网站界面视觉效果方案 (2)设计网页动态效果方案 2.1.2模块二:网页设计制作 1.制作页面效果图(使用PhotoshopCS3) (1)运用形式感法则设计版面; (2)划分网站首页的功能区域; (3)按照色彩使用法则明确功能区的色彩; (4)按照版面设计的原则进行初步排版; (5)确定版面文字; (6)确定动画及音乐等媒体效果; 2.制作网站主标识(Logo) (1)使用Adobe Photoshop CS3制作网站主标识(logo);(2)设计字母标志; (3)设计概括形体; (4)选择字体及位置; 3.制作网站导航 (1)根据网站的信息量及网站风格设计导航; (2)根据用户需求和网站风格设计不同形式的导航;4.制作Flash动画 (1)应用Adobe Flash CS3软件进行特殊效果处理;(2)应用ActionScript实现交互式flash制作; 5. 制作网页动态效果 (1)设计制作视觉效果样本; (2)使用网页脚本程序实现网页动态效果;

网页设计评分标准

学号 序号 1 2 3 4 5 评分点 文件操作 布局 美观性 主题 页面 链接、导航 图片 网页设计评分标准 总分 总分 总分 分值计分标准得分 第一部分页面( 15分) 文件命名规范( 0-2分),首页以 default.html 2 分。 或 index.html 命名,否则 0 ( 1)结构清晰,布局合理、规范 5( 2)布局新颖,有创意 (1)文字清晰 (2)背景恰当、美观 5( 3)整体效果 ( 字体大小、颜色搭配、动画 在整个页面的效果等 ) 3各个页面均有主题 第二部分层次( 23 分) ( 1)不同内容的页面不少于 30 页 ( 页面没有完 成或只有文字 , 该页不计在内 ) 0-3 分 6 (2)层次清楚、合理( 0-3 分) (1)首页有导航条,设置正确0-5 分 (2)各个页面可直接回主页 0-5 分 17( 3)各级分页面可以互相链接0-5 分 ( 4)给首页加入水平线和版权信息0-2 分 第三部分图片( 22 分) ( 1)能正确显示图片 ( 动态、静态 )0-3 分,一 处不能正确显示扣 1 分,最多扣 3 分 (2)图片选择恰当,符合主题0-3 分 (3)主页有 logo 图片,鼠标悬停时有图片说 明0-4 ( 4)有自制图片 ( 注意制作的技术难度和复杂 22程度 , 含背景图片 ) 0-4 分 ( 5)有自制 Flash 动画 ( 注意制作的技术难度 和复杂程度 ) 0-4分 (6)图片以英文或数字命名 0-4 分,若有以中 文命名的图片此项得 0 分

第四部分技术( 20 分) 框架结构、层、表格的使用,能完整浏览网页框架、层、表格 4内容 ( 含利用滚动条浏览 ) 0-4分 ( 1)使用字幕、按钮、翻转、浮动图片、时 间轴等单一技术手段制作动态效果 4 分,多一自制动态效果8种效果加 1 分。 6( 2)动态效果使页面重点突出,且无杂乱感 0-3 分 CSS样式3合理使用 CSS样式 0-3 分 表单5使用的表单元素种类丰富(有 3 类或 3 类以上给全分) 0-5 分 第五部分总体印象( 20 分) 创意5主题明确,内容健康,思路清晰,新颖独到3-5 分 美感5色彩合理,布局得体,视觉清新,美感独韵3-5 分 技术5运用合理,表达通顺,节奏流畅,视听一体 73-5 分 其他5不合理,错误链接,不完整等3-5分 整个网站至少 30 个页面,每少一个页面扣 10备注分,深度至少包括二级页面,显示分辨率以能 自适应显示屏为准。作品总体积不超100MB。 合计

分享网页设计的案例分析

分享网页设计的案例分析 在我们美丽的地球村里,绿色随处可见,如草、叶等的绿。绿色象征着生命、青春与和平。绿色,是一种中性色,介于黄色与蓝色之间,是最适合人眼注视的色彩。由于接近自然的特性,绿色给人沉稳、平静、舒适的感觉。因此,绿色也是在网页设计中使用得最广泛的颜色之一。下面笔者就通过不同的绿色搭配方式来分析下绿色在网页设计中的色彩和文字颜色搭配。 绿色设计可以结合任何其他颜色,纹理和阴影,可以直观地改变用户的印象。添加纹理可以使颜色变暗,光滑的表面纹理则更加丰富性和富有深度。 1.绿色+白色+暗红色 如下图所示,主色调、辅色调HSB模式的数值可看出,主色调与辅色调是同一种色,只是在明度上有所不同,让页面多了些空间感、层次感。由于绿色本身的特性,所以整个网页看起来很清爽舒适。中间使用白色块面,拉开了两种绿色之间距离,增加了视觉节奏感。点晴色暗红色的加入为网页增添了一分光彩,极具诱惑感,页面瞬间活跃提神了不少,使得整个页面配色清新爽朗。 2.绿色同类色+多种点睛色 上图中用色较多,主色调为明度稍低的黄绿色,辅助色

则为高明度的黄绿色,二者形成强烈反差,增加了页面层次感。此图的点晴色有4种,包括红色与主色调绿色、蓝色与橙红色,二者互相形成对比色。虽说点晴色较多,但都按色相环顺序出现在页面上,形过一个缓和的过渡效果,让人感觉到舒服而非突兀。整个页面色彩谐调,重点突出,层次分明,热闹多彩又不失井然有序。这样的网页配色方案的设计适用于小清新类的服装网站。现今的小清新取景都倾向于海边、公路,若是主色调仍是以白色、黄粉色为主,则会显得单调枯燥。在此笔者建议可以试试看绿色加上多色点睛色的配色方案,你会大有收获。 3.突出绿色+强暗色系 此图中大家一眼就能看出位于正中间的绿色植物,与周围纯度很高的黑色相比,这样的绿色显得醒目,形成鲜明的刺激对比。这两组色彩虽然不是严格意义上的对比色,但足够在页面中形成鲜明对比,整个页面瞬间被烘托得鲜活起来。就像是在油锅中加入水滴一样,瞬间显得生动,有效地突出网页前景。整个页面显得通透鲜活,主题鲜明。此外,加入了棕色和白色的,耀眼的绿色得到平衡,起到舒缓视觉的效果,有效平衡了绿色与暗黑色的强烈对比较果。 结论: 中国人普遍认为绿色是青春,向上,活力的代表,在网页设计中也越来越多的运用绿色系,以显示网页设计的年轻的

《网页制作 案例教程》题库2

第1小题(Dreamweaver单选题(1分) 下述关于图像对象的设置错误的是(_______)。 A 按住shift键后用鼠标拉动图像控制柄可保持图片宽高比例不变 B 直接在属性面板输入图像的宽高像素,也能改变图像的显示大小 C 图像属性面板中的“对齐方式”指的是调整图像与同一行中文本的相对对齐 D 对图像进行重新取样,不会影响图像品质 第2小题(Dreamweaver单选题(1分) 下列哪种软件是用于网页排版的?(_______) A Flash B Photoshop C Dreamweaver D CuteFTP 第3小题(Dreamweaver单选题(1分) Dreamweaver是哪家公司的产品?(_______) A IBM B Corel C Microsoft D Adobe 第4小题(Dreamweaver单选题(1分) 下列的HTML标记中,定义表格的单元格是(_______)。 A tr B dr C br D td 第5小题(Dreamweaver单选题(1分) 想将文字“2”设置为上标文字,在HTML5代码中应如何编写( ) A 2 B 2 C 2 D 2 第6小题(Dreamweaver单选题(1分) 标记符中连接图片的参数是(_______)。 A href B src

C type D align 第7小题(Dreamweaver单选题(1分) 要隐藏一个ap层(设置了绝对定位DIV盒子),需要把它的可见性设置为(_______)。 A default B inherit C visible D hidden 第8小题(Dreamweaver单选题(1分) 如何去掉文本超级链接的下划线?( ) A a {text-decoration:none} B a {decoration:no underline} C a {underline:none} D a {text-decoration:no underline} 第9小题(Dreamweaver单选题(1分) (1)在CSS中下列哪一项是“右边框”的语法() A border-right<值> B border-top:<值> C border-right-width: <值> D border-top-width:<值> 第10小题(Dreamweaver单选题(1分) 以下哪一种选择器是标签选择器() A #newbox br B table C #newtext D .newtext 第11小题(Dreamweaver单选题(1分) 下列(_______)可能是自定义样式的名字。 A body B .pic C text D c

网页制作要求

网页制作要求 一、概述 要求设计并制作一个表达某个主题的网站,不能是一些素材如图片、动画、音乐等的堆积,各页的内容应该具有相关性。可以从网上下载部分资料,但不要指望从网上下一个完整的网站应付老师。总页数不少于15页(一个htm文件算一页)。评分方式按照评分要求逐个仔细浏览,请同学们注意不要下载相同的资料,如果出现网页内容雷同,双方都要打折扣,严重的必须重做。 二、内容 网站应包含专题内容和原创内容两大部分。整个站点首先要求主题突出,信息分类合理,导航清晰。专题部分可根据自己爱好自定(但不要犹豫太久,迟迟不下手);原创内容应包括文字、图片、动画等,至少15个页面。下面是建议设置在网站主页的栏目,其中第一部分必须是自己创作,其他栏目可根据自己的专题调整或另设。 第一部分:原创部分:(至少10个网页) 1、站长介绍(原创) 介绍自己的家乡、成长经历、爱好,对自己所学专业的认识,事业计划。必须有自己的学号、真实姓名、照片(经过Photoshop处理的更好)和自己设计的背景。 2、我与电脑,内容包括:(即第一次上机这样作业) 另外还可以增加一些你在使用电脑过程中的有趣的故事,你对计算机和网络的期待?等等 3、搜索体会 4、个人作品:(原创) ●将自己的照片或要求制作的图片经过Photoshop处理后添加到网页中,组成一个或多个网页 ●添加自己创作的FLASH动画作品到网页中,组成一个页面或多个页面。 ●将自己的作品如文学作品、专业文章、或其他各种作品制作成网页 ●最后加入一个网页(必须的): 5、网页制作后记(原创)

写出你在网页制作过程的体会,写出你的心路历程、写出你的技术成长之路,写出大家的酸甜苦辣,文章要有新意、文字流畅,没有错别字。千万不要抄袭别人的。 第二部分:专题部分:(至少10个网页) ●通过网络就某个专题(如某地区的风俗或文化介绍,某作家介绍等)搜索资 料,题材不限,要求有个人特色、新颖和有吸引力,并对专题作简单的介绍,如专题是什么?分那几个栏目,每个栏目的特色和主要内容是什么? ●专题中的网页不能直接从网站上DOWNLOAD下来,只能从网站上搜索文 字和图片等资料,自己加工处理后组织网页。 参考专题:文学、历史、科技、体育、旅游、生活、时尚等。 三、版面及格式: ●要求图文并茂,颜色搭配合理,切忌背景颜色与文字相近,图片及声音文件不要太大。如果能加入自己创作的动态元素(如Flash,Gif动画等)将获得加分(最好有明确标示是你自己创作的,比如放入自己的名字或照片),希望充分发挥自己的创作能力。 ●?导航设计简洁明了,每一页应该安排返回上一页和返回主页的导航链接,并且要确保不能出现“死链接”,或者图片无法显示的情况。(该项为评分的要点)。 ●使用表格布局。 ●要求必须有一个栏目使用框架网页。 ●?网页中可插入一些Web组件,包括悬停按钮、滚动字幕、横幅广告管理器等,但在一个页面中不要插太多的动态效果。 ●原创内容越多越好,得分越高 四、网页制作流程 1.在本地磁盘中建立一个新文件夹,命名为MYWEB。 2.启动Frontpage,将MYWEB文件夹作为站点打开,此时,会弹出对话框要求在站点文件夹中增加管理文件,选择“是”。 3.此时在Frontpage中的当前目录就是MYWEB了,可以看到在窗口中有文件夹列表,MYWEB子文件夹中增加了Images和_Private两个文件夹,是供你保存你的网页素材文件的。

相关文档
相关文档 最新文档