如何制做网页.docx

如何制做网页.docx

《如何制做网页.docx》由会员分享，可在线阅读，更多相关《如何制做网页.docx（15页珍藏版）》请在冰豆网上搜索。

如何制做网页

网页制做入门

（1）

网页制做入门

我们天天与网页打交道，那些或界面精美，或内容丰富，或构思独特、风格各异的网页，不知道吸引了多少人的眼球了，它们的运行方式，制做方法，你说你说一点都不好奇，一点都不想知道，那肯定是假的，嘿嘿，我也一样，而且我的好奇心有时还不小～～～，可我的好奇心有是有了，因为网页制做没有真正当成吃饭的家伙，所以，，，当初的热度也只有三分钟，在这里，把以前的一些经验介绍给大家，强烈希望广大高手介入，来个你说，我说，大家说，集众人的智慧于此。

因为大多数地方，是跟据我自己的做法，我自己的理解说的，难免有说错的地方，也请大家指正了。

第一讲网页基本常识

我们平时常见的网页，基本可以分为两类，静态网页（htm,html等）和动态网页（asp、cgi、php等）。

静态网页交互性不强，只是单纯的传输信息给客户浏览器，而动态的一般有很强的交互性，很多都在一定程度上结合了数据库，能进行资料的搜索等功能，常用于论坛，留言本，网上订单等。

常用的网页脚本语言VBScript、JScript，也是一种编程语言。

下面这几点是在别的地方抄来的，就当看小说一样看下吧，只需大概知道下就行了。

一、什么是HTML？

网页的学名称作HTML文件，是一种可以在www网上传输，并被浏览器认识和翻译成页面显示出来的文件。

www是“worldwideweb"的缩写；HTML的意思则是"HypertextMarkupLanguage",中文翻译为“超文本标记语言”。

“超文本”就是指页面内可以包含图片，联接，甚至音乐，程序等非文字的元素。

网页就是由HTML语言编写出来的。

HTML语言只是一种排版语言，语法就类似于这样：

"页高8宽5，（1,2）处插入高1宽1的图片A..."

HTML语言发展很快，已经历经HTML1.0,HTML2.0和HTML3.0,html4.0多个版本，现在html5.0正在测试同时DHTML（动态），VHTML（虚拟），SHTML等也飞速发展。

我们现在一般只要掌握HTML4.0就可以了。

二、什么是动态HTML（DHTML）？

动态HTML是一组技术，是一种新的思想方法，它被设计用来创造和显示更多的交互性网页，包括动态样式，动态内容，2D布局，数据捆梆和多媒体效果等等。

动态HTML（DHTML）是一门令人兴奋的新技术，它完全克服了传统HTML的不足，极具发展前景。

DHTML使用一个文件对象模型（DOM）来扩充HTML语言，使得WEB页面的所有元素及其属性都可以实时存取，从而允许你使用脚本动态地修改页面元素，而这些都不需要WEB服务器的干预。

使用DHTML完全能够设计出复杂的，动态的，交互式的WEB页面，使我们的WEB页面将因此而变得更为生动和精彩。

DHTML目前正在发展中，尚没有形成一个标准。

Microsoft和Netscape两大公司对DHTML各有自己的看法，尽管两大公司都使用了很多相同的技术术语，并引用相同的已发表和提议的标准集合，但在具体实现中，两者不能统一。

Netscape是增加一些新的标记（主要是Layer,Ilayer等），而Microsoft是对现有的标记增加一些新的属性。

由此引起的问题是在InternetExplorer上正常运行的动态网页，在Netscape上可能会不正确运行；反之亦然。

W3C目前正在努力开发一种标准使它能与所有的平台和浏览器兼容。

三、什么是HTTP？

HypertextTransferProtocol,WWW服务程序所用的协议。

我们在用浏览器浏览网页时，使用的就是这个协议，所以在地址栏中都要输入HTTP:

//……。

四、什么是FTP？

FTP是FileTransferProtocol（文件传输协议）的缩写。

