你现在的位置 -> try it

htc magic 把mp3设置为铃声

星期六, 二月 26th, 2011

使用magic时会经常下载音乐,但是却不能设置为手机铃声,系统自己也没有这个功能,而第三方软件也很少。 今天偶然使用QQ 音乐 Android版本 在里面选择相应的歌曲,然后按住,弹出菜单里面就有设置为手机铃声,这下就方便了,把音乐都扫描到里面,然后一天换一曲,哈哈。

Bluehost主机开户GZIP

星期三, 二月 23rd, 2011

在主机的public_html目录新建一个文件命名为php.ini,然后把代码考进去,代码如下: zlib.output_compression = On; zlib.output_compression_level = 6; 然后登陆主机,在Cpanel面板上点击Software/Services里面的PHP Config 选择php5 (Single php.ini)或者php5 (FastCGI)其中一个就行,我使用的是前者 点击Save Changes 之后就可以使用Gzip了,但是可能会发现你的主机只是HTML进行Gzip而CSS与JS没有Gzip。 可以把Wordpress的Cache插件缓存清空一下。 或者到whatsmyip检查一下是否已经生效 2011-3-3更新 最终使用这种方法只能对php进行压缩,不能对html/css/js进行压缩。 所以针对css与js还是建议使用Google Closure自己进行压缩比较方便与保险。

PHPnow开启Apache SSI

星期五, 二月 11th, 2011

使用PHPnow开启Apache SSI的方法: 在根目录新建.htaccess文件 在文件内加入代码如下: AddType text/html .shtml AddOutputFilter INCLUDES .shtml AddType text/html .html AddOutputFilter INCLUDES .html Options -Indexes FollowSymLinks Includes 不用重启Apache即可使用

前端MVC – PSD设计篇

星期二, 八月 24th, 2010

一般情况下经常发生设计师的稿件由于计算的不够精准,在实现时发生偏差较大。 由于网页设计与网站开发经常需要与人合作,不论是设计师还是策划还是开发人员他们之间的合作往往非常密切。 我们从设计稿开始入手。 没有绝对的自由 完美的精度1px 网页设计与杂志设计不同在于,网页有更多尺寸上的限制,这点跟报纸排版比较相通。 不能凭感觉就堆放与目测,需要精准到1像素的级别。 而设计师也需要对页面的布局相当的了解,商业网站分割区别一般很多,所以需要尺寸灵活把握,这样才能做出更精准的设计。 千万不要想着让其他人(制作人员)来想这些计算的方法,每个人都多做些事,合作起来才会更愉快。 Grid 而对于大网站来说,网站页面的数量也是非常庞大的,而制作的人相对较多,这样,要保证每位设计师出来的效果都是可以轻松被制作出来,需要一套标准,一套格(Grid)还是需要的。 字体 商业网站,由其是大型商城等网站的设计,由于对流量与加载速度的考虑,会少会图片所以其可用字体其实是非常少的,所以设计师的难度也就无形中的增加了,但是可以根据访问流量与用户所用浏览器系统等,用少量特殊字体,增强视觉效果,但是必须要有备选的方案,保证其他人也能正常的浏览。 更多信息 重要的信息指引是快速制作与开发的根基,所以网页设计也一样,设计师应该把一些基础的标准值都标记出来,比如说边框的颜色、边框的种类、应用的场景等进行标注,这样不仅为开发人员提供了良好的可读性,同时也可以大大提高开发效率。 先有数据,再有设计 现在一般认为先要出设计稿,然后再往里填充数据,其实是这真是大错特错。我们被模板时代给坑害了,更把模板的感念给误解与曲解,认为一切都可以模板化。 而事实是先要进行数据分析,然后再对数据进行可视化,往往连最基本的数据都没有就纸上谈兵,这只会走更多的冤枉路与耗费大家的精力与增加合作之间的摩擦。 只有仔细的对数据进行分析,才会发现,原来还有这么多“特殊”的存在。所以预测数据的精准度,将决定着设计稿(PSD)写实际搞(HTML)的偏差值。 虽然不能做到万无一失,但是知己知彼,百战不殆。 同样可以减少摩擦与挫败感,增强合作的愉悦。 没有简单的事情 当需求人员把东西拿过来,永远不要“小看”这些数据,这里需求人员也要注意。 永远不要说“这个很简单,这样,这样,然后这样就行了”… … 这样的后果就是不断的返工与无休止的争论,即使再小的Banner也有他特殊的地方。 先写这么多,想到再写~~

px – em – % – pt – keyword

