网站的规划与设计.ppt

网站的规划与设计 欣赏优秀作品 一、欣赏优秀作品： 1、虎门销烟启示录 2、观鸟 /zt/birds 3、2003年“全国电脑制作活动”优秀作品中的网页作品 二、思考以下问题： 1、这些网站是怎样围绕主题展现内容的？ 2、这些网站提供了哪些栏目及功能？ 3、网站的链接有哪些特色，是否便捷？ 4、网站主页的布局、色彩运用有哪些特点？ 一、开发网站的基本过程 二、网站的规划 1、网站主题的确定网站的规划从选择网站的主题开始。网站的选题，就是要根据网站的开发目标和访问网站的用户群，确定网站的主题，并给网站起一个简练响亮的名字。然后围绕这个主题搜集素材和相关资料，并把它们通过网页的形式呈现出来。 2、网站运行环境的确定网站环境包括网站服务器、文件磁盘存储空间、网站域名解析等方面。 　　 3、网页制作工具的选择主要包括网页制作工具、图像处理工具、动画制作软件的选择等。 　　 4、网站开发任务的管理 　　(1)任务分工　 (2)时间安排 三、网站的设计 （一）网站结构的设计 制作网站前要设计好网站的栏目。网站的栏目可以有多层，以能够恰当地体现网站主题为好。此外，每个栏目本身应有一个大致的内容描述，以表达该栏目的设计思路，充实整个网站的总体结构设计。 “虎门销烟启思录”网站的结构 “虎门销烟启思录”网站的结构 三、网站的设计 （二）网页的版面设计 1、风格设计 包括网页布局的整体造型、色彩的搭配、字体图片的样式设置、网站的标志设计等 2、版面布局设计标题信息、栏目信息、内容信息、附加信息等，要进行合理的放置，让人看起来井井有条，主次分明。 常见网页布局类型 布局类型 布局方式 实例 “国”字型 上面是网站的标题及横幅广告，接下来是网站的主要内容，左右分别列一些小条，中间是主要内容，下面是一些网站的信息 人民网 拐角型 上面是标题广告，接下来在左侧是导航栏，右侧是正文，下面是网站的信息。 ? 标题正文型 上面是标题，下面是正文。 ? 左右框型 左边是导航栏，右边是正文。有时最上方会有一个小标题。 ? 上下框型 上面是导航栏，下面是正文。 /show/ 综合框架型 左右、上下两种框架结构的结合。 ? 封面型（Flash型） 精美的平面或动画作为首页。 http://www.matinee.co.uk/site2/fr_nmd.htm （三）网页的交互设计 任务 本学期以小组为单位，每个小组制作一个专题网站。网站主题由各小组定。每小组选出小组长，确定好主题，作好网站的规划。 1、填写好网站规划表 2、给自己组的主题网站设计栏目、结构和作版面设计 参考下面阅读材料，给主题网站作好结构设计、版面设计。 １、个人网站的规划与设计 ２、网站规划书的写作规范 ３、网站设计必知的65条原则 ? ４、网页色彩的选择及搭配原理 ５、确定网站的栏目和版块 ６、确定网站的目录结构 ７、文件夹文件名命名规范 1、个人网站的规划与设计 一、个人网站与个人主页主页就像一份报纸的头版，通常用来作为一个站点的目录或索引。网站的内容都会在主页上面有超级链接，以便用户点击访问。主页在一个网站的处于中心地位，所以常常用主页代称网站。比如：个人网站也经常被称为“个人主页”。 二、个人网站的规划与设计1.明确你建网站的目的是为了宣传自己；还是介绍自己的爱好；还是为了传播某项技术或专业知识；还是建立一种公益性服务；还是为一种思想、观念、事业做宣传；还是使自己走向世界，与更多的人交流。2.建站前的调查根据自己的目的，调查下相关的个人网站，看别人的网站申请了什么样的网站空间、采用了什么建站技术、设置那些栏目、提供了那些功能。3.网站的定位　　如今互联网上的个人网站如雨后春笋般蓬勃发展，绚丽多彩的主页比比皆是。每个人都有发挥个人才能，挥洒自己个性的网上伊甸园。但透过华丽外表，不难看出个中的一些问题所在。（1） 内容定位（2） 技术定位问题（3） 广告定位问题4.网站的表现形式基本上与企业网站的表现形式一样，但要时刻注意紧扣自己建立的目的主题。 1、个人网站的规划与设计 三、个人网站的栏目设置栏目的实质是一个网站的大纲索引，索引应该将网站的主体明确显示出来。在制定栏目的时候，要仔细考虑，合理安排。一般的网站栏目安排要注意以下几方面：1.一定记住要紧扣你的主题！一般的做法是：将你的主题按一定的方法分类并将它们作为网站的主栏目。记住：主题栏目个数在总栏目中要占绝对优势，这样的网站显的专业，主题突出，容易给人留下深刻印象。 2.设一个最近更新或网站指南栏目这样做是为了照顾常来的访客，让你的主页更有人性化。　3.设定一个可以双向交流的栏目不需要很多，但一定要有。比如论坛，留言本，邮件列表等4.设一个下载或常见问题回答栏目