网页设计方案实习报告
姓名：陈 伟 班级：微机0922班 学号：专业：计算机应用技术 指导教师：钱 民
时间：2010年12月29日
目录
第一阶段：规划和准备阶段
(一) 需求分析，决定网站的主题，风格； (二) 收集资料，准备素材并进行整理修改； (三) 规划网站的结构和页面版式；
第二个阶段：网页设计，制作阶段；
（一）网页的模板设计；
（二）设计界面，制作网站中的各个网页； （三）将各个网页通过超链接进行整合；
第三个阶段：网站的发布，推广，和维护阶段；
（一）测试，调试与完善网站； （二）推广和发布网站；
实现过程
第一阶段：规划和准备阶段
（一）需求分析，决定网站的主题，风格；
1）说明：在拿到任务书时，我看了一些关于网页设计的案例（如：云南交通职业技术学院网站），也是想起尝试做我们学校的网站，因为这几年随着我们学校的知名度的提高，许多学生和相关人士不断关注我们的学校；也是自己决定尝试下这个挑战，确定了主题和风格。 2
3）风格：
色系风格：所设计页面文字颜色采用深褐色为主，主要为了突出我们学校以冶金为龙头专业的风格；
排版风格：版面使用模板布局页面，表格布局其次，这种风格容易修改网页中的元素：在加上文字、图片、动画等，使页面更加深动活泼，动感强烈。 图标设计风格：学校的图标以学校的校训为特点，以一个向上的图想为标志，突出了我们学校的上进的这样一种深邃的含义。
特效风格：页面使用了Flash . Java script . HTML，真强了页面的动感，使浏览者增加了深刻的印象。
架构风格：每个页面只简单的介绍了学校学院的基本的信息，让读者大体掌握我校的基本情况作铺垫，反正就是突出通俗易懂的这样一个目的。
内容风格：网站主题、整体实用性、文件关联性、内容切合度，都是用一些简单易懂的词语，就是为了给好的掌握我学校的简单信息。
走向风格：对于网站我的网站，基于模板可以增加给多的内容，而且修改内容方便。
加入学校最新动态：安宁校区的信息；
（二） 收集资料，准备素材并进行整理修改；
1）收集资料主要来源与我们学校现有的网站里，还有一些图片是来自于网上下载的。
收集部分资料展示：
首页使用的部分文字资料
使用的部分图片
安宁校区规划图（图 1） 新校区在教学楼（图2）
计息学院运动会（图3） 比赛学生（图4）
处理图像、文字处理工具
（三） 规划网站版式和页面设计
1） 网站的网页主要采用主体上、中、下结构，中间部分组要采用左、中、右和左、右结构，符合传统的网站设计风格，也符合目前学以致用的目的。
2) 结构设计图展示：
中间部分为左、右结构的为：（图六）
这种设计风格符合许多比较大型网站所使用，并且使用的概率非常高，这也是我本次主要使用的一个版式了。
到这里网站的第一个阶段算圆满结束了，现在要进行的就是下一部操作了。
第二个阶段：网页设计与制作阶段；
第1步：制作网页模板，在根据模板创建各个页面。
制作流程：
打开Dreamwear8————HTMR文档————插入一行一列的表格 高：100像素，宽；900像素————在表格下方在插入一行一列的表格宽度和第一个表格一样————在插入一个三行一列的表格————在第二个表格中插入一个20行，3列的表格，和合并后两个页面————在合并页面中在插入一个一行一列的表格，————在这个下方插入一个20行6列的表格————处理相应的表格格式————在头部插入一个图片，就是页面的首部————调整图像大小————制作导航栏————用网页设计软件进入相应的内容首页————学校概括————系部风采————专业设置————师资队伍————学生之窗————教学管理————招生就业————校办企业————后勤服务————教学资源————导航设置完成————到了中部份，在右侧的单元格中键入相应的学院名称————名称上方键入学院导航————冶金材料学院————测绘工程学院————电气学院————矿业学院————计算机学院————外语学院————东盟国际学院————建工学院————建材学院————机械工程学院————商学院————物流学院————化工学院————艺术设计学院————环境工程学院————文理学院————职业教育学院————成人教育学院————相关链接————在时两幅连接图片——中国优秀共产党员教育网————全国高职高专创新教育网————中间部分————插入按钮————校园快讯————2010年中国人权事业的房展 ————2010年美国的人权记录————中德“3+2”合作办学项目招生简章————机械工程学院搬迁仪式启动————电气学院教学设备搬迁工作结束————实习处组织实践教学专题讲座————学校校徽设计招集工作————教育专题————全国高职院校心理健康教育委员会————避免高技能人才带病上岗————《中国青年报》采访夏昌祥校长————昆明冶专自主招生火爆的背后————昆明冶专形象力建设的启示————创建一流的国家示范
校————对高职院校示范性建设工作的思考————安宁新校区的建设跟踪————校园领导在线讲座————在插入图片相应的图片————调整想要的图片————学生工作动态————大学军事课件B面————大学军事课件A面————开展新生入学工作————关于优秀学生奖品(购书券)的通知————加强学习，提高学生素质的讲座————校学生会的工作跟踪————校学生会的开展情况定期调查————党群行政————党委(校长)办公室————组织部（统战部）————纪检监察审计处————学生工作部（处）————财务资产处————武装保卫处——图书馆————在做完这些部分使就要做昆明冶金高等专科学校欢迎你的动态效果————在代码中键入相应的命令即可————在设置下部的导航栏————返回首页————收藏本站——版权声明————关于我们————联系我们————留下建议————版权所有 昆明冶金高等专科学校《当前时间：Wednesday, 2010-12-29 》————技术支持：昆明冶金高等专科学校 计算机信息学院 微机0922班 陈伟————设置模板页面背景颜色————版权所有的背景颜色————最后在整体调整页面的布置。
部分代码展示：
说明：实现主导航栏的设置
说明：实现脚部分导航的实现
height=
2.jpg
2.jpg
2.jpg
2.jpg
2.jpg
2.jpg
2.jpg
2.jpg
说明：这份代码是实现各学院的链接导航栏
2)制作网站的各个页面
设置可编辑区域：
首先是上一步的网页做模板————设置可编辑区域，把需要改内容的的表格设置成可编辑区域————在把设置后的页面进行保存————设置可编辑区域成功
基于模板制作网页：步骤
打开网页模板————选中可编辑区域进行修改内容————把设置后网页保存为学院概括————打开模板制作安宁校区网页————选中可编辑区域————进行删、改内容操作————在把页面进行保存—————在打开模板制作制作冶金材料学院的网页————选中可编辑区域进行删、改内容操作————在保存网页————以此同样步骤制作计算机学院|矿业学院和我们简介的网页——————最后调整和控制所做的全部网页。
3)设置超级链接
将各个需要设置的超链接额的页面在dreaweanr中打开，在进行超级链接 步骤： 1、选中字体
2、选中那个文件夹
3、选择我们所要链接的网页
4）把最链接好后的页面进行保存，链接就做好了。以此类推，做其他页面的链接是做同样的劳动。
5）链接好后的字体效果是
有明显的变化。
第三个阶段网站的发布、推广、与维护；
1）
2）
在基于第二步的基础上，完善网站后，就可对网站进行申请域名，在网上发布了； 但在这里们我们占不涉及这些内容;
本次课程设计的心得体会
一周的课程设计结束了，在这次的课程设计中不仅检验了我所学习的知识，也培养了我如何去做一件事情，如何理解一件事情，又如何完成一件事情；在设计过程中，自己认真设计，不懂的就问身边的同学，相互学习，相互监督；学会了合作，学会了把握事情，学会了宽容，学会了理解，也学会了做人与处世。
课程设计是我们专业课程知识综合应用的实践训练，这是我迈向社会，从事职业工作前一个必不少的过程．”千里之行始于足下”，通过这次课程设计，我深深体会到这句千古名言的真正含义．我今天认真的进行课程设计，学会脚踏实地迈开这一步，就是为明天能稳健地在社会大潮中奔跑打下坚实的基础。
通过这次网页设计，我在多方面都有所提高。通过这次网页设计，我综合运用本专业所学课程的理论和生产实际知识进行一次网页设计工作的实际训练从而培养和提高学生独立设计的能力，巩固与扩充了网页设计等课程所学的内容，掌握网页设计的方法和步骤，掌握网页设计的基本的技能，懂得了怎样分析软件的综合运用，怎样确定设计方案，了解了网页的基本结构，提高了设计能力，绘图能力，熟悉了规范和标准，同时各科相关的课程都有了全面的复习，独立思考的能力也有了提高了。
在这次课程设计过程中，体现出自己单独设计网页的能力以及综合运用知识的能力，体会了学以致用、突出自己劳动成果的喜悦心情，从中发现自己平时学习的不足和薄弱环节，从而加以弥补。
在此感谢我的指导老师.，在这次网页设计的每个实践细节和每个数据，都离不开老师细心指导，你认真的指导，帮助我能够很顺利的完成了这次课程设计。 同时感谢对我帮助过的同学们，谢谢你们对我的帮助和支持，让我感受到同学的友谊。
由于我的设计能力有限，在设计过程中难免出现错误，望老师多多指导,我十分乐意接受你的批评与指正，我将会认真听取你的教导，在下次当中总结经验，把网页设计的更好。
网页设计方案实习报告
姓名：陈 伟 班级：微机0922班 学号：专业：计算机应用技术 指导教师：钱 民
时间：2010年12月29日
目录
第一阶段：规划和准备阶段
(一) 需求分析，决定网站的主题，风格； (二) 收集资料，准备素材并进行整理修改； (三) 规划网站的结构和页面版式；
第二个阶段：网页设计，制作阶段；
（一）网页的模板设计；
（二）设计界面，制作网站中的各个网页； （三）将各个网页通过超链接进行整合；
第三个阶段：网站的发布，推广，和维护阶段；
（一）测试，调试与完善网站； （二）推广和发布网站；
实现过程
第一阶段：规划和准备阶段
（一）需求分析，决定网站的主题，风格；
1）说明：在拿到任务书时，我看了一些关于网页设计的案例（如：云南交通职业技术学院网站），也是想起尝试做我们学校的网站，因为这几年随着我们学校的知名度的提高，许多学生和相关人士不断关注我们的学校；也是自己决定尝试下这个挑战，确定了主题和风格。 2
3）风格：
色系风格：所设计页面文字颜色采用深褐色为主，主要为了突出我们学校以冶金为龙头专业的风格；
排版风格：版面使用模板布局页面，表格布局其次，这种风格容易修改网页中的元素：在加上文字、图片、动画等，使页面更加深动活泼，动感强烈。 图标设计风格：学校的图标以学校的校训为特点，以一个向上的图想为标志，突出了我们学校的上进的这样一种深邃的含义。
特效风格：页面使用了Flash . Java script . HTML，真强了页面的动感，使浏览者增加了深刻的印象。
架构风格：每个页面只简单的介绍了学校学院的基本的信息，让读者大体掌握我校的基本情况作铺垫，反正就是突出通俗易懂的这样一个目的。
内容风格：网站主题、整体实用性、文件关联性、内容切合度，都是用一些简单易懂的词语，就是为了给好的掌握我学校的简单信息。
走向风格：对于网站我的网站，基于模板可以增加给多的内容，而且修改内容方便。
加入学校最新动态：安宁校区的信息；
（二） 收集资料，准备素材并进行整理修改；
1）收集资料主要来源与我们学校现有的网站里，还有一些图片是来自于网上下载的。
收集部分资料展示：
首页使用的部分文字资料
使用的部分图片
安宁校区规划图（图 1） 新校区在教学楼（图2）
计息学院运动会（图3） 比赛学生（图4）
处理图像、文字处理工具
（三） 规划网站版式和页面设计
1） 网站的网页主要采用主体上、中、下结构，中间部分组要采用左、中、右和左、右结构，符合传统的网站设计风格，也符合目前学以致用的目的。
2) 结构设计图展示：
中间部分为左、右结构的为：（图六）
这种设计风格符合许多比较大型网站所使用，并且使用的概率非常高，这也是我本次主要使用的一个版式了。
到这里网站的第一个阶段算圆满结束了，现在要进行的就是下一部操作了。
第二个阶段：网页设计与制作阶段；
第1步：制作网页模板，在根据模板创建各个页面。
制作流程：
打开Dreamwear8————HTMR文档————插入一行一列的表格 高：100像素，宽；900像素————在表格下方在插入一行一列的表格宽度和第一个表格一样————在插入一个三行一列的表格————在第二个表格中插入一个20行，3列的表格，和合并后两个页面————在合并页面中在插入一个一行一列的表格，————在这个下方插入一个20行6列的表格————处理相应的表格格式————在头部插入一个图片，就是页面的首部————调整图像大小————制作导航栏————用网页设计软件进入相应的内容首页————学校概括————系部风采————专业设置————师资队伍————学生之窗————教学管理————招生就业————校办企业————后勤服务————教学资源————导航设置完成————到了中部份，在右侧的单元格中键入相应的学院名称————名称上方键入学院导航————冶金材料学院————测绘工程学院————电气学院————矿业学院————计算机学院————外语学院————东盟国际学院————建工学院————建材学院————机械工程学院————商学院————物流学院————化工学院————艺术设计学院————环境工程学院————文理学院————职业教育学院————成人教育学院————相关链接————在时两幅连接图片——中国优秀共产党员教育网————全国高职高专创新教育网————中间部分————插入按钮————校园快讯————2010年中国人权事业的房展 ————2010年美国的人权记录————中德“3+2”合作办学项目招生简章————机械工程学院搬迁仪式启动————电气学院教学设备搬迁工作结束————实习处组织实践教学专题讲座————学校校徽设计招集工作————教育专题————全国高职院校心理健康教育委员会————避免高技能人才带病上岗————《中国青年报》采访夏昌祥校长————昆明冶专自主招生火爆的背后————昆明冶专形象力建设的启示————创建一流的国家示范
校————对高职院校示范性建设工作的思考————安宁新校区的建设跟踪————校园领导在线讲座————在插入图片相应的图片————调整想要的图片————学生工作动态————大学军事课件B面————大学军事课件A面————开展新生入学工作————关于优秀学生奖品(购书券)的通知————加强学习，提高学生素质的讲座————校学生会的工作跟踪————校学生会的开展情况定期调查————党群行政————党委(校长)办公室————组织部（统战部）————纪检监察审计处————学生工作部（处）————财务资产处————武装保卫处——图书馆————在做完这些部分使就要做昆明冶金高等专科学校欢迎你的动态效果————在代码中键入相应的命令即可————在设置下部的导航栏————返回首页————收藏本站——版权声明————关于我们————联系我们————留下建议————版权所有 昆明冶金高等专科学校《当前时间：Wednesday, 2010-12-29 》————技术支持：昆明冶金高等专科学校 计算机信息学院 微机0922班 陈伟————设置模板页面背景颜色————版权所有的背景颜色————最后在整体调整页面的布置。
部分代码展示：
说明：实现主导航栏的设置
说明：实现脚部分导航的实现
height=
2.jpg
2.jpg
2.jpg
2.jpg
2.jpg
2.jpg
2.jpg
2.jpg
说明：这份代码是实现各学院的链接导航栏
2)制作网站的各个页面
设置可编辑区域：
首先是上一步的网页做模板————设置可编辑区域，把需要改内容的的表格设置成可编辑区域————在把设置后的页面进行保存————设置可编辑区域成功
基于模板制作网页：步骤
打开网页模板————选中可编辑区域进行修改内容————把设置后网页保存为学院概括————打开模板制作安宁校区网页————选中可编辑区域————进行删、改内容操作————在把页面进行保存—————在打开模板制作制作冶金材料学院的网页————选中可编辑区域进行删、改内容操作————在保存网页————以此同样步骤制作计算机学院|矿业学院和我们简介的网页——————最后调整和控制所做的全部网页。
3)设置超级链接
将各个需要设置的超链接额的页面在dreaweanr中打开，在进行超级链接 步骤： 1、选中字体
2、选中那个文件夹
3、选择我们所要链接的网页
4）把最链接好后的页面进行保存，链接就做好了。以此类推，做其他页面的链接是做同样的劳动。
5）链接好后的字体效果是
有明显的变化。
第三个阶段网站的发布、推广、与维护；
1）
2）
在基于第二步的基础上，完善网站后，就可对网站进行申请域名，在网上发布了； 但在这里们我们占不涉及这些内容;
本次课程设计的心得体会
一周的课程设计结束了，在这次的课程设计中不仅检验了我所学习的知识，也培养了我如何去做一件事情，如何理解一件事情，又如何完成一件事情；在设计过程中，自己认真设计，不懂的就问身边的同学，相互学习，相互监督；学会了合作，学会了把握事情，学会了宽容，学会了理解，也学会了做人与处世。
课程设计是我们专业课程知识综合应用的实践训练，这是我迈向社会，从事职业工作前一个必不少的过程．”千里之行始于足下”，通过这次课程设计，我深深体会到这句千古名言的真正含义．我今天认真的进行课程设计，学会脚踏实地迈开这一步，就是为明天能稳健地在社会大潮中奔跑打下坚实的基础。
通过这次网页设计，我在多方面都有所提高。通过这次网页设计，我综合运用本专业所学课程的理论和生产实际知识进行一次网页设计工作的实际训练从而培养和提高学生独立设计的能力，巩固与扩充了网页设计等课程所学的内容，掌握网页设计的方法和步骤，掌握网页设计的基本的技能，懂得了怎样分析软件的综合运用，怎样确定设计方案，了解了网页的基本结构，提高了设计能力，绘图能力，熟悉了规范和标准，同时各科相关的课程都有了全面的复习，独立思考的能力也有了提高了。
在这次课程设计过程中，体现出自己单独设计网页的能力以及综合运用知识的能力，体会了学以致用、突出自己劳动成果的喜悦心情，从中发现自己平时学习的不足和薄弱环节，从而加以弥补。
在此感谢我的指导老师.，在这次网页设计的每个实践细节和每个数据，都离不开老师细心指导，你认真的指导，帮助我能够很顺利的完成了这次课程设计。 同时感谢对我帮助过的同学们，谢谢你们对我的帮助和支持，让我感受到同学的友谊。
由于我的设计能力有限，在设计过程中难免出现错误，望老师多多指导,我十分乐意接受你的批评与指正，我将会认真听取你的教导，在下次当中总结经验，把网页设计的更好。