星期五, 八月 13th, 2010

截取部分翻译,图片来源http://css-tricks.com/ 原文地址:px – em – % – pt – keyword Keyword 大部分浏览器支持的关键字有: smaller, xx-small, x-small, small, medium, large, larger, x-large, xx-large 大部分浏览器对这些关键字解析都差不多,并且有继承性。 虽然看起来差不多,但是在断行(line break)处还与整个段落的高度上还存在着差异。 px 更精准的控制,把字体设置为px可以让浏览器精准的渲染其高度。 虽说可以说更精确的渲染,但是在不同浏览器下依然会有差异 px不具有继承性 px在过去被认为是在可用性与可访问性非常友好。在IE6(以下),字体被设置为px后不能够被用户缩放。 em em也许是最难理解的,因为他的概念比较抽象。 一般来说:1em是等于当前字体大小。如果没有设置字体大小,而使用浏览器默认(16px),那么1em=16px。如果你在body上设置字体大小为20px,那么1em=20px。 IE5-7 em font-resizing bug % 与em相似,具有继承性。 一个比较流行的方法是给body一个合理的font-size性比如说:small。然后对其他元素用%。可以用这个方法还做一个局部字体放大与缩小的功能。 pt Point Values are only for print CSS! 72pts=1inch(英寸),1inch=真实世界的1英寸,不是你显示器的1英寸。 并且在不同的浏览器下pt所显示的并不相同。

Why Grid?

星期二, 三月 30th, 2010

现在Web Grid依然非常流行,可以了解到Grid最早的出现是为了打印排版的规范性。 而如今的Grid在网页上出现也是为了规范性? 难道人云亦云,大家说好才是真的好? Grid的分法我就不详细的说明了,在这里讨论一下Web Grid System可以有哪些重要的用途。 一开始我觉得Grid只是一快事构建与多人协助所用的方法,只要开发人员都应用统一的标准,可以很好的控制代码统一,易于维护。 但是实际应用中发现不仅要追求“黄金分割”这样以美学为标准的Grid,其实Grid System还有一个更重要的用途,可以统一页面之间广告的展示。 我们都知道,在网页上经常会因为不同的大小,所以经常改变广告位,这对于现在这种没有Web AD标准来说,非常头痛。 而在一个网站内部来说同样存在这个问题,一个大型网站必然有很多种不同布局的页面,这些面会被不同的部门所应用,但是里面的广告内部有时几乎不变或穿插很大。为了以一种最好的广告尺寸来应对多页面布局的方法—Grid System。 Yahoo ad流行的尺寸 在设计网站之-初,根据原型业务部门的反馈并且与设计师等沟通后,需要对网站页面进行统计与规划,布局由为重要,这将是以后网站可持续发展的一个根基。 可以想象一个大型网站,其广告数量是相当的惊人的,你说可以改,没问题,但是谁能去改几万张的图片! 在这里采用了20-10-33的栅格,选取几种主要的布局分别为: 200-770 440-530 320-650 这三种“二栏”布局又都可以拆分为 200-440-320 再加上嵌套的布局,可以很达到10多种,基本可以按需分配。 而其中关键的“广告位”则可以选取 770(黄金广告位) 200-200(方块) 440-120 300-250 这些广告(除黄金广告)都可以做到页面之间的通用性,展示的频率增加了,那效益自然要增加。 这里值得一提的是黄金广告位,为什么这里不设计为分两栏?因为黄金广告位的目的是为了更大的展示,而这个页面,应该是访问的最多(首页与SEO方向)所以才能称为黄金,看着舒服买家买的也爽啊~^_^~哈哈 Yahoo的前端工程师Nate Koechley说过前端工程师是企业的价值的体现,将价值最大化。 题外话: 理解是一个团队的最关键一点,大家之间因为专业的差异会变得陌生,分工越细使得分化越利害,这不是一个良好的团队。 在理解业务与开发人员之间的问题之后,需要大家都必须了解对方的角色,当然这需要时间的考验。 不过,对于小型网站来说其实并不需要这么复杂,这样会增加开发成本,但是对于大型网站,其页面不尽相同数量之多,开发人员也多,这样一个协调的“标准”是必须的,只有这样才能保证设计的质量,如果大家都可以熟练的应用那么在合作之间可以减少很多不必要的摩擦,使得开发的过程变成一个快乐的过程。

IE6特殊的Bug

星期四, 九月 17th, 2009

