网站制作的详细8大步骤由于目前所见即所得类型的工具越来越多，使用也越来越方便，所以制作网页已经变成了一件轻松的工作，不像以前要手工编写一行行的源代码那样。一般初学者经过短暂的学习就可以学会制作网页，于是他们认为网页制作非常简单，就匆匆忙忙制作自己的网站，可是做出来之后与别人一比，才发现自己的网站非常粗糙，这是为什么呢？常言道：“性急吃不了热豆腐”。建立一个网站就像盖一幢大楼一样，它是一个系统工程，有自己特定的工作流程，你只有遵循这个步骤，按部就班地一步步来，才能设计出一个满意的网站。 一、搜集材料 明确了网站的主题以后，你就要围绕主题开始搜集材料了。常言道：“巧妇难为无米之炊”。要想让自己的网站有血有肉，能够吸引住用户，你就要尽量搜集材料，搜集得材料越多，以后制作网站就越容易。材料既可以从图书、报纸、光盘、多媒体上得来，也可以从互联网上搜集，然后把搜集的材料去粗取精，去伪存真，作为自己制作网页的素材。 二、确定网站主题 网站主题就是你建立的网站所要包含的主要内容，一个网站必须要有一个明确的主题。特别是对于个人网站，你不可能像综合网站那样做得内容大而全，包罗万象。你没有这个能力，也没这个精力，所以必须要找准一个自己最感兴趣内容，做深、做透，办出自己的特色，这样才能给用户留下深刻的印象。网站的主题无定则，只要是你感兴趣的，任何内容都可以，但主题要鲜明，在你的主题范围内内容做到大而全、精而深。 三、制作网页 材料有了，工具也选好了，下面就需要按照规划一步步地把自己的想法变成现实了，这是一个复杂而细致的过程，一定要按照先大后小、先简单后复杂来进行制作。所谓先大后小，就是说在制作网页时，先把大的结构设计好，然后再逐步完善小的结构设计。所谓先简单后复杂，就是先设计出简单的内容，然后再设计复杂的内容，以便出现问题时好修改。在制作网页时要多灵活运用模板，这样可以大大提高制作效率。 四、规划网站 一个网站设计得成功与否，很大程度上决定于设计者的规划水平，规划网站就像设计师设计大楼一样，图纸设计好了，才能建成一座漂亮的楼房。网站规划包含的内容很多，如网站的结构、栏目的设置、网站的风格、颜色搭配、版面布局、文字图片的运用等，你只有在制作网页之前把这些方面都考虑到了，才能在制作时驾轻就熟，胸有成竹。也只有如此制作出来的网页才能有个性、有特色，具有吸引力。如何规划网站的每一项具体内容，我们在下面会有详细介绍。 四、选择合适的制作工具 尽管选择什么样的工具并不会影响你设计网页的好坏，但是一款功能强大、使用简单的软件往往可以起到事半功倍的效果。网页制作涉及的工具比较多，首先就是网页制作工具了，目前大多数网民选用的都是所见即所得的编辑工具，这其中的优秀者当然是Dreamweaver和Frontpage了，如果是初学者，Frontpage2000是首选。除此之外，还有图片编辑工具，如Photoshop、Photoimpact等；动画制作工具，如Flash、Cool 3d、Gif Animator等；还有网页特效工具，如有声有色等，网上有许多这方面的软件，你可以根据需要灵活运用。 五、推广宣传 网页做好之后，还要不断地进行宣传，这样才能让更多的朋友认识它，提高网站的访问率和知名度。推广的方法有很多，例如到搜索引擎上注册、与别的网站交换链接、加入广告链等。六、维护更新 网站要注意经常维护更新内容，保持内容的新鲜，不要一做好就放在那儿不变了，只有不断地给它补充新的内容，才能够吸引住浏览者 ★要想学做网页，首先得了解制作网页的工具。 制作网页主要有以下一些工具 Frontpage：office自带的一个工具，操作简单，实用，学起来比较轻松，功能不咋地，我不太喜欢。 Dreamweaver：这是网页三剑客之一，专门制作网页的工具，可以自动将网页生成代码，是普通网页制作者的首选工具，界面简单，实用功能比较强大。建议初学者选用。 另外一个工具就是代码编辑工具，例如写字本、EditPlus等，这些工具主要编辑asp等动态网页。 此外还有一些网络编程工具，javascript、java编辑器等。 网页制作也是一个比较吃香的行业，要真正做一个好的网站，还必须有良好的设计功底。所以还得学很多边缘性的软件，例如photoshop、flash等。 大型的网站往往还需要数据库的支持，所以还得懂数据库。sql、甲骨文等。 七、上传测试 网页制作完毕，最后要发布到Web服务器上，才能够让全世界的朋友观看，现在上传的工具有很多，有些网页制作工具本身就带有FTP功能，利用这些FTP工具，你可以很方便地把网站发布到自己申请的主页存放服务器上。网站上传以后，你要在浏览器中打开自己的网站，逐页逐个链接的进行测试，发现问题，及时修改，然后再上传测试。全部测试完毕就可以把你的网址告诉给朋友，让他们来浏览。  FrontPage是一个非常简单使用的网页编辑软件，用它可以快速的编好一个网页，它具有上手快，易学、易用的特点。FrontPage是初学者理想的制作网页的集成工具。Dreamweaver是第一套对专业网页设计师的视觉化网页开发工具，利用它可以轻而易举地制作出跨越平台和跨越浏览器的充满动感的网页【关键词】网页制作、FrontPage、所见即所得、 Dreamweaver，HTML 当我们在网上冲浪时，会对那些美观的网页羡慕不已，其实，我们也可以制作自己的个人网页，现在网页制作软件不少，主要有以下几种有特色的网页制作软件。Microsoft FrontPage——制作功能强大的网页Netscape编辑器——制作简单的网页Adobe Pagemill ——制作多框架、表单和Image Map图像的网页Claris Home Page ——快速创建动态的网页DreamWeaver——自制动态HTML动画的网页HotDog Professional ——制作要加入多种复杂技术的网页HomeSite ——制作可完全控制页面进程的网页HotMetal Pro ——制作具有强大数据嵌入能力的网页hotdog Professional ——强大而又方便至极的超级网页编辑工具Paintshop Pro ——可以看作是photoshop的简化版本Ulead Cool 3d——人人叫好的3D特效字制作工具Gif movie Gear ——简单至极的动画软件Ulead Smartsaver——对图像进行优化、压缩处理在这么多网页制作软件中，目前最知名和最常用的两套热门软件应该是Frontpage 和Dreamweaver。下面我就来向大家简单介绍这两种软件。Microsoft FrontPage是目前最流行的网页制作与网站管理软件之一，可以方便、快捷地编辑网页样式，在编辑器中提供了所见即所得的“设计”视图，同时显示网页框架、代码的“拆分”视图，显示代码命令的“代码视图，预览网页页面的“预览”视图四种不同编辑网页使用的视图。FrontPage有以下特点：1.可视化。使用Frontpage软件，不需要很深的网页编程技术知识，也不需要了解HTML的语法，它支持所见即所得的编辑方式。2.通用性。它的文字处理方法和Word基本相同，可以像编辑Word文件那样在文章中插入表格和图象，也可以插入声音文件，动画和视频文件。3.多种视图窗口。可以使用Frontpage的“设计”视图，直接输入文字，插入图片和表格。可以使用Frontpage的“代码”视图，修改或编写命令代码。可以使用Frontpage的“预览”视图，浏览编写的网页在浏览器中显示的页面。4.易于管理。Frontpage可以将多个网页组织起来成为一个站点，并能对它进行分布和有效的管理。Dreamweaver是美国macromedia公司开发的网页制作和管理网站于一体的所见即所得网页编辑器，它是第一套对专业网页设计师的视觉化网页开发工具，利用它可以轻而易举地制作出跨越平台和跨越浏览器的充满动感的网页，它与Flash、Fireworks合在一起被称为网页制作三剑客，这三个软件相辅相承，是制作网页的最佳选择。其中，Dreamweaver主要用来制作网页文件，制作出来的网页兼容性比较好，制作效率也很高，Flash用来制作精美的网页动画，fireworks用来处理网页中的图形。Dreamweaver有以下特点：1.卓越的可视环境。使用macromedia的可视化开发环境（如右图所示），你只需通过简单的拖拉技术（Drag&Drop），将"Objects"窗口中的对象拖到"Documentwindow"中即可，例如：Web开发人员想在网页中加入一个Table，只需将"Table"从"object"窗体中拖放到舞台中，Dreamweaver将自动生成一个表格，然后通过"Properties"（属性）窗体来进行格式的修改和调整。 2.所见即所得。你可以在"Properties"（属性）窗体中调整参数，即刻在"Documentwindow"窗体中看到它的改变，如果你按下"F12"，Dreamweaver会自动生成HTML文件格式，供欲览，以便开发人员进一步调整。3.方便快速的文本编排。与"Word"相似，具有强大的文本编辑能力，你可以在"Layer"、"Table"、"Frame"或直接在"Document window"窗体中输入文字，通过快捷的右键，选择例如"Font"（字体）类的选项进行编辑，也可以利用"Text"菜单进行更为细致的排版编辑。4.高质量的HTML生成方式。由Dreamweaver生成的HTML源代码保持了很好的可读性。代码结构基本上同手工生成的代码相同，这使得设计者可以轻易掌握代码全局并加以修改。5.实时的HTML控制。设计者可以在可视化或者文本这两种方式下进行页面的设计，并且可以实时的监控HTML源代码。当设计者对代码作出任何改动时，结果将立刻显示出来。6.FTP。在Dreamweaver中包含了一个界面极为友好的FTP工具。通过它，设计者可以非常方便的将设计的单一页面或者一个站点上传至服务器。同时，设计者还可以非常方便的将已经上传至服务器的文件下载以供参考和修改。在文件传输的过程中，Dreamweaver将记录下整个过程以供错误分析。 文件锁定。这是一种专为合作开发环境设置的档案机制。可以通过标记和取出机制设置只读或可编写属性来进行文档的保护。通过这种方法可以防止不必要的数据丢失，增强了安全性。 这两种软件都有其优点及缺点，通过在实际使用过程中的分析比较，我发现这两种主流网页编辑软件的优劣处体现在以下几个方面：1.代码简洁性。在使用FrontPage时，搭配使用一个网页压缩软件是常事，FrontPage常常在网页中莫名其妙插入很多空格，经压缩后网页会比原先小 20％～30％，而下次编辑存盘后这些空格又还会再度出现，挥之不去。而以代码简洁而著称的Dreamweaver没有这方面的问题。2.使用操作性。在这方面FrontPage和Dreamweaver各有所长：FrontPage具有Word类似的界面和操作性，尤其在手绘表格方面，很多人都觉得 FrontPage比Dreamweaver要方便不少。在查看源代码和预览功能上FrontPage也比Dreamweaver方便。还有对于采集整理资料很重要的一点：从浏览器中复制的页面粘到FrontPage中时仍能保持原有的表格、链接、文字格式；而在Dreamweaver中即使使用 “Past as text”也只能粘贴为纯文本段。Dreamweaver的优点在于：它的标记选择器（Tag selector）可以方便准确地选择所要编辑的对象。此外，它的表格与层相互转化、依对象而自动变动的属性栏也颇受喜爱。3.与Word软件的兼容性。很多人都是使用Word来输入和编辑网页文字内容，如果要将这些文档内容剪贴到FrontPage或Dreamweaver软件中时，就会发现 FrontPage在这方面略胜一筹。因为我们只要在Word中选取所要的部份(包含图片)，然后贴到FrontPage的文字编辑区，不仅文字和图片都能正常显示，而且样式也几乎一致。其中不太一致的是，原本是居中的图，会变成靠左。但是，如果我们选取了Word中的一部份，然后想要贴到Dreamweaver中，就会发现图片不见了，而且文字的样式也没有了，因为文字全部挤在一起，连段落也无法区分。因此我们如果想调整这些文字和图片的话，就必须再花费不少时间。4.站点管理。相对于FrontPage强大的站点管理，Dreamweaver略显不足：FrontPage中特有的报表视图可以显示未链接文件、慢速网页、较旧的文件、新增文件、未验证链接等15个项目细节。Dreamweaver在这方面做得就差多了，只有简单的断裂链接（Broken links）、外部链接(External links)和孤文件(Orphaned Files)三项。而且不像FrontPage中每一项目下都有详细的文件名称、标题、大小、类型、修改日期等说明。此外，Dreamweaver不认为表格背景图片是网页不可缺少的部分。当在站点管理器中对表格背景图片进行移动或改名等操作时，Dreamweaver 不会提示更新链接，结果就会出现断裂链接。而且基于同样的原因，Dreamweaver会把表格背景图片识别为孤文件，也影响了对网站的管理。当然Dreamweaver在站点管理方面也有其优秀之处。它可以在不逐一打开每个文件的情况下实现全站的整体查找替换，还有其特有的HTML标记属性的查找，功能强大。相比之下FrontPage可以实现全站查找但做不到即时替换，需要对查找结果列表中的文件逐一打开替换。5.图片的使用。在使用图片时，如果我们想要在Dreamweaver中放上图片，必须使用“插入图片”的方法来产生，而无法使用“剪贴板”的“粘贴”功能。因此我们的图片必须事先存放在硬盘中，并且已经取好名字才可以。而FrontPage就轻松多了。我们可以从任何软件复制或剪贴图片到FrontPage中，这些图片并不需要事先储存成文件。因为当我们要储存网页的时候，FrontPage会一并将这些图片以预设的文件名储存在“与网页相同的文件夹”中。当然图片的文件名和储存路径都是可以修改的。6.所见即所得。在这项功能上，FrontPage比Dreamweaver 强。由于这一点对初学者相当重要，因此包括学生在内的网页设计初学者，都相当偏好FrontPage。所谓“所见即所得”，就是我们在软件中设计的样式应该和最后在网页中呈现的样式“完全一样”。遗憾的是，在我们使用FrontPage或 Dreamweaver时，都无法达到真正的“所见即所得”。也就是说，我们在网页编辑时的样式，跟最后在IE等浏览器中所看到的样子往往都有极大的差距。其中又以Dreamweaver的差距更大。因此我们常常需要配合浏览器来观看结果，然后再到网页编辑软件中做修改。尤其在处理文字时更是常常有令人不太愉快的经验。如果常常需要设定文字的“样式”，建议使用FrontPage。7.设计动态和互动式网页。我们可以利用Dreamweaver的“图层”(Layer)和“时间轴 ”(Time Line)功能，来让图片或文字随意地在网页中自由移动。移动的方式可以是绕着我们所设定的路径(path)移动，也可以是左右或直线的移动。另外，我们可以设计让文字或图片配合鼠标的点选有更多的变化。也就是说，当鼠标经过文字或图片，文字或图片会产生变化的动态效果。Dreamweaver还可以插入Flash的.swf动画文件和 Firework设计的HTML文件，让网页更加活泼。虽然FrontPage也可以插入Flash文件，但操作方面比Dreamweaver麻烦。因为 Dreamweaver、Flash、Firework都是MacroMedia公司的产品。由此可见，FrontPage是一个非常简单使用的网页编辑软件，用它可以快速的编好一个网页，特别适合第一次做网页的人，通过FrontPage还可以做简单的多媒体课件、企业策划书、产品演示说明书等，它具有上手快，易学、易用的特点。FrontPage是初学者理想的制作网页的集成工具。而Dreamweaver 是一款专业的 HTML 编辑器，用于对 Web 站点、Web 页和 Web 应用程序进行设计、编码和开发。无论你愿意手工编写 HTML 代码时的驾驭感还是偏爱在可视化编辑环境中工作，Dreamweaver 都会为您提供有用的工具，使您拥有更加完美的 Web 创作体验。FontPage和Dreamweaver各自的优缺点 浏览次数：1268次悬赏分：20 | 提问时间：2008-10-8 13:56 | 提问者：343895975 大家都说使用FontPage多为新手,如果新手使用FontPage作为网页制作的启蒙软件,是否会对今后的网页制作水平产生影响?换一个角度说是否会弱于使用Dreamweaver的制作人?其他回答 共1条 在目前的网页编辑软件中， MicroSoft公司的FrontPage以及MacroMedia公司的Dreamweaver是最知名和最常用的两套热门软件。通过在实际使用过程中的分析比较，我对这两种主流网页编辑软件的优劣得出了点个人体会。一、代码简洁性在使用FrontPage时，搭配使用一个网页压缩软件是常事，FrontPage常常在网页中莫名其妙插入很多空格，经压缩后网页会比原先小 20％～30％，而下次编辑存盘后这些空格又还会再度出现，挥之不去。而以代码简洁而著称的Dreamweaver没有这方面的问题。二、使用操作性在这方面FrontPage和Dreamweaver各有所长：FrontPage具有与Word类似的界面和操作性，尤其在手绘表格方面，很多人都觉得 FrontPage比Dreamweaver要方便不少。在查看源代码和预览功能上FrontPage也比Dreamweaver方便。还有对于采集整理资料很重要的一点：从浏览器中复制的页面粘到FrontPage中时仍能保持原有的表格、链接、文字格式；而在Dreamweaver中即使使用 “Past as text”也只能粘贴为纯文本段落。Dreamweaver的优点在于：它的标记选择器（Tag selector）可以方便准确地选择所要编辑的对象。此外，它的表格与层相互转化、依对象而自动变动的属性栏也颇受喜爱。三、与Word软件的兼容性很多人都是使用Word来输入和编辑网页文字内容，如果要将这些文档内容剪贴到FrontPage或Dreamweaver软件中时，就会发现 FrontPage在这方面略胜一筹。因为我们只要在Word中选取所要的部份(包含图片)，然后贴到FrontPage的文字编辑区，不仅文字和图片都能正常显示，而且样式也几乎一致。其中不太一致的是，原本是居中的图，会变成靠左。但是，如果我们选取了Word中的一部份，然后想要贴到Dreamweaver中，就会发现图片不见了，而且文字的样式也没有了，因为文字全部挤在一起，连段落也无法区分。因此我们如果想调整这些文字和图片的话，就必须再花费不少时间。四、站点管理相对于FrontPage强大的站点管理，Dreamweaver略显不足：FrontPage中特有的报表视图可以显示未链接文件、慢速网页、较旧的文件、新增文件、未验证链接等15个项目细节。Dreamweaver在这方面做得就差多了，只有简单的断裂链接（Broken links）、外部链接(External links)和孤文件(Orphaned Files)三项。而且不像FrontPage中每一项目下都有详细的文件名称、标题、大小、类型、修改日期等说明。此外，Dreamweaver不认为表格背景图片是网页不可缺少的部分。当在站点管理器中对表格背景图片进行移动或改名等操作时，Dreamweaver 不会提示更新链接，结果就会出现断裂链接。而且基于同样的原因，Dreamweaver会把表格背景图片识别为孤文件，也影响了对网站的管理。当然Dreamweaver在站点管理方面也有其优秀之处。它可以在不逐一打开每个文件的情况下实现全站的整体查找替换，还有其特有的HTML标记属性的查找，功能强大。相比之下FrontPage可以实现全站查找但做不到即时替换，需要对查找结果列表中的文件逐一打开替换。FrontPage对站点管理的一个不好的副产品就是大量的“_vti_cnf”目录，里面对应记录了站点每一个文件的相关信息。因此，如果我们用MODEM来上传主页的话，就必须找一个好点的上载软件才能把它们滤掉。五、图片的使用在使用图片时，如果我们想要在Dreamweaver中放上图片，必须使用“插入图片”的方法来产生，而无法使用“剪贴板”的“粘贴”功能。因此我们的图片必须事先存放在硬盘中，并且已经取好名字才可以。而FrontPage就轻松多了。我们可以从任何软件复制或剪贴图片到FrontPage中，这些图片并不需要事先储存成文件。因为当我们要储存网页的时候，FrontPage会一并将这些图片以预设的文件名储存在“与网页相同的文件夹”中。当然图片的文件名和储存路径都是可以修改的。六、所见即所得在这项功能上，FrontPage比Dreamweaver 强。由于这一点对初学者相当重要，因此包括学生在内的网页设计初学者，都相当偏好FrontPage。所谓“所见即所得”，就是我们在软件中设计的样式应该和最后在网页中呈现的样式“完全一样”。遗憾的是，在我们使用FrontPage或 Dreamweaver时，都无法达到真正的“所见即所得”。也就是说，我们在网页编辑时的样式，跟最后在IE等浏览器中所看到的样子往往都有极大的差距。其中又以Dreamweaver的差距更大。因此我们常常需要配合浏览器来观看结果，然后再到网页编辑软件中做修改。尤其在处理文字时更是常常有令人不太愉快的经验。如果常常需要设定文字的“样式”，建议使用FrontPage。七、文字样式在使用文字时，FrontPage提供较多的设定功能，能让文字做更多的样式变化。而且文字在经过设定样式后，文字也会作即时的变更。例如设计者可以对文字设定“字体”、“大小”、“颜色”，也可以设定文字“内缩”、“行距”、“段落距离”、“字距”。而后面这四项在Dreamweaver中是无法更改的。虽然FrontPage在文字样式方面提供较多的功能，同时在“所见即所得”上也较令人满意，但却并不是说FrontPage在这方面就没有缺点。有时我们在设定链接文字的色彩或粗细体上，也往往碰到一大堆问题，这些都是软件厂商以后应该注意修正的事项。八、固定部件更新要保持网站的整体风格，每页的公司徽标、版权栏、宣传语句、广告等页面元素是必备要素之一。当必须对这些要素进行修改时，手工修改的工作量是难以想象的。对此，FrontPage和Dreamweaver都有自己的解决方案：FrontPage采用共享边框，在站点上的单个或所有页面的某一边上共享相同内容并保持统一更新；而Dreamweaver则设立了库（Library）的概念，可以把页面中所要重复的任一部件加入到库项目，自由设定在所需的页面中重复使用、统一更新。相对于Dreamweaver的库，FrontPage的共享边框就要逊色多了。它只能在网页的四边中选择位置，而且一旦设置，影响的就是网站所有页面，对于不想采用共享边框的页面只能另外逐一单独设置。最致命的一点是在FrontPage应用共享边框的时候会把原页面内容统统套在一个大表格中，而共享边框设在另一个表格之中。这样的危害在设计者本地看不大出来，然而在网络上由于浏览器要下载完整个表格才会显示，因而会大大降低网页的实际浏览速度。九、设计动态和互动式网页Dreamweaver的使用者和支持者，从现在开始，可以抬头挺胸了。因为下面这两大项的功能都是Dreamweaver的长处，而且是极其重要的两项。首先介绍的这项功能，就是Dreamweaver具有“设计互动式网页”的功能。我们可以利用Dreamweaver的“图层”(Layer)和“时间轴 ”(Time Line)功能，来让图片或文字随意地在网页中自由移动。移动的方式可以是绕着我们所设定的路径(path)移动，也可以是左右或直线的移动。另外，我们可以设计让文字或图片配合鼠标的点选有更多的变化。也就是说，当鼠标经过文字或图片，文字或图片会产生变化的动态效果。Dreamweaver还可以插入Flash的.swf动画文件和 Firework设计的HTML文件，让网页更加活泼。虽然FrontPage也可以插入Flash文件，但操作方面比Dreamweaver麻烦。因为 Dreamweaver、Flash、Firework都是MacroMedia公司的产品。十、模板功能现在的网站内容，大都会在每一个网页中提供“目录”(主功能链接)。而这些目录式的项目通常在未来会有所改变，但是我们的网页可能也有数百个或甚至数千个，难道我们的每个网页都要做一一修改吗？这显然是不可能的。于是我们可以利用Dreamweaver提供的“模板”功能(模板后缀名为.dwt)，即：首先设计一份模板或二、三份模板(份数当然可以根据我们的需要而定)，然后将我们的网页“套用”这些模板，之后只要修改相关的模板(可能只改变一个)，那么所有套用模板的网页，就可以“一次全部”跟着修改。这项功能对于设计大型网站或多网页的网站有“容易修改和维护”的作用。至于FrontPage，虽然它提供“主题”(Theme)，也能够让多网页套用到某些“主题”的样式，但是FrontPage的这项功能弹性比较差。也就是说，我们在许多地方无法按照自己的想法来设计，只能使用FrontPage的几种固定样式。因此，如果希望设计出富有变化的套用模板，那么建议使用 Dreamweaver。本文比较了两大主流网页编辑器常用功能的部份差异。对于一些较高端的应用：如FrontPage特有的服务器扩展应用、与OFFICE家族协同工作、 ActiveX组件；Dreamweaver所特有的强大动态网页设计能力、与Fireworks、Flash的协同工作特性等等，都有它们自己的特色。一般来说：FrontPage适合于新手使用，而Dreamweaver则更多为专业公司所采用，如何选择就看用户自己了。本文发布于北京网站建设公司商企云http://www.1558.cn/