浅谈dreamweaver网页制作技巧及常见问题处理方法

天津国土资源和房屋职业学院 马 莉

浅谈dreamweaver网页制作技巧及常见问题处理方法

天津国土资源和房屋职业学院 马 莉

在计算机各项网络技术中,网页制作是必学的一项入门级技术,Dreamweaver软件支持多脚本的语言,也是初学计算机技术者或者是网站开发工作者必选的一种软件,但同时它也是带给初级入门者很多困惑的一个软件.使用Dreamweaver进行网页制作时,有很多应用技巧的应用能达到事半功倍的效果,但也有很多易犯的错误容易被忽视.本文就对Dreamweaver网页制作技巧和解决这些问题的方法进行探析,旨在为后续学习者提供参考借鉴.

Dreamweaver;网页制作;技巧;问题;处理方法

Dreamweaver是一款网页编辑器,深受网页制作者与学习者的青睐.但是该软件却易学难用,实际使用时有很多情况下会让使用者一筹莫展,这是因为Dreamweaver对细节与规范要求非常高,如果学习者粗心,制作较为随意,就会发生一些意想不到的错误,使得于调试时很难下手.其实通过一些技巧的应用,有很多问题便会迎刃而解,而且如果能恰当应用制作技巧,还能实现对页面的细节优化.下文就对这些常见问题与技巧方法做整理、总结.

一、网页制作前的整体准备

(一)确定主题.网页主题的确定范围应该小,而且应表达直接、准确,应根据用户需求确定网页的主题,应依照浏览者的意愿进行定位,使网页能够满足用户需求.

(二)风格确定.网页的创意与风格是较难把握的两个内容,创意的独特性和风格的迥异能展现出网页的整体品质,对网站的发展有着巨大的影响力.网页的创意多是来源于生活的积累,关键在于设计的用心.

(三)整体规划.一个高质量的网页设计,其规划是需要完整的,栏目、板块与导航栏等应做到清晰、明确.栏目的安排要紧扣主题;目录和链接的结构要安排妥当,目录层次不宜过多,一般控制在3层以内,链接可一对一、一对多两种形式混用.

(四)上传测试.网页制作完成后要申请主页进行上传的工作,可选择Dreamweaver自身的FTP功能作为上传工具,上传后做测试的工作,一旦发现问题要及时更正.

(五)维护管理.网页内容需不断的更新来提高访问量,并定期做维护检测的工作来提高工作效率.如果网页内容一成不变,久而久之会失去大量的浏览者.

二、网页制作技巧及问题的处理方法

(一)"#"空链接页面置顶问题解决技巧

空链接是指:仅有链接形式但是没有链接对象的这种链接.在空链接中,所链接的目标URL通常情况下是以"#"进行表示的.但是如果是在浏览器上查看网页,当单击了这一形式的空链接,那么它便会自动的将当前页面重置到网页的顶端去,而这也会严重影响到用户正常使用.

若在进行空链接的设置时,使用代码"javascript:void(null)"来替代原有的"#",便可以有效解决这一问题.

(二)解决Flash背景颜色问题的技巧

Flash工具具有强大的动画编辑功能,界面简洁、功能强大,能够实现把动画、音效等完美的融合在一起,是动画设计初学者和网页制作人员的首选.将Flash插入到网页中,能使页面更为鲜活、生动.虽然Flash在当今有着广泛的应用,但是该软件也有一些操作技巧需要灵活运用,例如,如果想要插入的Flash动画,其背景颜色会对网页背景有一定遮挡,如何解决Flash背景色,使之变成透明色?

解决技巧:在网页插入Flash后,在选定的基础上,点击【参数】按钮,在弹出的退化框中输入"wmode",【值】下输入"transparent",之后选择【确定】.这样就可以使网页中的Flash文件变为透明.

(三)解决空格输入的技巧方法

在Dreamweaver中输入空格的这一问题已经是一个很普遍发生的问题,各种介绍、问题讲述都涉及到这一内容.

在Dreamweaver中,对空格输入有"全角"文字状态下的这一要求,而很多操作者在进行网页制作时往往会忽略掉这一细节之处,在半角模式下就进行输入,因此出现问题.另外也可以通过其它一些技巧来进行空格的录入,比如:直接于源代码中加入代表着空格的" "这一HTML代码.

(四)处理路径错误问题的技巧方法

路径是相关元素和网页之间架构的重要桥梁,一旦路径错误,那么会导致网页不能正常浏览,出现异常.在使用Dreamweaver做网页设计时,普遍发生的路径错误问题便是图片链接错误,而这一直接后果便是导致浏览器不能显示出图片.发生该问题的诱因可能为:

