网页设计与制作概述.ppt

1、网页设计和制作的概要，理解网页的基本构造特性和布局理解网页制作的基本工具和开发语言，网页：网页是Web信息传递的载体，是网站中用户阅读的网页，也称为网页 world wide web :简称为www或3W，也是建立在互联网上的网络服务。 根据HTTP协议，通过超文本和超媒体收集互联网上的文本、声音、图形、图像、视频信号等各种信息。 浏览器：需要浏览器才能访问网络中的各种资源。 否则，无法访问网络中丰富的资源。 目前常用的浏览器有：IE、netscape和taniversalresourcelocator(URL ) :互联网上每个网页都有唯一的名称标识符，通常称为URL地址。 是指出某信息的位

2、置和访问方式，取得各种服务信息的标准方法。 通信协议：在上述示例的“http”部分中，包括http (超文本传输协议)、FTP (文件传输协议)、gopher (图形协议)、News (新闻组) 主机名：访问服务器的互联网名称。 IP地址： IP地址是一组32位数字，如“84”，这是因特网主机的地址。 域名： IP地址是一系列长数字，这些数字很难记住，很难理解。 为了便于大家的理解、记忆，有域名的概念。 网域名称的范围大于主机名称。 一个域名下可以有多个主机名，域名下可以有子域名。 例如，域名www. good-下面有主机server1和server2，该主机的全名是se

3、rver1.good-和server2.good-。 也就是说，是经常说的二次域名。 通过在域名前加入传输协议信息和主机类型信息，是网站(URL )、文件传输协议(FTP ) :高速、高效、可靠性的信息传输方法。 hypertextmarkuplanguage (html ):www创建超媒体文本的语言，也是创建网页的最基本的语言，创建的网页基于html文本进行标识。 表格：表格是用于填写申请和提交信息的交互式页面。 电子邮件地址、主页空间、QQ号码等申请页面、论坛、聊天室、留言簿等。 超链接：这是web页面创建中常用的概念，指页面对象之间的连接关系。 导航栏：导航栏可以非常有效地实现超链接功

4、能。 分发：将创建的网页上传到服务的过程称为分发，也称为上传或上传。 1.2网站制作流程、资料收集、企划网站选择适当的制作工具制作网站测试并发表宣传网站的维护；(1)定位网站的主题和名称主题与网页主要销售或展示的产品或服务密切相关请注意，在主题选择方面，主题小而精致。 定位要小，内容要精致。 题材最好是你自己擅长或喜欢的内容。 题材不要太杂乱，也不要目标太高。 1、策划设置修订，(2)确定网站栏和版本，一般网站栏应注意以下几点：将你的主题按一定方法分类，并将它们作为网站的主栏，主题突出，容易给人留下印象。 最近更新或设置站点指南栏设置允许双向交流的栏设置下载或设置常见问题回答栏，(3)确定站点

5、的目录结构，并且不要将所有文件放在根目录下。 用栏目的内容创建子目录。 在每个主目录下创建一个独立的images目录。 目录的层次不要太深。 目录层次结构不得超过三个层次结构。 不要使用中文目录。 太长的目录尽量不要使用意义明确的目录。 容易记忆和管理。(4)决定网站的链接结构、树链接结构(1对1 )。 点击、“古典音乐”，点击“筝”，点击星状链接结构(一对多)。 点击电影，点击古典音乐的最好方法是在首页和第一页之间使用星形链接结构，在第一页和第二页之间使用树链接结构。 点击古典音乐、音乐页面，程序员在进行详细设计的同时，网页图稿开始设计网站的整体形象和首页。 整体形象设计包括标准字体、Log

6、o、标准颜色、广告语等。 首页设计包括样式设计，如版面、颜色、图像、动态效果和图标，以及模块设计，如菜单、标题和版权。 也可以使用图像剪切工具收集自己感兴趣的素材。 模块布局的目的是使访问者的阅览变得容易，现在的多媒体网页具有强有力的交互功能，同时存在文字、图像、动画、声音、超链接等媒体方式。 文字是简洁有效的媒体，适合输入方便、处理速度快、网速慢时用文字进行大面积的布局。 图像可以给予更直观和更感性的认识，其缺点是下载速度慢，互联网速度慢的情况下不应该大面积使用。 (5)设计网站的整体风格，网页颜色网页颜色是确立网站形象的重要要素之一。 组合网页颜色时，请注意颜色的鲜明度、独特性、适应性、联

7、想性。 各印版采用与网站首页相同颜色系的颜色，印版内部整体也尽量使风格一致。 可以采用专用的配色软件。 网页文本注意以下基本原则：不得使用三种以上的字体类型。 否则，网页看起来很杂乱，主题不要用得太大。 由于布局空间非常宝贵和有限，粗糙的大字体无法为阅览者提供大量信息的标题字体应该比正文大一些，颜色也应该不同。 设计网站的logo) logo是你网站的特色和内涵的集中表现，一看logo就会联想到你的网站。 标志也可以是中文、字母、符号、花样、动物或人物等。 下载保存的文件，由Twins07.swf在自己的网页上选择“插入”|“媒体”|“Flash”命令，中式：古色古香、韵味典雅、古典的边框、温

8、雅的颜色。 个性化网站欣赏：天马星空，随行发挥，常见中国门户网站：有板有眼，方正，不贴近。 企业级简洁页面：页面清晰，客户一目了然。 大气、颜色多与产品类型有关。 欧美风-科学技术感：动感的弧形图案、金属质感的图标、商业化、科学技术感的照片。 时尚感：大胆时尚的照片，相关颜色对比，技术色彩多，色调冷，页面结构坚硬。 日韩风格：使用渐变颜色、色彩鲜艳、高分辨率的图像。 日韩风格：颜色搭配协调，五彩缤纷，颜色丰富饱和正好。按照网站内容的整体风格设计布局。 修订者可以参考其他优秀的网站，调用自己的各种知识储备，特别是艺术知识。 此时，设定修正者用笔在纸上大致描绘出布局的轮廓。 常见的页面布局结构有： (6)页面布局和布局，t型结构同字结构同字结构三字结构单一Flash型，t型结构，同字结构，川字结构，三字结构，单一结构，2 .页面制作工具(1)网页布局工具Dreamweaver front p 网页美化工具图像处理软件：Photoshop、Fireworks动画制作软件：FLASH、Swish、Ul