2023年11月28日发(作者:)
目录
第一章:网页设计规划........................................................................................ 1
一、整体规划 ................................................................................................ 1
1.网页设计目的..................................................................................... 1
2.网页定位:......................................................................................... 1
3.网页模块的设置................................................................................. 1
第二章:网页设计与制作 .................................................................................... 1
一、主页设计 ................................................................................................ 1
1.模块设计............................................................................................. 1
2.风格与色彩......................................................................................... 2
二、子页设计 ................................................................................................ 2
1.基本信息模块..................................................................................... 2
第一章:网页设计规划
一、整体规划
1.网页设计目的
我们读书就是为了获得知识,学习了网页设计就是为了把它运用到实际中。
此次网页设计的目的有三个。第一,完成我们的考试,对我们平时学到的知识进
行考核。第二,把学到的知识运用到实践中。正值大四,求职是我们必须面对的
事情,一份完美的简历是找到一份满意工作的敲门砖。把自己的简历做成个人网
页是一个独特新颖的方式,能让大家直观快速地了解我。第三,在此次的网页设
计中,能把之前学到的知识前后联系起来,系统地得到复习,加强对知识的掌握
程度。
2.网页定位:
1) 让大家更快更全面地了解我。
2) 把自己以最新颖的方式推荐给大家。
3) 网页设计风格要符合简历本质的要求。
3.网页模块的设置
此次网页设计共分成五个模块。第一个是网页主页,其次是四个子网页,分
别是我的基本信息、学习成绩、获奖情况、实践经历四个模块。主页中包含有四
个子网页的链接。
在基本信息页面中,可以了解到我的个人信息、优势、技能和在校任职情况
等。在学习成绩模块可以了解到大学期间每个学期我的综测排名情况,还可以链
接到我的详细成绩单。获奖信息页面中可以了解到大学期间不同时间段我获得的
奖励,并附上了主要的几张奖状。在实践经历页面中可以了解到大学期间我的一
些实践情况以及每次实践经历后提高的能力。
第二章:网页设计与制作
一、主页设计
1.模块设计
此页面上包含四个链接图标,分别为基本信息、获奖情况、学习成绩和实践
1
经历。在photoshop中制作好四个链接图片,设定图片大小。通过使用标签
在HTML中创造链接,使用herf属性创建指向另一个文档的链接。通过
标签定义链接图片的样式信息,再通过 设置背景图片。通过标签插入背景音乐。为了增加网页的画面感加入一 个特效-----浮动在窗口的图片,该图片在photoshop中制作,之后对下载的特效 代码进行修改,以适合该网页设计的要求。 2.风格与色彩 页面背景使用花瓣飘落的动态图片,给人以画面美,四个链接图片同样是粉 色花朵为底色,融入整个背景之中。黑色的背景映衬下,花瓣越发鲜艳,同时整 个画面不会因为飘动的花瓣而显得杂乱。浮动的图片采用与背景有一定对比度的 米色和红色,使其识别度更高,其中的字体表达了对浏览该网页人们的尊重。“个 人简历”四个字位于页面正中间并采用与背景对比度很大的颜色,达到醒目的效 果。背景音乐为“我相信”,一首很励志的歌曲,与网页设计内容相称,同时通 过歌词让大家对我留下深刻的第一印象。 二、子页设计 1.基本信息模块 该子网页包含了我最基本的信息,通过 情况两个表格,设置边框属性border为3显示边框。通过标签定义优 势和技能的多行输入文本控件。插入图片特效,把制作好的照片保存到文件夹中, 修改特效代码,使其大小和特效效果符合整个页面结构。五张照片中,包含一张 工作照和四张生活照,使大家能更全面的了解我。背景图片采用竹子的水墨画, 向大家传达自己的虚心和正直。 2.学习成绩模块 该子网页上包含了综测排名情况和详细成绩单的超链接。背景是梅花图案, 传达出自己不屈不挠的品质。旁边附有《出师表》的节选。梅花和该词都是与学 习相关的积极的意象,与该子网页内容紧密相关。 3.获奖情况模块 获奖情况通过 本信息页面相同的特效,把照片替换成几张主要的奖状,是大家更直观的了解到 该模块信息。因为奖状色彩比较多,所以采用白色系列图片。 4.实践经历模块 该网页页面通过 根据 的天空、辽阔的草地上放着书本表达了不仅要学习更要走出课本,去接触外面的 社会和世界,理论结合实践,才会得到更广阔的视野,得到更丰富的知识。 2 总结 本次网页设计我制作了个人简历网页。首先根据自己想到表达的内容确定设 计思路,大致确定设计风格、构建整体布局。紧接着进行素材收集,素材包括必 要的照片、图片和网页特效代码。一切准备就绪之后,利用PhotoShop对图片进 行处理使之符合设计思路和网页页面大小要求,对必要的文字进行特效处理,使 之切合网页设计的整体设计格局。然后进行HTML网页编辑。 在设计制作的整个过程中,加深了对网页设计的认识和理解,使学到的理论 知识运用到实践中。在设计制作中遇到一些困难,通过查阅资料和搜索问题得到 解决,自信心页随之增强。网页设计需要自己的创意,同时也需要小心谨慎,也 许一个符号的错误就可能导致所有的代码都无法运行。 3 标签定义个人信息和在校任职
定义无序列表,列出在校期间每天获得的奖励。插入与基
标签定义实践经历表格。根据内容设定表格的宽度,
发布评论