第一,如果浏览器页面呈空白状,而且没有任何对话框提示,应查看图片名称,首先应排除图片名称是否命名为汉字,其次应该确定图片格式是否存在问题,Dreamweaver所插入的图片要求必须是JPG模式的.

第二,若浏览器有提示"小红叉",那么应该检查图片的路径,正确的路径设置是"/images/solar.jpg",代表是父级目录images下的solar.jpg图片.而错误的路径是"file:///e:Documents/solar.jpg",它是代表为E盘Document下的solar.jpg图片,代表图片没有在站点的文件夹中.而解决的方法便是把图片相应的移动到站点文件夹中去.

(五)解决表格混乱问题的方法

表格可以说是一个又快捷、但是又难以调试的布局方式,这是因为表格方便、简单,很容易学会,但是却不容易掌握,会常发生混乱、错位的问题.有一些初学者习惯使用单一表格的方法来给整个网页的页面进行布局,这种方法不仅不规范,而且很容易导致错误发生.这是因为表格每一个单元格之间都是存在密切的相关性的,在反复将其拆分、合并之后,很难记住到底是哪一个单元格设置了什么样的宽度,哪一个单元格又会对其它布局内容带来影响,诸如此类,问题便会接连出现.

正确的解决方法是:尽可能使用多个表格来做布局,尽量减少每个表格之间存在的关联度,对较为复杂的内容栏目来说,应该做合理的嵌套,每一个不同的栏目都要相应使用一个独立的表格.同时,注意不能随便的挪动表格,切忌随意更改单元格的高度与宽度.网页的布局是一项细致性要求非常高的内容,无论是哪一个栏目的高度与宽度,都必须要提前进行测量,之后再做相应的设置,避免出错.

(六)处理页面分辨率的方法

在进行网页设计时,有很多时候都会发生这样的情况:在本地电脑上页面显示是正常的,但是一旦换了台电脑,网页的界面就会或变宽、或变窄,不仅不具美感,而且会影响到用户浏览.而针对这一问题,关键原因在于网页分辨率的设置是不统一的,而解决的技巧为:于Dreamweaver文档窗口的右下角,点击选择分辨率的大小,确定适宜尺寸,于弹出的菜单中,选中当前页面指定的分辨率,之后便可以实现在不同电脑浏览下网页都会统一了.

(七)图文混排问题的处理方法

Dreamweaver网页设计中,图文混排的问题是通常会发生的,主要表现为:图片和文字堆积在一起,排版时由于错位而无法对齐.比如说在栏目条中的一个单元格中,标题与小图标共存,文字与图标无法相互对应.对于这一问题的解决技巧,便是确定图片为居中属性,并做图片左、右边距的调整.

(八)不同版本的Dreamweaver界面及功能的不同

目前,市面上所使用的Dreamweaver版本繁多,在使用过程中究竟应该选择哪个版本比较好,对于初学者来说大家都会有这样的问题.从最早的Dreamweaver1.0到目前的Dreamweaver CC每个版本各有优缺点;当然大部分情况下,新版本是在老版本的基础上做了一定的修改及提升.就软件的稳定性而言,Dreamweaver8.0界面简洁,比cs版占用系统资源低得多;功能比较全,虽然相对来说软件版本较老,但适于初学者的使用.另外,CS4之前的版本,大多适应表格框架的网页,所对应的语言是html4;CS4开始,提高了对于层和CSS控制的支持.无论使用哪一种软件版本,最终所实现的目标都是相同的,只要能完成预期网页的制作就可以,所以大家在选择时,应该更加注重自己在使用过程中的使用习惯及使用技巧的熟练度.选择自己能够得心应手的工具软件.

三、结束语

Dreamweaver是很多网页制作者在网页制作时的首选软件,具有简单、实用的优点,而针对其中容易忽略、常发生的一些问题,应当使用合适的技巧,不仅可以节约制作时间,而且还能提高网页制作的质量.当然,网页制作的学习也是一个漫长的过程,而Dreamweaver网页制作技巧和出现的问题不止是上文中提到的这几点,还有很多有待于做出深入的总结与研究.

[1]韩媛媛.浅谈Dreamweaver在网页设计中的应用[J].信息与电脑,2016,35(7):57-58.

[2]王艳.Dreamweaver网页制作技巧与问题处理[J].电脑编程技巧与维护,2016,22(19):70-72.

[3]樊小春.16条Dreamweaver网页制作的操作技巧[J].计算机与网络,2014,24(21):36-37.

[4]李远华.任务驱动法在Dreamweaver网页制作课程中的实践与研究[J].现代职业教育,2016,18(23):286.