推荐阅读
数码相馆精良装备:ACDSee篇
处理照片的第一步,首先要对它要有全面的了解。所以看图软件是必备工具的首选,它相当于侦察兵,查看问题的所在。在众多的看图软件中ACDSee是最优秀的,而最新的ACDSee 6.0已经不是简单的看图工具了,它集看图、视频播放、简单图像处理等众多的功能于一身。尽管ACDSee 6.0现在“强大”了,但它最主要的特色还是在看图和对图片的管理上,也是装机必备软件之一。 一、裁剪图片 在我们拍摄的照片中需要修改得最多的就是图片的裁剪、旋转以及色彩的调整。这在ACDSee 6.0中是非常容易的。 1.在ACDSee 6.0中打开你要处理的图片,在快捷按钮栏上点第一个按钮“编辑模式”,在编辑模式中选择修剪工具。 2.点修剪工具后图片变黑了,在要修剪的图片上拉出一个修剪的范围(图1)。选取的范围不满意,还可以用鼠标按住边框任意拉伸。图1 3.满意后点右边控制面板的“完成”即可裁剪。 4.如果你要对图片的角度做旋转调整,你可以点菜单“修改→旋转/翻转”,在这里你可以对图片做镜向的翻转以及90度和180度的旋转(图2)。图2

网页排版应该考虑IE6的兼容性问题
下图是本站统计系统中访客详情中浏览器查看率,IE6占据百分之40多。虽然浏览器的种类很多,光一个IE就有IE5.5,IE6,IE7,IE8等多版本,在这众多的高版本中,IE6依然受大多数用户所喜欢,所以排版时候就不的不去考虑IE6的兼容问题,要不然会损失很多访问者。下面列举IE6中10个不得不注意的问题:1. 使用 DOCTYPE你需要在HTML页面的最顶部加上DOCTYPE类型,当然, strict版是值得推荐的,例如:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">或者, XHTML页面的!DOCTYPE:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">你最不想看到的是,IE6进入怪癖模式 – 其实已经够多怪癖了。2. 设置position: relative设置position:relative解决了不止一个问题,特别当需要设置对齐的时候。很明显,你需要明白的一点是,绝对定位是相对来说的。说不定,因为你没有设置,而不知道东西都飞到那去了。比如,你设计了每篇文章前都有一张图片,最后,你发现,只有一张图片在页面上,或许,是他们重叠了。3. 给浮动元素设置 display:inline 值这源于著名的IE6双倍外边距BUG,例如,你给一个DIV设计了浮动,并且,设置了margin-left:5px;,在IE6中很可能就是margin-left:10px了,这里,给浮动元素设置 display:inline;,即可解决问题。4. 为元素设置 hasLayout很多IE6(或IE7)的问题可以用设置hasLayout值的方法来解决。(如果你不知道hasLayout是什么,请看这里)最简单的给元素设置hasLayout值的方法是给加上CSS 的height或width(当然,zoom也可以用,但这不是CSS的一部分)。设置一个具体的值是推荐的,但有时候并不一定知道高度多少,这里,你可能会用到height:1%。如果父元素没有设置高度,那么元素的物理高度并不会改变,但是,已经具备hasLayout属性。5. 解决字符重复出现的问题复杂的布局可能导致一些浮动元素里面的文字,出现在清理浮动位置的下面。这是一个奇怪的问题,下面这此可以帮你解决:•确保浮动元素设置了 display:inline;•在浮动元素中使用 margin-right:-3px;•在浮动元素的最后一个元素后加上一个IE注释,例如: <!--[if !IE]>把你的注释放这里… <![endif]-->•在最后的元素中加上一个DIV(这以设置width 为90% 或者其他相似的高度)UPDATE: 最简单的方法是删除掉所有注释。(感谢恬玮儿的提示,我自己并没有遇到过,不过,google了一下,发现这个方法也可以解决,并且,这是值得推荐的一个方法。)你可以到positioniseverything.net中查看更多关于这个的解释。6.只在<a>标签中使用hover,IE6只支持<a>标签显示hover样式当然,你还是可以通过JS来解决这个方法。但是, 这关于到可访问性的问题。建议不要把重要的内容设置在利用JS来实现的hover中。7. 使用!important 或高级选择器来区分IE浏览器比如min-height可以避免使用CSS来实现对IE的兼容。#element { min-height: 20em; height: auto !important; height: 20em; /* 让IE6显示这个高度 */ }IE6 并不能正确地识别min-height,可以设置固定的高度,让IE6解析为20em。即使如此,它还是会因为内容的尺寸扩大而改变高度。而另一个方法是使用高级选择器:#element { min-height: 20em; height: 20em; } /* 忽略 IE6 */ #element[id] { height: auto; }8. 避免按比例确定的尺寸比例会让IE6变得错乱,除非你给父元素添加一个确切的高度。不然,给其他的加上!important,例如:body{ margin: 2% 0 !important; margin: 20px 0; /* IE6 可读 */ }9. 尽早测试,经常测试别忘记尽早测试,经常测试, 除非你的程度已经完成。不然,你可能花更多的时间来解决IE6的问题。一般情况下,如果你的网站能在IE6和firefox下良好表现,估计其他浏览器就不会有什么大问题了。10. 重构你的代码很多情况下,解决一个问题,可能比重构你的代码要花更多的时间。

