第7章 网站设计详解.ppt

第7章 网站设计 本章着重介绍网站规划、设计、与发布，其目的是通过学习使读者对网站的制作有一个基本的了解和认识。 主要内容与要求 7.1 网站设计的基本步骤与原则 7.2 网页设计基础——HTML 7.3 网页的制作 7.4 站点发布 7.5 网页脚本语言——JavaScript 7.1网站设计的基本步骤 1、首先在Internet网上申请网站的主页空间和域名。在很多门户网站都提供免费的服务，但代价是要在你的主页上留有该网站的广告。 2、然后在自己的计算机上设计出网页。可以利用一些网页的制作工具。如：网页编辑软件FontPage 、Dreamwave ；图片处理软件，如PhotoShop；动画的制作软件，如Flash等等。 3、通过FTP（文件传输）软件或站点发布软件，将网页、有关的图片文件、动画文件以及相关文件传到网网站。 4、登记搜索引擎。为自己所做的网站进行宣传，让广大的Internet网络用户能够知道你的存在，否则你所做的网站就毫无意义，因为别人无法知道你的网页。 网站设计的基本原则 1 使用者优先的观念； 2 内容第一； 3 着手规划、确定特色、锁定目标； 4 重视首页、合理分类； 5 考虑网站的互动性； 6 应用图形技巧； 7 选取合理的背景底色； 8 避免滥用技术； 9 及时更新维护。 7.2 网页设计基础——HTML 网页的学名称作HTML文件，是一种可以在WWW网上传输，并被浏览器认识和翻译成页面显示出来的文件。 WWW是“World Wide Web”的缩写；HTML的意思则是“Hypertext Markup Language”，中文翻译为“超文本标注语言”。“超文本”就是指页面内可以包含图片、链接、甚至音乐、程序等非文字的元素。一般，一个网站是由很多的Web网页组成，其中有一个比较特殊的Web网页，它是当Internet网络用户访问这个网站时所显示的第一个Web网页，称作主页（Homepage 或Home Page）。 HTML 语言的结构 HTML（超文本标记语言）是一种描述文档结构的标注语言，它使用一些约定的标记对WWW上的各种信息进行标注。当用户浏览WWW上的信息时，浏览器会自动解释这些标记的含义，并按照一定的格式在屏幕上显示这些被标记的文件。HTML的优点是其跨平台性。即任何可以运行浏览器的计算机都能阅读并显示HTML文件，不管其操作系统是什么。 HTML文件是标准的ASCII文件，且其后缀名为htm或html的文件。HTML文件看起来象是加入了许多被称为链接签（tag）的特殊字符串的普通文本文件。 大部分的标签形式是：标签名相应内容/标签名 例子 HTML HEAD TITLE华中科技大学/TITLE /HEAD BODY bgcolor= yellow P这是一HTML的测试文件/P /BODY /HTML 超文本链接指针 超文本链接指针是HTML最吸引人的优点之一，可以这样说，如果没有超文本链接指针，就没有万维网。使用超文本链接指针可以使顺序存放的文件具有一定程度上随机访问的能力，这更加符合人类的跳跃思维方式。超文本链接指针是指把并不连续的两段文字或两个文件联系起来。 构成网页的基本元素 1．基本标签 该类标签用于建立具有文本、标题和列表的HTML页面。 HTML…/HTML：括住整个HTML文档（文件的开头和结尾） HEAD…/HEAD：括住HTML文档的页头（描述文件的信息） BODY…/BODY：括住HTML文档的主体（文本、标签和正文内容） TITLE…/TITLE：用于设定文档的标题 2．题头标签、结构相关的标签 （1）六级标题标签 H1…/H1： 1级标题 H2…/H2： 2级标题 H3…/H3： 3级标题 H4…/H4： 4级标题 H5…/H5： 5级标题 H6…/H6： 6级标题 （2）标题对齐 H? ALIGN=LEFT|CENTER|RIGHT…/H? （“?”对应标题的六级1-6） （3）区段 DIV…/DIV （4）区段对齐 DIV ALIGN=LEFT|RIGHT|CENTER…/DIV （5）引文区段 BLOCKQUOTE…/BLOCKQUOTE（显示时通常内缩） （6）强调 EM…/EM （通常以斜体显示） （7）强烈强调 STRONG…/STRONG （通常以黑体显示） （8）引用语句 CITE…/CITE （通常以斜体显示）