详谈illustrator首选项设置
2009-09-29 02:44
详谈Illustrator CS3首选项之一(常规、选择和锚点显示、文字)
对于使用Adobe软件来说,“首选项”是不能不了解的,它用来存储用户设定的参数。了解它对我们更好的使用软件会起到帮助。
以下以Illustrator CS3版本来介绍,相对之前的版本有些变化就不一一注明。
首先是“常规”对话框:
键盘增量——用来设定我们在使用键盘上的方向键进行移动操作的时候,被移动对象在每一次按键时候所移动的距离。很多时候我们都需要使用键盘来精确移动对象,这个数值应根据我们需要的移动量灵活设置,可是使用像px、mm、inch等单位。
约束角度——一般保持为0,这个选项会影响到页面的坐标,比如你设置为20°,那画出来的任何图形都会倾斜20°。
圆角半径——这个数值会影响到我们在绘制“圆角矩形”的圆角半径,当然在Illustrator中还有几个地方可以设定圆角半径(例如:选中“圆角矩形工具”在画板上单击会弹出相应设置对话框,其中的圆角半径和这个是一个意思)。
停用自动添加/删除——不选,在使用“钢笔工具”的时候,鼠标移动到路径锚点上,钢笔工具会自动转换成增加或删除节点工具。选中,则不会自动转换。
双击以隔离——这个是CS3新增的一个选项,关系到“隔离模式”,此模式也为CS3新增功能。(隔离模式可隔离组或子图层,以便您能够轻松选择和编辑特定对象或对象的部分。当使用隔离模式时,您无需担心对象所在的图层,也无需手动锁定或隐藏不希望受到您所做编辑影响的对象,Illustrator 将自动锁定所有其他对象,以便只有隔离组中的对象会受到所做编辑的影响。)
使用精确光标——这个选项在实际操作中,并不会造成什么影响,因为我们可以使用Caps Lock键在精确和工具形状之间转换。
使用日式裁剪标记——顾名思义,产生日式的裁剪标记。
显示工具提示——无所谓的选项,鼠标在工具上悬停时候会显示该工具名称及快捷键。
变换图案拼贴——如果你的图形填充了图案,勾上它在你旋转、缩放、倾斜该图形时候,里面填充的图案会随着变化。这个在“变换”调板的下拉菜单
中有更好的选项。
消除锯齿图稿——不用解释什么,勾上。你可以画个图来观看勾与不勾的不同之处。
缩放描边和效果——这个和“变换图案拼贴”意思差不多,在“变换”调板的下拉菜单中也有它。
选择相同颜色百分比——这个一般来说很多人都不明白他的意思,例如:我们用一个50%PANTONE黄色(专色)来填充一个对象并保持它是选中状态,勾上它然后单击“控制”面板中的“选择类似的对象”按钮那个下拉箭头,选择“填充颜色”的时候,只会选中用该颜色50%色调填充的对象,不勾的话将选中所有这个颜色填充的对象。
使用预览边界——选中它,当物体被选中时候边界框就显示出来。需要主意的是,例如:给一个图形施加了“投影”效果,勾上它的时候边界内会包含投影效果,反之亦然,这个时候施加的效果产生的尺寸变化也会计算在内(如投影、描边)。
打开旧版文件时追加[转换]——打开Illustrator CS3之前版本的Illustrator文件时候,自动在文件名上添加上“[转换]”。
重置所有警告对话框——将Illustrator中的警告说明重置为默认设置,这个不解释。
二是“选择和锚点显示”对话框:
此对话框为CS3新增。
容差——指定用于选择锚点的像素范围。较大的值会增加锚点周围区域(可通过单击将其选定)的宽度。这个数值越大越好选,但是在锚点密集的时候数值过大就不好办了。
仅按路径选择对象——如果你勾上这个选项,那只能点上图形的路径才能将其选中,一般我们是不勾它的,只会增加选择对象时候的难度。
对齐点——将对象对齐到锚点和参考线。指定在对齐时对象与锚点或参考线之间的距离,不解释。
锚点和手柄显示——这个一看就应该明白,根据个人喜好来选择吧。
鼠标移过时突出显示锚点——突出显示位于鼠标光标正下方的锚点。
三是“文字”对话框:
大小/行距、字距调整、基线偏移——这里设定的是在使用快捷键更改文字时候的递增值。
仅按路径选择文字——这个和“仅按路径选择对象”是同一个意思。
显示亚洲文字选项——针对CJK文字,我们用中文这个当然得选上,否则在“字符调板”中就不会显示和亚洲文字相关的选项。
以英文显示字体名称——勾上所有的字体名称都用英文来显示,例如:“方正美黑”就会显示成FZMeiHei-M07之类的。
最近使用的字体数目——这个根据自己习惯来设定,为我们提供方便的。字体预览——字体预览时候的大小。
启用缺失字形保护——防止键入当前字体不支持的字符,及防止在字体不包含一个或多个所选字形的情况下将该字体应用到所选文本。
对于非拉丁文本使用内联输入——将双字节文本直接输入到文本框。
详谈Illustrator CS3首选项之二(单位和显示性能、参考线和网格、智能参考线和切片)
接着之一,四是“单位和显示性能”对话框
这个感觉不用多说,不过还是得说
常规——虽然都是单位,但是“常规”的单位体现在哪呢?“常规”度量选项会影响标尺度量点之间的距离、移动和变换对象、设置网格和参考线间距以及创建形状,还有新建文档时候的默认尺寸单位。
描边——当然是“描边”宽度的单位了。
文字——文字的度量单位。
亚洲文字——选择适合亚洲文字的度量单位。
当常规为“派卡”的时候,那个灰色的选框才被激活。混合派卡和点时,您可以输入如XpY的值,其中X和Y是派卡和点的数量(例如 12p6 为 12 派
卡、6 点)。
对象识别依据——“变量”面板显示动态对象在“图层”面板中显示的名称。如果以 SVG 格式存储模板以供其他 Adobe 产品使用,那么这些对象的名称必须遵循 XML 的命名规则。例如,XML 的名称必须以字母、下划线或冒号开始,并且不能包含空格。
显示性能——不多说了吧。
五是“参考线和网格”对话框
就说重点吧网格线间隔——数值决定每隔多少距离生成一条坐标线。
次分隔线——设定坐标线之间再分隔的数量。
网格置后——当然是将网格放在文件最后面了。
六是“智能参考线和切片”对话框
智能参考线快捷键“ctrl+u”,满优秀的一个功能。
文本标签提示——选中,会显示光标所在位置对齐方式的信息。
变换工具——缩放、旋转和做镜像的时候,可以得到相对与操作的基准点的参考信息。
结构参考线——选中时候,使用智能参考线,页面窗口中会用直线作为参考线帮助用户确定位置。
对象突出显示——勾上时候,光标在围绕对象移动的时候,高亮显示光标下的物体。
角度——这个根据自己实际需要灵活变化。
对齐容差——图形在靠近参考线的时候如果小于设定的数值,则自动吸附。显示切片编号——就是显示切片的编号了。。
线条颜色——就是切片线条的颜色了。
智能参考线这块,解释起来貌似很复杂。不过不用想太多,我们不需对它的设置做过多研究。
之二先到这里。
详谈Illustrator CS3首选项之三(连字、增效工具和暂存盘、用户界面、文字处理与剪贴板、黑色外观)
之三了,剩下这些我就不分太细了,挑重点的来解释。
连字基本上和我们中文用户关系不大,因为只针对西文,当然进行西文处理的时候他就变的有用了。
增效工具和暂存盘——一般情况下增效工具都是放置在安装软件时候默认创建的地方,如果在别的地方你还有需要使用的增效工具,可以不用复制过来,只要勾上选项,然后找到你存放增效工具的文件夹位置即可。
暂存盘——默认是C盘,当然我不建议放在C盘,这样会影响系统效率,在C盘之外选一个你硬盘分区中剩余量充足的分区。如果你地方很多那就把次要也设置一个。
用户界面不解释。
Version Cue——可以解释成一个整合应用,与他协作时候会很好用,可以对设计管理整合到现存的工作流程中,横跨Adobe Creative Suite所有的程
序。
自己用软件时候勾它没什么意义。
退出时,剪切板内容的复制方式——“复制为”选项决定剪贴板中内容的格式,PDF就是复制为PDF格式。AICB就是AICB格式(不支持透明度)。
精确显示所有黑色——将纯CMYK 黑显示为深灰。本设置允许您查看单色黑和多色黑之间的差异。
将所有黑色显示为多色黑——将纯 CMYK 黑显示为墨黑 (RGB=000)。此设置使纯黑和复色黑在屏幕上的显示效果一样。
精确输出所有黑色——如果打印到非 PostScript 桌面打印机或者导出为RGB 文件格式,则使用文档中的颜色数输出纯 CMYK 黑。本设置允许您查看单色黑和多色黑之间的差异。
将所有黑色输出为多色黑——如果打印到非 PostScript 桌面打印机打印
或者导出为 RGB 文件格式,则以墨黑 (RGB=000) 输出纯 CMYK 黑。本设置确保单色黑和多色黑的显示相同。
到此结束了,对于一款强大的软件,它的每一个地方都不能忽视,希望以上对Illustrator CS3首选项内容的相关解释让你有所收获。
如何用Photoshop进行切图 一、基本概念 1,切图,是一种网页制作技术,它是将美工效果图转换为页面效果图的重要技术。Photoshop、Fireworks 等软件提供了切图技术,切图后可以直接导出为网页格式。 2,切片,是切图的直接结果,切图实际上就将图切分为一系列的切片。 二、切图操作过程 1,切图工具图标的识别 2,切图基本操作(最好是先拉出参考线) 1)基本操作有两个:划分切片和编辑切片。 划分切片,是使用切片工具,在原图上进行切分的操作。
编辑切片,是对切分好的切片进行编辑的操作,编辑包括对切片的名称、尺寸等的修改等等下面我们看一下这两个操作 2)基本操作
如果想移动某个切片,可以使用“切片选择工具”选择某个切片,并用鼠标进行拖动,也可以使用实现,另外如果想精确的细微移动,则可以使用实现 如果想将某个切片存为某个图片输出,可以使用“切片选择工具”选择某个切片,然后选择“文件”菜单,并选择“存储为Web所用格式(W)...”,然后在弹出的界面中...
3,切图技巧
1)一张图,可以有多种切分方式,如下: 既然存在n多种切图方式,那么是不是哪种方式都可以满足要求? 答案:不是的。 一般对页面的要求是,当页面大小发生变化时,页面的各部分可以相对自由地伸缩,而不会使页面发生错乱或变形等问题。 我们切分好的图是要输出为Html格式的网页文件的,然后通过网页编辑器,将该页面进行加工,做成符合要求(例如可以根据内容多少,自由伸缩等)的模板页面。这其中,切图的方式直接影响着模板页面是否能够满足实际的要求。 我们来看一个例子:
PSD网页切图制作HTML教程 把psd页面利用div+css切割成html页面 首先看看效果 下面的图片就是效果图,切割出来后,可能头部和底部会宽点..... 新建文件夹 开始时,在您的计算机中创建一个文件夹。我把它命名为zmool。再在文件夹中创建新文件夹images,放网站的所有图像。接下来打开代码编辑器(Dreamweaver),并在根目录下创建一个HTML文件名为index.html,这是我们的主页模板。现在创建一个新的CSS文件,并将其命名为style.css文件。如下图:
打开index.html文件。在head标签顶部,添加链接到您的样式表(style.css)。你可以使用下面的代码。 头部的代码如下面:
sketchup中的小技巧 用了很长时间的sketchuo,总结了一些技巧,希望能和大家分享,共同进步,同时也希望高手们都来指导、补充一下。 1、选择的时候,双击一个单独的面可以同时选中这个面和组成这个面的线 2、双击物体上的一个面,可以选择整个物体的面和线 3、使用漫游命令和相机命令的时候,可以在右下角的输入框里面输入视线的高度 4、使用动态缩放命令的时候,可以输入数字+deg(例:60deg)来调整相机视角 5、使用动态缩放命令的时候,可以输入数字+mm(例:35mm)来调整相机焦距 6、把物体做成组群或者组件,可以在右键菜单里面的沿轴镜相里面选择镜相方式 7、选择物体,用比例缩放命令,选择缩放方向以后输入-1,可以镜相物体 1,利用推拉命令一次,下次运用推拉命令时双击可重复上次的尺寸 2,选择物体时按住ctrl可以增加选择,按住shift可以加减选择,同时按住ctrl和shift为减选择3,shift+鼠标中键为pan功能 4,当锁定一个方向时(如平行,极轴等)按住shift可保持这个锁定 在选择工具状态下按住ctrl、shift以及同时按住ctrl和shift可以改变选择集,请看下面的贴图,应该可以理解了吧。。。。。 不知道为什么不能抓图,每次抓的图上都没有鼠标,只能用数码相机拍了,晚上效果比较差,将就着看:) 选择状态下单击物体是选线或面双击是线和面而三击可以选体 选择物体后按住CTRL 用移动复制命令可以直接复制物体而如果该物体已经做成组的话 复制出来的物体依然在同一组里 使用橡皮檫只能删除线而不能删除面所以如果要删除一个面上杂乱的线要比框选物体后用DEL命令方便 初学者的一点小心得大虾们见笑了 滚轮+左键全按是pan哦. 注意先按滚轮,在按左键。 在移动后输入x/ 的数值时,如输入5/则两物体之间出现4个物体,如输入4/则两物体之间出现3个物体,阵列好象也一样啊!!!! 我们一个在做一个城市规划的项目,想建立一个体块模型,由于文件量很大,分成多个部分,大家同时建模完成。cad是由统一的原点导入的,但是,建好以后,用import命令将不同部分拼起来的时候,为何插入得有些体块只有?.. 在导出时有一个选项(options,在save/cancel键下方),进入其中并选择边线(edges)和面(faces),导出后就线和面都有了 我看教学上的是直接用拉伸工具就能直接连动牵引着图形出来,我觉得兰色图形中间的是用偏移工具做出来的,但是我只能拉出中间的图形,而没有牵引的感觉??!!
ArcGIS 制图工具、方法和技巧
Esri中国(北京)有限公司 行业技术部 徐丽丽
分享地理价值
PDF 文件使用 "pdfFactory Pro" 试用版本创建 https://www.doczj.com/doc/2e16865686.html,
定义
地图就是依据一定的数学法则,使用制图语 言,通过制图综合,在一定的载体上,表达 地球(或其他天体)上各种事物的空间分布、 联系及时间中的发展变化状态的图。 地图 ≠ 专题图 专题图 = 地图 + 主题 专题图 = 地图 + 特效 + 适度夸张
分享地理价值
PDF 文件使用 "pdfFactory Pro" 试用版本创建 https://www.doczj.com/doc/2e16865686.html,
制图的一般工艺
数据模型 制图规范
数据处理
符号化 制图规则 企业级工作流管理
制图编辑
输出产品
单一应用 VS 多种应用
数据综合 质量控制 ETL
数据驱动制图 高级符号 VS 复杂数据 智能标注
冲突检查 冲突处理 灵活性 & 自动化
产品类型
分享地理价值
PDF 文件使用 "pdfFactory Pro" 试用版本创建 https://www.doczj.com/doc/2e16865686.html,
大纲
? 一、ArcGIS 制图基础
– – – – ETL(综合、提中心线、平滑……) 制图表达 Model(生成坡度、坡向图) MapLex
?
二、基本效果
– – – 按属性分类显示 按大小显示 统计图表显示
?
三、特效入门
– – – 让你的图“立”起来 ——更好的使用您的DEM 让你的图“炫”起来 ——活学活用渐变效果 让你的成果“动”起来 ——多源数据组织与出图的常见问题
?
四、美图欣赏
分享地理价值
PDF 文件使用 "pdfFactory Pro" 试用版本创建 https://www.doczj.com/doc/2e16865686.html,
网页编辑图片处理技巧[1] 如何切图-保存为html 概括: 【视图】菜单显示标尺——使用参考线(凭经验和需要)分割图片——基于参考线切片——合并或增加切片——保存web形式——设置质量,可以设置单个切片图片的属性——保存“html和图像”,或者其他。 图文演示: 一、标尺 ——标尺可以用快捷键,ctrl+r 显示和隐藏标尺; 二、参考线 (1)可以直接从边缘的标尺用工具拖移出水平或者垂直的参考线。 按住ctrl可以把水平变成垂直,或相反。 (2)固定位置建立参考线:从【视图】--【新建参考线】--【设置水平或者垂直,距离最左边的距离】 px(像素)可以手动改为厘米。 (3) 用拖移工具放在参考线上即可移动,保存图片是参考线会自动隐藏,可以在视图中 隐藏掉参考线,或者把某个参考线拖到最左边或者最上边,就可以删掉那个参考线。
三、切片 参考线拉好后,用切片工具。 顶部这个工具的属性栏会显示为下图 点“基于参考线的切片”,自动根据你的参考线切图。 假若切片太多或者有的切片要调整,直接用切片工具对所需要调整的区域拖选就可以了。 如图,从01切片的左上角拖选到切片09的右下角,把1~9切片合并为一个切片了。 四、保存 ·——菜单【文件】保存为【存储为web和设备所用格式】
·进入的页面右上角,可以预设整个图片的统一名字,也可以点击单个切片命名。存储格式可以为多种。品质一般为60左右足够网页需求。其他默认即可。 ·在图片下方可以看到是单个切片或者整个图片存储后的大小,可以根据需要调整上图的“品质”,使得大小也可以增大或减小。 ·当点击左上角,即对整个图片进行设置。而则是可以对单个切片设置的状态。 ·点击保存,,“格式”选择为html 和图像。 ·table id__01就是切图部分的代码。 · 将相关图片放入制作的web文件夹里的对应位置(例如:3G_web文档 /images文件夹下)复制table id=”__01”到结束。放入index.html文件的需要位置,即可。
大瓦片切图的操作说明 一、背景和原理 通常瓦片尺寸被设置为400*300,项目实践中运算时间非常长;通过将瓦片尺寸放大,例如1600*1200、6400*4800等,能够提高arcgis每次渲染的范围、减少渲染的次数,从而实现性能的提高;而大瓦片裁切为小瓦片的操作,只需要少得多的时间。 下面是一组测试对比数据: 瓦片尺寸400*300,1156张1200*900 2000*1500 AP-Map-CutMap切图12’13”到13’03”, 平均每张0.63”到0.68”1’45” 平均每张0.73” 1’15” 平均每张1.53” AP-Map-CutCut二次裁切21.328”到25.25”19.328”到20.109”合计12’25”或745秒2’15”或135秒1’35”或95秒 18% 13% 显然,瓦片越大越有效;而且这还能减少瓦片文件数量,可以在将大瓦片拷贝到服务器之后再进行二次裁切,减少瓦片迁移所需要的时间。 需要特别注意的是: 1.瓦片尺寸不能大于屏幕显示分辨率,否则很可能出现瓦片显示内容的坐标范围偏差,这 是ArcGIS的问题,目前无法解决。例如分辨率最高1280*1024的话,建议瓦片选择为1200*900;分辨率能到2048*1536的话,则可以选择瓦片为2000*1500;而分辨率1440*900时不可选择1200*900,否则也会出问题。 2.大瓦片必须设置为小瓦片的整数倍,两个方向可以不一样。 3.大瓦片裁出来的小瓦片,总数很可能比小瓦片直接切要少;而且每个瓦片范围内的显示 结果可能与切小瓦片有所不同。例如瓦片边界处的注记。 二、作业流程 1.使用原有的AP-Map-CutMap切图。在正常的瓦片切图配置文件基础上,编写大瓦片的切图配置文件;并执行切图操作; 2.将大瓦片迁移到服务器; 3.用AP-Map-CutCut进行二次裁切,输出到服务器上的发布目录。 三、操作说明 1.大瓦片切图配置文件
18个PS的隐藏技能让你相见恨晚! 作者:王靖文 无论你是专业还是非专业摄影师,Photoshop一定是你再熟悉不过的软件。可是你是否知道这些Photoshop里神奇的隐藏技能?看了这篇文章,一定让你跟这18个技巧相见恨晚! 1.在画布中调整笔刷的各种参数关于笔刷,用过PS的人基本上都知道几个快捷键,比如Ctrl+”['、']“调整笔刷大小之类,这次我带来的方法比那个更加便捷,不但是大小上的调整,连同硬度和颜色都可以在画布中完成调整。方法:①在画布中按住Alt+鼠标右键——此时在画布上会出现一个红色的圆点,圆点代表了你笔刷的大小和硬度(越实越硬,越虚越软),拖动鼠标进行左右平移可以调整笔刷的大小,上下拖动可以调整硬度。如图②按住Alt+Shift+鼠标右键——此时你会发现鼠标旁出现了一个色彩选取框,没错!现在你可以调节颜色了!按住右键不放,移动鼠标到想要的颜色上即可。如图 2.小抓手的组合用法按住空格键将鼠标变成小抓手拖拽画布已经是相当普及的用法,几乎每个PS玩家都要使用,但是它的组合键却鲜有人知,这次为大家带来小抓手的组合级之一:全局拖拽——即使放大到很大比例仍然能瞬间让视图到达画布的任意位置。 方法为:按住空格键将鼠标变成小抓手后,再按住一个“Z”,
然后按下鼠标——这时你会发现视图瞬间回到了全局,鼠标则变成了一个小方框,这个小方框就是你当前所能显示到的区域,拖动鼠标挪到想要去的地方,然后撒手,走你~3.自由变换的附加用法这一条有点老调重弹了,不过估计肯定会有不知道的,这里再提一下,Ctrl+T进行自由变换过一次后,用Ctrl+Shift+T可重复上次的变换,用Ctrl+Shift+Alt+T可实现复制本体并重复上次变换的效果。如图 4.利用Shift实现加速拖动不知道大家有没有遇到过这种问题,有的时候为了对准细节不得不将视图放得很大,这时候拖动一个图层或者选区等到另一个地方要经历漫长的等待,看着下面的滚动条慢慢悠悠的走真是心急如焚呐……其实 这个时候只要按住Shift,你会发现滚动条嗖的一下就过去了~这个技巧需要多练几次,因为按住Shift之后的拖拽速度真的是灰常快,可能一不注意就过头了,所以建议你可以一下下的点着而不是一直按着,不截图了,一用就明白。5.钢笔工具绘制中转换折点一个小技巧,在使用钢笔工具时,按住鼠标拖拽节点时按下Alt,即可实现对当前节点的一个转折。 6.利用Alt选中锁定图层锁定图层大部分时候是因为不想再移动它,但有时真需要动它的时候却可能因为图层过多而找不到,即使勾选了直接选取图层也无法选中锁定了的,这个时候只要按住Alt在画布上点击被锁定的图层就可以选中了,
一些Photoshop 的小技巧,让人相见恨晚(多图) 图片:作者:王靖文, 恰好这个问题我很擅长~之前写过一系列的文章《那些你不知道的Photoshop 冷知识》,以下技能均摘自此文,有兴趣的童鞋可以移步站酷查看~由于知乎不能传GIF,这里尽量挑了一些能用图片说清楚的: 1.在画布中调整笔刷的各种参数 关于笔刷,用过PS 的人基本上都知道几个快捷键,比如Ctrl+"["、"]"调整笔刷大小之类,这次我带来的方法比那个更加便捷,不但是大小上的调整,连同硬度和颜色都可以在画布中完成调整。 方法: ①在画布中按住Alt+ 鼠标右键——此时在画布上会出现一个红色的圆点,圆点代表了你笔刷的大小和硬度(越实越硬,越虚越软),拖动鼠标进行左右平移可以调整笔刷的大小,上下拖动可以调整硬度。如图②按住Alt+Shift+ 鼠标右键——此时你会发现鼠标旁出现了一个色彩选取框,没错!现在你可以调节颜色了!按住右键不放,移动鼠标到想要的颜色上即可。如图2.小抓手的组合用法 按住空格键将鼠标变成小抓手拖拽画布已经是相当普及的
用法,几乎每个PS 玩家都要使用,但是它的组合键却鲜有人知,这次为大家带来小抓手的组合级之一:全局拖拽——即使放大到很大比例仍然能瞬间让视图到达画布的任意位置。 方法为:按住空格键将鼠标变成小抓手后,再按住一个“Z”,然后按下鼠标——这时你会发现视图瞬间回到了全局,鼠标则变成了一个小方框,这个小方框就是你当前所能显示到的区域,拖动鼠标挪到想要去的地方,然后撒手,走你~3.自由变换的附加用法 这一条有点老调重弹了,不过估计肯定会有不知道的,这里再提一下,Ctrl+T 进行自由变换过一次后,用Ctrl+Shift+T 可重复上次的变换,用Ctrl+Shift+Alt+T 可实现复制本体并重复上次变换的效果。如图4.利用Shift 实现加速拖动 不知道大家有没有遇到过这种问题,有的时候为了对准细节不得不将视图放得很大,这时候拖动一个图层或者选区等到另一个地方要经历漫长的等待,看着下面的滚动条慢慢悠悠的走真是心急如焚呐……其实这个时候只要按住Shift,你会发现滚动条嗖的一下就过去了~这个技巧需要多练几次,因为按住Shift 之后的拖拽速度真的是灰常快,可能一不注意就过头了,所以建议你可以一下下的点着而不是一直按着,不截图了,一用就明白。 5.钢笔工具绘制中转换折点
切图命名法头:header 内容:content/container 尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制整体布局宽度:wrapper 左右中:left right center 登录条:loginbar 标志:logo 广告:banner 页面主体:main 热点:hot 新闻:news 下载:download 子导航:subnav 菜单:menu 子菜单:submenu 搜索:search 友情链接:friendlink 页脚:footer 版权:copyright 滚动:scroll 内容:content 标签页:tab 文章列表:list 提示信息:msg 小技巧:tips 栏目标题:title 加入:joinus
服务:service 注册:regsiter 状态:status 投票:vote 合作伙伴:partner (二)注释的写法: /* Footer */ 内容区 /* End Footer */ (三)id的命名: (1)页面结构 容器: container 页头:header 内容:content/container 页面主体:main 页尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制整体布局宽度:wrapper 左右中:left right center (2)导航 导航:nav 主导航:mainbav 子导航:subnav 顶导航:topnav 边导航:sidebar 左导航:leftsidebar 右导航:rightsidebar 菜单:menu 子菜单:submenu
第一章:网页布局 一、画出页面的整体布局 制作网页之前,我们首页要先设想出网页的样子,就是网页的大体布局形式,根据布局来设计网页能加快我们的设计速度。 对网站页面整体布局就意味着,我们在设计的时候要根据我们布局的来设计,所以我们在网站整体布局的时候要考虑清楚,要根据方案书的具体分析和栏目要求来布局,要体现出简洁、大方,所以我们在首页的布局上面不能有太多的栏目块,banner图要稍微比一般网站要大点,这样能衬托大方的味道,至于简洁嘛?我们就在首页上体现几个重点的栏目块,一般体现的是企业的公司简介、公司产品、联系方式、新闻中心等。所以我们就选择3个栏目块来布局,3个栏目块布局在一排,具体页面整体布局规划图如下图所示。 Logo 导航 Banner 内容 版权
多元素布局如下图: 二、新建网页大小 布局出来后,接下了就是要确定网页的大小,标准的网页大小宽度一般的1003PX,高度不定,只要不超过1003PX的网页都是正常的,超过1003PX后,在800*600的宽屏电脑的浏览器下面会出现左右条,会影响页面浏览。 步骤:打开【文件】菜单,选择【新建】菜单,在弹出的【新建】对话框中输入网页的名称为“*******”,宽带1003像素,高度720像素,然后点确定按钮。学布局加学习交流群:517870096。当布局弄好后,下面我们就来切片。 三、切片 一,基本概念 1,切图,是一种网页制作技术,他是将美工效果图转换为页面效果图的重要技术。Fireworks也提供了切图技术,Flash则直接提供了网页格式输出技术(不需要切图)。 2,切片,是切图的直接结果,切图实际上就将图切分为一系列的切片 二,切图操作过程
课程总览 在本课程中,朋友们将学习到以下内容: ?? 如何通过Photoshop CS3 进行网站首页的版面设计?? 各种网页版面元素的设计技巧和方法 ?? 如何进行网页的切图以及切片的属性设置 ?? 如何创建与Flash 整合的FLV 视频
?? 在Dreamweaver CS3 中使用“Spry 选项卡”构件 第1 讲制作首页的主体部分 本文以“石桥花园”的网站首页为例,来演示页面创作的整个过程。其实“石桥花园”是不存在的,笔者虚构出来也并非只为完成本例,我一直向往生活在幽静、闲雅之所,虽然“石桥花园”离我的初衷有很多差异,但也多少能表达我的一些想法吧。 书归正传,早先的网页页面设计一般是以Dreamweaver 为中心,由Photoshop 或Flash 等软件来提供各种素材,如图片、动画、文字等。自从Photoshop 出现了“切图”等专为网页设计所定制的功能后,设计的中心已慢慢转向了Photoshop。因为Photoshop 本身以图像为基础的特性,决定了他能对版面施以更精确的控制,使网页的页面能够更加灵活和生动的布局,这几乎完全解放了网页设计师的创作灵感,不再受方方正正的网页表格所约束。现在我们要制作的是“石桥花园”首页的主体部分,主体部分包括标题、主展示图片和导航条。 1. 打开Photoshop CS3, 执行菜单“文件> 新建”。在新建对话框中设置名称为“石桥花园”,宽度为“777”、高度为“800”,这个数字并不“官方”,只是我在平时工作当中测试出来的而已。对于网页来说,一般只用于屏幕显示,所以分辨率为“72”、颜色模式为“RGB 颜色”,其它参数保持默认。 2. 按下Ctrl+A 全选页面,执行菜单“编辑> 填充”将页面填为纯黑色。在工具箱中选择矢量的“矩形工具”,绘制一个如图1-1-1 所示长方形A。然后使用白色的“直接选择工具”将该矢量形状扭曲成如图1-1-1 中B 所示外观,该形状的十六进制颜色值为“#246b34”,一种厚重的深绿色。
使用photoshop进行网站切图 一,基本概念 1,切图,是一种网页制作技术,他是将美工效果图转换为页面效果图的重要技术。Fireworks也提供了切图技术,Flash则直接提供了网页格式输出技术(不需要切图)。 2,切片,是切图的直接结果,切图实际上就将图切分为一系列的切片 二,切图操作过程 1,切图工具图标的识别 2,切图基本操作
1)基本操作有两个:划分切片和编辑切片 划分切片,是使用切片工具,在原图上进行切分的操作。 编辑切片,是对切分好的切片进行编辑的操作,编辑包括对切片的名称、尺寸等的修改等等 下面我们看一下这两个操作 2)基本操作 如果想移动某个切片,可以使用“切片选择工具”选择某个切片,并用鼠标进行拖动,也可以使用实现,另外如果想精确的细微移动,则可以使用实现 如果想将某个切片存为某个图片输出,可以使用“切片选择工具”选择某个切片,然后选择“文件”菜单,并选择“存储为Web所用格式(W)...”,然后在弹出的界面中...
3,切图技巧 1)一张图,可以有多种切分方式,如下:
既然存在n多种切图方式,那么是不是哪种方式都可以满足要求?答案:不是的。 一般对页面的要求是,当页面大小发生变化时,页面的各部分可以相对自由地伸缩,而不会使页面发生错乱或变形等问题。 我们切分好的图是要输出为Html格式的网页文件的,然后通过网页编辑器,将该页面进行加工,做成符合要求(例如可以根据内容多少,自由伸缩等)的模板页面。这其中,切图的方式直接影响着模板页面是否能够满足实际的要求。 我们来看一个例子:
2)切图技巧主要有几下几点 属性均匀的区域适合分为一个切片,均匀主要是指颜色和形状都没有变化,或者在X或在Y方向上没有变化。 属性渐变的区域适合分为一个切片,渐变有两种表现形式 颜色渐变 形状渐变 根据原图的内容布局,确定整体的切分策略,即切分要有分块的思想,要在想象中将整个布局看成是一个两个table,然后在具体到每个table,去考虑里面应该如何切。 下面通过几个图例来说明
这才是我学习Photoshop的动力啊!如果你对此也有着狂热的兴趣,那就继续读下去吧。 这些都可以帮你从小白成为高手! 《超赞!设计师完全自学指南》 《交互设计师修炼指南!教你从零开始成为优秀交互设计师》 攻略分为三部分, 基础篇 o最常见的几种抠图方法 o切图绝技之抠图大法 o教你使用抽出滤镜 实例演练 o抠头发丝的技巧 o简单几步抠出火焰素材 o利用通道抠出婚纱人像 神器推荐 o在线抠图神器 o万人好评的神器Kockout 同学们可以自己选择对应的部分学习:) 基础篇(一)
最常用的抠图方法: 一、魔术棒法——最直观的方法 适用范围:图像和背景色色差明显,背景色单一,图像边界清晰。 方法意图:通过删除背景色来获取图像。 方法缺陷:对散乱的毛发没有用。 使用方法: o1、点击”魔术棒”工具; o2、在”魔术棒”工具条中,在”连续”项前打勾; o3、”容差”值填入”20″。(值可以看之后的效果好坏进行调节); o4、用魔术棒点背景色,会出现虚框围住背景色; o5、如果对虚框的范围不满意,可以先按CTRL+D取消虚框,再对上一步的”容差” 值进行调节; o6、如果对虚框范围满意,按键盘上的DELE键,删除背景色,就得到了单一的图像。 二、色彩范围法——快速 适用范围:图像和背景色色差明显,背景色单一,图像中无背景色。 方法意图:通过背景色来抠图。 方法缺陷:对图像中带有背景色的不适用。 使用方法:
o1、颜色吸管拾取背景色; o2、点击菜单中”选择”功能里的”色彩范围”功能; o3、在”反相”项前打勾,确定后就选中图像了。 三、磁性索套法——方便、精确、快速和我常用的方法 适用范围:图像边界清晰。 方法意图:磁性索套会自动识别图像边界,并自动黏附在图像边界上。 方法缺陷:边界模糊处需仔细放置边界点。 使用方法: o1、右击”索套”工具,选中”磁性索套”工具; o2、用”磁性索套”工具,沿着图像边界放置边界点,两点之间会自动产生一条线,并黏附在图像边界上。 o3、边界模糊处需仔细放置边界点。 o4、索套闭合后,抠图就完成了。 四、(索套)羽化法——粗加工 适用范围:粗略的抠图。 方法意图:粗略抠图,不求精确。 方法缺陷:图像边界不精确。 使用方法: o1、点击”索套”工具;
网页美工切图设计要素 网页美工切图设计要素 1.一定要做好网页宽度的设置设计,一般网页宽度有760PX、900PX、1000PX等,最好不要超过1200PX的宽度,高度没有限制。大多数做网站的公司都有一个比较合理的标准。 2.作为网页背景、网页图标的要清晰,在网站设计的时候比较注重。所以在切图的时候不要切出来的效果与设计的效果相差太大。 3.有特效地方,有必要设计出特效样式,以便DIVCSS制作的时候切图使用。 4.在做成网页后可改变的文字,需要使用宋体、黑体无需修饰 5.细节一定要对齐 美工图设计好后要注意的两点: 1.导出JPGGIFPNG等格式观察效果。 2.不要合层,尽量保持每个文字图标图片都有独立图层,这样在DIVCSS切图时方便隐藏显示切图。 在新建设置之后,就要开始进行网页美工设计了,在网页美工设计的过程中要注意: 1.注意页面的分块,着手设计一个页面的时候,你必须根据所掌握的内容,以及其风格,对页面的整体进行分块。分块是一个非常必要且难以掌握的`技巧。对于一般杂志来说,它们是有边的,这意味着杂志美工设计师有边可循,依靠边来形成立体感,依靠边来产生未尽的意韵;但是对于web页面,边的概念被淡化了,屏幕可以上下左右的拖动。所以此时分块显得非常必要,目的也就是产生的效果。
分块可以用不同着色的色块、框、细线、排列整齐的英文等等,还可以混合使用,但是注意不要过于醒目,因为页面的重点在内容,而不在其他。 2、色彩的平衡与呼应。 1)色彩的平衡。色彩在页面中可以形成很多的效果,通过强烈的对比,可以突出页面的重点。还可以通过色彩调配,达到页面稳重 度的改变。一般的情况下,页面上方的颜色总是很重,这样才能压 住下面的颜色,如果不采取这种办法,整个页面将显得很不稳重, 底下的文字图片,有飘出的意味。因此,要使整个页面显得很平衡,必须要有能镇住其他颜色的色彩。 2)色彩的呼应。一种比较突出的色彩,如果很突兀地放在页面中,无论你是突出重点也好,还是logo图标,都给整个页面带来了副作用。为此,你必须在相对称的位置加上该色系(对于页面并不醒目) 的色彩以呼应,这样可以弱化这种视觉的冲击。 3、精确到1个像素 如果你是一个成功的页面设计者,你至少会在做出页面前已经把整个页面构思好了;如果你很宽容地对待图片中1个像素的差别,那 说明你还不是很合格。
Ps网站切图详解 一,基本概念 1,切图,是一种网页制作技术,他是将美工效果图转换为页面效果图的重要技术。Fireworks也提供了切图技术,Flash则直接提供了网页格式输出技术(不需要切图)。 2,切片,是切图的直接结果,切图实际上就将图切分为一系列的切片 二,切图操作过程 1,切图工具图标的识别 2,切图基本操作 1)基本操作有两个:划分切片和编辑切片 划分切片,是使用切片工具,在原图上进行切分的操作。 编辑切片,是对切分好的切片进行编辑的操作,编辑包括对切片的名称、尺寸等的修改等等 下面我们看一下这两个操作 2)基本操作
如果想移动某个切片,可以使用“切片选择工具”选择某个切片,并用鼠标进行拖动,也可以使用实现,另外如果想精确的细微移动,则可以使用实现 如果想将某个切片存为某个图片输出,可以使用“切片选择工具”选择某个切片,然后选择“文件”菜单,并选择“存储为Web所用格式(W)...”,然后在弹出的界面中... 3,切图技巧 1)一张图,可以有多种切分方式,如下:
既然存在n多种切图方式,那么是不是哪种方式都可以满足要求? 答案:不是的。 一般对页面的要求是,当页面大小发生变化时,页面的各部分可以相对自由地伸缩,而不会使页面发生错乱或变形等问题。 我们切分好的图是要输出为Html格式的网页文件的,然后通过网页编辑器,将该页面进行加工,做成符合要求(例如可以根据内容多少,自由伸缩等)的模板页面。这其中,切图的方式直接影响着模板页面是否能够满足实际的要求。 我们来看一个例子: 2)切图技巧主要有几下几点 属性均匀的区域适合分为一个切片,均匀主要是指颜色和形状都没有变化,或者在X或在Y方向上没有变化。 属性渐变的区域适合分为一个切片,渐变有两种表现形式 颜色渐变 形状渐变 根据原图的内容布局,确定整体的切分策略,即切分要有分块的思想,要在想象中将整个布局看成是一个两个table,然后在具体到每个table,去考虑里面应该如何切。 下面通过几个图例来说明
CAD切图方法 1、点击模型/布局选项卡中的‘布局‘按钮切换至图纸空间,将弹出的‘页面设置-布局1’窗口取消,屏幕中会显示一个默认的视口; 2、若切换至布局后没有显示出视口,则在命令行中输入‘MV’,回车后在屏幕上任意创建一个视口; 3、视口创建后将会显示出模型空间中所有的图纸内容,但此时图纸的比例不符合要求;可以在命令行中输入‘MVSETUP’,回车,选取?S?选项,回车后点击视口边线,回车,命令行中将会询问是否以模型中的比例为1,回车后命令行中会提示在布局中的比例是否也为1,若是,则回车即可;若要求为1:50,则输入50后回车;图纸比例就设置完成; 4、比例设置完成后,屏幕中的图纸内容可能会消失或则至显示图纸的一部分,需要放大视口,可以单击视口后对视口的视口的四个点进行拉伸,或者采用…SCALE?命令进行缩放,以使显示图纸的所有内容; 5、我们可以根据最后的出图比例对图纸进行分割,只需单击视口,对视口进行拉伸,插入图框,将视口拉伸至合适位置,即完成一张图纸的分割;若有多张图纸,则拷贝一个视口,在进行拉伸即可; 6、暂定图纸边界线为线宽1.0的实线,但分割线无法修改,需重新绘制,并在边界线的外侧标出接图信息;若一条边界线要与两个或两个以上图号相接,则在两个不同的图号间用线宽为1.0的短实线区分; 7、图纸空间中不可对模型空间的内容进行修改,但可以增加内容,如:接图信息、轴线号等内容可以在图形空间中加入;若要修改模型空间的内容,则应切换至…模型?空间进行修改,图纸空间将会自动修改; 8、将图纸空间中视口的位置在模型空间中绘出,关闭管道等图层,使图纸中只显示设备、建筑等,自然就形成了一张配管分区图; 9、一个布局中的窗口不能太多,控制10个左右,否则会影响速度; 10、(布局空间中不要双击在模型空间绘制的内容,可能会使视口无法恢复。)布局空间中选中视口,点击菜单“修改/特性”,属性框中“显示锁定”,选择“是”,完成后去双击图纸空间中的内容,就会切换至模型空间,不管如何缩放,都不会改变视口的大小。
我们都知道,对于一个网站而言,网页的下载速度是至关重要的。它不仅直接影响到用户的浏览体验、还关系到网页在搜索引擎中的排名参数。因此,优化网页、使之能快速下载是页面制作中很重要的考虑因素。网页优化涉及方方面面,图片优化则是其中重要手段之一。 我们都知道,对于一个网站而言,网页的下载速度是至关重要的。它不仅直接影响到用户的浏览体验、还关系到网页在搜索引擎中的排名参数。因此,优化网页、使之能快速下载是页面制作中很重要的考虑因素。网页优化涉及方方面面,图片优化则是其中重要手段之一。下面,本着把图片大小节省到字节的精神,网页教学网就来探讨一下web图片的优化,欢迎大家补充、指正。 图片优化基本原则: 一、图片裁切 切图时尽量贴合图形区,避免空白区域占用文件大小。 二、图片输出 1. 使用photoshop的“存储为web所用格式”功能来输出照片, 测试表明:输出某张图片为jpg格式,分别使用“存储为web所用格式”和一般的“存储为”,都压缩到50%,前者得到的图片结果为14.4kb,后者为47.1kb。 2. 在使用上述功能进行图片输出的过程中,对比jpg、gif格式下的文件大小,选择效果和大小较优的文件格式。 一般情况下,色彩少的图片使用png-8、gif格式文件会小些,色彩渐变丰富的图片,则使用jpg会小些。 3. Jpg格式的图片,需综合对比压缩品质高、中、低下的效果,尽量选择效果好且压缩品质较低的选项,以达到获取较小文件的目的。 4. 对于无多通道透明需求的图片,避免使用png24位格式输出。 Gif图片如何优化?
有些图片,色彩并不是很丰富,通过对比可知输出gif会更小些;或者,因为要用在多种背景中使用,需要输出为透明格式(非多通道),这时,就需要选用gif格式。我们都知道Jpg格式可以通过控制压缩比来优化,相对于JPG,gif 优化是比较容易被忽视的。看到身边有些朋友在输出gif时基本不作什么优化选择,觉得很可惜。其实,即使确定要输出gif格式,通常也仍有继续瘦身的余地。 我们可以做个实验。 请看看下面四个图片,大家在肉眼、原大的情况下能看出区别来吗? (声明,此实验图标取自网络,作者未知,感谢!) 呵呵~~相信如果不放大到像素级来一个个点的对比看,是很难辨认出有何不同的。 其实,这几张图片有着不同的色阶。请看下面在Photoshop中输出时的相关参数,注意文字中红色线标注的内容。
xHtml+CSS时代怎么切图 一、鬼扯几句 Web2.0,告别表格布局,xHtml+CSS布局成为网页前端必备的一种技能。从PS到xHtml的过程中,切图是很多CSSer头痛的事情。用表格的时候,我们只需要用切片把图切成一块一块的,然后导出再进行一些简单的修改即可。在CSS布局的过程中,个人认为不需要切片,而是用选区。本文主要就怎么用选区切图进行简明讲解。 当然,个人水平有限,难免有不足之处,欢迎指正。本文中的方法仅代表个人观点,非官方,非权威,您可以进行批评指正,但请勿进行人身攻击,否则您可以不用继续往下看。 二、需要掌握的知识点 1、PS里的参考线和标尺。 2、PS里的图层基本知识。 3、PS里有一个命令叫【拷贝(Ctrl+C)】,但还有一个命令叫【合并拷贝(Ctrl+Shift+C)】可能您用得比较少,而在用选区进行切图的过程中,【合并拷贝】命令则具有重要的作用。 【拷贝】只是对当前选区、当前图层内的内容进行复制。 【合并拷贝】则是对当前选区、所有可见图层的内容进行复制。 三、思路分析 拿着一张效果图,首选应该对这张效果图进行分析,在切图层面上,主要分析三点: 1、哪些图片是单独的,比如图1中的logo和banner部分。 2、哪些图片是需要平铺的。比如图1中的导航部分的背景。 3、哪些图片是需要sprite的。如图1中一些列表前面的小图标。 如图1所示为本文所用图片。
图1 四、实现方法 在切图之前您肯定已经建立好了一个图片文件夹的。打开PSD文件进行并显示参考线。 切出大图片 1、选择矩形选框工具,沿banner部分四周的参考线绘制一个矩形选区,如图2所示。 图2 2、招待【编辑】菜单下的【合并拷贝】命令,或按下快捷键【Ctrl+Shift+C】。这样选区内的图片所有可见像素都已经拷贝到了PS剪贴板。 3、新建文件,由于PS可以监视剪贴板,所以大小不用更改。直接确定。如图3所示。