FLASH视觉特效实例之大风车篇
=版权所有 热点网络 热点下本例是一个比较容易实现的,但却很眩的视觉效果。笔者是用Flash AS来“描述”一个风车。相信读者们朋友会喜欢这个效果,并一定能从该例中学到一些有用的东西的。 本例源文件下载:点击下载(3K, zip压缩文件) 效果预览:点击预览一、制作元件 1.打开FlashMX,设置场景的大小为350px X 350px,背景色为黑色。帧频为30fps。 2.按快捷键Ctrl+F8打开“创建新元件”面板,创建一个名为“曲线”的影片剪辑元件。点选“工具”面板中的“直线”工具,在“曲线”元件的场景里绘制一条直线,单位为4,宽度为60px,颜色为灰色,然后用“箭头”工具进行微调,如图1所示。图1 3.按快捷键Ctrl+F8创建一个名为“运动曲线”的影片剪辑元件。按快捷键Ctrl+L打开库,把库中的 “曲线”元件拖拽到“运动曲线”元件的场景中。图2 4.点选“运动曲线”元件第1帧中的“曲线”,按快捷键Ctrl+T打开“变形”面板如图2所示设置。右键点选第1帧并选择“创建补间动画”命令创建补间动画。接着分别点击选中“图层 1”的第10、20、30帧并按F6键插入关键帧。如图3所示。图3

超越人类视野 简单8招新手也能玩转超广角
超广角镜头的使用虽然很难驾驭,但是所有器材都会有它的特性,在长时间使用过程和拍摄实践中,专业摄影师都会总结出规律,掌握超广角镜头的使用技巧。这里就有一个使用超广角镜头应该做与不应该做的清单。有了这些贴士,你利用超广角镜头既能够得到高质量的照片,也能避免超广角镜头给人带来的某种不适感觉。请享用! 1.横构图与竖构图 尝试横、竖构图两种构图方法吧!所有人都知道横构图是使用超广角镜头的常用的构图方法,它能把事物尽可能的拍摄进一张相片内!横构图虽比较常被使用,但不代表竖构图就无法拍摄到好相片!当你要拍摄很高的事物时,竖构图就能帮你很大的忙,你用超广角镜头竖构图拍摄同样也能拍到很好的作品! 2.线条摄影教程 注意寻找对构图有帮助的线条,给画面增加更好的视觉效果。让线条对准画面的一角,让线条的另一头朝向中间。例如当你拍摄一个很长的通道的时候,使用这个技巧可以让通道像是从边缘伸展到*,这样可以加强画面的纵深感。 3.运用小光圈 由于夸张的视角,通常超广角镜头很难保证整张照片的锐度。收小光圈是一个有效的做法,但即使是f/11或f/13,也无法保证完美的锐度。因此你需要决定把焦点对在哪里,以及你手中相机和镜头的最佳光圈。 4.手动对焦
最新发布