它是一种在UNIX类操作系统上使用的协议，现在已经被纳入TCP/IP协议中，被广泛的应用在Internet上。

它的传输方式一般分为ASCII和BIN（二进制）两种。

我们在说到Internet上的FTP时，通常是指一些使用FTP协议的站点和FTP的传输方式。

五、上传主页有哪几种方式？

E-Mail方式维护主页是什么意思？

通常我们上传主页的方式是由提供主页空间的ICP来决定了。

一般的上传方式有FTP、HTTP、和E-Mail三种。

FTP是文件传输协议的英文缩写，光看字面意思，我们就应该知道传输文件是它的拿手好戏。

好戏。

HTTP方式是利用浏览器与服务器链接，向服务器端发送文件。

E-Mail方式是指在维护主页的时候将要更新的内容用压缩软件压缩打包，用E-Mail发给主页空间所在网站的WebMaster。

再由WebMaster将主页内容解压打开，完成更新工作。

这三种上传的方式中，FTP以它的快速和良好的交互性，得到了大家的公认和推崇，现在已经是最流行的上传和下载方式了。

而E-Mail上传方式的优点是安全性极高，不易被黑客乘虚而入。

但是由于交互性和灵活性太差，已经很少使用了。

六、什么是CGI？

CGI意思为CommonGatewayInterface，公共网关接口，一种基于浏览器的输入、在Web服务器上运行的程序方法。

CGI脚本使你的浏览器与用户能交互，为了在数据库中寻找一个名词,提供你写入的评论，或者从一个表单中选择几个条目并且能得到一个明确的回答.如果你曾经遇到过在web上填表或进行搜索,你就是用的CGI脚本。

你那时也许没有意识到，因为大部分工作是在服务器上运行的，你看到的只是结果。

作为一个网页设计者，你创建客户端的CGI脚本，服务器端的程序用来处理用户输入，结果返回给用户。

七、什么是ASP？

MicrosoftActiveServerPages即我们所称的ASP，其实是一套微软开发的服务器端脚本环境，ASP内含于IIS3.0和4.0之中,通过ASP我们可以结合HTML网页、ASP指令和ActiveX元件建立动态、交互且高效的WEB服务器应用程序。

有了ASP你就不必担心客户的浏览器是否能运行你所编写的代码，因为所有的程序都将在服务器端执行，包括所有嵌在普通HTML中的脚本程序。

当程序执行完毕后，服务器仅将执行的结果返回给客户浏览器，这样也就减轻了客户端浏览器的负担，大大提高了交互的速度。

以下罗列了ActiveServerPages所独具的一些特点：

1.使用VBScript、JScript等简单易懂的脚本语言，结合HTML代码，即可快速地完成网站的应用程序。

2.无须compile编译，容易编写，可在服务器端直接执行。

3.使用普通的文本编辑器，如Windows的记事本，即可进行编辑设计。

4.与浏览器无关（BrowserIndependence）,用户端只要使用可执行HTML码的浏览器，即可浏览ActiveServerPages所设计的网页内容。

ActiveServerPages所使用的脚本语言（VBScript、Jscript）均在WEB服务器端执行，用户端的浏览器不需要能够执行这些脚本语言。

5.ActiveServerPages能与任何ActiveXscripting语言相容。

除了可使用VBScript或JScript语言来设计外，还通过plug-in的方式，使用由第三方所提供的其他脚本语言，譬如REXX、Perl、Tcl等。

脚本引擎是处理脚本程序的COM（ComponentObjectModel）物件。

6.ActiveServerPages的源程序，不会被传到客户浏览器，因而可以避免所写的源程序被他人剽窃，也提高了程序的安全性。

7.可使用服务器端的脚本来产生客户端的脚本。

8.物件导向（Object-oriented）。

9.ActiveXServerComponents（ActiveX服务器元件）具有无限可扩充性。

可以使用VisualBasic、Java、VisualC++、COBOL等编程语言来编写你所需要的ActiveXServerComponent。

八、JavaScript是什么？

Java和JavaScript是一样的吗？

JavaScript是一种新的描述语言，此一语言可以被嵌入HTML的文件之中。

