用photoshop与DW配合做网页,怎样做比较规范

我是在校大学生,以前跟别人合作给学校做过网页
但我觉得我们的网页制作不够规范
想知道做网页的规范流程

我们以前通常是Photoshop做出一张图,然后切片导出成HTML,再放到DW
里改一下,加一些ASP代码(ASP程序也是网上找的模板)

但感觉这样做不够规范,ps导出的html不能是表套表那种,有人说不应该用ps导出html,而是直接在DW里布局
各位有经验大侠请指教到底怎样做才对

1.下载安装Dreamweaver cs5和photoshop cs5,安装好后打开photoshop。

2.设计准备1--新建图像。

 

3.新建图像     1400*3000

分辨率       72

颜色模式     RGB

背景内容     白色

4.快捷键:

Ctrl+N            新建图像    Ctrl+(+/-)       缩放画布

Shift+Ctrl+S   存储图像      Ctrl+S            保存操作


5.设计准备2--新建参考线

垂直参考线1   200px

垂直参考线2   1200px

操作完成后,出现2条垂直的蓝色参考线,参考线中间区域为1000px(设置参考线主要考虑到页面设计的主内容的大小),效果如下:

6.经典设计布局分配一般包括头部,导航,焦点图,主要内容,底部5部分。

7.设计准备3--设计图层的规范

基于经典设计,在图层面板里添加5个文件夹,分别命名是:头部,导航,焦点图,主要内容,底部。

设计准备完成。

8.打开Dreamweaver cs5,进行页面准备。

9.页面准备1

1 )新建站点所在文件夹,在D盘根目录下新建文件夹ind0605。

2 )在ind0605中再新建css、images、js等3个文件夹  。

3 )回到Dreamweaver中,在左上角有个文件菜单,点击新建,新建ind.html  。

4) 用同样地方式,新建style.css文件,然后存储到css文件夹中。

5) 选择本地站点文件夹为D盘新建的ind0605文件夹,站点名称为ind0605。

10.页面准备2-html布局

1 打开html文件,在代码<head></head>之间输入

<link rel="stylesheet" type="text/css" href="css/style.css"/>

2 根据经典布局,书写5大模块div

代码效果如下:

11.DW代码准备完成。

温馨提示:内容为网友见解,仅供参考
第1个回答  2008-11-18
你那样做只是很粗糙的做法,网站表面看起干净好看!但要是对于内容复杂的网站就不行了。
我建议你用photoshop制作图片,图片美化,切片的时候不要套出web格式,直接套出切片,然后在dw中布局生成网页!本回答被提问者采纳
第2个回答  2008-11-26
想要标准就看w3c.
学DIV+CSS.
第3个回答  2008-11-26
一个网站不是这么简单就可以做好的.他涉及到很多知识.
相似回答