搜索
Tangtang汤汤多媒体课件制作室网站的设计与制作网站的设计与制作江苏省滨海县獐沟中学汤凤池2010年05月25日学习目标•确定小组网站的主题和名称•完成小组主题网站的栏目设置•完成小组主题网站的版面规划•学会网站标志的初步设计网站赏析网站名称百度MP3主题设置最新音乐资讯歌曲下载等网站赏析网站名称主题设置任务一各小组交流讨论，确定本小组主题网站的名称，主题。并推选一名小组成员为大家讲解选择的理由。网站名称网站主题选择理由注意事项：（1）主题内容积极向上。（2）名称要紧扣主题。栏目设置栏目地理资讯|----考古|----探奇|----图片地理论坛行游天下|----路书|----攻略|----地图个人门户手机媒体会员活动电子杂志地理基金…我们要把一个优秀的网站由蓝图变为现实的第一个步骤就是网站设计，那到底如何进行设计呢？这就好比写一篇文章，首先要拟好提纲，文章才能主题明确，层次清晰。所以，题材选好后，第一步要设置栏目。栏目设置栏目我们要把一个优秀的网站由蓝图变为现实的第一个步骤就是网站设计，那到底如何进行设计呢？这就好比写一篇文章，首先要拟好提纲文章才能主题明确，层次清晰，所以，题材选好后，第一步要设置栏目。任务二网站名称栏目内容描述注意事项：（1）要紧扣主题，尽可能删除与主题无关的栏目（2）尽可能将网站最有吸引力的内容列在栏目上（3）尽可能方便访问者的浏览和查询。各小组交流讨论，确定本小组主题网站的栏目，并推选一名小组成员为大家作简单介绍。版面设计•网海茫茫，能够吸引我们眼球的只有那些有特色的网页，大量的网页引不起网民的兴趣，究其原因，站点内容是否丰富是其中一个方面，而网页的版面设计是否精美也是重要因素之一。•版面结构是指一种能够让浏览者清楚、容易地理解作品传达的信息的东西，通俗地讲，也就是将不同元素巧妙排列的方式。•布局就是以最适合浏览的方式将图片和文字排放在页面的不同位置。网页要呈现的内容很多，如何合理地放置信息，使之井井有条、主次分明是版面布局需要考虑的问题。•设计版面时，可采用平面分割方式，调动全部面积来构建整个版面。版面设计常见样式“厂”字型页面顶部为主菜单以及横条网站标志+广告条，下方左面为主菜单，右面显示内容的布局特点优点：页面结构清晰，主次分明；缺点：呆板，如果细节色彩上不注意，容易“看之无味”参考示例网站标志广告条主菜单横条等栏目菜单主要内容版面设计常见样式“口”字型页面一般上下各有一个广告条，左面是主菜单，右面放友情链接等，中间是主要内容特点优点：充分利用版面，信息量大，与其他页面的链接多，切换方便；缺点：页面拥挤，不过灵活参考示例网站标志广告条主菜单横条等广告条栏目菜单友情链接主要内容版面设计常见样式自由式：又称POP布局页面布局像一张宣传海报，以一张精美图片作为页面的设计中心，菜单栏目自由摆放特点优点：漂亮、吸引人，适宜于艺术类网站缺点：显示速度慢，文字信息量少页面布局像一张宣传海报，以一张精美图片作为页面的设计中心，菜单栏目自由摆放。参考示例任务三主要内容标题图片栏目其他参考这个例子完成本小组网站版面设置草图,并注明版面用途。完成后请一名小组成员将本组版面在黑板上展示。网站标志“2010上海世博会”标志赏析上海世博会会徽由江苏盐城的青年设计师邵宏庚设计的，编号为0275号的作品“世”字形图形在全球征集的9046件作品中脱颖而出，被选定为中国2010年上海世博会会徽。会徽图案形似汉字“世”，并与数字“2010”巧妙组合，相得益彰，表达了中国人民举办一届属于世界的、多元文化融合的博览盛会的强烈愿望。会徽图案从形象上看犹如一个三口之家相拥而乐，表现了家庭的和睦。在广义上又可代表包含了“你、我、他”的全人类，表达了世博会“理解、沟通、欢聚、合作”的理念。会徽以绿色为主色调，富有生命活力，增添了向上、升腾、明快的动感和意蕴，抒发了中国人民面向未来，追求可持续发展的创造激情。网站标志标志可以是中文、英文字母，可以是符号、图案，可以是动物或者人物等。标志的设计创意来自你网站的名称和内容。一般来说，设计标志有这样几种方法：（1）选择与网站主题有关的，并具有代表性的人或物如搜狐网站的狐狸尾巴（2）对于专业性的网站，可以是本专业有代表的物品作为标志，比如中国银行的铜板标志。（3）最常用和最简单的方式是用自己网站的中文或英文名称作标志。采用不同的字体、字母的变形与组合，可以很容易制作出自己的标志。如世博会吉祥物“海宝”的标志设计体现了以人为本的世博理念。任务四参考下面的一些网站标志，每人完成本小组网站标志一份，由组内讨论选出最佳标志。由标志创作者谈设计构思。标准色彩•网站的标志、标题、主菜单和主色块文字的链接色彩尽量使用标准色彩；图片的主色彩、背景色、边框等尽量使用标准色彩同色系的色彩，这样给人以整体统一的感觉。一个网站的标准色彩不超过3种。•我们来浏览一些网站是如何运用色彩树立风格的：蓝色调为主，加上白色和红色，强调权威与真实橙色为主，白色为辅，具有轻快、时尚的效果标准色彩红色为主，产生热情、活力的感觉、充满欢乐气氛绿色为主，白色为辅，产生舒适、优雅、适于阅读的气氛•网站的标志、标题、主菜单和主色块文字的链接色彩尽量使用标准色彩；图片的主色彩、背景色、边框等尽量使用标准色彩同色系的色彩，这样给人以整体统一的感觉。一个网站的标准色彩不超过3种。•我们来浏览一些网站是如何运用色彩树立风格的：标准字体上海世博会与标准色彩一样，标准字体指用于标志、标题、主菜单的字体。一般网页默认的字体是宋体。各种字体大都具有各自不同的性格，如黑体字凝重、宋体字端庄、隶书飘逸、楷体淡雅等等。体现专业可以用粗仿宋体，体现设计精美可以用广告体，体现亲切随意可以用手写体等。素材收集•选定了主题和栏目，接下来我们就该准备网页素材了。成功网站的最大秘诀在于让用户感到网站对他们非常有用，“内容为王”依然是网站成功的关键，如果内容空洞，无论页面制作得如何精美，仍然不会有多少浏览者。•在收集素材的过程中，首先，要注意对收集来的素材分类，例如同类素材用一个文件夹来管理；其次，文件名要易懂易记；最后，要注意保护知识产权，避免侵犯别人的版权。我非常聪明！我潜力无穷！我定能成功！Tangtang汤汤多媒体课件制作室感谢大家的支持！