这段时间，友商网完成了第三次改版，收获了很多，挑其中的一点稍稍的进行了“深入思考比较学习分析研究参悟理解”。啰嗦的话说完了，正题......
本帖同时发布在KDUED.com,如果小窝不稳定，可移步查看
应该不难发现，在目前的各大网站中，大量的采用了圆角去修饰边框，使得页面的呈现更加柔和，干净舒服。所以，友商网在这一次改版中也大量采用了这个样的设计，特别是二级页面的大部分元素框，就采用了时尚的银灰色调配上灰黑的圆角。在将设计稿实现成页面的时候，这个地方开始的确让我头疼，因为这些元素有很多相似的特点，也有一些不一样的地方，相似的是：
title是银灰色渐变x轴横向
底部圆角内凹度一样
而不一样的地方是，整个元素框宽度不一定一样，title高度也有两种，在看到绝大部分的频道设计稿后，我决定将这些元素框做成通用的结构和样式，希望能提高开发效率，省去了一次次重复的调试，也有利于不用的前端开发同事统一风格，整体提高开发速度。
实现的思想是这样的（可以说主要是滑动门的应用）：
1.将title的银灰条进行分离（其实也可以合在一起），作为两个结构元素（分别是h2和span）的背景，进行适应的拉伸
Posted in Web Standard | No Comments »
前段时间去了趟桃源村附近的IKEA后有点想法，但是由于最近比较忙，并且家里网络不好使，所以没整理，这两天搬了个窝，网络OK了，也有点时间就写写吧。先记点很水的帐：
KDUED成员们突然想搞个户外活动，采一下风，一小伙说，要不去IKEA吧，那里的某些设计不错，大家也没啥好建议，所以敲定就整这个。
我们跟大黄广宇一打车嗖嗖的到了，等了10分钟还不见巾帼们到来，一问，得，迷路了。。-_-！！！都在深圳混好多年了还迷路。。。。。
进门后，第一感觉是：有点温暖，这温暖来自放置在门口的一套沙发，上面坐着几个玩耍的小朋友，戏耍嬉笑真开心，哈哈哈，左边是小朋友乐园，很宽敞，很有童趣，只要是在8岁以下年龄段混的没有不被吸引的（教育，从娃娃做起。买卖，从娃娃做起？？）。温暖沙发的右边就是上楼的电梯，在电梯上升的过程中你会被墙上的各种颜色的倒挂椅子吸引，颜色很抢眼，这个时候就抓住你的心了，想知道这个椅子怎么样吗？上来体验吧。。。
在二楼的整个搞怪和享受过程中，我发现一个别的家具售前体验店所没有特点：导航设计。。
它有着引导性很强的路线，最前面的是样板房的展现，非常多，非常贴近生活的设计，几乎利用了每一寸空间（其中一个带有养花房的设计，我比较喜欢 哈哈），利用绳子来悬挂一些相框或者画框是一个不错的方案，既不用在墙上钉来钉去，也比较高雅时尚，有家的概念。接着是一些床样椅子睡房，从这些地方开始就是将一整套房子进行剖析了，一样一样的去诠释，到最后是儿童玩具的地方，很多小孩往往是前面那些东西并不能吸引他们太多注意力，主要是大人在看，而快到出口的时候小孩就很兴奋了，大人小孩一起在这里就会逗留一会，带着很愉快的心情离开，或者取货。将幸福感持续到了最后一刻。。。。-_-!!好像走题了。。。。
Posted in UE, Web Standard | 1 Comment »
前些天，利华说能不能让某个div或者其他块元素左右，及垂直居中，我想了一会，做了下面这个测试页面，在IE系列，FF，safari，opera下均通过。。主要是position的用法。。其实像很多light box使用的也是类似的方法：
css:
#bd{position:static;display:table-cell;}
#test{width:500px;height:500px;background:#DADADA;position:absolute;top:50%;left:50%;
margin-left:-250px;margin-top:-250px;}
structure:
demo here!!
test HW
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
#bd{position:static;display:table-cell;}
#test{width:500px;height:500px;background:#DADADA;position:absolute;top:50%;left:50%;margin-left:-250px;margin-top:-250px;}
Posted in Web Standard | 2 Comments »
IE8 beta1发布已经有一段时间了，这个版本主要是针对web开发人员，官方声称IE8将更多的兼容WEB标准，例如:css2.1 .增加了Activities（活动）、WebSlices（源剪辑）、Favorites Bar、Automatic Crash Recovery、Improved Phishing Filter等特性，而且通过了Acid2测试。此外，Internet Explorer 8通过IE7模拟功能（注意这个地方！）实现了对之前版本IE浏览器的兼容。
今天早上看到sina的新闻提到beta2将在10份推出，突然想到现在使用IE8的用户应该不少了，根据sina提供的数据是0.2%。就想，应该做点什么了。。
由于IE8采用了新的layout渲染引擎，所以会导致以前兼容IE7的页面样式出现问题，但是现在的IE8还是beta阶段，为了使得网站能在其中显示正常，就必须使得它使用IE7的strict模式来工作。根据微软的官方提供建议是：使用X-UA-Compatible支持一下三种模式
* 支持 Internet Explorer 5 和传统浏览器的 Quirks 模式
* 支持 Internet Explorer 7 且可以通过模拟 Internet Explorer 7 按钮访问的严格模式
* Internet Explorer 8 标准模式
但是使用了http://support.microsoft.com/kb/952030上提供的
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
后发现并没有效果，调试，也百度后，发现content应该写成：content="IE=7"（-_-!!）。
完整的应该是这样：<meta http-equiv="X-UA-Compatible" content="IE=7" />
这样，在IE8里，页面就会以IE7的strict模式来渲染了。。
Posted in Web Standard | 1 Comment »
记个流水账：
昨天跟邓妹妹，维崽，溜溜的云，还有玲玲MM到某报告厅听了公司的《管理与艺术论坛》之油画与管理艺术（貌似是这个名称，偶有点健忘）。
整个讲座不能说它没意思
1.原来，这，就是油画。
2.搞艺术的有点“折腾”，这画得越画越大，杰克画的是1米5的，你得整个3米的，不然那不创新，兰伯特画的那是相当细腻，相当考究，得，你得潦草点，这就跟人家不一样了。。这就是创新。
3.油画史-----基本遵循：室内---室外---室内---室外。。。。。这是创新与颠覆的过程，同时也是油画评论家的发展史。。
油画讲究形体，肌理，明暗，色彩，线条，空间与质感的结合，最后传达给赏析者的是原创意，我大胆的概括为：构，现，达。这个创新过程让我想到web标准的一些东西，他们是：结构，表现，行为，这三者是web标准提倡的结构（HTML,XHTML,XML）与表现(CSS,XSL)进行分离，再用行为(SCRIPT)控制的思想，与油画颇为相似，他同样是形体，肌理，线条与空间作为实实在在的构成体，色彩，质感等就是表现，而传达的东西就是行为,这些元素构成了整个艺术作品，就像一个按照WEB标准编写的页面一样，相同的是，作者都要将设计与创作的思想最大化的传达给“客户端”，不同的是，材料有点不一样，画笔不一样。。哈哈哈
整个讲座始终贯穿着一个理念，我也很欣赏：颠覆，你得不断把自己给颠了。。。
最后上一张徐唯辛老师的作品，版权归徐老师所有，来源于artron.net。
Posted in Web Standard | 4 Comments »