用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
一个网站不是这么简单就可以做好的.他涉及到很多知识.

用photoshop与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-...

ps切片后怎么用dw制作网页
小编这里用Photoshop CC和Dreamweaver CS6来做演示。首先我们打开ps软件。请点击输入图片描述 2 然后打开网页设计图,一般都是psd格式的,小编这里以简单的JPG格式代替了。请点击输入图片描述 3 然后点击左侧工具栏中的“切片”工具,就是那个小刀子形状的。请点击输入图片描述 之后在图片上切出想要做网页...

ps与dw之间如何进行有效的设计
使用切片工具 把你在photoshop排版的页面切成一块一块的然后在dreamweaver里排版即可。

网页设计最标准的尺寸是多少
2. 在1024*768分辨率的屏幕下,网页宽度应不超过1002像素。如果页面满屏显示,理想的高度应在612至615像素之间,这样可以防止水平滚动条和垂直滚动条的出现。在Dreamweaver(DW)中,有预设的标准值,1024*768的页面标准大小是955*600像素,按照这一尺寸进行设计即可。3. 使用Photoshop(PS)进行网页设计时...

如何用ps制作网站如何用ps制作网站链接
从零开始学习的话,我想可以这样:先学会使用工具DreamWeaver,打好html基础。做简单的静态网页。同时学习photoshop和imageready,熟悉图像处理。然后做漂亮的简单静态页面,将ps,imageready,dw综合起来应用。然后学asp,加入。就是漂亮的具有相当交互功能的页面啦:)然后就是美工的提高啦:)如何建一个人网站?

PHTOTSHOP中有关网页设计的知识
根本就是两类软件,只能配合使用。1、用PHOTOSHOP 处理图片,然后用DW调入 就这么简单。别用复杂了。

如何用Photoshop 制作网页?该从哪里入手呢?
【页面模块区域】知道了页面的结构和组成,就可以在页面的内容上入手了。内容的设计和制作有一定的规范,简单说,就是链接看上去可以点击,按钮看上去像个按钮,文本框看上去可以输入,保留默认控件的识别性和可用性(单选、复选,手机端通常为左右滑动式,PC端则常委纽扣式,这种是符合设备操作体验的变化...

你好 我是刚毕业的一名大专生 现在想做网站设计 想学习div css 但是...
一、你要学会dreamweaver、flash、fireworks\/photoshop软件,这是必须的,也是基础。首先要你懂得如何制作一个网页效果图,这个时候你要用fireworks\/photoshop来进行整个网站效果的设计,把你的构想全部加在这个效果图里面,设计好后,觉得可以做成网页了,用切片工具将网站切出形成图片,但你最好把其中的元素导...

如何使用PSD做网页
在PHOTOSHOP里面打开PSD 然后用“切片”工具进行切片,比如说有一些地方你想做成按钮的,就把它切成单独的一块~~~然后“另存为”,在对话框的下方可以选择保存的属性的,就选保存“图片及HTML”,然后就会输出一个网页啦。在DW或者FP等网页编辑器里面可以直接编辑那个网页啦~~大体就是这样~~

制作网站
f.网页的css规范 g.网页标题 四、网站的设计制作 1.整体形象设计 在程序员进行详细设计的同时,网页设计师开始设计网站的整体形象和首页。 整体形象设计包括标准字,Logo,标准色彩,广告语等。 首页设计包括版面,色彩,图像,动态效果,图标等风格设计,也包括banner,菜单,标题,版权等模块设计。首页一般设计1-3个不同...

相似回答