如何制作博鱼体育网页(网页制作实战篇)111
发布时间:2023-02-19 03:11

  (2)题材最好是你自己擅长或者喜爱的内容。比如:您对诗歌感兴趣,可以 放置自己的诗词;对足球感兴趣,可以报道最新的球场战况等等。这样在制作 时,才不会觉得无聊或者力不从心。 (3)不要太滥或者目标太高。 “太滥”是指到处可见,人人都有的题材; “目 标太高”是指在这一题材上已经有非常优秀,知名度很高的站点,你要超过它 是很困难的。 OK!如果你已经有一个绝妙的主意了,那我们就开始下一步:规划框架。 2、规划框架 选定了一个好的题材,是不是可以立刻动手制作了?不,经验告诉我们, 您必须规划框架,这是很重要的一步! 每个网站都是一项庞大的工程。好比造高楼,没有设计图纸,规划好结构, 盲目的建造,结果往往是倒塌;也好比写文章,构思好提纲,才不至于逻辑混 乱,虎头蛇尾。 全面仔细规划架构好自己网站,不要急于求成。 规划一个网站,可以用树状结构先把每个页面的内容大纲列出来,尤其当 你要制作一个很大的网站 (有很多页面) 的时候,特别需要把这个架构规划好, 也要考虑到以后可能的扩充性,免得做好以后又要一改再改整个网站的架构, 十分累人,也十分费钱。 大纲列出来后,你还必须考虑每个页面之间的链接关系。是星形、树形, 或是网形链接。这也是判别一个网站优劣的重要标志。链接混乱,层次不清的 站点会造成浏览困难,影响内容的发挥。 为了提高浏览效率,方便资料的寻找,本站的框架基本采用“蒲公英”式, 即所有的主要链接都在首页上,每个主链接再分别展开,主链接之间相互链接。 框架定下来了,然后开始一步一步有条理、有次序地做来,就胸有成竹得 多,也为你的主页将来发展打下良好的基础。 下一步,你可以动手制作具体内容了,我将告诉你一些收集资料的窍门。 3、资料收集 题材选定,框架选定,接下来就开始往主页里面填内容。我们称作 资料收 集。 就个人主页而言,很少有人有能力完全靠自己来创作所有的内容。 (一些高 手能够提供自己编的软件,文章或者音乐,是我非常佩服的! ) 大部分人的方法是:从报纸、杂志、光盘等媒体中把相关的资料收集整理, 再加上一定的编辑后就可以了。 另外一个好的方法是从网络上收集,您只要到雅虎、搜狐等搜索引擎上查 找相应的关键字,就可以找到一大堆的资料。 如果您是英语高手,您可以到国外站点上把最新的信息、资料翻译成中文, 提供给大家,这叫“洋为中用” 。 网络上的资料呈爆炸性的增长,只要注意收集某一非常细小的题材,随时

  四、如何把握网页布局 最开始,网页呈现在你面前的时候,它就好像一张白纸,它需要你任意挥 洒你的设计才思。在开始的时候,你需要明白,虽然你能控制一切你所能控制 的东西,但假如你知道什么是一种约定俗成的标准或者说大多数访问者的浏览 习惯,那么你可以在此基础上加上自己的东西。你当然也可以创造出自己的设 计方案,但如果你是初学者,那么最好明白网页布局的基本概念。

  图 13 站点文件夹 以文件后缀名分类建立文件夹,这是文件夹通常命名情况,如果你记不住 它,也可以自己重新命名,但不要用中文。 ※ adm:放置后台管理程序,对于动态网站是少不了的一个文件夹 。 ※ audio:放置音频文件。 ※ backup :放置备份文件。 ※ doc:放置 Word 文档。 ※ image:放置站点用到的图片。 ※ source:放置开发过程中编写的源文件,如 FLASH,photoshop 等编辑、末 合并图层之前的图片,保留源文件的目的是方便将来修改编辑。 ※ video:放置视频文件。 ※ zip:提供给客户下载的压缩文件。 ※ index.files:网站首页中的各种文件,首页使用率最高,为它单独建一个文件 夹很有必要。 ※ web、web2:放置 WEB 文件夹。

  网页加载性能。可以通过在网页底部提供另外的链接和使用替代文字,而不是 图像来满足访问者的需要。 28 重复使用图像 一些网站由于使用大量不重复的图像而错过了使用更好的技巧的机会。在创建 商标时,在网页上多次使用同样的图像是一个好的方法,并且一旦它们被装入, 以后重新载入就会很快。 29 避免使用过大的图像 不要使用横跨整个屏幕的图像。避免访问者向右滚动屏幕。占 75%的屏幕宽度 是一个好的建议。 30 “避免使用炫耀的技巧。 ——专家忠告 ” 31 选择使用 Flash 动画 许多使用比较慢的计算机的访问者发现动画图标很容易耗尽系统资源,使网站 的操作变得很困难,因此,应该给用户一个跳过使用 Flash 动画的选择。 32 尽量少使用 Flash 插件 虽然许多 Web 设计者认为 Flash 功能很强大,并且 Netscape5.0 将支持 Flash, 在 使用时不必再下载任何插件。 但是,最好还是取消使用 Flash 做各接口的想法。 33 让用户先预览小图像 如果不得不放置大的图像在网站上,就最好使用 Thumbnails 软件,把图像的缩 小版本的预览效果显示出来,这样用户就不必浪费金钱和时间去下载他们根本 不想看的大图像。 34 动画与内容应有机结合 确保动画和内容有关联。它们应和网页浑然一体,而不是干巴巴的。动画并不 只是 Macromedia Director 等制作的东西的简单堆积。 35 慎用声音

  4、文本 文本在页面中出现都数以行或者块(段落)出现, 它们的摆放位置决定者整个 页面布局的可视性。在过去因为页面制作技术的局限,文本放置的位置的灵活 性非常小,而随着 DHTML 的兴起,文本已经可以按照自己的要求放置到页面 的任何位置。 5、页脚 页脚和页头相呼应。页头是放置站点主题的地方,而页脚是放置制作者或 者公司信息的地方。你能看到,许多制作信息都是放置在页脚的。 6、图片 图片和文本是网页的两大构成元素,却一不可。如何处理好图片和文本的 位置成了整个页面布局的关键。而你的布局思维也将体现在这里。 7、多媒体 除了文本和图片,还有声音,动画,视频等等其它媒体。虽然它们不是经 常能被利用到,但随着动态网页的兴起,它们在网页布局上也将变得更重要。 五、设计网站 65 条原则 网站中有哪些关键技巧?有哪些陷阱?在这里告诉你:使网站赋予情趣的 诀窍、应该避免做什么、应使用什么工具软件以及他们喜爱和厌恶的网站。 01 明确内容 如果你想成为一个网站设计者,并正想建一个网站的话,首先应该考虑网站的 内容,包括网站功能和你的用户需要什么。你的整个设计都应该围绕这些方面 来进行。 02 抓住用户 如果用户不能够迅速地进入你的网站,或操作不便捷,网站设计就是失败的。 不要让用户失望而转向你的对手的网站。

  ●HomeSite 3.0——制作可完全控制页面进程的网页 Allaire 的 HomeSite 3.0 是一个小巧而全能的 HTML 代码编辑器,有丰富的 帮助功能,支持 CGI 和 CSS 等等,并且可以直接编辑 perl 程序。HomeSite 工作 界面繁简由人,根据习惯,可以将其设置成像 Notepad 那样简单的编辑窗口, 也 可以在复杂的界面下工作。 HomeSite 具有良好的站点管理功能,链接确认向导可以检查一个或多个文 档的链接状况。HomeSite 更适合那些比较复杂和精彩页面的设计。如果你希望 能完全控制你制作的页面的进程,HomeSite 3.0 是你最佳选择。不过对于生手过 于复杂。 下载网址 http:∥或者 http:∥-●HotMetal Pro 4.0——制作具有强大数据嵌入能力的网页 HotMetal 既提供“所见即所得”图形制作方式,又提供代码编辑方式,是 个令各层次设计者都不至于失望的软件。但是初学者需要熟知 HTML,才能得 心应手地使用这个软件。 HotMetal 具有强大的数据嵌入能力,利用它的数据插入向导,可以把外部 的 Access、 Word、 Excel 以及其它 ODBC 数据提出来, 放入页面中。 而且 HotMetal 能够把它们自动转换为 HTML 格式,是不是很棒,此外它还能转换很多老格式 的文档(如 WordStar 等), 并能在转换过程中把这些文档里的图片自动转换为 GIF 格式。 HotMetal 为用户提供了“太多”的工具,而且它还可以用网状图或树状图 表现整个站点文档的链接状况。 下载网址:http:∥以上工具各有千秋,但对于 WEB 新手来说, “所见即所得”无疑是最方便 的,所以我建议你选择 DreamWeaver,在网上人们习惯叫它为“DW” 。下面我 将在 DreamWeaver 里做实例,希望对你有所帮助。

  21 闪烁让人头痛 通过使用标识可以吸引访问者对你的主页特殊部分的注意,但这也让你的访问 者头痛。如果你想使访问者再次光顾你的网站,就少用此方法。 22 背景颜色 背景颜色也会产生一些问题,可能会使网页难于阅读。你应当坚持使用白色的 背景和黑色的文本,另外还应当坚持使用通用字体。 23 向前和向后按钮 应当避免强迫用户使用向前和向后按钮。你的设计应当使用户能够很快地找到 他们所要的东西。绝大多数好的站点在每一页同样的位置上都有相同的导航条, 使浏览者能够从每一页问网站的任何部分。 24 “坚持你的信念。严格遵守各种规则。避免想当然。绝不停止学习。 —— ” 专家忠告 25 点击记数器 不要轻易考虑在你的网站上放置一个醒目的点击记数器。你设计网站是为了给 访问者提供服务,而不是推销你自己认为重要的东西。大多数浏览者认为计数 器毫无意义,它们很容易被做假,浏览者也不想看广告。如果你显示你的网站 是多么受欢迎,你最好提供一个链接,显示访问日志。 26 不要用框架 与记数器一样,框架在网页上越来越流行。在大多数网站上,在屏幕的左边有 一个框架。但是设计者立刻就发现,在使用框架时产生了许多的问题。使用框 架时如果没有 17 英寸的显示屏几乎不可能显示整个网站。框架也使得网站内个 人主页不能够成为书签。也许更重要的是,搜索引擎常常被框架混淆,从而不 能列出你的网站。 27 去掉图像 在浏览器中即使去掉了图像功能,也要保证访问者能够在你的网站上获得满意 的效果。 对于那些使用 ISDN 连接并且关掉了图像功能的访问者, 还能获得好的

  ●Adobe Pagemill 3.0——制作多框架、表单和 Image Map 图像的网页 Pagemill 功能不算强大,但使用起来很方便,适合初学者制作较为美观、 而 不是非常复杂的主页。如果你的主页需要很多框架、表单和 Image Map 图像, 那么 Adobe Pagemill 3.0 的确是你的首选。 Pagemill 创建多框架页十分方便,你可以同时编辑各个框架中的内容。 Pagemill 在服务器端或客户端都可创建与处理 Image Map 图像, 它也支持表单创 建。 Pagemill 允许在 HTML 代码上编写和修改, 支持大部分常见的 HTML 扩展, 还提供拼写检错、搜索替换等文档处理工具。在 Pagemill 3.0 中还增加了站点管 理能力,但仍不支持 CSS、TrueDoc 和动态 HTML 等高级特性。 Pagemill 另一大特色是有一个剪贴板,可以将任意多的文本、图形、表格拖 放到里面,需要时再打开,很方便。 下载网址 http:∥●Claris Home Page 3.0——快速创建动态的网页 如果使用 Claris Home Page 软件,你可以在几分钟之内创建一个动态网页。 这是因为它有一个很好的创建和编辑 Frame(框架)的工具,你不必花费太多的力 气就可以增加新的 Frame(框架)。而且 Claris Home Page 3.0 集成了 FileMaker 数 据库,增强的站点管理特性还允许你检测页面的合法连接。不过界面设计过于 粗糙,对 Image Map 图像的处理也不完全。 下载网址 http:∥提高级软件 如果你对网页设计已经有了一定的基础,对 HTML 语言又有一定的了解, 那么你可以选择下面的几种软件来设计你的网页,他们一定会为你的网页添色 不少。 ●HotDog Professional 5——制作要加入多种复杂技术的网页 HotDog 是较早基于代码的网页设计工具,其最具特色的是提供了许多向导 工具,能帮助设计者制作页面中的复杂部分。 HotDog 的高级 HTML 支持插入 marquee,并能在预览模式中以正常速度观看。这点非常难得,因为即使首创这 种标签的 Microsoft 在 FrontPage 98 中也未提供这样的功能。HotDog 对 plug-in 的支持也远远超过其他产品,它提供的对话框允许你以手动方式为不同格式的 文件选择不同的选项。但对中文的处理不很方便。 HotDog 是个功能强大的软件,对于那些希望在网页中加入 CSS、Java、 RealVideo 等复杂技术的高级设计者,是个很好的选择。 下载网址 http:∥

  (a)鼠标在表格第一行中单击右键,然后指向“表格”“选择表格”这时再进一 步设置表格属性,第一行属性如图 37

  图 37 设置表格属性 (b)鼠标在表格第二行中单击右键,然后指向“表格”“选择表格” ,再进一步设 置表格属性,在这里我们设置宽为 778,高为 680,填充为 0,间距为 0,边框 为 0,对齐为“居中对齐” 。以上设置完成后,按一下回车。 (6)在表格第一行里输入内容: 当前页:首页 (7)在表格第二行里单击鼠标右键,选择 “表格”“拆分单元格” 设置为 3 , 列,然后单击“确定” ,如图 38

  一个站点究竟使用什么样的主题,要根据建站的性质来确定。公司站点主 要是向外界展示公司的形象,介绍公司情况以及推销自己的产品;政府站点侧 重网上办公,将办公的材料放置到网上供人查阅;个人站点则希望将个人的兴 趣爱好展示出来,让别人通过自己的站点了解自己,因此个性化更强一些。 2、规划站点结构 一般来说,一个站点包含的文件很多,大型站点更是如此.如果将所有的文 件混杂在一起,则整个站点显得杂乱无章,自己看起来也很不舒服且不易管理, 因此需要对站点的内部结构进行规划。应该将各个文件分门别类地放到不同的 文件夹下,这样可以使整个站点结构看起来条理清晰,井然有序,使人们通过 浏览站点的结构,就可知道该站点大概内容。这样做主要是为网页设计人员在 修改管理页面文件时提供方便。 在你电脑里除 C 盘外要新建一个站点的文件夹, 命名如 Myweb, 也可以叫 “我的站点” 然后在站点文件夹里再新建几个文件夹, 。 如下图:

  图 35 给首页文件命名 (4)使用表格构架页面,鼠标单击菜单栏“插入”.选择“表格”在弹出的对话框 中设置表格一行,一列,宽为 778 像素对齐标题为“顶部”然后单击下面的“确

  图 36 插入表格 (5)设置表格属性。鼠标在表格第一行里点一下,然后在属性栏里设置表格高度 为 22,去掉“”标题”前面的小钩表格第二行设置高度为 680。(注:这个 680 高度

  图 14 网站草图 打开 Dreamweaver 8 后,可以通过“窗口”下面的“资源”面板创建新的模板。 快捷键是 F11。如图 15

  图 15 打开资源,新建模板文档 这时你双击才命名的 muban 文件,便在 DW 里显示一个空白的文件。当你新建 一 个模板 文档 时, Dreamweaver 8 将 会在你 的站 点根 目录 下自 动生 成一 个 Templates 文件夹,该文件夹专门用于放置模板文档。如图 16

  图 30 新建重复区域对话框 用同样方法在页脚处设置重复区域 2。 导航栏也定义为重复区域 3、4。 定义可编辑区域:我们是主要编辑区在第三。用同样方法把它设置为可编辑区。 将光标定在第三行,然后选择菜单“插入” “模板对象” 指向“可编辑区域” 单击鼠标左键,这时会弹出“新建可编辑区域”对话框,点“确定” 。如图 30

  标签中保存这个属性。这可以使网页显得很流畅,因为浏览器可以在图像被下 载之前在屏幕上显示整个网页。 58 设计失败的网站 ——在它上面找一件 T 恤衫要花一个小时 ——不吸引人,主页太雷赘 ——设计太差 ——没有新意 ——导航不知所云 59 图像大小属性,可以在 IMG 标签中保存这个属性。这可以使网页显得很流 畅,因为浏览器可以在图像被下载之前在屏幕上显示整个网页。 60 用户注册 如果能知道谁浏览了网站以及是怎样浏览网站的,那么就能得到大量有用的信 息。但是,要求访问者在浏览网站之前进行注册,这样做是要冒风险的,因为 这将赶走一批不愿意注册的人。获得信息的另一种方法是进行有奖竞猜或金钱 奖励,让用户能主动填一些信息反馈表。 61 使网站具有交互功能 在网站上提供一些回答问题的工具,使得访问者能从网站上获得交互的信息。 62 图片更新 尽可能经常更换网站上的图片,人们更愿意点击的是图片而不是文本。 63 在网站上提供游戏 游戏是很好的交互工具,它是使访问者能再次光顾网站的好方法。 64 挑选工具软件 仔细选择 Web 设计工具。保证使用自己最想要的、自我感觉最好的软件。 65 使用最新版本的软件

  图 5 新建一个文件夹 第二步: 双击下载的软件” Dreamweaver 8-chs” 会出现如下安装界面, 如图 6 。

  根据提示,点下一步,在“接受该许可协议中和条款”前点一下,再点“下一 步” 。如图 7

  图 8 在桌面创建快捷方式 下一步,点“更改” ,在弹出的对话框中选择安装位置,找到 E 盘,双击”DW” 文件夹,点“下一步”开始安装。

  供大家方便的查找,您的主页就已经有做不完的活了。 但是,有一点必须注意!在 Copy 或引用他人的资料文章时,请您尊重知识 版权。有特别声明、禁止复制的请不要盗为己用。允许复制的也应该在引用时 注明作者、 出处。 一般来说, 个人主页是非商业站点, 只要你发封 Email 给作者, 都会征得同意的。 还有就是收集的资料必须合法。按照我国《计算机信息网络国际联网安全 保护管理办法》的规定: 任何单位和个人不得利用国际联网制作、复制、查阅和传播下列信息: (一)煽动抗拒、破坏宪法和法律、行政法规实施的; (二)煽动颠覆国家政权,推翻社会主义制度的; (三)煽动分裂国家、破坏国家统一的; (四)煽动民族仇恨、民族歧视,破坏民族团结的; (五)捏造或者歪曲事实,散布谣言,扰乱社会秩序的; (六)宣扬封建迷信、淫秽、色情、赌博、暴力、凶杀、 恐怖,教唆犯罪的; (七)公然侮辱他人或者捏造事实诽谤他人的; (八)损害国家机关信誉的; (九)其他违反宪法和法律、行政法规的。 到这里我们已经完成了制作主页的准备工作了。 三、如何选择网页制作工具 “工欲善其事,必先利其器” 。制作网页第一件事就是选定一种网页制作软 件。从原理上来讲,虽然直接用记事也能写出网页,但是对网页制作必须具有 一定的 html 基础,非初学者能及,且效率也很低。用 WORD 也能做出网页, 但 有许多效果做不出来,且垃圾代码太多,也是不可取的。我认为比较合适的网 页制作软件首推 Dreamweaver,它简单易学,功能强大,用它做出的网页垃圾代 码也比较少,另外,它还可以在我们用所见即所得的环境制作网页的同时可以 在代检视窗中看到对应的 HTML 代码,这对我们学习 HTML 有很大好处。虽然 用 Dreamweaver, 即使我们一点不懂 HTML 也能做出漂亮的网页,但 HTML 毕 竟是制作网页的基础,我们要想把网页做活了,必须要知其然还要知其所以然, 最 终 我 们 还 是 要 熟 练 掌 握 HTML 才 行 。 当 然 Frontpage 也 不 错 , 但 比 起 Dreamweaver 来还是要稍逊一筹。 ●DreamWeaver——自制动态 HTML 动画的网页 DreamWeaver 是一个很酷的网页设计软件,它包括可视化编辑、HTML 代 码编辑的软件包, 并支持 ActiveX、JavaScript、 Java、 Flash、 ShockWave 等特性, 而 且 它 还 能 通 过 拖 拽 从 头 到 尾 制 作 动 态 的 HTML 动 画 , 支 持 动 态 HTML(Dynamic HTML)的设计, 使得页面没有 plug-in 也能够在 Netscape 和 IE 4.0 浏览器中正确地显示页面的动画。 同时它还提供了自动更新页面信息的功能。

  DreamWeaver 还 采 用 了 Roundtrip HTML 技 术 。 这 项 技 术 使 得 网 页 在 DreamWeaver 和 HTML 代码编辑器之间进行自由转换, HTML 句法及结构不变。 这样,专业设计者可以在不改变原有编辑习惯的同时,充分享受到可视化编辑 带来的益处。DreamWeaver 最具挑战性和生命力的是它的开放式设计,这项设 计使任何人都可以轻易扩展它的功能。 下载 Dreamweaver 注:下载点不提供安装序列号的,请复制( WPD800-53931-95632-35191) ●Microsoft FrontPage 98——制作功能强大的网页 如果你曾对 Word 很熟悉,那么相信你用 FrontPage 98 进行网页设计一定会 非常顺手。 使用 Frontpage98 制作网页,你能真正体会到“功能强大,简单易用”的含 义。页面制作由 Frontpage98 中的 Editor 完成,其工作窗口由 3 个标签页组成, 分别是“所见即所得”的编辑页,HTML 代码编辑页,预览页。Frontpage98 带有 图形和 GIF 动画编辑器,支持 CGI 和 CSS。向导和模板都能使初学者在编辑网 页时感到更加方便。 FrontPage 98 最强大之处是其站点管理功能。在更新服务 器上的站点时,不需要创建更改文件的目录。FrontPage 98 会为你跟踪文件并拷 贝那些新版本文件。 FrontPage 98 是现有网页制作软件中唯一既能在本地计算机 上工作,又能通过 Internet 直接对远程服务器上的文件进行工作的软件。 下载网址 http:∥●Netscape 编辑器——制作简单的网页 Netscape Communicator 和 Netscape Navigator Gold 3.0 版本都带有网页编辑 器。 如果你喜欢用 Netscape 浏览器上网,那么使用 Netscape 编辑器真是简单方 便!当你用 Netscape 浏览器显示网页时,单击编辑按钮,Netscape 就会把网页 存储在硬盘中,然后就可以开始编辑了。你也可以象使用 Word 那样编辑文字、 字体、颜色,改变主页作者、标题、背景颜色或图像,定义描点,插入链接, 定义文档编码, 插入图像, 创建表格等, 是不是与 Frontpage 98 还有些像。 但是, Netscape 编辑器对复杂的网页设计就显得功能有限了, 它连表单创建、 多框架创 建都不支持。 Netscape 编辑器是网页制作初学者很好的入门工具。 如果你的网页主要是由 文本和图片组成的,Netscape 编辑器将是一个轻松的选择。如果你对 HTML 语 言有所了解的话,能够使用 Notepad 或 UltraEdit 等文本编辑器来编写少量的 HTML 语句,那么也可以弥补 Netscape 编辑器的一些不足。

  图 33 创建新文档 (2)在新建文档上边框处单击鼠标右键,在弹出的对话框中选择“另存为” 。如图 34

  图 34 另存为文档 (3)在弹出的对话框“文件名”处输入“index” ,并单击“保存”按钮。首页文件 一般要在网站根目录下,文件命名要根据你注册的空间要求来决定的,静态网 站大都用 index 如图 35

  十、制作首页 模板出来了,下面我们开始制作首页,首页是一个网站的门面,要注意的问题 很多,前面我们已做了些说明,在这里就不再进行理论研究了。 (1)启动中文版 Dreamweaver8,选择“文件”“新建”菜单选项,在弹出的“新 建文档”对话框中打开“常规”选项卡,选择“基本页”单击下面的“创建” 按钮,创建一个新的文档。如图 33

  1、页面尺寸 由于页面尺寸和显示器大小及分辨率有关系,网页的局限性就在于你无法 突破显示器的范围,而且因为浏览器也将占去不少空间,留下给你的页面范围 变得越来越小。一般分辨率在 800x600 的情况下,页面的显示尺寸为:780x428 个象素;分辨率在 640x480 的情况下,页面的显示尺寸为:620X311 个象素;分 辨率在 1024X768 的情况下,页面的显示尺寸为:1007x600。从以上数据可以看 出,分辨率越高页面尺寸越大。 浏览器的工具栏也是影响页面尺寸的原因。一般目前的浏览器的工具栏都 可以取消或者增加,那么当你显示全部的工具栏时,和关闭全部工具栏时,页 面的尺寸是不一样的。 在网页设计过程中,向下拖动页面是惟一给网页增加更多内容(尺寸)的方 法。但我想提醒大家除非你能肯定站点的内容能吸引大家拖动,否则不要让访 问者拖动页面超过三屏。如果需要在同一页面显示超过三屏的内容,那么你最 好能在上面做上页面内部连接,方便访问者浏览。 2、整体造型 什么是造型,造型就是创造出来的物体形象。这里是指页面的整体形象, 这种形象应该是一个整体,图形与文本的接合应该是层叠有序。虽然,显示器 和浏览器都是矩形,但对于页面的造型,你可以充分运用自然界中的其它形状 以及它们的组合:矩形,圆形,三角形,菱形等。 对于不同的形状,它们所代表的意义是不同的。比如矩形代表着正式,规 则,你注意到很多 ICP 和政府网页都是以矩形为整体造型;圆形代表着柔和, 团结,温暖,安全等,许多时尚站点喜欢以圆形为页面整体造型;三角形代表 着力量,权威,牢固,侵略等,许多大型的商业站点为显示它的权威性常以三 角形为页面整体造型;菱形代表着平衡,协调,公平,一些交友站点常运用菱 形作为页面整体造型。虽然不同形状代表着不同意义,但目前的网页制作多数 是接合多个图形加以设计,在这其中某种图形的构图比例可能占的多一些。 3、页头 页头又可称之为页眉,页眉的作用是定义页面的主题。比如一个站点的名 字多数都显示在页眉里。这样,访问者能很快知道这个站点是什么内容。页头 是整个页面设计的关键,它将牵涉到下面的更多设计和整个页面的协调性。页 头常放置站点名字的图片和公司标志以及旗帜广告。

  声音的运用也应得到警惕。内联声音是网页设计者的另一个禁地。因为过多地 使用声音会使很慢,同时并没有带给浏览者多少好处。首次听到鼠标 发出声音可能会很有趣,但是多次以后肯定会很烦人。使用声音前,应该仔细 考虑声音将会给你带来什么。 36 少用 Java 和 AxtiveX 在网页上应尽量少使用 Java 和 AxtiveX。因为并不是每一种浏览器都需要使用 它,只有那些 Netscape 和 Explorer 的早期版本的使用者才需要它。另外 Mac 在 处理 Java 时也存在问题,过分地使用 Java,会使 Mac 崩溃。 37 设计成功的网站 ——内容和关联性很好 ——图形下载很快 ——设计简单明了 慎用插件 在 Web 设计中,如果依赖于一些特别的插件,会减少网站的吸引力。如果访问 者没有所要求的插件,将不得不到其它站点去下载,这样访问者有可能就不会 返回了。 39 使用著名的插件 如果网站上有声音或视频,要保证使用者通过使用某个知名的插件,能够听到 或看到。许多站点使用 QuickTime、RealPlay 和 Shockwave 插件。因为,许多 访问者并不愿意浪费很多时间和金钱去下载可能仅使用一次的插件。 40 使用先进技术 跟上新的技术。Web 技术的进步绝不会停止,所以应花一些时间来研究新产品 和开发技术。 41 自己创建图像和声音

  注:宽度通常设置在 780 以内,这可以在 800X600、1024X768 两种分辨率情况下使你的的网页不变样, 如果过大超过 800,那么使用 800X600 分辨率的电脑看你的网页就会出现下滑块。

  (2)设置表格属性 在“对齐”处选“居中” ,在“填充”“间距”“边框”处全部设置为“0” 、 、 。 如图 25

  第三步:注册软件。 双击桌面“Dreamweaver8”图标,进行软件注册。如图 11

  图 11 桌面快捷方式 在弹出出来的对话框里会提示你的软件过期, 你不要管它, 点最下面的 “继续” 。 在弹出的对话框最上面,填上刚才复制的序列号;在下面第一小行里打上你的 名,第二行打上姓,这个没有什么特别规定。在第三行里打上你的邮箱地址, 如果你没有,那你就打上“”在第四行地址栏里,选“中国” 将 滑块拉到底便可以看到“中国” 。 全部填好后,再点最下面的“注册” ,这时会有“注册成功”的提示。 接着会弹出如下对话框,你选“设计器”然后点“确定” 。

  图 16 模板专用文件夹 下一步就是在这个空白的文档中建模板了。 (这个空白文档和你做网页一样 的)当然也可以用别的方法来创建模板,如通过“插入”面板或者菜单选项可 以完成模板文档的创建,新建模板与创建模板略有不同。创建模板的操作方法 哪下: (1) 选择“窗口”面板“插入”菜单选项,打开“插入”面板。 (2) 在“插入”面板中选择“模板对象”向右点“创建模板” 。 (3) 也可以在一般页面中象平时做网页一样,把页面做好,然后点左上 “文件” “另存为模板”等。在这里我就不一一说了,你肯定能在实践中摸索出 来的。言规正传,下面我们开始在刚才打开的 muban 文件中建模板啦。 第一步:设置页面属性 (1)选择菜单“修改”向下单击“页面属性” ,如图 17。在弹出的对话框 里设置字体和边距。Dreamweaver 8 默认设置网页都留有间隙,不怎么好看,所 以要全部设置为“0”如图 18 再选择“链接”根据自己的喜好设置下划线和链 接的颜色。如图 19

  如何制作网页目录 一、认识网页 二、制作主页前的准备 三、如何选择网页制作工具 四、如何把握网页布局 五、设计网站 65 条原则 六、下载安装 Dreamweaver8 七、规划站点 八、在 Dreamweaver 设置站点 九、制作模板 十、制作首页 十一、在 Dreamweaver 套用模板修改模板 一、认识网页 你现在所看到的就是网页啦!可是您知道为什么网页可以在 Internet 上传播, 为什么可以被您的电脑认识吗?还是让我们来好好来认识网页。 网页的学名称作 HTML 文件,是一种可以在 网上传输,并被浏览器 认识和翻译成页面显示出来的文件。 WWW 是 “World Wide Web” 的缩写; HTML 的意思则是 “Hypertext Markup Language” ,中文翻译为“超文本标记语言”“超文本”就是指页面内可以包含 。 图片、链接、甚至音乐,程序等非文字的元素。 网页就是由 HTML 语言编写出来的。 看到这,您也许会想:我最怕编程了!别急!其实 HTML 语言只是一种排版 语言,语法就类似于这样: “页高 8 宽 5,(1,2)处插入高 1 宽 1 的图片 A...” 如 果您是使用 WPS 或则 Word 的高手,那么恭喜您,网页制作的学习您已经走了 一半路了! HTML HTML:全称 HyperText Markup Language,正式名称是超文本标记语言, HTML 语言发展很快,已历经 HTML1.0、HTML2.0 和 HTML3.0、HTML4.0 多 个版本, 现在 HTML5.0 正在测试, 同时 DHTML (动态)、 VHTML(虚拟)、 SHTML 等也飞速发展起来。我们现在一般只要掌握 HTML4.0 就可以了。 html 利用标记(tag)用来描述网页的字体、大小、颜色及页面布局的语言, 使用任何的文本编辑器都可以对它进行编辑,与 VB、C等编程语言有着本质 上的区别。

  49 测试网站 在你的网站正式发布之前,必须进行有用的测试。在设计网站时要使用最新的 软件,但是不要忘了人们并不会使用最新的浏览器,所以要照顾到以前的浏览 器。在上载网站时还要测试所有的链接和导航工具条。 50 “尽你所能反复测试所设计的网站,直到你不能发现新的东西为止。 —— ” 专家忠告 51 演示即将发布的网站 在网站正式运行之前,让人演示它。演示中人们会告诉你所设计的网站是否容 易使用。 52 动画点缀 网页上的动画最多只用一个 53 “倾斜的按钮看起来不会太好,最好不要使用。 ——专家忠告 ” 54 内容组织 在开始创建新的网页前,仔细考虑网站内容的组织。决定好想让访问者浏览的 内容,然后设计导航系统。 55 “空白万岁” 注意留空白。不要用图像、文本和不必要的动画 GIFs 来充斥网页,即使有足够 的空间,在设计时也应该避免使用。 56 “利用空白去吸引注意力。为了吸引眼球, Web 设计者使用各种方法,比如: 闪烁、旋转等,但是利用空白会吸引更多的注意力。 ——专家忠告 ” 57 图像压缩 为了保持小的图像,可以使用类似 GIF 向导的程序,它能自动对图像进行压缩。 先声明图像的大小, 在图像显示之前最好能详细说明图像大小属性, 可以在 IMG

  图 43 选择创建的模板 (3)在弹出的对话框中用鼠标单击 Document body 选项, “将内容移到新区域”处 选择 “EditRegionl” 。

  图 44 选择 “EditRegionl” 再用鼠标单击 Document head d 在“将内容移到新区域”选择“不在任何地方” 单击“确定”按钮。

  图 14 新建站点 第二步:在弹出的对话框里给站点起一个名子,并在下面打上网站域名,然后 点“下一步”如图 15

  图 15 命名站点 第三步:在弹出的对话框里选择“否,我不想使用服务器技术” 。然后点“下一 步” 如图 16 。 ,

  图 16 选择“否,我不想使用服务器技术” 第四步:选择站点文件夹存放的位置,如图 17

  图 24 设置表格属性 (3)拷贝和粘贴单元格 将鼠标左键对着单元格边框点一下,然后再点右键,选“拷贝” ,再将鼠标 对着表格下面点右键,选“粘贴”五次。如图 25

  图 25 拷贝和粘贴表格 这样做的目的是为了打散表格,能提高打开网页速度。当然也可以用一个整体 的表格。 (4)设置单元格属性 表格第一行:我们将用来放置 FLASH 动画,或者图片。尺寸在 780X100, 宽度已定下来了,现在确定它的高度将鼠标对着第一行点一下,然后在下面表 格属性里“高”打上“100”按一下回车,要注意所有表格属性栏下面的标题前 面有小钩要去掉,如果不去掉,你打出来的字特粗。 表格第二、第三行,是用来放置栏目的,一般高度设置“20”方法同第一 行。 表格第四行是主要编辑区,我们暂时设置高为“200” 。再提醒一句, “标题” 前面的小钩一定要去掉哟~~ 表格第五行是放页脚的,一般高在“60”以内。设置方法同上。 到此,插入表格和设置表格属性完成了。 第三步:制作页眉 插入 FLASH 动画 :鼠标在第一行点一下,然后选择菜单“插入” 指向“媒 体” 向右单击 “FLASH” 在弹出的对话框里找到你制作的 FLASH 然后点 “确定” 。

  图 12 选“设计器” 好了,下载安装 Dreamweaver8 就写到这里了,在实际操作中如遇到什么困难, 请你给我留言。下面要进行实际操练啦,没有什么更多的理论,只是把我怎么 做的简单在这里表达一下,由于水平有限,可能表达的不清楚,你可以再多看 几次。 七、规划站点 规划站点,不像直接设计编写那么简单,事先需要做许多准备工作,不仅 要准备建设站点需要的素材文字资料、图像以及媒体文件) ,还要设计好资料整 合的方式,并根据资料确定站点的风格特点;同时在内部还要整齐、有序地排 列归类站点中的文件,否则杂而乱的资料堆积到一起,不仅不利于将来的维护 和 (包括站点的管理, 同时还会因为页面间极为混乱的关系而导致站点容易出 ) 现错误。 1、确定站点风格 访问互联网时,可以看到形形的站点,每一个站点都有自己的特色, 不同类型的站点风格特色更不相同。站点的风格是整个网站的灵魂,没有风格, 就不具有自己的特色,更谈不上吸引用户访问站点。因此站 点设计者通常在设 计之前都要规划好站点的风格。

  尽量使用 Web 设计软件的最新版本,还应当能被授权进行免费或便宜的升级。

  六、下载安装 Dreamweaver8 一、下载 Dreamweaver8 中文版 Dreamweaver8 具有全新的操作界面和改进的产品性能, 它具有在量 的新特色,能 够大大提高产品的可用性,并使“设计”视图和“代码”视图的 操作更为简便。 使用中文版 Dreamweaver8 不仅可以在短期内迅速快捷地制作 出精美的页面,还能够十分方便地管理和维护站点。中文版 Dreamweaver8 集网 产设计、制作和发布于一体,学会使用中文版 Dreamweaver8 后,不仅意味着能 够独立设计、制作、维护和管理独具一格的网站,还意味着你掌握了一门基本 技能。 中文版 Dreamweaver 8 目前是最新的版本, 下载地点请点击这里, 点击下载后, 请你选择一个离你家较近地点下载, 这时会出现如下对话框, 请你选择“保存” 。 如图 1

  图 39 插入表格 鼠标在表格里点一下,然后将属情栏“标题”前面的小钩去掉。 在左边表格里单击鼠标右键,指向“表格”“选择表格”ຫໍສະໝຸດ Baidu,在属性栏里进行如下 设置: 680, 高 填充为 0, 间距为 1, 边框为 0, 对齐为 “默认” 背景颜色为 cccccc。 , 用同样方法在右边栏插入表格进行设置。如图 40

  十一、在 Dreamweaver 套用模板修改模板 一、套用模板方法如下: (1)在做好的首页或者在别的页面中选择菜单“修改”指向“模板”向右,单击 “套用模板到页” ,如图 42

  图 42 套用模板到页 (2)在弹出的对话框中,鼠标选择我们在实例中创建的 020 模板,并单击“选定” 按钮。如图 43

  图 38 拆分单元格 (8)鼠标在表格第二行的左边栏里点一下, 然后在属性里设置宽度为 160, 同样在 右边栏设置为 160 。数字输入后要按一下回车,然后点“文件”“保存” , 。 (9)以上设置在浏览器里是看不到边框的,下面我们设置二边有边框,中间不显 示边框。将光标指向第二行左边栏,然后选择菜单“插入”“表格” ,插入一行

  使用你自己创建的或从某个商业网站上下载的图像和声音。在制作商业网站时, 应该花足够的资金来创建图形,以增强公司的宣传。 42 “无论是游戏、图像、动画还是电影,想想你喜欢的设计是怎样的,这将激 发你的创作灵感,使你创作出新的和更好的网站。 ——专家忠告 ” 43 平台的兼容性 要为用户着想,必须最少在一台 PC 和一台 Mac 机上测试你的网站,看看兼容 性如何。 44 用软件分析工具找错 使用软件 分析工具检查 HTML。软件分 析工具 Doctor HTML 能够帮助 检查 HTML 中的任何问题。如果你有许多网页需要检查,可选用软件分析工具。在 网址 中,你能够找到更多有效的 HTML 工具。 45 避免错误链接 网站中可能与其它一些有用的站点作了链接。但是,如果在你的网页上有链接, 一定要经常检查它们,保证链接有效。链接的网站可能很多,但不要链接到与 你的内容无关的网站上。 46 给观众成熟的东西 如果网站没有完成,就不要发送到 Web 上。所有好的网站都是在幕后完成之后 再发布的。 47 在搜索引擎上登记网站 任何一个人发现你的网站的机会都很少,除非你把你的网站在主要的搜索引擎 上进行登记。 48 设计一个留言板 浏览者愿意把时间花在好的网站上,所以最好有一个留言本,这能激励访问者 再次回到你的网站,还有助于扩充网站内容。

  举一个简单的例子: 要在浏览器的显示效果: 原代码就标记为:b其中 b/b 就是两个 HTML 标记。它以起始标记b及结束标记/b标 记文字 ,令它显示成粗体。 也有懒虫(像我一样:-)觉得一下要记住 HTML 那么多枯燥的标记实在太麻 烦了。那么有一个偷懒的办法:找一个所见即所得的网页制作工具,即使一点 HTML 语言都不会,也可以制作出出色的网页。(嘘——,别声张!)后面,我会 为大家介绍这类工具的。 说到底,我还是推荐您稍微了解一些 HTML 的语法。这样,您可以更精确 的控制页面的排版,可以实现更多的功能。当大家称赞羡慕您的主页的时候, 您就会觉得很值得哦! ------ 主页制作的基本条件-----在 WWW 上,不论你是资产上亿的大公司,还是捉襟见肘的穷学生,只要 你建立了自己的主页,你们的地位就是平等的。实际上,许多个人管理的站点 比商业站点更加受欢迎,一切都在于你的内容和创意。那么制作主页需要什么 条件呢? 主页制作的基本条件有: 硬件:一台电脑(64MB 以上内存,当然越大越好啦);可以拨号上网;如果 你有条件的话,建议:配置扫描仪,这将大大方便图像和文字的输入; 软件:HTML 编辑软件:常用的有 Frontpage、Hotdog 等,本文重点介绍 Dreamweaver; 图像处理软件:常用的有 Photoshop、flash、Fireworks 等; 文件上传软件:常用的有 Cuteftp、WSftp 等。 如果你已经万事具备了,我们继续下一步:制作主页前的准备. 二、制作主页前的准备 1、主页题材 下面我们开始着手策划制作主页。首先面临的问题便是我要制作什么内容, 选择什么样的主页题材。网络上的主页题材千奇百怪、琳琅满目。只要你想的 到,就可以把它制作出来。以下列出一些常见的题材,是否对你有点启发。 给您的建议: (1)一般来说,个人主页的选材要小而精。如果你想制作一个包罗万象的站 点,把所有您认为精彩的东西都放在上面,那么往往会事与愿违的,给人的感 觉是没有主题,没有特色,样样有却样样都很肤浅,因为您不可能有那么多的 精力去维护它。注意:网页的最大特点就是更新快。目前最受欢迎的个人主页 都是天天更新甚至几小时更新一次。

  图 1 选择保存 在出来的对话框里再选择保存的地点,本例保存在 D 盘,如图 2

  二、安装 Dreamweaver 8 一般较大的软件最好不要放在 C 盘,因为 C 盘是操作系统工作的地方。我 们选在别的盘子里安装。本例安装在 E 盘。第一步:我们要做的工作就是在 E 盘里新建一个文件夹,并重新命名为 DW。如图 5

  八、在 Dreamweaver 设置站点 一、申请免费空间 网站做好后放在哪里呢,这就要有一个空间。网上提供免费的空间很多, 有的服务质量还是可以的,但也有服务质量差的。我第一个申请的免费空间在 ,到现在还在用,只不过速度稍慢一点;我第二个申请的免费空间 是在中,打开速度快,服务质量还是可以的,但申请手续有 点烦,在申请中如果有一个地方他们认为是不真实的可能就不会批,申请可能 在一到三天。提供免费空间的网站很多,最近可用的一批免费空间,你可以点 这里查找。如果你的申请批下来了,会用电子邮件发送到你的邮箱,主要内容 是:域名、空间大小、注册名、FTP 密码 如果你不想用免费的空间,也可以用 收费的空间,收费的空间申请很容易,只要你的钱汇到了,马上就可以开通你 的网站。在价格上也不等,从几十元到几百元以上,根据你申请的空间大小来 决定的。我们才学做网站,如果图片不多,FLASH 放的少,有 100MB 足够你 用了。 真的不想用收费的空间,又不想用免费的空间,那么你就用自己的电脑做服务 器吧,详细内容请看本站“初学园地” 。 二、设置站点 有了空间后,我们就可以在 Dreamweaver 8 里做网页了。也可以先做好再 申请空间,这个由你自己定。我是先申请一个空间后,才动手做网站的。 设置站点分为动态和静态二种,动态网站的设置在“初学园地”里有介绍, 在这里我就不再重复了,重点介静态站点的设置。 第一步:打开 Dreamweaver 8 在菜单栏单击“站点”指向“新建站点”

  图 21 在允许多个连续的空格前打上钩,然后点“确定” 。 第二步:使用表格布局网页。 当然也可以用层。表格是网页布局设计的常用工具,它可以使插入页面中 的图像和文本等对象被限定在某一固定位置。相对于没有使用表格的页面,使 用表格的页面显得更加整齐有序。 (1)绘制表格 将光标置于需要插入表格的位置, 然后选择菜单 “插入” 向下单击 , “表格” , 如图 22 在弹出的对话框里根据以上草图确定行和列的数字,如图 23。

  图 27 在站点文件夹里找到 FLASH,然后点”确定” 第四步:制作导航栏 在第二行里可以用插入表格的方法,根据你的栏目,设置列数,可以在属 性里设置颜色,也可以放置背景图片。 第三行,同上。 第四行是主要编辑区,我们暂时不动。 第四步:制作页脚 第五行是页脚,页脚里主要内容是版权、联系地址、电话、网站备案、联 系人、网站统计等。所有编辑完成后如图 28

  图 40 设置表格 (10)显示表格细线条。 方法如下:将鼠标在带有背景颜色的表格里单击,然后 在下面的属性栏里“背景颜色”设置为白色,或者你自己喜欢的颜色,用同样 的方法设置右边栏,然后保存,进行预览。 (11)填充内容.表格设置好后,下一步就是按事先准备好的内容进行填充.在这里 我就不再表述.下面是填充好的首页页面,如图 41

  09 “在计算机上永远也找不到好的方案” ——专家忠告 。 10 网站地图 许多设计者把他们的网站地图放在网站上,这种做法,却是弊大于利。绝大部 分的访问者上网是寻找一些特别的信息,他们对于你的网站是如何工作的,并 没有兴趣。如果你觉得你的网站需要地图,那很可能是需要改进你的导航和工 具条。 11 “睁大你的眼睛,留意所有的事情。 ” “对最不相关的东西的观察可以得到最好的灵感。观察一个站点的结构和设计。 理解站点结构的关键元素,确保你的设计是围绕站点浏览进行的。 ——专家 ” 忠告 12 点击规则 听说过 3 次点击规则吗?对于小型网站,在你的主页上,没有任何一条信息, 需要点击次数超过 3 次的。对于大型网站,使用导航和工具条来改善操作。 13 特殊字体的应用 虽然你可以在你的 HTML 中使用特殊的字体,但是,你不可能预测你的访问者 在他们的计算机上将看到什么。在你的计算机里看起来相当好的页面,在另一 个不同的平台上看起来可能非常糟糕。一些网站设计员喜欢使用来定义特性, 这虽然允许你使用特殊的字体,但是仍需要一些变通的方法,以免你所选择的 字体在访问者的计算机上不能显示。级联风格表 CSS 有助于解决这些问题,但 是只有最新版的浏览器才支持 CSS。

  通过以上操作便完成了套用模板的工作。 二、修改模板方法如下: (1)在模板文档中直接修改 打开 Dreamweaver8 后, “文件” 打开” 在站点根目录下双击 选择 “ “Templates” 文件夹,在里面找到你要修改的模板,选择“打开” ,便可以进行修改。 (2)直接打开修改 双击站点 Templates 文件夹,再双击要修改的模板,也可以很方便的进行修改。 修改后的模板要选择“文件”“保存”菜单选项,这时将弹出“更新模板文件” 对话框。该对话框中的几个按钮含义如下: ※ 更新:单击该按钮,将会使所有的套用被修改模板的文档全部被更新。 ※ 不更新:单击该按钮,所有套用被修改模板的文档将不被更新。 ※ 查看:在该下拉列表框中,如果选择“文件使用”选项,可以根据特定模板 更新文件,使用该选项将更新当前站中的所有文件。若从相邻的下拉列表框中 选择站点名称,使用该项将根据相应的模板更新所选站点中的所有页面。 ※ 更新:在该选项区中选择更新的对象,可以选中“库项目”或“模板”复选 框。 ※ 显示记录:选中该复选框,可以查看站点更新的文件记录。

  博鱼体育

  第五步:定义可编辑区和重复区 定义重复区:页眉和页脚我们在这里都定义为重复区。将光标指向页眉目, 然后选择菜单“插入”“模板对象” “重复区域”单击鼠标左键,这时会弹出

  (2)选择菜单“编辑”向下单击“首选参数” ,如图 20 在弹出的对话框 里将 “允许多个连续的空格”打上钩,否则你在 Dreamweaver 8 按空格键它是不 动的,呵呵,没有像在 Word 里那么顺手。如图 21

  14 “使用切合实际的简便的命名规则。 ——专家忠告 ” 15 检查错别字 好的拼写是人们一生中重要的技能。但是遗憾的是,许多设计者都缺少这种技 能。确保你拼写正确,并且格外注意平常容易误写的错别字。 16 避免长文本页面

  在一个站点上有许多只有文本的页面,是令人乏味的,且也浪费 Web 的潜力。 如果你有大量的基于文本的文档, 应当以 Adobe Acrobat 格式的文件形式来放置, 以便你的访问者能离线 不要使用卷滚条 人们厌恶在网上使用卷滚条。Trouble 网站()是一个典型的 设计很差的网站。它基于一个浮动的架构,为了阅读所有的文本,浏览者不得 不使用卷滚条。 18 专家最喜爱的 Web 设计工具 1.Adobe Photoshop 2.Macromedia Flash 3.Adobe Illustrator 4.Adobe ImageRead 5.Dreamweaver 6.Macromedia Fireworks 7. Allaire Homesites 8.Microsoft Notepad 9. Macromedia Director 10. Lightwave 11. Macromedia Freehand 12. 其它: Adobe Acrobat Exchange, Allaire ColdFusion, BBEdit, HTML Validator 等。 19 网站介绍 你应当有一个很清晰的网站介绍,告诉访问者你的网站能够提供些什么,以便 访问者能找到想要的东西。但是,许多设计者都没有这样做。有效的导航条和 搜索工具使人们很容易找到有用的信息,这对访问者很重要。告诉访问者你所 提供的正是他们想要的信息。 20 “网站一旦发布,网站设计的优点和缺陷全都公布于世。没有什么方法使你 能够比从自己的错误、倾听其他人的建议和用户反馈意见中学到更多的东西。 ” ——专家忠告

  图 17 选择站点文件夹 第五步:按提示连接用 FTP、并打上由服务商给你的 FTP 地址,用户名和密码, 并进行测试。如图 18

  图 18 填写 FTP 地址及用户名和密码 第六步:测试服务器,提示成功。如图 19

  至此,站点设置工作完成。如果出现错误,你要认真核对你的用户名、密码和 FTP 地址。

  九、制作模板 如果想让站点保持统一的风格或者站点中多个文档包含相同的内容。 ----对 其进行编辑, 未免过于麻烦, 中文版 Dreamweaver 8 提供的模板功能可以很方便 地帮助用户解决这些难题。 模板由两部分组成:锁定区域和可编辑区域。对于刚创建的模板,所有的 区域都是锁定的,在定义模板时,可以在模板文件中定义可编辑的区域。套用 该模板的页面,只有可编辑区域是可以被改变的区域。 实践证明,用模板对于网页制作者来说省了很多的麻烦,也可以节约很多 时间,同时也能减少连接上的错误。 一、新建模板 在新建模板前,我劝你还是要对你的网站要在纸上画一个草图,再根据你 的图纸来定你的模板,我简单画了一个,供参考,样式是你自己设置的,我在 这里只是举个例子。如图 14

  注:凡修改模板后,都要进行“页面更新”其方法如下:选择菜单“修改”“模板” “更新页面” 。

  03 优化内容 内容是核心。大约在两年以前,企业网站就像一本广告册子,更槽糕的是,网 站使用了大量的图片,似乎要几个世纪才能下载完。 Chanels 网站()在设计的某些方面是成功的,但是内容太贪 乏,并且要花很长时间才能找到所要的东西,因此不能算是一个成功的网站。 04 快速下载 没有什么比要花很长时间下载页面更槽糕的了。作为一条经验,一个标准的网 页应不大于 60K,通过 56K 调制解调器加载花 30 秒的时间。有的设计者说网页 加载应在 15 秒内。 05 网站升级 时刻注意网站的运行状况。性能很好的主机随着访问人数的增加,可能会运行 缓慢。但是,如果你不想失去访问者的话,一定要仔细计划好你的升级计划。 06 坚持基本原则 即使你不懂 HTML 语言, 你只需购买一个有版权的所见即所得的网页设计工具, 如 Adobe PageMill 或 Microsoft FrontPage Express,就可以创建一个看起来很合 理的网站。但是,在设计时,这些软件包虽然不需要 HTML,却使网站速度下 降。 为了成功地设计网站,你必须理解 HTML 是如何工作的。大多数的网站设 计者建议网络新手应从有关 HTML 的书中去寻找答案,用 Notepad 制作网页。 07 学习 HTML 用 HTML 设计网站,可以控制设计的整个过程。但是,如果你仅仅是网站设计 的新手,你应该寻找一个允许修改 HTML 的软件包。HomeSite4 是一个很好的 Web 设计工具。 在设计过程中, HomeSite4 能帮助你学习 HTML。 它还允许你切 换到所见即所得的模式,以便你在把网站发送到 Web 之前,预览你的网站。 08 用笔画一个网站的框架 圣人云:笔比剑更强大。在用计算机之前,用笔画一个网站的框架,显示出所 有网页的相互关系。计划好你的用户如何以最少的时间浏览你的网站。