《网站前台设计综合实训》全套PPT课件.pptx

项目一教育类网站的设计与制作网站前台设计项目实战 教育类网站综合描述 网络以其海量信息资源、沟通便捷等特性成为新型学习环境的有机组成部分。教育类网站，顾名思义即服务于教育活动的网站，它面向学校、老师、学生以及家长而为其提供全方位的教育综合信息服务，是一个进行网上教育、宣传、交流、资源共享的信息平台和服务体系。 具有教育服务性的教育类网站通过提供求学咨询、择校指南、网上报考等的全方位服务，实时播报国内外重要的教育新闻、教育政策、学校招生等信息，既使求学者能够借助网络提供的教育资源，快捷经济地找到适合自己的理想学校；也为求学者们提供一个互动交流、互相帮助和学习的网上平台，更是关注教育的社会各方形成紧密联系、开展沟通交流的纽带。 教育类网站建设的主体既有政府部门、企事业单位和其他社会组织，也有学校及教师个人，这些网站构成了内容丰富、涵盖广泛的教育信息网络。所以，教育类网站分为教育行政部门的网站、教育研究机构的网站、企校合办或企校自办的网站及社会专业机构自办的网站。 项目制作流程前期准备中期网站制作网站修改完善任务一 “宁海职业技术学院网”效果图任务二 横幅广告制作任务三 网站搭建过程 前期准备一、客户需求分析 客户需求，是指学校创建门户网站的目的和对网站提出的特定要求。了解客户需求，是建好学校门户网站的前提。一般来讲，校园网站应比普通的互联网信息平台更有针对性、 更具校园特色, 并易于查询和使用，更能满足学校与外界沟通交流的需求。宁海职业技术学院对其拟建的门户网站提出的主要要求有：1、宣传学校办学理念，展示办学设施、教师队伍、专业设置、就业情况，提高学校的社会知名度； 2、适时发布学校管理、教学、招生等相关信息，为求学者提供相关咨询服务；3、获取社会各界对学校教育教学情况的评价和意见、建议；4、建立与兄弟院校进行交流学习的平台；5、向社会各界推荐毕业生，为毕业生提供就业信息。 前期准备二、网站风格定位 校园网站就是学校的网上形象，凭借百花齐放的院系(班级)网站群，学校门户网站就可成为一道独特的校园风景线。网页的风格是各个设计项目的配合应用，才能达到完美的网站风格设计。本项目介绍的校园网站以宁海职业技术学院为例，从以下三个方面来学习该网站的风格定位。1．色彩 本项目中采用一种色彩，先选定主色调为橙色，这是令人激奋的色彩，具有明亮、健康、热烈、温暖、欢乐、辉煌、庄严以及尊贵的色感，然后通过调整透明度或者饱和度，就是色彩进行变淡、加深或渐变的处理，产生新的橙色的近似色彩，使网页看起来色彩统一，富有层次感。在页面中借助浅灰色的背景图像，采用了留白艺术给人一个遐想的空间，让人感觉心情舒适、畅快。同时，也对于协调页面的均衡起到相当大的作用。 2．排版 在掌握了网页制作技术的情况下，都渴望将自己的网页制作得更具创意和美感。 本项目就是采用骨骼型排版形式，网页版式的骨骼型是一种规范的、理性的分割方法，类似于报刊的版式。常见的骨骼有竖向通栏、双栏、三栏、四栏和横向的通栏、双栏、三栏和四栏等。一般以竖向分栏为多。这种版式给人以和谐、理性的美。几种分栏方式结合使用，既理性、条理，又活泼而富有弹性。3．特效 网页中的特效运用适当，会给网页带来画龙点睛的效果。本项目中的动画效果处理的比较好，动感适度。在本网站中有两种动画效果：一是采用Flash软件制作了网站的广告；二是采用Java脚本制作了滚动图片。 前期准备三、网站建设方案1．页面风格创意设计： 网站页面风格颜色初步拟定采用橙色为基础色，在此色调的基础上进行颜色渐变的展开，通过色彩的运用突出本网站要传达的求知、务实、健康、热烈、庄严等元素，使网站收到了良好的创意效果。2．网站栏目划分：根据我们对用户的了解，特建立以下栏目。●学校概况 ●领导关怀●新闻中心 ●教学管理●多彩校园 ●教育动态●校报校刊 ●协会工作●留言板 ●校园文化●课程设置 ●知识百科●就业指南 前期准备三、网站建设方案 3．网站建设拓扑图教学管理制度教师简介课程设置系部简介教材建设业指南综合新闻校园新闻公 告市州新闻厅局新闻领导关怀新闻中心多彩校园校报校刊留言板学校概况课程设置教育动态协会工作教学管理知识百科就业指南网站首页校园文化在线招生 前期准备四、网站设计方案报价明细：静态页面设计报价明细：工作项目项目要求页数单价(元)合计(元)首页1XXXXXX子页不限XXXXXXBanner设计类型为*.swf的flash动画格式NXXXXXXLogo设计类型为*.gif的图片格式NXXXXXX总 计XXX服务器空间、域名价格明细：项目名称功能要求个数单价(元)合