浅谈网页加载动画的那点事
对于加载(loading),想必大家都不陌生。每当看到加载页中那个不停转啊转的圈圈,或者是 “Loading…”后面不停闪动的三个点点,心里都会涌起各种焦躁反感。这篇文章详析了不同Loading对用户情感的影响,魔鬼藏在细节里,假如想让用户在惊叹于魔鬼般的细节时有出色的体验,你可以试试这个 → 《让等待也成为享受!18个读取进度条的优秀设计案例》根据一份调查得出,用户能够忍受加载的最长时间在:6到8秒。8秒是一个临界值,如果加载时间在8秒以上,大部分访问者最终会选择放弃,除非他一定要打开那个页面。以上三种是常见的loading方式,如果是我,我更希望看到第三种的进度条,因为我实在不知道第一个圈圈要转多久才能算加载成功,也不知道第二个点点要点到猴年马月。如果这个时候,界面除了看到”加载”以外的东西,是否就能转移用户的注意力呢?我们在看视屏前,视屏都会缓冲,在这时个候总是会放一段广告。每次我都会忍耐加载时的广告,但是如果广告做的很棒,很吸引人,就一点都不烦躁了,甚至还能在评论里看到求加载广告的地址。网页的loading就承担了加载广告的作用。在页面局部加载时常能看到第一个圈圈的身影,不过每次看到这个圈圈都差不多,如果换一种转圈的形式,也许会觉得”这个圈圈跟别的好像不太一样”,通过好奇减少等待的焦躁。减少用户的焦虑,可以给个允诺,示意他们还要加载多久,告诉现在的进度(有个进程百分比),算给一个定心丸。例如以下的方式:

浅谈如何设计才能让网站风格协调一致
网页设计的要点之一便是一致性,设计师首先需要了解一致性,然后再致力于构建页面元素之间的联系。网页设计的目标是将网页和用户连结,通过设计(顺手的导航、流畅的交互)让用户对网站产生信任。尽管网页设计以功能性为主,但依然可以为用户提供优良的用户体验。客户,用户以及一致性:具备一致性特质的网页能够帮助推广品牌、清晰传递信息。客户在意的是设计能否有效传达他们的品牌、信息,在意设计是否能够在消费者中建立一种对品牌的信任感。如果品牌信息传递的不够一致、或者晦涩难懂,那么消费者很难对品牌产生信任感,这就影响到了客户的销售额和业绩。一致性与设计师个人推广:作为设计师,你自己就是一个品牌,你需要仔细思量一下该要如何打造一致性的”个人品牌”。如果你的个人博客设计的风格一致,分量充足,案例丰富,那么客户很容易就找上门来。简要概括一致性:布局井然有序,主页面、子页面有章可循,配色方案自成体系,交互方式统一协调,与内容深度联系————这就是一致性。

浅析文字在国际范网页中的重要性
网页设计中最重要的元素是什么?你不知道?思考一下:你是如何将信息传递给用户的?你是如何展示产品的?现在你明白了吧,答案很简单,用文字将信息传递给用户,用图像展示产品。两者结合之后,表达能力呈几何级上升。图像胜过文字大多数人认为图像比文字易于理解,这已经不是什么秘密了。通过观看的形式,图像更容易表达情绪,也更容易让用户铭记。用户很可能因为页面中一幅动人的图像而记住你的网站。在网上,你可能看过很多信息图。信息图的绘制规则很简单——人们更喜欢读图。很多人宁愿从图像中学习知识,世界上三分之一的人喜欢用图像作为学习的工具。背景图确实能够起到营造氛围的作用和信息图的道理很相似,你可能会注意到很多网站的背景都采用质感佳、意境好的大图。这种设计方式连我都挑不出毛病。这种背景图营造出特殊、出众的网站氛围,要注意根据品牌的特点选取恰当的大图。关键所在间断的介绍之后,我们来讨论一下:用户浏览网站,期望得到怎样的第一印象。从评论中我们得知,用户喜欢那种简约理念的网站,所以我们就放上一张效果惊人的背景照片,背景上面再写上几行字,就能满足用户需求。文字解释似乎有点含糊不清,可以看看下面的案例便能明晓。这种设计方法非常行之有效,效果很形象化。我前面已经说过,用户期望先看到一张大图,既舒服,又能了解大致内容,有个心理准备,然后再看文字,详细的了解内容,这样的信息传达更加到位。这种方式下,用户会在你的网站停留更久、会获取更多公司信息、会了解更多你的产品。

