星空体育官网登录入口

随着信息技术的发展, 网页制作成为时下互联网平台中人与人交流不可或缺的宠儿, 但是要完成网页设计作品就少不了其他软件的支持, 如Flash动画制作, Fireworks图像处理, Photoshop图片制作及处理等。如何结合Photoshop来设计出有自己风格的页面是本文所要研究的课题。
一、Photoshop和Dreamweaver的简单介绍
1.Photoshop的简介
Photoshop是一款由美国发布的用来处理图像、图形的软件, 简称PS。它不仅可以处理出你所需要的图片, 还可以根据自己的要求动手绘画出自己喜欢的图像、图形, 比如画笔工具、钢笔工具以及图形工具, 用鼠标单击选中, 在自己新建的画布上描绘出你喜欢的图像, 然后选择相配的颜色, 注意色彩要均衡, 单击“油漆桶工具”或选择菜单栏中“编辑|填充”命令即可, 这样, 简单的一幅画作就完成了, 最后你可以根据自己对图像的需要进行图层样式的选择, 单击菜单栏中“图层|图层样式”命令选择需要的选项就可以了。
2.Dreamweaver的简介
Dreamweaver简称Dw, 是一款集网页制作和网站管理于一身的网页编辑器, 也是人与人之间一种视觉的交流方式。一份精美的网页中包含的元素众多, 包括图像、图形、文字、动画等, 将这些元素进行规范的排版与合理的布局, 就需要用Dw中的CSS样式、表格制作等众多功能来辅助完成。需要提及的是Dw中的编辑基本上都是靠代码来完成的。
二、Dw中网页布局和实例制作
1.Dw中的页面布局原则
(1) 色彩要搭配恰当, 网页在颜色搭配上要遵从以下几点:渲染主题深色调, 突出氛围浅色调, 简约大方白色调, 对比鲜明黑色调, 端庄奢华紫色调, 浪漫婉约粉色调。
(2) 元素要相得益彰, 有些网站页面元素很多, 尤以图片文字为首。文字过多会让人觉得乏味无趣, 图片过多又会觉得低俗, 为了防止视觉疲累, 应该将图片和文字适当搭配。
(3) 图片要处理合理, 在页面布局中很多图片都不符合要求, 有些色彩过于鲜艳, 有些像素过低模糊不清, 有些只需要一部分图片。针对这些问题, 我们都可以用PS轻松处理。
2.实例制作
(1) 打开Dw软件, 选择新建栏目下的“HTML”模板, 进入后选择“管理站点|站点|新建站点”, 名称为“梦回唐朝”且保存在“E:/myweb”的根文件夹下。注意文件命名时要采用字母或数字, 以便各网页之间进行有效的链接。
(2) 处理需要的图片和文字存入“myweb/images”文件夹中, 图片处理使用PS软件, 主要处理图片的大小、色彩及像素值。比如网页的logo图片、导航条、锚点图标、分割图形等都可根据需要处理。在这里先介绍该网站主页的logo图片的制作合成, 首先打开PS软件, 新建立一个30×25cm的画布, 然后分别打开一幅扇子图片和一幅背景图片, 可单击工具栏中的“快速选择工具”将扇面抠下;处理背景图很简单, 只需要用裁剪工具裁出中间的部分。最后返回新建的画布, 将扇面和背景图分别放入两个图层中, 再处理文字“梦回唐朝”, 主要是用图层样式, 这里不再详细说明。需要注意的是图片格式须保存为网页一般格式“.jpg”“.png”或“.gif”, 以便浏览器快速下载。
(3) 插入所需表格, 将已经处理好的图片、文字、图标、导航条等进行规范合理的布局排版, 然后调整表格的长度和宽度。
(4) 保存之后根据浏览器的预览效果进行完善调整页面。
三、利用PS为网页布局
在Dw中布局页面会有些耗时, 既要代码输入, 又要调整表格搭配、背景颜色, 相比较而言, 在PS中将页面布局完成, 然后将其插入网页设计中更简单有效, 而且可以事先搭配好颜色。
1.PS布局原则
(1) 色彩搭配要清新亮丽, 选用一个主色调, 其他颜色选用不可与主色反差太大, 以防造成视觉错乱。
(2) 布局应合理规范, 不可随心布置, 让人看起来不舒服, 要疏密有度, 和谐统一。
(3) 突出主题, 对比鲜明, 不可让无关紧要的文字或图片占用大量篇幅, 以至于忽略了主题, 应将重要信息呈现在视觉的中心, 让人一看简单明了。
2.实例操作
(1) 打开PS并新建一个1024×768像素的画布, 文件名为“主题相册”, 颜色为白色, 分辨率为72像素\英寸。
(2) 利用图形工具描绘出所需要的页面效果图, 单击菜单栏中的“图层|图层样式”选择合适的样式, 让图像看起来有立体的效果或其他效果。
(3) 保存图片为“.jpg”格式, 以便观察其效果。
(4) 为了保证图片在网页设计中更好地适用于表格, 可以单击菜单栏中“视图|锁定切片”命令, 将图片切割成符合网页的logo、导航等多个小块进行保存, 保存时使用“存储为web形式”, 以便浏览器更快地下载。注意切割时应准确, 使页面效果更佳且易在网页设计中进行布局和表格处理。
(5) 在Dw中新建站点, 插入表格后将已保存的图片导入页面中, 设为背景图片, 然后完善调整页面。
(6) 在这个基础上可以加入自己喜欢的图片, 完成后保存并在浏览器中预览。