网页设计与制作案例教程

《网页设计与制作案例教程》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、书名：网页设计与制作案例教程ISBN：978-7-111-27397-4作者：池同柱出版社：机械工业出版社本书配有电子课件网页设计与制作案例教程高职高专ppt课件第1章网页设计与制作基础网页设计与制作案例教程高职高专ppt课件一、网页的基本概念1.网页与网站网站是指建立在互联网上的Web站点，是互联网上相关网页的集合，它面向公众提供互联网内容服务。网页是上网时看到的一个个页面，网站与网页的关系类似于一本书与一页书。网页设计与制作案例教程高职高专ppt课件2.静态网页与动态网页网页按其表现形式来划分可分为动态页和静态

2、页。静态网页只能浏览，不能实现客户端和服务器端的交流互动，在静态网页中，也可以出现各种动态的效果，如GIF格式的动画、FLASH影片、滚动字幕等，这些“动态效果”只是视觉上的，并不能实现客户端和服务器端的交互。动态网页的页面内容随用户的输入而变化，能与客户端交流互动，它们会随不同客户、不同时间，返回不同的网页，动态网页使用ASP、PHP、JSP、ASP.NET等技术生成。静态网页和动态网页各有特点，网站采用动态网页还是静态网页主要取决于网站的功能需求和网站内容的多少。网页设计与制作案例教程高职高专ppt课件二、网页制

3、作常用工具1．利用PhotoshopCS3设计网页图像2.利用FireworksCS3设计网页图像3.利用网页编辑软件DreamweaverCS3制作网页4.利用网页动画软件FlashCS3制作动画网页设计与制作案例教程高职高专ppt课件色彩的魅力是无限的，它是网站重要的表现形式之一。1、网页色彩的基础知识从物理学上，色光可分解为红、橙、黄、绿、青、蓝、紫等，其中，红、绿、蓝是三原色，在计算机科学中我们称之为RGB三原色，三原色通过不同比例的混合可以得到自然界中五颜六色、千变万化的各种颜色。现实生活中的色彩可以分为彩

4、色和非彩色。其中黑白灰属于非彩色系列。其他的色彩都属于彩色。任何一种彩色具备3个特征：色相、明度和纯度。其中非彩色只有明度属性。三、网页中色彩的应用网页设计与制作案例教程高职高专ppt课件2、网页色彩的搭配色彩搭配既是一项技术性工作，搭配协调可以设计出色彩鲜明、性格独特的网站。1）网页色彩搭配技巧单色、邻近色、对比色、黑色、背景色、色彩的数量的使用。网站用色一般控制在3种色彩以内，通过调整色彩的各种属性来产生变化。网页设计与制作案例教程高职高专ppt课件2）常见的网页配色方案红色代表热情、活泼、热闹、温暖、幸福和吉祥

5、。易引起人的注意，使人兴奋、激动、紧张和冲动，还易造成人视觉疲劳的颜色。黄色代表明朗、愉快、高贵和希望。只要在纯黄色中混入少量的其他色，其色相感和色性格均会发生较大程度的变化。白色的色感光明，性格朴实、纯洁、快乐。白色具有圣洁的不容侵犯性。在白色中加入其他任何色，都会影响其纯洁性，使其性格变的含蓄。紫色代表优雅、高贵、魅力、自傲和神秘的感觉。在紫色中加入白色，可使变得优雅、娇气，并充满女性的魅力。网页设计与制作案例教程高职高专ppt课件蓝色代表深远、永恒、沉静、理智、诚实、公正权威。蓝色是一种在淡化后仍然能保持较强个

6、性的颜色。如果在蓝色中分别加入少量的红、黄、黑、橙、白等色，均不会对蓝色的性格构成较明显的影响力。绿色代表新鲜、充满希望、和平、柔和、安逸和青春。绿色是具有黄色和蓝色两种成份的颜色。一般农林业、教育类网站常使用绿色代表希望、充满活力。灰色在商业设计中，具有柔和、高雅的意象，而且属于中间性格，易接受，所以也是永远流行的主要颜色。在许多的高科技产品，尤其是和金属材料有关的，几乎都采用灰色来传达高级、科技的形象。网页设计与制作案例教程高职高专ppt课件四、网页布局1．网页设计的原则主次分明，中心突出大小搭配，相互呼应图文并

7、茂，相得益彰简洁一致网页布局时的元素：格式美观的正文、和谐的色彩搭配、较好的对比度、使得文字具有较强的可读性、生动的背景图案、页面元素大小适中、布局匀称、不同元素之间留有足够空白、各元素之间保持平衡、文字准确无误、无错别字、无拼写错误。文本和背景的色彩：一个页面显示的颜色不宜过多，应控制在256色以内。主题颜色通常只需要2～3种，并采用一种标准色。网页设计与制作案例教程高职高专ppt课件2．网页布局的基本要素学习网页设计首先需要了解构成网页的基本元素，这样才能在页面设计中得心应手，根据需要合理地组织和布局网页内容。一

8、般网页的基本内容包括：页面标题、网站标志、页眉、导航栏、主内容区和页脚。1）页面标题网站中的每一个页面都有标题，用来提示该页面的主要内容。标题出现在浏览器的标题栏中，而不是出现在页面布局中。它还有一个比较重要的作用就是引导访问者清楚地知道所要浏览网站的内容，不至于迷失方向。2）网站标志网站标志在互联网上是一个站点的象征，是网站形象的重要体现。另