七条优秀网页设计的基本准则
互联网何时诞生,专家对此说法不一,30多年前,互联网的应用非常有限,仅仅一小部分人能够接触到这种先进的技术。然后经历了30多年的指数级发展,它取得了梦幻般的成功。十年前,互联网刚刚处于雏形阶段,到如今,整个产业的格局已呈”大而不倒”的局面。而互联网的阵线也拉长了,从传统的”老式桌面”到各式各样的便携式设备,从由互联网引领的”大数据时代”,再到存储的新革命”云概念”。而设备呢?手表、眼镜各种以网络为基础的可穿戴设备正在蓬勃发展。如穿越到十年前,向别人描述今日的网络现状,他肯定会一笑而过,认为这只不过是”海市蜃楼”般的幻想。但十年后的今天,这些革新一一实现,不再是触手不可及的幻象,这所有的技术革新切切实实的就在我们身边。感谢那些为互联网做出贡献的革命者们!这张图能够很好的阐述响应式设计的思想。而聪明的Luke Wroblewski提出了”移动优先(Mobile First)”设计战略,他认为,这种设计模式:先从移动设备开始设计,那么设计便能很轻松的向下兼容。(通俗的讲,就是大屏肯定能完美呈现小屏上的设计,而小屏不一定能装得下大屏上的设计。)

详细解析网页改版的一些心得技巧
互联网行业,几乎每天都有新的网站上线,旧的网站改版,但不论是新站还是改版都有一个共同的特征就是’全新’,全新的产品结构,全新的视觉风格带来全新的用户体验,这样的创新和调整多多少少都会给用户带来些许茫然。最近关注一些大型站点改版设计,如七月末淘宝的改版2013淘宝新详情页改版出炉以及针对京东改版谈网页设计趋势,感觉业内对新版调整后的用户适应方面做了很多新的努力,这篇则是作者对改版设计的一个小总结,今天特意拿来跟大家分享一下。01.新旧版同时在线,保留切换入口。豆瓣近期对首页做了改版,新旧版从产品结构方面做出了很大的调整,如果是豆瓣的常客,一定会在一个时期内觉得很不适应,所以豆瓣针对这个问题做出的解决方案是:暂时保留旧版网站的切换入口,一定时间段的适应期后彻底采用新版页面。MSN的新版上线后,发现多了一个往日首页的模块,用户可以自行设定日期,回顾当天MSN首页的样式和内容,很有新意。02.增加新版体验功能,第一时间给用户全新的认识。

如何设计完美婚礼网站的心得和秘诀
可能你已经收到过好几次请帖,或者准备好了礼物,因为这正是婚礼时节。夏季和秋季是受欢迎的婚礼季节。新人们越来越觉得,一个很棒的婚礼网站是和亲朋好友们交流的绝佳方式,还可免去各种额外花销。这原本小众的趋向,正在变得越来越流行。一个网站可以用作结婚纪念、婚礼信息展示台(登记信息、着装要求、向导指引和其他更多),还可以作为一个分享图片与视频的地方。很多新人会选择模版样式个性十足的婚礼网站,可以让他们的网站脱颖而出。一个精美的婚礼网站比facebook页面更个性化,也让不用社交网络的人(好吧……)更易访问。在这,我们分享一些打造精彩婚礼网站的诀窍和个性十足的案例——其实你不必依赖手书和粉红丝带,先来欣赏一组漂亮的婚礼相关网站设计。强调欢迎页面jessandrussPittmans一个婚礼网站可以简单到单页设计,或者复杂到任何你能想象。但是欢迎页面是重中之重,婚礼网站的欢迎页(或主页)应该传达三件事:新人要清晰可辨,要能看见婚礼日期,所有其他导航项应该清楚、容易找到。

10大创意教你玩转网站背景设计
如何选择一种最恰当的网页背景是网站设计中最常见的问题之一。 通常网站设计者都已准备好网站内容,而且版面布局大多也基本敲定。但背景要么是令人厌烦,要么是让人眼花缭乱,让设计者迟迟不能确定。今天,我们将介绍几个实际网站来启发你的灵感,看看如何设计趣味而又令人感兴趣的网页背景。收藏本文,当你再次阅读时,你定会被某一个背景设计所迷恋。1. 素描设计这种设计在几年前就变得比较流行,而且一直持续到现在。这灵感来源于在笔记本上的涂鸦乱画,就像你十几岁时在英文课上所作的那样。每一部分都是些粗糙的素描表现,页面看似是非常随意的创意集合,而它们都以不同的旋转方式散布在页面各处。NotchStudio就是很好地应用了这种创意,并且以非常柔缓的方式表现出来。即使你本人不善长绘画,这种创意也是相当容易实现的,是因为这些涂鸦通常都是些非常基本的设计。如果拥有一部Wacom或iPad平板电脑,你就可以相当容易地描绘出你自己的图片或者某种意义上能够反映此类风格的书写文本。还有很多免费字体如Pointy,可以帮你不费吹灰之力就可实现让人赞不绝口的素描。2. 精细文稿设计风格纸张的质地纹理总能激起设计者的激情,而且为所有年龄所适用。目前这种创意已不像几年前那样风靡,但是它还是会带给你一种非常微妙的效果:如果你没有看到它,那会让你非常地想念。你注意到Beautiful Type所用的纹理设计,它既没有偏离主题也没有过分夸张,而是将一个原本看起来就很好的网站更是锦上添花。

