超级会员免费看
网页图像处理与设计全攻略
1. 提取 Photoshop 网页原型
在网页设计中，借助 Photoshop 设计原型是常见做法。设计师能利用其熟悉的工具，快速制作包含文本、颜色和图像规格的页面设计，如导航栏按钮、公司标志和插入照片等，为潜在客户展示美观的页面。然而，这些原型只是图像，并非真正的网页。
Dreamweaver CC 2014 的 Extract 功能解决了这一问题。通过以下步骤，可将 Photoshop 原型的资产和规格提取到 Dreamweaver 中：
1. 切换到 Extract 工作区（Window→Workspace Layout→Extract），Extract 面板会出现在页面左侧。
2. 点击面板上的 Upload PSD 按钮上传 Photoshop 原型文件，上传后会在面板中显示缩略图。
3. 点击缩略图可查看全尺寸原型。指向元素时，会显示该元素的规格，如指向图像显示其尺寸，指向文本块显示字体、字号和颜色等。
4. 点击弹出面板顶部的按钮，可轻松复制标题和段落中的文本。若需要类型规格，点击 Copy CSS 并将规则粘贴到 CSS 样式表中。
5. 若页面上有需要的照片或其他图像，点击弹出面板右端的 Extract Asset 按钮下载。可通过点击元素或按 Photoshop 图层选择元素。
2. 使用图像映射
图像映射可将单个图像添加多个链接。例如，公司在全国各地有办公室，可使用美国地图，将每个州的轮廓变为热点，链接到该州办公室列表页面。
创建图像映射的步骤如下：
1. 选择要制作图像映射的图形，在完全展开的属性面板左下角会显示图像映射工具（
订阅专栏 解锁全文
扫一扫
50
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