今天在做东西时,发现在一个ie6有趣但是又很无语的Bug,见图: IE6下 正常效果 CSS .t { background: #ccc; border: 1px solid #ccc; width: 500px; } .t0 { margin: 0; } .t1 { float: left; margin-left: 2%; background-image: url(images/test-boder.jpg); height: 180px; position: relative; width: 10%; } .t2 { float: right; margin: 0; } HTML <div class=”t”> <div class=”t1 t0″> thi is t1 </div> <div class=”t1″> thi [...]

前端开发常见问题(非js)与解决方案

星期一, 九月 7th, 2009

在开发越来越深入,越来越复杂,人员也越来越多时,各种各样的团队问题便随之而来。 以下列出一些我在开发中经常遇到的问题,并应用相应的方法来解决,大家有很好的建议不防提出来大家讨论。:) 问题 设计: UI不够统一 设计不规范,导致制作时出样式出现偏差 CSS: CSS过于混乱,多人联合编写时命名空间冲突问题 各自为政,不能使相同的部分共用起来,造成沉余与维护困难 乱用Selector优先级,导致无法更新样式。 HTML: 结构嵌套问题 语意不明确 解决方案 设计: 多利用草稿,制定初期架构草图(图1) 制定统一版式与UI样式(图2) 精确计算宽度值与其他数据(可以蓝图阶段进行),并严格遵循   CSS: CSS采用统一的命名规则如:header_wrapper, main_containter或header-wrapper, main-containter 注:后一种写法header-wrapper在.net的服务端控件中会报错,由于.net中无法识别id中含有‘-’ 通常我的作法为: id:headerWrapper class:header-wrapper 当然其实我还是建议采用‘-’的写法,如果不是为.net做开发的话。 引用类库或自己编写相关类库,并制作相关文档,按文档编写。这样可以最大限度的避免命名冲突。 另外一点就是在全局引用‘命名空间’的做法,因为CSS本身并没有这一概念所以需要做一些hack手段 代码: <html> <body class="text-page"> … </body> </html> 利用CSS的权重进行的hack,也是一种比较通用的hack手法,这样就可以利用CSS的优先级来做不同的样式。所以CSS的优先级是个非常重要的工具! HTML: 对于页面的基础,莫过于HTML。整个架构的骨架! 为避免大规模开发时造成不必要的混乱,一定要按W3C的一些标准来实施 可参考:符合XHTML Strict 1.0 W3C组织标准的标签与结构 进而就需要考虑应用一些规则 如:Grid System 这里先打个招面,以后的文章里再详细说明一下Grid System。 现在网站大家都是即时开发,很少有整理与规划HTML的习惯,鉴于这点,应该多向CSS Zen Garden学习,整理由最适合用自己的骨架。

符合XHTML Strict 1.0 W3C组织标准的标签与结构

星期一, 八月 17th, 2009

选择适当的标签与合理的结构,将是构建一个标准网站的基础

代码高亮插件-SyntaxHighlighter

星期六, 四月 11th, 2009

介绍一款代码高亮插件-SyntaxHighlighter。 其实说是一款插件,不如说是js lib~ 因为他不需要像其他WP的插件那样在后台安装与配制。 首先,说一下它的好: 完全绿色不需要修改function.php,只需要在页面加载相应的js与css即可 支持多类型代码高亮(其实其他的插件支持的也不少),可自主选择所需高亮的语言 其次,说一下它的坏: 体积过大,压缩完后竟然还有19K! 自定义的api太少,很多时候需要自己去修改js或css文件 其他的功能与一般的代码高亮插件都差不多。 这所以这么大的体积我还选择他的原因是,因为其DIY相对而言要方便许多。 只要你修改相应的js或css即可,对于开发人员来说,还是很方便的。 对于他的期望就是希望在新版本中体积可以小一点,毕竟一个19K的文件不是一个小数字。 安装 安装时只需要将相应的js文件放到你的header.php中即可 js必须文件为:shCre.js shBrushBash.js shBrushCpp.js css必须文件为:shCore.css shThremeDefault.css 然后在加入相应的高亮代码js如:shBrushCss.js这是css的 写代码 这样在写日记的时候可以用<pre class=”brush: css”>这里是相应的代码</pre> 来测试一下代码: 这里是javascript代码 function test() : String { return 10; } 这里是CSS代码 #test{ font-size:19px; margin:10px; padding:20px; }

Page 1 of 212

分类

随机作品

GlobalMarket Career

让网页变得简单灵活

EYE

很漂亮的眼睛,很有神,清澈透明!

Photoshop CS3

Wacom

ICON Design – Single Color

简单的一套图标,使用单色让图标更有视觉吸引力

UAT9