透过JavaScript可以做到回应使用者的需求事件（如form的输入）而不用任何的网络来回传输资料。

所以当一位使用者输入一项资料时，它不用经过传给服务器端（server）处理，再传回来的过程，而直接可以被客户端（client）的应用程序所处理，你也可以想像成有一个可执行程式在你的客端上执行一样。

javascript虽然效果不错，但它在网络上的效果奇慢。

在JavaScript上，JavaScript和Java很类似，但到底并不一样。

Java是一种比JavaScript更复杂许多的程序语言。

而JavaScript则是相当容易了解的语言，JavaScript创作者可以不那么注重程序技巧。

所以许多Java的特性在JavaScript中并不支持。

九、常用的WEB图像格式有哪些？

1、PNG（PortableNetworkGraphic）

PNG格式是WEB图像中最通用的格式。

它是一种无损压缩格式，但是如果没有插件支持，有的浏览器可能不支持这种格式。

PNG格式最多可以支持32位颜色，但是不支持动画图。

2、GIF（GraphicsInterchangeFormat）

GIF是Web上最常用的图像格式，它可以用来存储各种图像文件。

特别适用于存储线条、图标和电脑生成的图像、卡通和其它有大色块的图像。

GIF文件非常小，它形成的是一种压缩的8位图像文件，所以最多只支持256种不同的颜色。

Gif支持动态图、透明图和交织图。

3、BMP（WindowsBitmap）

BMP格式使用的是索引色彩，它的图像具有极其丰富的色彩，可以使用16M色彩渲染图像。

此格式一般用在多媒体演示和视频输出等情况下。

4、TIFF（TagInageFileFormat）

TIFF格式是对色彩通道图像来说最有用的格式，支持24个通道，能存储多于4个通道。

TIFF格式的结果要比其它格式更大、更复杂，它非常适合于印刷和输出。

5、JPEG（JointPhotographicExpertsGroup）

JPEG是Web上仅次于GIF的常用图像格式。

JPEG是一种压缩得非常紧凑的格式，专门用于不含大色块的图像。

JPEG的图像有一定的失真度，但是在正常的损失下肉眼分辨不出JPEG和GIF图像的差别。

，而JPEG文件只有GIF文件的1/4大小。

JPEG对图标之类的含大色块的图像不很有效，不支持透明图和动态图。

6、TGA（Targa）

TGA格式与TIFF格式相同，都可以用来处理高质量的色彩通道图形。

另外，PDD、PSD格式也是存储包括通道的RGB图像的最常见的文件格式。

十、域名

由于IP地址全是些的数字，为了便于用户记忆，Internet上引进了域名服务系统DNS（DomainNameSystem）。

当您键入某个域名的时候，这个信息首先到达提供此域名解析的服务器上，再将此域名解析为相应网站的IP地址。

完成这一任务的过程就称为域名解析。

以机构区分的最高域名原来有7个：

com（商业机构）、net（网络服务机构）、gov（政府机构）、mil（军事机构）、org（非盈利性组织）、edu（教育部门）、int（国际机构）。

1997年又新增7个最高级标准域名：

firm（企业和公司）、store（商业企业）、web（从事与WEB相关业务的实体）、arts（从事文化娱乐的实体）、REC（从事休闲娱乐业的实体）、info（从事信息服务业的实体）、nom（从事个人活动的个体、发布个人信息）。

这些域名的注册服务由多家机构承担，CNNIC也有幸成为注册机构之一；按照ISO－3166标准制定的国家域名，一般由各国的NIC（NetworkInformationCenter，网络信息中心）负责运行。

以地域区分的最高域名有：

