网页设计是一门融合了技术与艺术的学科，旨在创建具有吸引力和功能性的在线内容。这份实验报告详细介绍了上海建桥学院计算机科学与技术专业学生黄德凯进行的网页设计大作业，涵盖了从网站规划到实际制作的全过程。实验的目标是让学生掌握网页设计的基本技巧，包括网站构建流程、平面设计软件的运用、CSS和HTML的布局方法，以及JavaScript的基础应用。
在实验内容上，学生需要完成一个名为“Krios”的综合主题网站。这个网站主要是为了服务各种开发人员和图片处理人员，以蓝色、灰色和白色为主色调。网站结构包括首页（Home）、特色（Features）、关于我们（About us）、反馈（Feedback）、博客（Blog）和联系我们（Contact）等六个一级栏目。每个一级栏目下还可能有二级或三级子栏目，如Features下的具体功能模块。
在设计阶段，学生需使用Photoshop等平面设计软件绘制页面布局原型线框图。线框图是网站设计初期的重要工具，它展示了网站的基本结构和内容布局。接着，学生需根据设计稿进行切图，这一步骤是为了将设计转化为可被网页浏览器理解的格式。
在实现阶段，学生采用div+css布局方法来构建网页。div是HTML中的一个容器元素，用于组织和分隔网页内容；CSS则用来控制这些元素的样式，如位置、颜色、字体等。通过CSS，学生可以制作二级菜单，这是网站导航系统中的常见元素。同时，学生还需掌握JavaScript的基本应用，例如实现交互效果，如鼠标悬停、点击事件等。
实验过程包括以下几个步骤：
1. 确定网站主题和风格。
2. 设计并绘制网站结构图，包括各级栏目。
3. 规划和创建文件管理结构，确保文件分类清晰。
4. 绘制主页页面结构图，明确各功能区的位置和名称。
5. 使用div+css进行页面布局，并编写相关代码。
6. 制作和插入媒体元素，如图片和JavaScript代码。
7. 进行网站发布，并进行浏览器兼容性测试，确保在不同环境下都能正常显示。
实验结果部分，学生应展示主页的设计效果图，提供主要结构的CSS代码，并记录在制作过程中遇到的问题及其解决方案。示例代码片段展示了网页的头部结构，包含标题、CSS和JS引用，以及导航菜单的HTML结构。
这个实验旨在培养学生的网页设计技能，包括网站规划、视觉设计、前端开发和用户体验等方面的能力。通过这样的实践，学生可以更好地理解和应用网页设计的基本原理，为未来的职业生涯打下坚实基础。
