Grimlock | 
07 4th, 2008| 
Jun
30
1、说明本文阐述了我们发现的在用CSS设计中有用的解决方案。
2、浏览器特定的选择器
当你想在一个浏览器里改变样式而不像在其他浏览器中改变时，这些选择器很有用。
IE6以下
*html{}
IE 7 以下
*:first-child+html {} * html {}
只对IE 7
*:first-child+html {}
只对IE 7 和现代浏览器
html>body {}
只对现代浏览器(非IE 7)
html>/**/body {}
最新的Opera 9以下版本
html:first-child {}
Safari
html[xmlns*=”"] body:last-child {}
要使用这些选择器，请在样式前写下这些代码。例如：
#content-box {
width: 300px;
height: 150px;
}
* html #content-box {
width: 250px;
}
/* 重写上面的代码并且把宽度改为250PX
在IE6以下版本中适用。 */
3、在IE6中使用透明PNG图片
IE6的一个很难处理的BUG就是它不支持透明PNG图片。
你可能需要用一个重写的CSS的滤镜来解决这个问题：
*html #image-style {
background-image: none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=”/”fil”
ename.png”, sizingMethod=”scale”);
}
4、去掉连接虚线框
当你点击链接时，Firefox会在链接周围产生一个虚线外框。
这个很好解决，只需在a标签中添加outline:none就可以了。
a{
outline:none;
}
5、对inline元素应用宽度。
如果你对一个inline元素使用宽度，它将只在IE6下起作用。
所以的HTML标签要么是Block的要么就是inline的。inline属性的标签有<span><a>< strong>和<em>Block标签包括<div><p><h1><form> 和<li>
你不能控制inilne标签的宽带，不过有一个方法是把标签属性从inline改为Block。
span{
width:150px;
display:block;
}
应用display:block能够把span标签变成block标签，从而控制它的宽度。
6、使一个固定宽度的网站居中。
为了让你的网站在浏览器中居中，可以为最外层Div添加position:relative属性，然后将margin设为auto。
#wrapper {
margin: auto;
position: relative;
}
7、图片替换技术
对于头部来说，永远是最好用文字而不是图片。在你必须要用图片的某个特殊地方最好使用隐藏文字的层的背景图片。这对于屏幕阅读和SEO非常有用，尽管依然使用很普通的文字，这可以联想到所有的优点。
HTML：
<h1><span>Main heading one</span></h1>
CSS:
h1 {
background: url(heading-image.gif) no-repeat;
}
h1 span {
position:absolute;
text-indent: -5000px;
}
正如你所见，我们对H1标签使用普通的HTML代码，用CSS来将图片替代文字。Text-indent把文字放到左边5000像素处，从而用户看不到它们。
8、最小宽度
IE的另外一个Bug就是它不支持min-width属性。min-width确实非常有用，特别是对于100%宽度的可变模板来说，因为他告诉浏览器停止收缩。
对于除IE6以外的所有浏览器来说你只需min-width:xpx;例如：
.container {
min-width:300px;
}
要让这些在IE6下起作用的话你要添加额外的努力！你需要创建两个DIV，一个包含着另一个。
<div class=”container”>
<div class=”holder”>Content</div>
</div>
然后你需要设置外面层的min-width：
.container {
min-width:300px;
}
现在又要IE hack起作用了，你需要写下以下代码：
* html .container {
border-right: 300px solid #FFF;
}
* html .holder {
display: inline-block;
position: relative;
margin-right: -300px;
}
当浏览器窗口调整外层宽度来适应直到它缩小到border的宽度时，这个时候它就不能够在缩小了。而holder层也会停止收缩。外层的边框宽度变成了内层的最小宽度。
9、隐藏水平滚动
要去除水平滚动条，可以在body中插入overflow-x:hidden属性。
body {
overflow-x: hidden;
}
这在你决意要用一个比浏览器款的图片或Flash时很有用。
如果需要批量解决整站点的超链接虚线框，一个一个加这样的代码，不是要晕了。
可以使用两种方法解决：
第一，使用DW中的插件：scrubber.mxp，代点是可以对于整页内的超链接进行处理，但无法对整站点消除虚线框，有局限性。
第二，使用样式表，这样，就可以对整站进行处理了。
样式代码：
a {blr:expression(this.onFocus=this.blur())}
如果是图片区域，可以加：
area {blr:expression(this.onFocus=this.blur())}
一切都搞定了。
Jun
16
Jun
3
今天是我第一次和雅虎的朋友们面对面交流。我希望把我成功的经验和大家分享，尽管我认为你们其中的绝大多数勤劳聪明的人都无法从中获益，但我坚信，一定有 个别懒的去判断我讲的是否正确就效仿的人，可以获益匪浅。让我们开启今天的话题吧！世界上很多非常聪明并且受过高等教育的人，无法成功。就是因为他们从小 就受到了错误的教育，他们养成了勤劳的恶习。很多人都记得爱迪生说的那句话吧：天才就是99％的汗水加上 1％的灵感。并且被这句话误导了一生。勤勤恳恳的奋斗，最终却碌碌无为。其实爱迪生是因为懒的想他成功的真正原因，所以就编了这句话来误导我们。
Read the rest of this entry »
Jun
3
user experience design,国外叫UXD,国内也简称UE设计。
我们来分析一则国外的UE设计师招聘要求，看看你还需要欠缺什么吧：
我们正在寻找一名高级用户体验设计师加入我们的产品设计团队。We are looking for someone to join our growing Product Design group as a sr.
user experience designer.
Jun
3
不应该是局限于web2.0的网站的，只不过在web2.0的圈子里面，大家普遍比较重视用户体验，界面的交互友好性，因此做web2.0的网站推行用 户为中心的设计(User-Centered Design)就容易得多。这些天总有些负责网站界面的设计人员找我咨询，怎么做用户访谈才感觉不像聊天，怎么样让用户参与到设计中来，得到更多的意见而 不是简单的一句还可以或不错之类的评语，原型的改进花费时间总是太长怎么能缩短，设计的时候没什么把握，诸如此类的问题。。我想对此在msn上做的指导大 量重复，需要在这里做一些入门级的解释了。。
May
16
最总的成功与否,在多大程度上成功,也并不是最关键的,最关键的是做正确的事情,并且把事情做好的能力.
KING KONG TEAM 一直在努力做我们的事情.
请大家期待我们的新产品-我们会让所有人听音乐更方便…………..
Mar
31
一般来说，网站设计制作到最后发布到网上，这只是网站发展的最初一个阶段，网站作为公司的一个线上宣传手段，极大的体现了公司的理念和宗旨，是公司不可分割的一部分。公司要发展，网站也会不断的更新变化。让我们来看看，那些大公司的网站是如何一步步改版到现在的样子的。
苹果现在 / 5 年前 / 10 年前
Adobe 现在 / 5年前 / 9 年前 / 12 年前
Amazon 现在 / 9 年前
CNN 现在 / 5 年前 / 8 年前
Yahoo 现在/ 4 年前 / 8 年前 / 12 年前
Nike 现在 / 5 年前 / 8 年前
Microsoft 现在 / 5 年前 / 10 年前
ESPN 现在 / 8 年前
Starbucks 现在 / 7 年前
MTV 现在 / 5 年前 / 10 年前 / 11 年前
Read the rest of this entry »
Mar
31
在网络设计领域关于Eye-Tracking的研究十分火爆，但是如何把这些研究结果转变为具体可行的设计来运作依旧是个难点。以下就是一些来自于Eye-Tracking研究结果的窍门，可以为改进你的网站设计提供些意见：
1.对比图像，文字更具吸引力
与你所认为的相反，在浏览一个网站的时候，能够直接吸引用户目光的并不是图像。大多数通过偶然点击进入你的网站的用户，他们是来寻觅信息的而不是图像。因此，保证你的网站设计凸现出最重要的信息板块，这才是设计的首要原则。
2.眼球的第一运动聚焦于网页的左上角
用户浏览网页的这一习惯应该在意料之中，毕竟左上部为主要操作中心这一点为大多数重要的计算机应用程序的设计所采用。在你构建网站考虑网站设计时，应该尽量保持这一格式。要知道，如果你希望保持个人特色，搭建一个成功的网站，你就必须尊重用户们的习惯。
Read the rest of this entry »
Mar
31
互联网时代创新的含义，不仅仅是某种跨越式的技术，而是利用互联网技术创造出前所未有的商业模式。和互联网精神相契合的是，这一时代的创新往往是在开放、合作、平等与全球化的前提之下发生的。本专题要展示那些在互联网时代脱颖而出，能够持续创新的企业。他们中有的是互联网服务公司，有的是电子制造商，有的是传统制造企业。创新机制各有不同，但都能总结出符合这个时代特征的一些共性来。我们试图描绘出这样一个创新路线图。Who，Doing what，In which ways，To whom，With what effect可以看作这张图景的五个要素，即5W模式。下面这张创新路径图，也可以成为检验企业创新效率的模型。[详细]
转自163>查看全文内容.