AQ（南极洲）、AR（阿根廷）、AT（奥地利）、AU（澳大利亚）、BE（比利时）、BR（巴西）、CA（加拿大）、CH（瑞士）、CN（中国）、DE（德国）、DK（丹麦）、ES（西班牙）、FI（芬兰）、FR（法国）、GR（希腊）、IE（、爱尔兰）、IL（以色列）、IN（印度）、IS（冰岛）、IT（意大利）、JP（日本）、KR（韩国）、MY（马来西亚）、NL（荷兰）、NO（挪威）、NZ（新西兰）、PT（葡萄牙）、RU（俄罗斯）、SE（瑞典）、SG（新加坡）、TH（泰国）、TW（中国台湾）、UK或GB（英国）、US（美国）（一般可省略）等。

从域名的结构上来看，域名可分为一级域名、二级域名、三级域名等。

以电脑报网站为例是个一级域名，在一级域名的下一级就是一个二级域名，如果要在下面设立则是三级域名了。

我们见到的免费域名通常是二级域名。

网页制做入门

（2）

作者：

第二讲初识代码

我的网页之路是从洪恩网站里的DW教程开始的，从零到现在这个半调子水平。

那里的很多教程都是从最基础的开始，很合适广大初学者，所以建议大家也从那里开始了。

洪恩网站的学习网址：

在这里，基本上不讲软件的具体使用，只讲总结性的东西，要注意的技巧吧，在最后，也会写一两个用DW做的简单特效实例。

随便打开一个网页，点击查看，再点源代码，一般都可以看到这个网页的代码，做网页说白了，也就是把文字、图象等多媒体效果有机的结合在一起，DW和FP等只是书写代码的利器，只要你知道代码，用记事本也一样能做出精美的网页（真正的高手据说就是用记事本做网页），但对我们初学者来说，没有必要去记代码，只需知道利用DW或FP，能实现哪些操作，就象用WORD一样，画一条线就有一条线，画一个表格就有一个表格，在软件的演示窗口里，有着同WORD一样所见即所得的最后效果察看。

因此，可以说，做网页入门很简单！

可后面还有半句话：

做好网页不简单！

因为，一个好的网页，不单单是代码书写，更重要的是美工设计，内容的充实。

虽然很多代码不需要一一手工书写，可有些代码的基本组织结构了解一些，还是对做网页大有帮助的。

我们可以这样学习、研究代码：

在用DW或FP中做了某一个操作，把效果与上面的代码窗口比较一下，就可以知道什么代码是实现什么效果的，还可以通过查看别人的网页的源代码分析学习。

想学ASP网页的朋友们，有些基本代码是非记不可的。

现在很多做网页的人，都是用借鸡生蛋的办法做的网页，做法是从网上下载现成的网页模板，对模板稍加更改，替换下内容成了。

当然，这也是新手们做网页速成的一种好办法。

模板在很多有提供空间的网站都有下载。

很多以前收录的网址，现在打开都没有用了，在这里，能提供给大家的，只有这些了。

1.源代码下载：

要下载ASP源代码的可以到“中国站长站”去，网址：

forSQLServer版本（excelhome的论坛就是用这个版本）。

2.网页图片及音乐等素材：

3.网页特效代码：

推建一个小工具：

“水晶情缘网页特效专家”，有1M，本来想发上来，太大了，算了，要的话，留下邮箱，我发过去。

如，下雪的效果，鼠标滑动效果等，这里都有。

下面我把一些常用的写下来，以供大家参考：

DREAMWEAVER常用标记：

（都是以前记的一些笔记了）

标记一般成对出现，一个表示特定代码部分的开始，另一个表示特定代码部分的结束（表示结束的前面带"/"符号），但也不是绝对的，比如，
标记。

基本的HTML标记：

html、head和body必不可少。

1.和标记中仅包含网页标题（如）和程序脚本。

2.标记中包含网页的全部内容。

是网页的主体部分。

3.

是中间内容居中标记；

4.

和

从h1~h6，将文本标注为标题，通常要比正文粗大，h1最大；

5.

和

段落标记，在行与行之间添加额外的空白行；

6.
：

强行换行标记，插入单行，不需要封闭标记

7.图象标记：

align水平对齐（left、right或center），valign垂直对齐（top，bottom或middle），border边框宽度

alt="鼠标放在图片上时出现的提示文字"

8.

本行字符将以粗体显示

9.

本行字符将以斜体显示