网页设计心得

工具的使用:
Dreamweaver提供了许多方便网页设计的工具.
首先,对CSS的支持,可视化编辑,生成,链接CSS文件.
可以建立静态或动态站点,在文件面板可以对本站点的所有文件进行编辑.对某个文件改名或移动时支持自动更新链接引用这个文件的其他文件,以保持链接的可用性.(对以使用ASP#include命令引用文件等方式不支持自动更新,要小心).此外,对一些文件双击后用Dreamweaver或Fireworks打开很不方便,可以在编辑->首选参数中更改.
提供多种搜寻方式,比如使用对整个网站的源文件使用替换功能可以轻易地将特定的字符串(比如你想改造的网站文件里的logo)全部换成希望的文字.或者查找某个语句或函数出现的位置也很管用.
结果面板里的其他几项也很有用.目标浏览器栏中将设置改为只验证IE6.0,就可以发现一些致命的错误,双击结果项目可以转到错误处.当然误报情况也很多,可以对误报处点右键选择"忽略错误"以忽略同类错误,然后重新开始验证,就会忽略掉许多同类错误.反复多次可以通过验证.链接检查器非常有用,首先可以检查断掉的链接(即指向的文件不存在的超链接或图片链接等).还有可以检查外部链接,一般外部链接应该是在新页面打开(target=_blank),注意检查是否确定.最后可以列出孤立的文件,除了入口文件可能不被其他文件引用外,其他的文件都应该至少被一个文件引用,所以孤立文件是最后可以安全删除的垃圾.站点报告里的"无标题文件"报告对静态网站很有用,对动态网站用处就弱些.当然,结果面板的功能都多是在网站整体设计完成,进行最后调整时使用的.
使用Dreamweaver可以代码编写和可视化设计结合使用.它有代码补充功能,比如一个标签里打个空格就会列出属性,按回车选定,很方便.
它的代码参考功能也很好用,对于不明白的功能函数,在其上点右键,选择"参考",就可以自动查找这个函数或对象的相关资料.但是对VBScript 语言参考的支持很不好,我附带了一个.chm文件,讲VBScript 语言就非常详尽.


Fireworks处理图片还可以,有一点值得一提的是它选择导出gif格式图片时,可以很容易将某种索引色改为透明色输出,对于修改某些图片的背景为透明十分方便.




静态网站设计心得：
1.核心技术:
(1)使用table来控制布局,如位置,空隙等.
(2)静态网站主要是考验美工的水平,一个唯美的网站必然要有大量精美的图片和flash来支撑.对于链接按钮普遍使用图片,并且onmouseclick鼠标点击事件都是改变成另一张图片.仙剑系列的官网就是非常优秀的例子:
http://www.softstar.sh.cn/pal3
http://www.softstar.sh.cn/palp
http://www.softstar.sh.cn/pal4
(3)将控制样式的CSS代码与完成特定功能的脚本代码都分别保存为独立的文件,再在HTML文件中引入,从而可以清晰地划分了网页内容与其他的代码的界限.对于多个网页共用的代码最好也保存为独立的库文件,并在各个特定的页面中使用引用库项目来引入.
2.好的习惯与技巧
(1)使用dreamweaver设计和手写代码相结合的方法更有效率.初步设计用工具,细节修改可用代码.
(2)table的行宽是以所有行中最宽的那一行列的宽度来决定的.table的行宽或行高并不一定等同设定的数值,如果实际宽度或高度小于设定数值,则行宽或行高为此数值,否则按实际的宽度或高度显示(没有设定数值也会如此).
在table中是先定义行,后定义列的,而且默认各个行的列设置是一致的,所以当各行需要不同列数或列宽时就要采用嵌套table的方法.而且为避免不必要的麻烦,建议一个table中凡是没有相同列的行(包括只有一列)都应该是包含一个嵌套table.否则容易使布局出现意想不到的混乱.
(3)建立站点后dreamweaver会追踪站点文件,当在dreamweaver中对某文件改名后,凡是引用这个文件的文件都会被更新.如果总出现错误,可以尝试点击”站点-高级-重建站点缓存”.
(4)站点完成后应该首先利用dreamweaver提供的”结果-目标浏览器检查/连接检查器/站点报告”功能对站点进行语法,断掉的连接,以及孤立文件,有无”无标题”文件等的检查.其后还应实际浏览,检查所有连接是否连接到正确的网页等.
(5)对于作为内容的图象文件一般都应设置alt属性(包括个别的链接也可以设置title属性).对于外部连接一般都要target=”_blank”.




动态网站设计心得:
1.服务器问题:
对于没有联网(所以没有DSN解析)应该设置ip地址为(全部未分配),然后可以用http://localhost/或http://127.0.0.1访问.
一般对网站的应用程序设置栏里选择配置,打开"选项"卡,启用父路径.打开"调试"卡,启用ASP脚本调试.打开IE,打开Internet选项->"高级"卡,把"禁止脚本调试"和"显示友好HTTP错误消息"前的对勾去掉.这样可以及时显示错误的提示信息.
对网站的根目录文件夹点右键,选择"安全"卡,如果是XP系统,应该先在文件夹选项->查看中勾去"使用简单的共享控制"前的对勾,就可以看见"安全"卡了.选择"安全"卡,设置所有人对该文件夹的控制权限为完全控制.(可以解决数据库无法写入的问题)
对于windows 2003,默认是不使用ASP技术,所以先在IIS管理器->Web服务扩展中选择允许ASP,否则访问.asp类型文件时会出现找不到文件的错误.
2.核心技术和相关技巧:
(1)文件的独立.比如链接数据库的文件可以独立为conn.asp并广泛为其他文件所包含使用.还有就是不把功能代码独立出去,比如注册页面本身其实包含了注册页面(table+form)和处理功能两部分,使用访问文件的后决定,比如访问reg.asp?action=reg可能就是注册页面,而form会提交reg.asp?action=deal进行处理.很多都是把相对一套体系(包括显示,处理和结果提示等等)集成在一个文件中,其实也是加强了整体独立性.
(2)编写代码是一件很容易的事情,尤其是现在既成的代码很多.所以首先应该完成静态界面(将动态生成内容用文字代替)的设计是关键,然后将静态文本换成读取数据库即可.这时候再考虑诸多的限制即可,比如长度对界面显示效果的影响.
(3)由于验证是在服务器端进行,所以应该说外部提交(即不是从有效的站内链接进入)的数据不会造成实质性威胁.比如你在注册页面里要求用户名最长为12,并在<input>标签中设置了maxlenth=12.虽然别人可以绕过这些直接提交大于12的用户名,但由于你在处理注册的功能部分会在服务器端验证得到的用户名长度,所以不会有威胁.但是也不是所有的都会没有威胁,比如Email的长度也许你就不会再在服务器端进行检查(当然也很少有人费事去加长Email),这就会存在漏洞.因此可以采用跟踪来源页面的方法(Request.ServerVariables("HTTP_REFERER"))来验证.总之,对于修改数据库的核心功能部分一定要仔细考虑,全面验证,防止有漏洞.其他部分则无需验证(比如显示一下某某信息,由于非法操作出点错并没多有什么影响).
(4)多学习典型的作品,可以去网上看,源码也很多.很多流行的东西都是很经典的,比如使用cookies登陆,使用asp写CSS样式可以使用户自己选择喜欢的界面风格.
(5)对于输入数据库中的数据的各种限制都是在接收数据的网页里进行限制,而不在数据库中对其中的数据进行任何附加限制,这样可以保持数据格式的灵活性,并方便升级.