::Web Magic::
The Web Image Magic…
The Web Image Magic…
四 14th
页头 header 登录条 loginBar 标志 logo 广告 banner
导航 nav 主导航 mainNav 子导航 subNav 边导航图标 sidebarIcon
侧栏 sideBar 菜单 menu 子菜单 subMenu 搜索 search
页面主体 main 内容 content 标签页 tab 文章列表 list
栏目标题 title 提示信息 msg 小技巧 tips 指南 guild
服务 service 热点 hot 新闻 news 下载 download
注册 regsiter 加入 joinus 按钮 btn 投票 vote
合作伙伴 partner 友情链接 friendLink 商标 label 状态 status
页脚 footer 版权 copyRight 注释 note 面包屑 breadCrumb
四 14th
这片文章大体概括了一些设计网页中的大问题。希望能给你做下一个网页时给予一些儿启发。
1.记住:你能掌控的时间是有限的
我仅仅用4秒钟就能浏览完平常的页面,因此,你没有足够的时间吸引用户并让他们继续浏览你的网站。也就是说你应尽可能准确的描述你设计的网站是关于什么的。如果它需要让浏览者花费更多的时间去弄明白此网站是关于什么的,他将放弃并离开。
十二 10th
在两个涉及到png透明应用的项目里,使用了多种让png在ie6下面透明的方法。包括:pngfix和DD_belatedPNG_0.0.8a。下面分别介绍一下:
1、pngfix,使用js代码、AlphaImageLoader滤镜和一个透明gif来模拟png透明
使用方法:
第一步,把blank.gif、pngfix.htc和pngfix.js放在同一个文件夹里面
第二步,
第三步,在CSS样式表里制定标签应用 img,div,a,input {behavior: url(pngfix/pngfix.htc);}
2、DD_belatedPNG_0.0.8a,这个js插件使用了微软的VML语言进行绘制
使用方法:
优点:支持background-position定位,支持a:hover
缺点:因为是一个一个绘制的,如果png多的时候就有问题了,速度慢得有点受不了。
建议:
1、实在要使用这个js插件的话,可以在函数调用的时候,精确指定应用png的标签样式。例如:DD_belatedPNG.fix(’.png_bg’);尽量少用标签,这样遍历所有标签是一件很痛苦的事情。
2、也可以把所有需要做透明的png图片设计成全背景,然后通过一个CSS样式引入,再通过DD_belatedPNG.fix(”)指定。例如:把所有图标设计成全背景,CSS样式.icons {background-images:url(img/icons.png);},DD_belatedPNG.fix(’.icons’)。
还有值得提醒的几点,只要你遵循下面的几点,IE6会让你好过一点:
1、如果是多张图片合并的一张大图,每个图片之间留几像素空隙
2、每个图片宽高都尽量是偶数,图片坐标也是偶数(IE6的奇偶数是个超级大问题)
3、如果背景填充使用右对齐或者底对齐,那么还是会因为填充对象的宽高出现奇偶BUG,所以尽量用偶数坐标定位(这个就是我说的些许问题,其它都还好)
总结经验,我个人还是建议使用CSS滤镜来实现。几K的CSS代码,和一个可能带来缓慢访问速度和js冲突的js插件,你选择那一个?至于链接失效的问题不仅仅可以设置链接的position相对定位,也可以对该内容所在的层进行相对定位设置。
十 20th
Fireworks?什么软件?你印象中并不熟悉,你只知道photoshop?没错,PS的确很强大、无所不能。我曾经听过这样一句话:“只有你想不到的,没有photoshop做不到的!”,我并不反对,而且十分认同。但是请静下来听我发表一下我的个人看法:我使用fireworks设计效果图已经有八年多了,我并没有觉得FW有什么地方比不上PS,至少在web界面设计方面还是很相当出色的。智能的自动建层、快捷精确的绘图、简单易用的内置常用效果、操作方便的渐变效果。这些操作起来比photoshop方便,这就是我一直使用FW原因,正所谓小鸟胜雄鹰嘛!
十 19th
web设计其实没有想象中那么复杂,只要你知道在什么地方应该放什么东西。并且简单明了地向网站用户传递相关信息。更深入一点,也就是技术积累和审美积累。当你发现自己停滞不前的时候,不妨试着改变自己的习惯,反一下传统。或者尝试学习新技术来武装自己。没有改变怎么可能有进步?
十 19th
常见的图像文件格式包括:BMP、GIF、JPG、JPEG2000、TIFF、PSD、PNG、SVG等,其中网页上面常用的格式:GIF、JPG、PNG。接下来我们简单了解一下这几种图像格式。
一、GIF格式
GIF是英文Graphics Interchange Format(图形交换格式)的缩写。顾名思义,这种格式是用来交换图片的。事实上也是如此,上世纪80年代,美国一家著名的在线信息服务机构CompuServe针对当时网络传输带宽的限制,开发出了这种GIF图像格式。
十 19th
web设计主要分三大部分:
一、web UI
也就是网页设计稿,具体用什么软件?这个因人而异,比较普遍的应该是photoshop和fireworks。而我从开始学习网页设计至今一直使用后者,不是为什么而是因为我第一个接触的制图软件就是它。于是一直钟情于fw,方便快捷的绘图,完美的渐变和元素效果,输出图形的优化,以及切片工具的集成。一切都那么方便!当然很多方面还是不如ps,但是对于设计页面效果图已经足够了。
十 19th
人生就像一条曲线,每一个阶段都会遇到不同的人和不同的事!认真对待每一个人,认真对待每一件事!珍惜每一个学习的机会,选择自己喜欢的,不要计较它是否能够为你带来什么!因为他们将会是你人生曲线上的每一个点,也正是这些看似平淡且独立的点描绘出你的精彩人生!–AIO anylee 2009.10.19