下载文档原格式
项目一电子商务网站页面赏析任务一“制造业类企业网站赏析”任务单网站的整体色调以蓝色为主，其背景色以白色为主。
其中LOGO为红色。
蓝色给人一种理智的感觉，冷静，安心的感觉，很容易使人联想到海洋、天空、水以及永不言弃。
这跟铁牛的追求的永不言弃不谋而合。
其次白蓝的对比，给人一种宁静致远的放心。
四、任务小结、制作过程中遇到的问题及解决办法。
五、任务执行评价：（根据任务完成的质量、及时度、报告的编写质量给出成绩（100制），作为本项目总成绩评定时的依据之一）成绩：日期：年月日任务二“服务业类企业网站赏析”任务单网站的整体色调及背景色都以蓝色、白色为主调。
其中logo以及页面主要版块的标题栏都是采用蓝色为主。
蓝色给人一种理智的感觉，冷静，安心的感觉，很容易使人联想到海洋、天空、水以及永不言弃。
四、任务小结1、制作过程中遇到的问题及解决办法。
五、任务执行评价：（根据任务完成的质量、及时度、报告的编写质量给出成绩（100制），作为本项目总成绩评定时的依据之一）成绩：任务三“电子商务平台类网站赏析”任务单网站的整体色调及背景色都以白色为主色调，橙色、黑色为辅助色调。
其中logo以及页面主要版块的标题栏都是采用橙色为主，橙色总是带给人朝气蓬勃、活泼向上的感觉，它会使人联想到金色的秋天、丰硕的果实，这与内利商城所追求地积极进取、不断向上的精神是一致的。
另外在整个网站的突出色彩上采用了黄色、红色及灰色，代表了一种喜庆、祝福，也寓意着新改版的内利商城一定会大展宏图。
四、任务小结1、制作过程中遇到的问题及解决办法。
五、任务执行评价：（根据任务完成的质量、及时度、报告的编写质量给出成绩（100制），作为本项目总成绩评定时的依据之一）成绩：日期：年月六、任务拓展。
网页设计师们经常会浏览高质量的网页设计作品分享网站，来解决灵感枯竭的问题。
因为在这些优秀的网站设计实例中可以看到某些趋势，诸如：扁平化设计、视差滚动、响应式设计、流行配色设计等等。
今天小摹为大家带来10个优秀网站设计实例，希望能为网页设计师们带来好的灵感。
在这个网页设计中，采用了流行的插画风格，动态的草图插画使这些插画的纹理非常的清晰，有非常明显的手工迹象，整体看起来创意十足，给人营造出了完美的氛围。
进入Sokruta网站后，引入眼帘的是醒目的大图背景，然后配合简单直观的导航。
使用鼠标滚轮的切换方式让整个网站看起来非常炫酷以及充满个性。
这些个性化的设计都是在视觉上给用户冲击，但是确实有效。
网站首页配色采用了本年度流行的紫色，代表着高贵、庄严、神秘，同时，也有着智慧和创造力的象征，可以说是一种非常有寓意的色彩。
此外，里面的嘉宾介绍，采用了非规则的宫格布局，而且鼠标悬浮后有丰富的动效。
全网站设计使用了全新的分屏设计，这种网站设计可以很好地为用户呈现两方面的信息，并且能够针对不同尺寸的屏幕进行匹配，使网页端和移动端做到很好的兼容，以便为用户创造好的用户体验。
用户在浏览网站时能一次获取两种不同的信息，鼓励用户根据个人喜好做出选择，使用户不会错过任何重要的信息。
网站首页采用了比较夸张的圆形元素，页面中让文字构成圆环形状，围绕批萨，给用户创造出独特的视觉奇观。
为什么采用圆形元素呢？从形状心理学的角度来看，圆形和环形有着完整、和谐的心理学特征，在很多不同的场合，它常常会拿来传达爱情、能量的意象。
在这里，极简网站设计从未如此美丽。
网站设计使用漂亮的美食大图背景吸引用户，全屏式的展示堪称完美。
此外，采用汉堡包菜单按钮，设计抽屉式导航栏，可以大大节约网站空间。
随着页面滚动，导航栏会自然的移动到页面顶部固定。
网站设计层次清晰，且保持着一定的复杂度。
网站设计的背景采用了流行的渐变色。
网站logo使用简约文本样式，背景和LOGO之间有一定的对比度，但没有太过扎眼。
20个惊艳的网页导航赏析货车专用导航哪个最好简洁高效的导航菜单设计，能够有效优化搜索，改善用户体验。
今天，我们将研究一些网页导航设计方案。
这些案例新颖夺目，生动有趣，原创前卫，令人过目难忘。
其中有些设计的复杂程度更将超乎你想象。
推选这些案例，不光是因为这些创意的原创性，还有包含其中的先进设计技巧，可以启发灵感，帮助大家对网页导航设计领域有更多的认知和了解。
你可以点击图片到该网站看看～01 JovaJova的导航菜单干净、整洁、均衡且布局得当。
细直线条，网格布局，黑白配色方案以及清新醒目的排版，拼出了几何韵味十足的优雅界面。
浅色的背景，与之相得益彰。
02 Beloesuhoe这个设计团队很巧妙地找到了一个让网站抓人眼球的方案。
乍一看，似乎这是一个常规的背景图，但是红色的光标点和菜单标题则告诉我们这一切并不像看起来那么简单。
实际上，菜单项是可交互的，只要点击画面上的指示牌，就可以跳转到目标页面。
这是基于虚拟现实的一个相当有趣的解决方案。
03 First PersonFirst Person网站最大的特色就是它那精巧、超现实的立方体情景图。
设计师对细节的刻画，对透视的精准把握使之更引人入胜。
不可思议的是，这个立方体还有白天黑夜两个不同的场景变化。
当然了，这并不是这个网站的主导航，它的作用只是为了能够吸引到你的注意力。
不过，它的超细节展示配上动态场景支持绝对是酷炫爆表。
04 Mint Design CompanyMint Design Company网站让人耳目一新。
通过动画表现，手绘插画风格的页面顿时活灵活现。
网站里的所有元素包括导航都是以契合整体艺术风格的手法来设计的。
每页菜单都有两版风格，一种是包豪斯式极简主义的写生，另一种则是巴洛特式的华美，这两种风格之间采用了令人愉悦的效果进行平滑转换。
05 Vive Latino为了使登陆的页面从众多的网页中脱颖而出，设计师在这里借用了涂鸦的方法。
清爽的单色配上手写字体，加上几十个微小的移动字符，它不仅成功营造出了一种热闹的盛日氛围，还是一个让人很有点击冲动的导航菜单。
实验一经典页面赏析
实训任务：
通过经典页面的赏析，对网页的构成形成初步印象。
1、任务目标
通过学习，你应当能够
①赏析各种经典网页，了解各种类型网页的布局结构、色彩搭配；
②对网页的布局结构、色彩搭配形成初步印象。
2、引导问题
①色系：网页的底色、文字字型、图片的色系、颜色等等。
②排版：表格、框架的应用、文字缩排、段落等等。
3、任务指导
请分析如右图所示网页的布局结构及其配色。
完成任务的步骤：
第一步，分析页面的布局；第二步，分析页面的配色。
学生实验报告XXX学院学生实验报告。
移动端网站案例赏析移动互联网时代的悄然袭来改变着我们的生活方式，同时也有大批的设计力量涌入移动端设计领域。
在web2.0时代背景下孕育成长起来的设计师们，在进入这样一个新鲜的领域时多少有些“水土不服”。
网络环境研究根据CNNIC第32次互联网络发展状况调查,截至2013年6月,中国手机网民的总规模达4.64亿。
其中,手机浏览器用户规模为3.69亿，同比增长21.0%,在手机网民中的渗透率为79.5%。
用户使用手机浏览器的频率稳步提升，75.6%的用户每天都使用，其中63.3%的用户每天使用多次。
同时，从使用时长上看，手机上网开始挤占电脑上网时间，成为我国网民的一种主流上网方式。
手机浏览器作为移动互联网的入口地位将进一步稳定提升同时也成为网民接入移动互联网的首要入口。
在这样的局势下面仅在PC 端建立网站已经开始无法满足用户的需求。
移动端网站建立的必要性十分凸显。
如图所示，3G4G网络的普及率以及WIFI覆盖率正快速增长，而相对占比也不断的提升。
良好的网络环境将为移动端网站设计开拓更大的空间。
这为网站的视觉展示以及流畅体验带来更多可能性，同时因为低速网络仍有比较大的占比，所以网站的性能优化仍然是每位设计师需要迫切关注的要点。
平台支持浏览器作为网站的承载基础，上图数据体现智能移动设备的市场占有量十分高，而普遍智能移动设备系统的自带浏览器以及第三方浏览器基本都是采用webkit内核，对网站都有较高的兼容度，这为设计带来更多可控性。
（相较于IE6用户使用率仍高达24%的PC端【2013年6月微软数据：IE6最新市场份额，中国大陆】，webkit内核浏览器对ccs3以及html5的网站支持率达到的93.5%以上。
）交互差异性不同的终端有着不同的交互方式。
PC与移动设备的交互方式有着天壤之别，在PC上良好的页面交互方式放到移动端页面已然不完全合适。
移动端有着更丰富的交互方式，比如利用手机陀螺仪的重力感应来实现一些交互（如利用重力感应实现视差的js特效、旋转屏幕进行转跳、“摇一摇”实现页面切换等等），比如长按保存图片……同时移动端交互已经慢慢有一套完善成熟的交互体系。
《网页设计》课程标准一、课程定位《网页设计》是虚拟现实应用技术专业的专业学习领域课。
该课程实现Web程序开发知识、方法及工具，着重介绍在Web开发过程用到的HTML5基础知识，用于美化Web页面的样式表知识。
是一门用途广泛、前景良好的计算机行业课程，是适应计算机虚拟现实应用技术专业课程的需要。
该课程的学习可为后续《JavaScript脚本语言》等课程奠定一定的职业能力基础。
二、课程目标通过《网页设计》课程的学习，使学生具备Web应用开发的基本知识，为学习和掌握专业知识和职业技能打下基础。
1．知识目标（1）理解网站的基本概念和HTML5网页编程语言基础；（2）掌握搭建开发环境、网站的搭建（3）掌握HTML5中文字和段落的设置和常用标签；（4）掌握列表标签的使用；（5）掌握超级链接标签的使用；（6）掌握表格标签的设计和使用；（7）掌握框架页面布局；（8）掌握表单的设计；（9）掌握网页中多媒体的应用；（10）掌握层叠样式表CSS3的基本知识；（11）掌握一到多款网页设计软件的运用。
2．能力目标（1）能运用HTML5标签设计网页；（2）能使用CSS3设计网页；（3）会网页设计工具设计网页。
3．素质目标（1）具有自我学习的能力；（2）具备规范化、标准化的代码编写习惯，一定速度的代码编写能力；（3）养成忠于职守、认真负责、精益求精的敬业精神；（4）具备良好的沟通能力；（5）具备良好的团队合作精神以及自我展示能力。
三、课程设计1、设计思想（1）教学内容框架课程按照以能力为本位，紧密围绕在使用HTML5标签，利用CSS3 +DIV布局制作网页过程中遇到的实际需要和应该掌握的技术，全面介绍HTML5标签设计网页的内容和技巧。
（2）总体设计思路以完整的网页制作工作过程为导向，重构教学内容。
根据行业企业发展需要和完成职业岗位实际工作任务所需要的知识、能力素质要求，按照网页设计与制作的过程和学生的学习认知规律，打破原有的功能化知识体系，对教学内容从简单到复杂，从入门到深化进行科学安排，循序渐进的实现教学目标，课程内容与项目开发内容一致，理论与实践一体化，实现学习和工作的深度融合。
情境一简单网页设计与经典网站赏析教学设计知识能力要求1、了解网站和网页的概念；2、了解常用的网页制作软件；3、熟悉网页制作软件Dreamweaver的窗口、面板和命令菜单。
4、拓展知识面，提高网站鉴赏能力、协作学习的能力。
主要教学方法采用任务驱动教学方法。
整个教学过程围绕“美丽的春天”展开。
本次课主要引出该任务，并为完成该任务做准备工作，也使学生为实现从网页浏览者到设计者角色转换做准备。
主要教学互动点在教师引导下师生共同进行优秀网站鉴赏：分析技术、创意、特色等。
采用教辅手段利用多媒体系统进行教学和演示。
教学内容处理1、增加了供鉴赏和分析的优秀网站2、补充了教材以外的知识：以德州科技职业学院网站为例，说明网站设计的技术运用。
教学环节提出任务上网、浏览网页我们并不陌生，但在浏览网页时我们关心的是从网上获取所需要的内容，而对如何设计网页关心较少。
提出课程任务一：“美丽的春天”网站设计与制作。
通过完成该任务使我们实现从浏览者变为设计者角色转换。
任务分析本任务中，先要了解网站和网页的概念，了解网页制作主要软件，大体了解我们上网浏览网页过程的本质是什么，网页是怎么设计出来的。
然后通过优秀网站赏析，使学生进入设计者的角色。
最后要交代贯穿本课程教学的两个任务的基本要求和完成的主要方法和在教学中的侧重点。
完成该任务的教学一、网页设计与制作概述●网页由超文本标记语言（HTML）的文件格式来构造，网页中包含了文本、图像、动画、声音及其他信息。
●使用浏览器可以搜索、查看和下载互联网上的各种信息。
提出并解答问题:浏览网页过程其本质是？●网页的起源:创始于２０世纪７０年代●网页制作软件目前，网页的复杂性越来越高。
软件厂商开发了许多制作工具，采用图形界面，所见即所得。
网页主要制作软件：Dreamweaver 辅助软件：flash photoshop等熟悉Dreamweaver操作界面、（同时开设flash及photoshop软件课程）二、优秀网站赏析国内外优秀网站赏析之一:门户网站中华人民共和国中央人民政府；中国教育科研网；新浪网；太平洋电脑网；万科房地产；无锡旅游国内外优秀网站赏析之三：教育网站清华大学；中国人民大学南京大学德州科技职业学院网站中国少年雏鹰网少年儿童资源网微软中国在进行网站赏析时，和学生就网站特点、内容、结构、技术逐一进行分析和讨论。
