浅谈网站建设和网页制作的方法
浅谈网站建设和网页制作的方法
[摘要] Internet的日益兴起和以网页为载体的网络信息的广泛传播和应用，使得网站的建设及网页制作得到发展的空间，大至大型企业的产品推销、售后服务、解决方案，小至个人Web页面开发，形形色色，五彩缤纷，网站建设和网页制作也成为计算机网络领域最热门的话题。本文介绍了网站建设前的准备，网页制作的一些方法与技巧，以及在建设和制作中值得注意的一些问题。
[关键词] 网站；网页；网站建设；网页制作
随着计算机网络的广泛应用，尤其是互联网的普及与发展，上网已成为人们新的生活方式。上网可以了解发生的新闻事件，查询各种所需资料信息，利用网络购物，办公，还可以进行商务贸易和休闲聊天。对互联网的需求自然拉动了供应，各种网站便成几何倍数的增长起来。在网络空间里，网站是发布和获得知识与信息的载体，是个人、企业和政府机关在网络空间的形象和存在。网站由许多相关网页构成，因此著作也就成为这个时代的热门技术。本文介绍了网站建设前的准备，网页制作的一些方法与技巧，以及在建设和制作中值得注意的一些问题进行了介绍。
1 网站建设前的准备
1.1网站的定位和规划
要建设一个网站，首先需要定位，既要清楚建设网站的目的和面向浏览的对象，只有定位准确的网站才会有可观性和应用性。在目标明确的基础上，完成网站的构思创意即规划。网站的设计者必须清楚地了解本网站的浏览者的基本情况；对网站的整体风格和特色做出定位，规划网站的组织结构，主题鲜明突出，要点明确，以简明的语言和画面休现站点的主题；最后，在此基础上收集、制作网站所需的素材，在进行页面制作时，要调动一切手段充公表现网站的个性和情趣，展示出网站的特色。
1.2网站整体风格的统一
网站在设计时要考虑到网站整体风格的统一。从页面的排版和布局下手，各个页面使用相同的页边距，文本、图形之间保持相同的间距；主要的图形、标题或符号旁边留下相同的空白；如果在第一页的顶部放置了站点标志，那么在其他各页面都放上这一标志；如果使用图标导航，则各个页面应当使用相同的图标。如图1和图2：
图1 图2
要实现这样的效果通常有两种方法，一种是使用模板，模板是Dreamweaver中一种特殊类型的文挡。设计者在模板中将各页面中相同的部位定义为锁定区域，而将不同的部位定义为可编辑区域。此后在制作每个页面时，都选择由模板新建，然后在编辑区域输入不同的文字内容，从而简化了设计主页的工序。此外，模板最强大的用途之一在于一次更新多个页面。由模板创的文挡与该模板保持连接状态，修改模板就可以更新所有基于该模板的文挡中的设计，大大降低了页面维护的时间。
另一种方法是使用框架，框架（FRAME）也叫帧页，是现在制作页面时较为常用的一种技术。该技术可以把浏览器窗口划分为几个小窗口，每一个窗口都显示一个页面的内容，并分别设置大小、有无滚动条等信息。这样就方便了设计网站的结构，可以在上方的框架里放置网站的标志，在左面的框架里显示导航拦，而在下方的框架里安置版权信息。当然这只是一个比较公式化的设计，每个人可以根据自己的实际需要和创意来做安排。而且浏览时，可以指定连接的页面在哪个框架里显示，从而避免了网页上相同内容的重复下载，这对于提高网页显示速度和网络传输效率方面都有着积极的意义。
1.3网站页面的版式及色彩
网站页面要简洁大方，在页面中不要过多的加入与本页内容无关的信息，保证主题内容让浏览者一目了然。如果希望人们在看完你的页面后能留下印象，最好用一个简单的关键词语或图像吸引他们的注意力。如图3：
图3
设计网站前要先确定网站的主题色。一个网站必需有一种或两种主题色，不至于让浏览者迷失方向，也不至于单调、乏味。例如：儿童类网站一般都使用橙色、红色用以体现儿童的活泼和、温翰气氛等效果。主题色确定好以后，使用其他配色时一定要注意它与主题色的关系，要表现什么样的效果。例如：教育类网站使用蓝色为主题色，再用红色和黑色作为配色，就能表达出严肃、稳重的效果。同时，在使用色彩时要考虑它会带给人心理上的感觉。比如，冷色使人平静，而暖色使人激动；强的色彩对比造成紧张感；暗的颜色给人以沉重感和压迫感；亮的颜色给人轻松、开放的感觉。我们可以根据所要表达的主题，选择合适的色彩与主题色进行搭配。
2 网页制作方法与技巧
在网页制作中，为了提高页面效果，需要使用一些技巧和方法。
2.1应用表格的定位功能
运用表格可以自由地控制文本和图像在网页上出现的具体位置，而不用担心不同对象之间的影响，从而使整个网页看上去紧凑统一。要充分利用表格的定位功能，准确地将每一段文字、每一副图片按照一定的次序进行合理的编排和布局。对于表格的框度，应采用绝对定位，不用百分比，以便浏览者在不同的显示分辨率下都能看到同样的效果。考虑到目前上网浏览者使用电脑屏幕的分辨率多为800×600，因此，每个页面在设计时也要设定在此分辨率下，如有特殊，还要给浏览者做出提示。
表格内容的下载比较耗时，往往要在整张表格中全部内容下载完成后，才能显示该表格内容。因此，表格中尽量不要嵌套过多的表格，以免影响页面的下载速度。浏览器解释HTML页面的顺序是自上而下依次逐行解释和显示，但当碰到表格中所有的元素后才将结果在页面中显示出来，在页面内容教多而访问者浏览的速度又很慢的情况下，浏览器的这种解释次序将明显表露出来，只有等到浏览器解释到了页面的最后，才会将整个页面的内容在访问者眼前显示出来，而在浏览器解释过程中，访问者什么也看不到，这将会使访问这产生不耐烦的心情。一些优秀网站的设计，通常也都采用表格来定位，而且大多都是一行一行来设计的，当然每个单行排列的表格里也存有表格嵌套，但各个页面的内容最好不要放于一张的表格里面。因此在使用表格进行网页元素布局时，应尽量避免使用整个表格。
2.2修改HTML代码来实现页面的动态效果
现在有了那些“所见即所得”的网页制作工具，假如只想制作出功能简单的网页，使用这些网页制作工具即可。但是，要想制作出功能完善、风格独特的网页，只靠那些工具是远远不够的，还是要学习一些HTML语言。如在网页制作中使用“跑马灯”，可以使网页增色不少，因为其中的文字有一种动感的效果，这种效果完全可以用修改HTML代码来实现。
先来谈一下如何制作最简单的跑马灯效果。一般情况下，在层或表格中输入若干个文字，先对其中的文字设置颜色、字体及大小等，然后选中该文字切换到代码窗口，你会看到代码窗口的文字还是呈现选中状态，在第一个文字前输入，只要将移到最后一个文字后面，在预览时，就可以看到文字从右往左移动，就像跑马灯一样。
文字的默认运动方向就是从右往左移动，相当于用了语句direction=“left”，如果想让“文字”从左往右移动，只要把“left”改成“right”就可以了。同样的道理，要使文字上下移
动，只要再把“right”改为“up”，或“down”就可以了。
改成上下运动的跑马灯你会发现速度很快，读者根本无法阅读滚动的文字，修改时只需加入scrollamount=“1”参数，值得一提的是scrollamount的值越大，其上下移动的速度就越快。Scrollamount=“6”就是默认的速度很快的效果。
此外，还可以用width、height参数来设置跑马灯区域的范围。下面这段HTML代码是与一个从下而上的跑马灯效果相对应的：
2.3 适当运用网页特效
网页特效是指在网页中调用一种特殊的小程序如JavaScript和VBScript程序等使网页页面有一种特殊的效果，如动态日期与时钟，鼠标跟随、状态栏中活动的信息、在页面中有不断飘落的花朵等。这些特殊效果在Dreamweaver中用HTML语言是无法实现的。
JavaScript和VBScript对于非专业人员来说学起来比较困难，自己编一段这样小程序也很麻烦，为此我们可以引用他人提供JavaScript 源程序。例如中国较大的计算机教程网--------豆豆技术网中提供了一些源代码程序，可以直接拷贝引用。
例：制作一个页面转换特效：
（1）登录https://www.wendangku.net/doc/6211623233.html,/web/Dreamweaver/index4.asp进入豆豆技术网
（2）进入该技术网中的网页特效https://www.wendangku.net/doc/6211623233.html,/web/effect/index.asp
（3）点页面背景按扭，找到“页面转换特效”的文章并打开
（4）选中如下代码进行复制：
（5）进入Dreamweaver，打开自己的网页。进入代码编辑窗口，在
和中粘贴上述代码。3 几个值得注意的问题
3.1预览时看不到图片
有时图片在编辑状态下是好的，而在预览时或在网页发布后无法显示，究其原因，一个方面可能是路径问题，另一方面可能就是因为图片用的是中文文件名而招来的麻烦。如果是路径的问题，可能是图片不在站点内，这就需要把图片存人相应的文件夹中，然后改变图片的路径就可以了。如果图片是在站点内，在预览时仍看不见图片，则往往是使用了中文的文件名、目录名或文件名。解决的方法是把中文名字改为英文字母、数字和下划线等符号组合成文件名或目录。
3.2 不要忽略页面属性的设置
设置左边界、顶部边界、边界宽度和边界高度。细心的用户会发现在没有进行设置前浏览时页面会在上下、左右，各留一片空白，这块区域用户不能利用，白白浪费了，为了节省网页中的宝贵空间，建议把这四个选项都设置为0。
3.3 适当变化网页中的字体
网页中的字体字号、字距、行距和文字颜色可作些适当变化，以求最美的视觉效果。需要突出的地方可以用不同的字体、字号和不同的颜色表示。字体最好采用系统自带的字体，因为字体的显示效果是由浏览者的浏览器来决定的。许多漂亮的文字，浏览器可能并不支持，可以把文字做成图片的方式来处理，不过这种方法不适合在大段的文字上采用。恰当的运用css样式表会使文字处理达到事半功倍的效果。但每一页中的字体要限制在4种以内，过多的字体反而显得杂乱无序。
4 结束语
设计一个好的网站，除了要有一定的网站基础知识外，还必须掌握很多的网页编程技术、技巧和一定的美工知识，当然也要求对编程工具和数据库知识有更深的了解和更加灵活的应用。随着科学技术的进步与发展，也将会出现更多、更好的网站设计工具，使网站的建设更容易、更先进！
参考文献
[1] 李建梅.《新概念中文DreamweaverMX教程》.北京科海电子出版社,2003.
[2] 刘洋.《DreamweaverMX短期培训教程》.北京希望电子出版社,2002.
[3] 黄俊.《DreamweaverMX中文版精彩设计百例》.中国水利水电出版社,2003.
致谢
感谢指导老师XXX及学院有关领导对我本次毕业设计的关心与指导，通过本次毕业设计使我懂得了如何去思考并做好每一件事！
《网页制作与网站建设》在线作业
1、在下列软件中，（）软件不能设计网页。 A.Dreamweaver B.FrontPage C.记事本 D.Windows Movie Maker 2、在以Dreamweaver设计网页过程中，为了避免网页的链接对象使用包含盘符的本地绝对路径，最有效的方法是（）。 A.建立用户文件夹，把网页所需的全部文件存储在该文件夹中 B.建立本地站点，把网页所需的全部文件存储在本地站点的文件夹中 C.建立与服务器的映射关系，要求服务器实时检测网页状态 D.没有什么专门的方法 3、在Dreamweaver中，（）工具不能建立图像热区链接。 A.矩形工具 B.椭圆形工具 C.多边形工具 D.线条工具 4、Dreamweaver无法显示的图像文件格式有（）。 A.GIF格式 B.JPG格式 C.BMP格式 D.PNG格式 5、在本地电脑里，网页index.htm的存放路径是c:\webpages\index.htm，图像logo.gif的存放路径是c:\webpages\images，现在将该图像插入到网页index.htm中，则使用相对路径方式显示logo.gif，正确选项是（）。 A.C:\webpages\images\logo.gif B.C:\webpages\logo.gif C.images\logo.gif D...\images\logo.gif 6、下列关于超链接的说法，不正确的是( )。 A.超链接的指向可以是网页或是网页中的书签（锚点） B.超链接可以建立在文本、图像或是图像的热区上 C.超链接的目标页面可以在当前窗口打开，也可以在新窗口打开 D.访问过的超链接颜色一定发生改变。 7、如果网页是一个包含3个区域的框架结构，那么就要保存( )个文件。 A. 1 B. 2 C. 3 D. 4 8、Dreamweaver默认字体大小是( )。 A. 2 B. 3 C. 4 D. 5 9、在Dreawearer中，下面对象中可以添加热点的是（）。 A.表格 B.文字 C.图象 D.任何对象 10、如果锚点名称（书签）是a，则建立该锚点的链接，应在链接对话框中输入（）。 A.$a B.！a C.@a D.#a 11、在Dreamweaver网页制作中，给网页添加信息框（弹出信息），应利用（）面板。 A.代码 B.文件 C.行为 D.应用程序 12、在Dreamweaver设计网页时，下列关于表格的说法，不正确的是（）。 A.表格可以嵌套 B.可以对表格添加超链接 C.表格可以通过样式表来进行修饰 D.表格可以用来辅助网页布局 13、如果需要在打开当前窗口时自动弹出一个新的浏览器窗口，应该针对Body的（）事件添加“打开浏览器窗口”的命令。 A.Check B.Text C.onLoad D.行为 14、在Dreamweaver中，要实现小图片的时间轴动画效果，对小图片的要求是（） A.小图片必须具有动画功能，比如是具备动画效果的gif文件； B.小图片必须存放到层中
自己制作网页的7个步骤
自己制作网页的7个步骤 怎样自己制作网页？需要在互联网了解一点的做法，一旦你掌握了它，这是一个很大的乐趣。第一步是决定你想要您的网页上发布。也许你想发布，你已经写了一个原始的故事，分享您已经阅读评论的书籍，或创建一个电子杂志，你的业余爱好之一。无论您希望把什么放到您的网页上，这一步一步的指南会指示如何做到这一点。 怎样自己制作网页步骤1:创建一个文本文档 首先,您需要创建一个文本文档包含单词,你想要出现在您的Web页面。只要你给你的文档名称结尾，大多数文字处理程序将会工作的很好。首先一个标题和一个引人注目的问候或介绍,所以人们会立即告诉您的页面是什么,会想要读更多。思考逻辑的地方插入你的文本。没有人想要向下滚动一个长,不间断的文本块。你的页面将会更可读的如果你把在频繁的换行符和水平规则。想想,你可能想要插入图片,如果你让他们在电子文件。大量的网页开始与一个引人注目的图像顶端,旁边的标题。 怎样自己制作网页步骤2:学习基本的HTML标记
现在您需要插入一些格式化标记你的文档,会告诉一个互联网浏览器如何安排你的文字和图片在屏幕上。这些标签组成一个语言称为超文本标记语言,或者HTML。一个基本结构H TML文档像这样: < HTML > <头> <标题>的标题页< /标题> < /头> <身体> 文本的页…… < /身体> < / html > 注意(1)每个格式标记之间出现“小于”(<)和“大于”(>)符号,以及(2)标签通常成对出现,第二个标记用“削减”(/)。 下面列出的一些基本的格式化HTML标记:
< h1 >…< / h1 > 头,一级。小标题都带有< h2 >…< / h2 >、< h3 >…< / h3 >等。 < b >…< / b> 粗体文本 < i >…< / i > 斜体文本
制作一个简单的网页
制作一个简单的网页 教学目标: 1、知识目标:了解网页的基本概念以及建立网站的一般方法,学习制作只有文字的网页. 2、能力目标：让学生通过学习掌握建立网站的方法,学生通过学习能够建立只有文字网页. 3、情感目标：培养学生主动实践，勇于实践的勇气，和敢与参与的意识。教学重点: 建立网站制作网页 教学难点: 建立网站制作网页 教法、学法分析: 由于本节课作为制作网页的基础知识,学生可以根据所学知识自己进行操作,教师在此过程中进行适当的指导既可。为了让学生能够充分了解网页的概念，采用教师讲解的教学方法，为了培养学生主动实践的勇气与参与意识，采用学生自主学习的方法。 教学过程: 引入： 我们已经学习过因特网的基础知识和应用，实际体验了“网上冲浪”的滋味，网上世界的确很精彩！但是我们有什么方法能让更多的人了解自己或者自己的学校或家乡呢？最好的方法就是制作一个关于自己或家乡的网页并把它发布到网上。通过了今天的学习我们就能够做到了。
一、网页的概念： {通过多媒体展示“我的家乡”网页，向学生介绍网页的组成，让学生了解网页的概念，并做出总结} 网页就是把用文字、图形、声音、影视等多媒体形式表达的信息，以及分布在因特网上的相关信息，相互链接起来而构成的一种信息表达方式。 二、制作网页前的准备工作 1、认识网页制作工具FrontPage {学生打开FrontPage软件，通过以前学习过的知识认识该软件的窗口，并了解各栏中按钮的作用。} 2、准备好网页素材 [学生在因特网上查找关于“我的家乡”的相关资料，并保存在自己的文件夹中，以便在制作网页时作用。] 三、建立“我的家乡”网站 [根据“做一做”建立一个自己的网站“命名为”我的家乡。] 布置作业: 构思自己的网站，并在小组中进行讨论。 [学生思考问题，并进行操作。] {建立网站后，我们还需要在网站中加入网页，这样我们的网站才能充实起来。} [学生在自己的文件夹中建立一个站点命名为“我的家乡” 根据“做一做”中的提示制自己作主页并保存。然后分别建立其他几网页陕西风景欣赏、陕西古诗文欣赏、自我介绍。]
网页制作实例
网页制作实例 一、网页设计基础 1、熟悉Dreamweaver 8的工作环境 2、创建新站点 创建本地站点：站点----管理站点----新建----站点（前三步也可直接从“新建站点”进入下面的设置向导对话框）----跟随向导设置直至完成 3、网页文件的基本操作 a、创建、打开和保存网页文件 创建：文件----新建----创建 打开：文件---打开----选择欲打开的文件 或者在右边的文件浮动面版中选择打开 保存：文件---保存或另存为 b. 设置网页的页面属性 修改---页面属性---然后设置（标题、背景、背景图像、文本等） c. 设置网页对象的颜色 网页对象，如页面背景、文字、链接都经常需要设置颜色。 可在各自对应的属性面版中设置。 d. 网页文本的输入和属性设置 文本可键入、导入、粘帖 文字可设置字体、大小、颜色、格式等。 键入空格的方法：1、汉字输入法设置为全角方式，按空格键即可输入。2、属性面版格式中：预先格式化的 换行：ENTER、SHIFT+ENTER 实例练习： 1、输入以下文字 书签夹在诗集里， 落叶夹在深秋里。 喜悦夹在生活里， 追求夹在人生里。 2、第一次设置格式为“无”，字体为“华文行楷”，字体颜色为“红色”，字号为“5号”，添加项目符号。然后保存、预览。 3、第二次设置格式为“标题一”，字体为“楷体”，字体颜色为“蓝色”，字号为“5号”，添加项
目符号，对齐方式为“居中”。然后保存、预览。 比较两次设置的效果。 e. 网页图片的插入和属性设置 插入图片，在对话框中选择图片。（最好在建立站点时将欲用的图片素材复制到本地站点目录中） 插入图像占位符，在图片准备好后再加入图片。加入方法：1、双击图像占位符；2、点“属性面版”中的“指向文件”，拖到右边文件中要插入的文件处。 在图像属性面版中设置 f. 插入层 方法: 1、点击插入面版中的“描绘层”；2、在网页编辑器窗口中按住鼠标左键拖画出定位用的层； 3、可以随意移动层的位置； 4、可在层中插入图像、文字等。 g. *插入表格,用表格定位 方法： 1、先用鼠标点至欲插入表格的位置； 2、点插入面版中的“表格”—“插入表格”； 3、确定行数、列数后确定即将表格插入到选定位置了； 4、可在表格中任何单元格里插入图像、文字等。 h. 建立超链接 方法: 1、选中要建立超链接的文字或图像； 2、点右键“创建链接”打开的窗口或在属性的链接栏里，填入链接的目标。（如：本网站另一个网页，或外部网页如https://www.wendangku.net/doc/6211623233.html,，或电子邮件如：mailto:zdhwangji@https://www.wendangku.net/doc/6211623233.html,） 3、在页面属性里修改链接的属性：修改--页面属性（链接、活动链接、访问过链接） 二、制作实例1
网页制作方法以及常见网页的特点
网页制作方法以及常见网页的特点 网页制作是网站建设当中最实质的步骤，一个用户获得对企业网站印象的主要来源就是网页，好的企业网站，不仅仅能够让用户感受到网站的美观和大气，企业还能通过网页的隐含语言传递出企业的理念，提高企业的品牌认知度。 网页制作的三种方法 1、网页制作三剑客 网页制作通常会使用到奥多比的网页制作三剑客，当然Dream weaver是最常见的，Front page 也非常常见，Front page 更是简单到只要会WORD就会用，而同样是三剑客之一的Fire work 和Flash 通常会被用来美化网页。 2、用TXT文件来编辑Html代码的原因 用网页编辑器比如Front page等等这样的软件来改变Html代码常常会有一种风险，
就是代码改完以后文件却再也打不开了，要么就是文件的属性被改变了，所以要想修改Html文件的代码以后还保持原样不变，使用最简单最有效的记事本就可以。 3、有模板可借鉴并非是罪过 有很多网页设计师总是喜欢从头再来，即便是在有现成模板的情况之下也是一样，这样其实是在浪费时间，现在有很多前面的开拓者对于特定页面的开发很有强项，所以拿过来用一下也不是什么过错，比如首页的设计，就有不少人做得很好，页面大气，色彩合理，符合大网站的高度和气魄，能够给人一种强烈的震撼。如果有这样好的渠道和效果，自己仍然坚持重新开发只能是吃力不讨好。 各种页面的特点 1、首页，首页就像是一个企业的门面，规划和设计是很重要的，不论从颜色还是结构都应该请专门的人员来作设计，以能够展现企业主旨和优势为佳。 2、次级页面的主要功能在于导航，通过次级页面可以通达网站的各个部分，起到一个枢纽的作用，导航页的特点是要清晰明了易于辨认理解，并且风格上要和首页既一致又有呼应。 3、普通页面通常承担的是企业的项目、案例或者产品的介绍之类的，这一类页面的说明性强所以图文要准确，但是对于设计层面没有太高的要求，只要能够做到标准、整洁，风格一致就可以了。
使用HTML制作网页(精)
使用HTML制作网页 台州电大工程技术系钱莹 HTML（Hyper Text Mark-up Language ）即超文本标记语言，是 WWW 的描述语言。HTML语言是由 HTML标记组成的描述性文本，HTML 标记可以说明文字、图形、动画、声音、表格、链接等。 HTML的结构包括头部 (Head)、主体 (Body) 两大部分。头部描述浏览器所需的信息，主体包含所要说明的具体内容。 通过使用HTML，我们可以制作出精美的页面，同时，它也是设计功能更强大的电子商务网站的基础。 通过本章节的学习，要求同学掌握Tab标签，字标题标签，文本，链接，图片，表格等各类HTML标记的使用规则，熟悉标记中各类属性的含义及使用方法。 在本章节的学习中，我们将围绕HTML标记学习，通过一个实际案例制作（台州旅游网主页），依次学习Tab标签，字标题标签，文本，链接，图片，表格等各类HTML标记；在对以上标签进行介绍同时，辅以实际案例制作，使学习过程中能够理论与实际相结合，提高教学效果。 台州旅游网 Tab标签 < html>< /html>其间为所有的页面元素代码 < head>< /head> 放置页面的一些属性，如meta等 < title>< /title>设定网页的标题 < body>< /body>整个页面的主体部分，可设定背景色，文本等 例:< body bgcolor="颜色代码" background="图片地址" onload="" text=""
link="" vlink="已访问后的颜色" alink="单击时的颜色"> HTML标记示例
简单的网页制作教程-设计一个个人网站
题目：设计一个个人网站 一、要求： 1．使用Dreamweave网页工具制作一个个人网站； 2．包含至少四个网页: 包括首页、个人简介、个人相册等（可随意设计），网页之间用超链接相连。 3．网页中要有图片和文字内容，用表格进行页面布局； 4．添加至少两种行为，并为首页添加背景音乐。 5. 在网站中设计一个表单页面。 6. 首页必须包含页面标题，动态按钮导航栏。 首先新建一个文件夹，文件夹的名字不能为汉字，做网站所有的路径都必须用字母或者数字， 不能用汉字，我们就用名字吧，譬如说名字张三，那文件夹名字就是zs，如图 打开Dreamweaver软件，得到图 做网页要新建站点，关于站点配置服务器什么的，这里不讲了，只讲建立站点。 选择站点——新建站点。 我们建的文件夹就是站点根文件夹。
新建站点后得到这样一个界面 点选高级，得到界面 站点名称与我们建文件夹得名字相同，zs填进去就可以了本地根文件夹就是我们新建的那个文件夹zs， http地址为http://localhost/zs
接下来选择左侧栏里远程信息 点击无后面的那个三角，选择本地网络，远端文件夹同样选择我们新建的那个文件夹 接下来点选左面菜单里的测试服务器， 点选访问后面那个三角，选择本地网络，测试服务器文件夹也为我们建好的文件夹zs，在url前缀后面加上zs
然后点击确定就可以了得到这样一个界面。 下面看老师的第一条要求，是要至少四个网页，那我们就做四个 单击新建，然后单击 接下来，选择 然后单击创建，接下单击文件——保存，保存这个文件，保存在我们一开始建好的文件夹里面，保存名字不能是汉字，只能是字母或者数字，因为我们只坐四个网页，可以简单一点，把这四个网页命名为a、b、c、d，或者1、2、3、4，当然一个网站默认的索引首页名为index，这里也用index，
教你制作静态网页的方法
教您制作静态网页的方法 一、网页设计基础 1、熟悉Dreamweaver 8的工作环境 2、创建新站点 创建本地站点:站点----管理站点----新建----站点(前三步也可直接从“新建站点”进入下面的设置向导对话框)----跟随向导设置直至完成 3、网页文件的基本操作 a、创建、打开与保存网页文件 创建:文件----新建----创建 打开:文件---打开----选择欲打开的文件 或者在右边的文件浮动面版中选择打开 保存:文件---保存或另存为 b、设置网页的页面属性 修改---页面属性---然后设置(标题、背景、背景图像、文本等) c、设置网页对象的颜色 网页对象,如页面背景、文字、链接都经常需要设置颜色。 可在各自对应的属性面版中设置。 d、网页文本的输入与属性设置 文本可键入、导入、粘帖 文字可设置字体、大小、颜色、格式等。 键入空格的方法:1、汉字输入法设置为全角方式,按空格键即可输入。2、属性面版格式中:预先格式化的 换行:ENTER、SHIFT+ENTER 实例练习: 1、输入以下文字 书签夹在诗集里, 落叶夹在深秋里。 喜悦夹在生活里, 追求夹在人生里。 2、第一次设置格式为“无”,字体为“华文行楷”,字体颜色为“红色”,字号为“5号”,添加项目符号。然后保存、预览。 3、第二次设置格式为“标题一”,字体为“楷体”,字体颜色为“蓝色”,字号为“5号”,添加项目符号,对齐方式为“居中”。然后保存、预览。 比较两次设置的效果。 e、网页图片的插入与属性设置 插入图片,在对话框中选择图片。(最好在建立站点时将欲用的图片素材复制到本地站点目录中) 插入图像占位符,在图片准备好后再加入图片。加入方法:1、双击图像占位符;2、点“属性面版”中的“指向文件”,拖到右边文件中要插入的文件处。
制作一个简单的网页
制作一个简单的网页 教学目的：1、使学生初步认识Frontpage 2000中文字的添加。 2、使学生初步利用Frontpage 2000制作简单的网页。 教学软件：Frontpage 2000。 教学过程： 一、复习导入新课： 上一课同学们已经学会了如何启动Frontpage 2000，并且知道Frontpage 2000是用来制作网页的工具，但是有了好的工具我们还要学会如何来利用它做出好的网页来。今天我们就来学习如何制作一个简单的网页。 二、新授课程 1、启动Frontpage 2000。 2、根据下列步骤进行。 （1）请同学们单击工具栏上的“新建”按钮，建立一个新的网页。注意讲解这个时候看不到任何东西。 （2）请同学们利用键盘输入文字：“欢迎进入星星网！” （3）请同学们按照要求设置字体和对齐方式。选择字体大小为7号字，并选择对齐方式为居中方式进行。 （4）通过键盘自己调节文字在页面中的位置。 （5）完成后可以请同学们在“编辑区”点击“预览”方式看看作完后在网页的显示效果，如有不满意及时调整。 （6）完成后教师可以选折先做好的同学演示给没有完成的同学看。 三、课堂练习 1、在网页中输入文字“欢迎你的光临！”注意文字设置为7号，并居中显示。 2、请同学们自主练习输入一个自我介绍的网页内容，教师可以指定文字内容和设置的格式，也可以由学生自己设置。要求保存到（D:\班级名\自己名字）为以后的课做准备。 修饰网页中的文字和背景教案 【教材使用】宁教厅审定山东教育出版社出版软件FrontPage2000 【适用年级】初二年级 【适用单元】网页制作第2节 【教学目的】 1．知识目标 （1）掌握用网页编辑软件打开网站和修改网页的基本方法。 （2）学会对网页中的文字进行各种修饰。 （3）学会为网页设置背景图片。 （4）学会使用水平线美化网页。 2．技能目标 通过学生探究学习过程中，掌握美化网页的基本操作。 3．情感目标 （1）通过动手实践，培养学生的审美情趣。 （2）培养学生在学习过程中自主探究、对比、举一反三的学习能力。 （3）利用知识的迁移，培养学生的综合信息素养能力。 【课时安排】1课时
教你制作静态网页的方法
教你制作静态网页的方法 一、网页设计基础 1、熟悉Dreamweaver 8的工作环境 2、创建新站点 创建本地站点：站点----管理站点----新建----站点（前三步也可直接从“新建站点”进入下面的设置向导对话框）----跟随向导设置直至完成 3、网页文件的基本操作 a、创建、打开和保存网页文件 创建：文件----新建----创建 打开：文件---打开----选择欲打开的文件 或者在右边的文件浮动面版中选择打开 保存：文件---保存或另存为 b. 设置网页的页面属性 修改---页面属性---然后设置（标题、背景、背景图像、文本等） c. 设置网页对象的颜色 网页对象，如页面背景、文字、链接都经常需要设置颜色。 可在各自对应的属性面版中设置。 d. 网页文本的输入和属性设置 文本可键入、导入、粘帖 文字可设置字体、大小、颜色、格式等。 键入空格的方法：1、汉字输入法设置为全角方式，按空格键即可输入。2、属性面版格式中：预先格式化的 换行：ENTER、SHIFT+ENTER 实例练习： 1、输入以下文字 书签夹在诗集里， 落叶夹在深秋里。 喜悦夹在生活里， 追求夹在人生里。 2、第一次设置格式为“无”，字体为“华文行楷”，字体颜色为“红色”，字号为“5号”，添加项目符号。然后保存、预览。 3、第二次设置格式为“标题一”，字体为“楷体”，字体颜色为“蓝色”，字号为“5号”，添加项
目符号，对齐方式为“居中”。然后保存、预览。 比较两次设置的效果。 e. 网页图片的插入和属性设置 插入图片，在对话框中选择图片。（最好在建立站点时将欲用的图片素材复制到本地站点目录中） 插入图像占位符，在图片准备好后再加入图片。加入方法：1、双击图像占位符；2、点“属性面版”中的“指向文件”，拖到右边文件中要插入的文件处。 在图像属性面版中设置 f. 插入层 方法: 1、点击插入面版中的“描绘层”；2、在网页编辑器窗口中按住鼠标左键拖画出定位用的层； 3、可以随意移动层的位置； 4、可在层中插入图像、文字等。 g. *插入表格,用表格定位 方法： 1、先用鼠标点至欲插入表格的位置； 2、点插入面版中的“表格”—“插入表格”； 3、确定行数、列数后确定即将表格插入到选定位置了； 4、可在表格中任何单元格里插入图像、文字等。 h. 建立超链接 方法: 1、选中要建立超链接的文字或图像； 2、点右键“创建链接”打开的窗口或在属性的链接栏里，填入链接的目标。（如：本网站另一个网页，或外部网页如https://www.wendangku.net/doc/6211623233.html,，或电子邮件如：mailto:zdhwangji@https://www.wendangku.net/doc/6211623233.html,） 3、在页面属性里修改链接的属性：修改--页面属性（链接、活动链接、访问过链接） 二、制作实例1
网页制作教程,网页制作入门教程
选修课《网页设计》实践考核题 题目：设计一个个人网站 一、要求： 1．使用Dreamweave网页工具制作一个个人网站； 2．包含至少四个网页: 包括首页、个人简介、个人相册等（可随意设计），网页之间用超链接相连。 3．网页中要有图片和文字内容，用表格或框架进行页面布局； 4．添加至少两种行为，并为首页添加背景音乐。 5. 在网站中设计一个表单页面。 6. 首页必须包含页面标题，动态按钮导航栏。 下面我们大家统一一下软件版本，我用的是网页三剑客cs3版本的，大家可以去迅雷下载，因为我们要用到flash 建议大家也按装好flash 首先新建一个文件夹，文件夹的名字不能为汉字，做网站所有的路径都必须用字母或者数字， 不能用汉字，我们就用名字吧，譬如说名字张三，那文件夹名字就是zs，如图
打开Dreamweaver软件，得到图 做网页要新建站点，关于站点配置服务器什么的，这里不讲了，只讲建立站点。选择站点——新建站点。 我们建的文件夹就是站点根文件夹。 新建站点后得到这样一个界面 点选高级，得到界面
站点名称与我们建文件夹得名字相同，zs填进去就可以了 本地根文件夹就是我们新建的那个文件夹， http地址为http://localhost/zs 接下来选择左侧栏里远程信息 点击无后面的那个三角，选择本地网络，远端文件夹同样选择我们新建的那个文件夹
接下来点选左面菜单里的测试服务器， 点选访问后面那个三角，选择本地网络，测试服务器文件夹也为我们建好的文件夹zs，在url前缀后面加上zs 然后点击确定就可以了得到这样一个界面。 下面看老师的第一条要求，是要至少四个网页，那我们就做四个 单击新建，然后单击 接下来，选择
静态网页制作
静态网页制作 一、网页设计基础 1、熟悉Dreamweaver 8的工作环境 2、创建新站点 创建本地站点：站点----管理站点----新建----站点（前三步也可直接从“新建站点”进入下面的设置向导对话框）----跟随向导设置直至完成 3、网页文件的基本操作 a、创建、打开和保存网页文件 创建：文件----新建----创建 打开：文件---打开----选择欲打开的文件 或者在右边的文件浮动面版中选择打开 保存：文件---保存或另存为 b. 设置网页的页面属性 修改---页面属性---然后设置（标题、背景、背景图像、文本等） c. 设置网页对象的颜色 网页对象，如页面背景、文字、链接都经常需要设置颜色。 可在各自对应的属性面版中设置。 d. 网页文本的输入和属性设置 文本可键入、导入、粘帖 文字可设置字体、大小、颜色、格式等。 键入空格的方法：1、汉字输入法设置为全角方式，按空格键即可输入。2、属性面版格式中：预先格式化的 换行：ENTER、SHIFT+ENTER 实例练习： 1、输入以下文字 书签夹在诗集里， 落叶夹在深秋里。 喜悦夹在生活里， 追求夹在人生里。 2、第一次设置格式为“无”，字体为“华文行楷”，字体颜色为“红色”，字号为“5号”，添加项目符号。然后保存、预览。
3、第二次设置格式为“标题一”，字体为“楷体”，字体颜色为“蓝色”，字号为“5号”，添加项目符号，对齐方式为“居中”。然后保存、预览。 比较两次设置的效果。 e. 网页图片的插入和属性设置 插入图片，在对话框中选择图片。（最好在建立站点时将欲用的图片素材复制到本地站点目录中） 插入图像占位符，在图片准备好后再加入图片。加入方法：1、双击图像占位符；2、点“属性面版”中的“指向文件”，拖到右边文件中要插入的文件处。 在图像属性面版中设置 f. 插入层 方法: 1、点击插入面版中的“描绘层”；2、在网页编辑器窗口中按住鼠标左键拖画出定位用的层； 3、可以随意移动层的位置； 4、可在层中插入图像、文字等。 g. *插入表格,用表格定位 方法： 1、先用鼠标点至欲插入表格的位置； 2、点插入面版中的“表格”—“插入表格”； 3、确定行数、列数后确定即将表格插入到选定位置了； 4、可在表格中任何单元格里插入图像、文字等。 h. 建立超链接 方法: 1、选中要建立超链接的文字或图像； 2、点右键“创建链接”打开的窗口或在属性的链接栏里，填入链接的目标。（如：本网站另一个网页，或外部网页如https://www.wendangku.net/doc/6211623233.html,，或电子邮件如：mailto:zdhwangji@https://www.wendangku.net/doc/6211623233.html,） 3、在页面属性里修改链接的属性：修改--页面属性（链接、活动链接、访问过链接）
动态网页制作方法
一般的用网页dreamwaver一般必用，比较好上手的，html是要懂的，css+div 的标注设计也是要学习的。 如果是做前台页面设计会用到的工具：firework、flash、ps、coreldraw 如果是做后台的程序设计会用到：asp、PHP等一些语言，环境调试好后，dreamwear都支持的 https://www.wendangku.net/doc/6211623233.html,与ASP的区别 1、开发语言不同 ?ASP仅局限于使用脚本语言来开发，容易导致代码杂乱。而https://www.wendangku.net/doc/6211623233.html,允许用户选择并使用功能完善的编程语言，也允许使用潜力巨大的.NET Framework。 2、运行机制不同 ?ASP是解释运行的编程框架，所以执行效率较低。而https://www.wendangku.net/doc/6211623233.html,是编译执行，程序效率得到提高。 3、开发方式 ?ASP把界面设计和程序设计混在一起，维护困难。而https://www.wendangku.net/doc/6211623233.html,把界面设计和程序设计以不同的文件分离开，复用性和维护性得到了提高。 https://www.wendangku.net/doc/6211623233.html,的工作原理 浏览器向WEB服务器发送HTTP请求； WEB服务器分析HTTP请求，如果所请求的网页文件名的后缀是aspx，则说明客户端请求执行https://www.wendangku.net/doc/6211623233.html,程序；如果以前没有执行过该程序，则进行编译，然后执行该程序；否则直接执行已编译好的该程序。得到HTML结果； WEB服务器将HTML结果传回用户浏览器，作为HTTP响应； 客户机浏览器收到这个响应后，将HTML结果显示成WEB网页。 WINDOWS操作系统下建立https://www.wendangku.net/doc/6211623233.html,的运行环境需要安装如下软件： IIS MDAC .NET Framework 静态页面和动态页面 1、静态网页 （1）概况：纯粹HTML格式的网页，也就是以.htm、.html、.shtml、.xml等为后缀的。在HTML格式的网页上，也可以出现各种动态的效果，如.GIF格式的动画、FLASH、滚动字幕等，这些“动态效果”只是视觉上的，存在这些“动态效果”的HTML页面，仍然是静态网页。 （2）特点： ①静态网页是事先编写好的。每个静态网页的内容都是保存在网站服务器上不变的； ②静态网页的内容相对稳定，因此容易被搜索引擎检索； ③静态网页没有数据库的支持，在网站制作和维护方面工作量较大； ④静态网页的交互性较差，在功能方面有较大的限制。 2、动态网页 （1）概况：动态网页不仅具有HTML标记，而且含有程序代码，用数据库连接的网页。常见的动态网页是以.asp、.aspx、.jsp、.php等形式为后缀。 （2）特点： ①动态网页的页面内容是在服务器上运行后生成的，不是事先编写好的； ②动态网页常常以数据库技术为基础； ③动态网页的交互性较好，采用动态网页技术的网站可以实现更多的功能，如用户注册、
制作网站的步骤和方法
无论是开发软件还是创建网站，真正困扰我们的往往并非软件的使用问题，而是软件技术之外的一些东西，真正决定一个网站是否成功的要素是设计、定位、推广等非技术手段。 一、整理规划。 网站建设的开始就应该有一个整体的战略目标，即确定站点的目标。 首先要有一个总的目标，这个网站到底是要做什么。有的要显示自己的设计水平，这就要求页面美观；有的是为了求职而设计的求职网站，这就要求提供足够的信息让别人了解你的工作能力；有的是要为用户服务，这就要求网站有较强的互动性，而本站建设之初的主要目的就是为了本人更好的学习网络知识，只是兴趣而已，本站站名“网页教学网”让人一看就知道是有关介绍网页知识的站点。而申请域名也是相当重要的，webjx.co m，大家都知道web译为网、网页、网络等，j是jiao的第一个字母，x 是xue的第一个字母，其实本站是web jiao xue的字母的缩写！当然大家申请注册域名时可以申请自己名字的拼音等！在这里不作过多介绍。 确定好目标之后，还要决定网站的目标观众。其中包括以下几种情况： 1.目标观众的访问速度。很多在线教育网站采用不同的软件制作在线课件，但是视频无论如何在现在是不适合目前中国浏览者的网络带宽，不过提高我们的网络带宽也是一种发展的趋势。
2.目标观众的计算机配置和浏览器版本。计算机硬件技术飞速发展，现在使用的计算机的配置都是比较高的！下面把访问本站的情况给大家帖到下面： 所以我们在设计网页时，其实已经不必要考虑计算机配置了。需要注意的是在设计中要在不同的浏览器中浏览自己的网页，看看有没有发生变化。 3.插件问题。对于有些软件，比如Flash的插件，现在大部分浏览器都安装有这种插件了，如果网页上播放视频，那么就要考虑浏览器是否需要安装相应的插件，在这时最好在网站中说明并提供插件和播放器的下载。现在好多电影站都做的比较好，它们都提供播放器和插件的下载！ 二、新建站点
表单网页的制作方法
表单网页的制作方法 教学目的： 1、理解表单的概念及作用； 2、熟悉表单字段的种类和功能； 3、掌握表单网页的制作方法。 教学重点： 1、表单作用的理解和表单网页的制作。 2、如何验证表单元素的正确性。 教学难点： 1、如何将表单具体应用，设计出精美网页。 2、如何验证表单元素的正确性。 新课内容： 一、表单的概念及作用 表单（Form）是一种结构化的文件，用于收集和发布信息。它是网站管理员与访问者进行交流的一种媒介，通过访问者填写表单中的选择题、填空题和问答题，网站管理员可以收集到来自世界各地的资料和意见。目前表单主要用来进行意见调查、在线查询、网上购物、在线申请等。在表单中经常出现的字段有：单行文本框、多行滚动文本框、单选框、复选框、下拉列表框和按钮。 二、HTML表单设计基础 表单在HTML页面中起着重要作用，它是与用户交互信息的主要手段。一个表单至少应该包括说明性文字、用户填写的表格、提交和重填按钮等内容。用户填写了所需的资料之后，按下“提交资料”按钮，这样所填资料就会通专门的CGI接口传到Web服务器上。网页的设计者随后就能在Web服务器上看到用户填写的资料，从而完成了从用户到作者之间的反馈和交流。对于免费个人网站，往往服务器不提供CGI功能，也可以电子邮件来接收用户的反馈信息。 表单中主要包括下列元素： button——普通按钮 radio ——单选按钮 checkbox——复选框 select ——下拉式菜单 text ——单行文本框 textarea——多行文本框
submit——提交按钮 reset——重填按钮 用HTML设计表单常用的标记是：