网页设计基础.doc

1.复习css样式，行距样式/字体样式/td样式/超链接样式2.总结网页问题虚线画的不行，很粗的一根虚线在那里显得很不和谐切片做的很有问题，文字贴到图片的边角上面了表格使用凌乱，随意的表格居中影响效果字体的css样式做的不好，超链接的css样式没有做表格的亮边框和暗边框作的有问题切片的优势和劣势以及介绍切片的设计经验3.banner的设计和制作：配合上次设计得LOGO，制作BANNER，图片资料可以使用图片资料文件夹的内容,可以是静态或者是动态的 468*604.网页的主题设计一个站点，首先遇到的问题就是定位网站主题。第1类：网上求职第2类：网上聊天即时信息/ ICQ第3类：网上社区讨论 / 邮件列表第4类：计算机技术第5类：网页/ 网站开发 第6类：娱乐网站 第7类：旅行 第8类：参考 /资讯第9类：家庭/教育 第10类：生活/时尚 每个大类都可以继续细分，比如娱乐类再分为体育 /电影/ 音乐大类，音乐又可以按格式分为MP3，VQF1.主题要小而精。定位要小，内容要精。如果你想制作一个包罗万象的站点，把所有您认为精彩的东西都放在上面，那么往往会事与愿违，给人的感觉是没有主题，没有特色，样样有却样样都很肤浅，因为您不可能有那么多的精力去维护它。网络的最大特点就是新和快，网络上的“主题站”比“万全站”更受人们喜爱，就好比专卖店和百货商店，如果我需要买某方面的东西，肯定会选择专买店。2.题材最好是你自己擅长或者喜爱的内容。比如：您对擅长编程，就可以建立一个编程爱好者网站；对足球感兴趣，可以报道最新的战况，球星动态等。这样在制作时，才不会觉得无聊或者力不从心。兴趣是制作网站的动力，没有热情，很难设计制作出杰出的作品。3.题材不要太滥或者目标太高。“太滥”是指到处可见，人人都有的题材；比如软件下载，免费信息。“目标太高”是指在这一题材上已经有非常优秀，知名度很高的站点，你要超过它是很困难的。5.网站的名字其实网站名称也是网站设计的一部分，而且是很关键的一个要素。你来看，“电脑学习室”和“电脑之家”显然是后者简练；“迷笛乐园”和“MIDI乐园”显然是后者明晰；“儿童天地”和“中国幼儿园”显然是后者大气。我们都知道PIII的中文名称“奔腾”，如果改为“奔跑”，可能就没有今天这么“火”了1. 名称要正。其实就是要合法，和理，和情。不能用反动的，色情的，迷信的，危害社会安全的名词语句。 2. 名称要易记。根据中文网站浏览者的特点，除非特定需要，网站名称最好用中文名称，不要使用英文或者中英文混合型名称。例如：beyond studio和超越工作室，后者更亲切好记。另外，网站名称的字数应该控制在六个字（最好四个字）以内，比如“XX阁”“XX设计室”，四个字的可以用成语，如“一网打进”。字数少还有个好处，一般友情链接的小logo尺寸是88X31，而六个字的宽度是78左右，适合于其他站点的链接排版。 3. 名称要有特色。名称平实就可以接受，如果能体现一定的内涵，给浏览者更多的视觉冲击和空间想象力，则为上品。如：音乐前卫，网页陶吧，天籁绝音。在体现出网站主题的同时，能点出特色之处。6确定网站的栏目和版块我们在动手制作网页前，一定要考虑好以下三方面：1.确定栏目和版块；2.确定网站的目录结构和链接结构3.确定网站的整体风格创意设计网站的题材确定后，相信你已经收集和组织了许多相关的资料内容。你一定认为这些都是最好的，肯定能吸引网友们来浏览网站。但是你有没有将最好的，最吸引人的内容放在最突出的位置呢？有没有让好东西在版面分布上占绝对优势呢？举一些反面的例子1.一定记住要紧扣你的主题！一般的做法是：将你的主题按一定的方法分类并将它们作为网站的主栏目。记住：主题栏目个数在总栏目中要占绝对优势，这样的网站显的专业，主题突出，容易给人留下深刻印象。2.设一个最近更新或网站指南栏目 如果你的首页没有安排版面放置最近更新内容信息，就有必要设立一个“最近更新”的栏目。这样做是为了照顾常来的访客，让你的主页更有人性化。如果你的主页内容庞大(超过15MB)，层次较多，而又没有站内的搜索引擎，建议您设置“本站指南”栏目。可以帮助初访者快速找到他们想要的内容。3.设定一个可以双向交流的栏目不需要很多，但一定要有。比如论坛，留言本，邮件列表等，可以让浏览者留下他们的信息。4.设一个下载或常见问题回答栏目网络的特点是信息共享。如果你看到一个站点有大量的优秀的有价值的资料，你肯定希望能一次性下载，而不是一页一页浏览存盘。“将心比心”在你自己的主页上设置一个资料下载栏目，会得到大家的喜欢。至于其他的辅助内容，如关于本站，版权信息等可以不放在主栏目里，以免冲淡主题。7确定网站的整体风格网站的整体风格及其创意设计是站长们最希望掌握，也是最难以学习的。难就难在没有一个固定的程式可以参照和模仿。给你一个主题，任何两人都不可能设计出完全一样的网站。当我们说：这个站点很cool，很有个性！那么，是什么让你觉得很cool呢？其实风格就是一句话：与众不同！如何树立网站风格呢？我们可以分这样几个步骤：第一，确信风格是建立在有价值内容之上的。一个网站有风格而没有内容，就好比绣花枕头一包草，好比一个性格傲慢但却目不识丁的人。你首先必须保证内容的质量和价值性。这是最基本的，无须置疑。第二，你需要彻底搞清楚自己希望站点给人的印象是什么。可以从这几方面来理清思路：1.如果只用一句话来描述你的站点，应该是:_参考答案：有创意，专业，有(技术)实力，有美感，有冲击力2.想到你的站点，可以联想到的色彩是：_参考答案：热情的红色，幻想的天兰色，聪明的金黄色3.想到你的站点，可以联想到的画面是：_参考答案：一份早报，一辆法拉利跑车，人群拥挤的广场，杂货店4.作为站长，你希望给人的印象是：_参考答案：敬业，认真投入，有深度，负责，纯真，直爽，淑女5.浏览者觉得你和其他网站的不同是：_参考答案：可以信赖，信息最快，交流方便，你可以自己先填写一份答案，然后让其他网友填写。比较后的结果会告诉你：你网站现在的差距，弱点及需要改进的地方。第三，在明确自己的网站印象后，开始努力建立和加强这种印象。经过第二步印象的的量化后，你需要进一步找出其中最有特色特点的东西，就是最能体现网站风格的东西。并以它作为网站的特色加以重点强化，宣传。例如：再次审查网站名称，域名，栏目名称是否符合这种个性，是否易记。审查网站标准色彩是否容易联想到这种特色，是否能体现网站的性格等等。具体的做法，没有定式。我这里提供一些参考1.将你的标志logo,尽可能的出现在每个页面上。或者页眉，或者页脚，或则背景。2.突出你的标准色彩。文字的链接色彩，图片的主色彩，背景色，边框等色彩尽量使用与标准色彩一致的色彩。3.突出你的标准字体。在关键的标题，菜单，图片里使用统一的标准字体。4.想一条朗朗上口宣传标语。把它做在你的banner里，或者放在醒目的位置，告诉大家你的网站的特色是.5.使用统一的图片处理效果。比如，阴影效果的方向，厚度，模糊度都必须一样。6.创造一个你的站点特有的符号或图标。比如在一句链接前的一个点，可以使用,.。（区位码里自己参看）等等。虽然很简单的一个变化，却给人与众不同的感觉7.用自己设计的花边，线条，点8首页的设计首页的设计和制作是绝对要重视和花心思的。一般首页设计和制作占整个制作时间的70%。你宁可多花些时间在早期，以免出现全部做好以后再修改，那将是最浪费精力的事。是否需要为站点设计一个“欢迎界面”？个人观点是：没必要！?除非你是很艺术类的站点，或者可以确信内容独特，可以吸引浏览者进一步点击进入的站点，否则的话，封面式的首页并不会给你的站点带来什么好处。我们上网浏览需要的是快速，有价值的信息，如果等待xx分钟，只显示出一个粗劣的“ENTER”图标，那么相信没有人会再耐心等待进入下一页。首页，从根本上说就是全站内容的目录，是一个索引。但只是罗列目录显然是不够的，如何设计好一个首页呢？一般的步骤是：确定首页的功能模块设计首页的版面处理技术上的细节一).确定首页的功能模块。首页的内容模块是指你需要在首页上实现的主要内容和功能。一般的站点都需要这样一些模块：网站名称(logo), 广告条(banner), 主菜单(menu),新闻(whats new), 搜索(search), 友情链接(links),邮件列表(maillist),计数器(count), 版权(copyright).选择哪些模块，实现哪些功能，是否需要添加其他模块都是首页设计首先需要确定的。二).设计首页的版面在功能模块确定后，开始设计首页的版面。就象搭积木，每个模块是一个单位积木，如何拼搭出一座漂亮的房子，就看你的创意和想象力了。设计版面的最好方法是：找一张白纸，一支笔，先将你理想中的草图勾勒出来，然后再用网页制作软件实现。三).处理技术上的细节我制作的主页如何能在不同分辨率下保持不变形，如何能在IE和NC下看起来都不至于太丑陋，如何设置字体和链接颜色.等等9. 版面布局的原理版面布局也是一个创意的问题，但要比站点整体的创意容易，有规律的多。让我们先来了解一下版面布局的步骤：一. 草案新建页面就象一张白纸，没有任何表格，框架和约定俗成的东西，你可以尽可能的发挥你的想象力，将你想到的景象画上去(我们建议您用一张白纸和一支铅笔，当然用作图软件fireworks等也可以)。这属于创造阶段，不讲究细腻工整，不必考虑细节功能，只以粗陋的线条勾画出创意的轮廓即可。尽你的可能多画几张，最后选定一个满意的作为继续创作的脚本。二.粗略布局在草案的基础上，将你确定需要放置的功能模块安排到页面上。(注：功能模块我们在首页设计-引子中提过，主要包含网站标志,主菜单,新闻,搜索,友情链接,广告条,邮件列表,计数器,版权信息等)。注意，这里我们必须遵循突出重点