精选国外优秀图片优化工具推荐
网页设计中往往需要大量部署图片。网站的品质取决于图像,如果一个网站的图像品质精良,那么体验将非常的棒。可以去看看那些优秀设计师和开发者的作品,他们往往非常注意图像的优化。既保证了图片的质量,又适度压缩图像,以提高加载速度。本文将介绍多种极佳的图像优化工具,可以在日常应用中帮助你。The Online Image Optimizer是一款在线压缩图像工具。支持本地上传图像进行压缩(最大不超过2.86MB)。可以选择图像输出类型。默认输出格式设置为和输入图像格式相同。 想要更好的图像优化体验吗?选择Riot吧!Riot软件提供了优化图像的绝佳平台。Riot软件轻量、界面简单、易用,实时优化,能够快速显示优化结果,可批量处理,可以发送到网络、邮箱、打印机中。原图:测试结果: 可以将你的图片最佳优化,达到惊艳的加载速度,同时最低限度降低图像质量。非常强大的工具,它的优化算法比其他工具先进。如果你想要”鱼与熊掌兼得”,那么花钱用这个吧!有网络试用版。支持SVG,PNG,GIF,JEPG。也具有Chrome、Firefox插件。

大胆奔放的字体在网页设计中的应用
好的设计为何好?原因可能不尽相同:先进的动效、蔚为壮观的图像、不同寻常的视频、细节精美的插画、完美无瑕的处理、创意的解决方案等等——但,以何种手段包装网页要取决于网站设计的目的。网站可以没有动效、可以没有图像及插画、可以没有视频、可以不采用流行风格,但是网站绝对不能没有文字。然而,正因为常见,所以被忽视。大家往往只把文字当作数据与内容的组织形式。然而大家有没有考虑过把字体也当成视觉表现的一种手段呢?优秀的字体能帮助网页设计打造清晰的视觉层级,有着优秀的可读性。字重、字体大小是字体较为重要的两个特性,我们可以借助这两个特性来进行优化。例如,如果你想要让一句话清晰可见、脱颖而出,那么只需要把文字加粗即可。粗厚的字体能够有效的引起用户注意。把字体放大一点,设计的显著一点,更具有支配性一点,那么网页将非常具有诱惑力。今天我们收集了一些对字体巧妙处理的网页设计。Holler大、柔和。黑白搭配,力量感很强的网页设计。Black in history吸引人的字体,精美的动效,蒙版效果不错,从其中可以窥见很多历史人物的肖像。

详细解析扁平化设计的进化论心得
别说你听的想吐了,也别说你不想讨论。除非有一天你想落伍离大家越来越远。事实证明,关于扁平化空前的争议和讨论导致了扁平化风格的多样化。没有争论,就没有变革!信息层级的简化、极简主义,这是我认为扁平化的核心,不同的设计师肯定对此理解也不同,大家有没有发现,最近的扁平化变了。实验,加入效果,失败!再实验,再次加入效果,成功,付诸实践!就是这么简单。所以现在的扁平化设计变得”不那么”扁平了或者”更”扁平了。好吧,先推荐一片文章An Extensive Look at Flat Design我们稍微挖掘了一下网络,我们试图搞清楚,这些设计师在干什么,在试验什么,在借鉴什么。以下是我们的小发现。来瞧瞧扁平化设计目前进化成哪几个类别了:)上帝看到扁平化设计,说”要有光”,于是就有光,然后也就有了投影。延伸投影,一般都是45度角,投影一般为物体的2.5倍大,给图标加入了一种深度。阴影也是扁平的,无渐变、明暗和衰退。但是坏处是,往往用户被阴影给吸引了,用户更关注阴影而不是图标。导致了一种阻碍效果。我个人看法是,这种设计个人感觉像是一团阴影,而不是一个图标。收集的长投影设计如下:ClockImage: Dmitri Litvinov