• 771
o

o

o

o

(

O

O

O

\

L

(

O

O

O

O

O

\

L

(

O

|

|

\

\

|

|

\

\

\

\

(

(

8

o

o

o

(

(

8

o

o

o

o

)

)

b

o

O

o

o

o

o

o

o

)

b

o

O

o

o

o

o

o

o

o

o

o

/

/

/

_

_

_

C

C

O

(

-

喜欢王小峰的同学肯定喜欢熟悉The Simpsons里的巴特

呃,有位牛人(西班牙语)用纯HTML+CSS画出巴特的爸爸河马,本帖那个就是不是图片,想起了多年前也有个牛头人用纯HTML做了一幅Linux企鹅图,哈哈真怀念

在主流浏览器下都能正常显示,

  • Internet Explorer 5.5, 6 , 7
  • Opera 9
  • FireFox 2 3beta
  • Safari 3

下面是全部源代码:

<div style="width: 100%; height: 466px;">
<div style="float: left; border: 2px solid #000; line-height: normal; background-color: #fff;">
<div style="width: 6.23em; height: 7.7em; font-family: Verdana; font-size: 60px; overflow: hidden;">
<div style="margin-top: -0.7em">
<div style="position: absolute; padding-left: 1.56em; padding-top: 0.37em;">
<div style="font-size: 2.57em; font-weight: bold; color: #000;">o</div>
</div>
<div style="position: absolute; padding-left: 1.62em; padding-top: 0.53em;">
<div style="font-size: 2.38em; font-weight: bold; color: #fff;">o</div>
</div>
<div style="position: absolute; padding-left: 1.2em; padding-top: 0.67em;">
<div style="font-size: 2.48em; color: #000;">o</div>

</div>
<div style="position: absolute; padding-left: 1.29em; padding-top: 0.85em;">
<div style="font-size: 2.23em; color: #fff;">o</div>
</div>
<div style="position: absolute; padding-left: 1.57em; padding-top: 2.03em;">
<div style="width: 0.32em; height: 0.52em; background-color: #fff;"></div>
</div>
<div style="position: absolute; padding-left: 1.52em; padding-top: 1.56em;">
<div style="font-size: 0.8em; font-style: italic; color: #000;">(</div>
</div>
<div style="color: #000;">
<div style="position: absolute; padding-left: 1.07em; padding-top: 0.62em;">
<div style="font-size: 4.57em;">O</div>
</div>

<div style="position: absolute; padding-left: 1.05em; padding-top: 1.15em;">
<div style="font-size: 3.53em;">O</div>
</div>
<div style="position: absolute; padding-left: 1.12em; padding-top: 0.74em;">
<div style="font-size: 4.63em;">O</div>
</div>
<div style="position: absolute; padding-left: 1.08em; padding-top: 3.64em;">
<div style="font-size: 1.77em; font-weight: bold; font-style: italic;">\</div>
</div>
<div style="position: absolute; padding-left: 1.17em; padding-top: 4.8em;">
<div style="font-size: 3.29em; font-weight: bold; font-style: italic;">L</div>
</div>
<div style="position: absolute; padding-left: 3.14em; padding-top: 5.21em;">

<div style="font-size: 3.01em; font-weight: bold; font-style: italic; height: 0.96em; overflow: hidden;">(</div>
</div>
<div style="position: absolute; padding-left: 4.13em; padding-top: 3.23em;">
<div style="font-size: 0.7em; font-weight: bold;">O</div>
</div>
<div style="position: absolute; padding-left: 1.37em; padding-top: 5.08em;">
<div style="font-size: 0.97em; font-weight: bold;">O</div>
</div>
</div>
<div style="color: #FED90E">
<div style="position: absolute; padding-left: 1.15em; padding-top: 0.76em;">
<div style="font-size: 4.37em;">O</div>
</div>

<div style="position: absolute; padding-left: 1.14em; padding-top: 1.26em;">
<div style="font-size: 3.37em;">O</div>
</div>
<div style="position: absolute; padding-left: 1.2em; padding-top: 0.87em;">
<div style="font-size: 4.42em;">O</div>
</div>
<div style="position: absolute; padding-left: 1.15em; padding-top: 3.61em;">
<div style="font-size: 1.7em; font-weight: bold; font-style: italic;">\</div>
</div>
<div style="position: absolute; padding-left: 1.24em; padding-top: 4.93em;">
<div style="font-size: 3.18em; font-weight: bold; font-style: italic;">L</div>
</div>
<div style="position: absolute; padding-left: 3.03em; padding-top: 5.05em;">

<div style="font-size: 3.2em; font-weight: bold; font-style: italic; height: 0.96em; overflow: hidden;">(</div>
</div>
<div style="position: absolute; padding-left: 4.18em; padding-top: 3.34em;">
<div style="font-size: 0.55em; font-weight: bold;">O</div>
</div>
</div>
<div style="position: absolute; padding-left: 1.84em; padding-top: 2.37em;">
<div style="width: 1.92em; height: 5.76em; background-color: #FED90E;"></div>
</div>
<div style="position: absolute; padding-left: 3.70em; padding-top: 2.73em;">
<div style="width: .30em; height: 1.56em; background-color: #FED90E;"></div>
</div>
<div style="position: absolute; padding-left: 4.36em; padding-top: 3.51em;">
<div style="width: .16em; height: .34em; background-color: #FED90E;"></div>
</div>

<div style="position: absolute; padding-left: 1.62em; padding-top: 5.47em;">
<div style="font-size: 10px">
<div style="width: 2.6em; height: 3.0em; background-color: #FED90E;"></div>
</div>
</div>
<div style="color: #000;">
<div style="position: absolute; padding-left: 1.23em; padding-top: 4.57em;">
<div style="font-size: 0.67em;">|</div>
</div>
<div style="position: absolute; padding-left: 1.23em; padding-top: 4.37em;">
<div style="font-size: 0.67em;">|</div>
</div>
<div style="position: absolute; padding-left: 1.34em; padding-top: 4.37em;">
<div style="font-size: 0.67em;">\</div>

</div>
<div style="position: absolute; padding-left: 1.4em; padding-top: 4.53em;">
<div style="font-size: 0.67em;">\</div>
</div>
<div style="position: absolute; padding-left: 1.55em; padding-top: 4.49em;">
<div style="font-size: 0.67em;">|</div>
</div>
<div style="position: absolute; padding-left: 1.55em; padding-top: 4.19em;">
<div style="font-size: 0.67em;">|</div>
</div>
<div style="position: absolute; padding-left: 1.66em; padding-top: 4.19em;">
<div style="font-size: 0.67em;">\</div>
</div>

<div style="position: absolute; padding-left: 1.76em; padding-top: 4.45em;">
<div style="font-size: 0.67em;">\</div>
</div>
<div style="position: absolute; padding-left: 1.27em; padding-top: 2.54em;">
<div style="font-size: 0.42em; font-weight: bold; font-style: italic;">\</div>
</div>
<div style="position: absolute; padding-left: 1.51em; padding-top: 2.18em;">
<div style="font-size: 0.42em; font-weight: bold; font-style: italic;">\</div>
</div>
<div style="position: absolute; padding-left: 2.31em; padding-top: 5.32em;">
<div style="font-size: 1.47em; font-weight: bold; font-style: italic;">(</div>
</div>
<div style="position: absolute; padding-left: 2.29em; padding-top: 5.69em;">

<div style="font-size: 1.11em; font-weight: bold;">(</div>
</div>
<div style="position: absolute; padding-left: 2.92em; padding-top: 4.72em;">
<div style="font-size: 2.4em; font-weight: bold;">8</div>
</div>
<div style="position: absolute; padding-left: 2.43em; padding-top: 3.96em;">
<div style="font-size: 3.13em; font-weight: bold; font-style: italic;">o</div>
</div>
<div style="position: absolute; padding-left: 2.31em; padding-top: 4.05em;">
<div style="font-size: 3.13em; font-weight: bold; font-style: italic;">o</div>
</div>
<div style="position: absolute; padding-left: 2.33em; padding-top: 4.37em;">
<div style="font-size: 3.06em; font-weight: bold;">o</div>

</div>
</div>
<div style="color: #CDB26F">
<div style="position: absolute; padding-left: 2.39em; padding-top: 5.36em;">
<div style="font-size: 1.38em; font-weight: bold; font-style: italic;">(</div>
</div>
<div style="position: absolute; padding-left: 2.37em; padding-top: 5.75em;">
<div style="font-size: 1.04em; font-weight: bold;">(</div>
</div>
<div style="position: absolute; padding-left: 2.95em; padding-top: 4.82em;">
<div style="font-size: 2.25em; font-weight: bold;">8</div>
</div>
<div style="position: absolute; padding-left: 2.49em; padding-top: 4.15em;">
<div style="font-size: 2.93em; font-weight: bold; font-style: italic;">o</div>

</div>
<div style="position: absolute; padding-left: 2.39em; padding-top: 4.22em;">
<div style="font-size: 2.93em; font-weight: bold; font-style: italic;">o</div>
</div>
<div style="position: absolute; padding-left: 2.4em; padding-top: 4.5em;">
<div style="font-size: 2.87em; font-weight: bold;">o</div>
</div>
</div>
<div style="position: absolute; padding-left: 2.98em; padding-top: 6.09em;">
<div style="width: .76em; height: 1em; background-color: #CDB26F;"></div>
</div>
<div style="color: #000">
<div style="position: absolute; padding-left: 3.69em; padding-top: 4.28em;">
<div style="font-size: 2.2em;">o</div>

</div>
<div style="position: absolute; padding-left: 4.62em; padding-top: 5.42em;">
<div style="font-size: 1.01em;">)</div>
</div>
<div style="position: absolute; padding-left: 4.78em; padding-top: 5.72em;">
<div style="font-size: 0.72em;">)</div>
</div>
<div style="position: absolute; padding-left: 4.53em; padding-top: 5.65em;">
<div style="font-size: 0.94em;">b</div>
</div>
<div style="position: absolute; padding-left: 4em; padding-top: 5.09em;">
<div style="font-size: 1.59em; font-weight: bold;">o</div>
</div>

<div style="position: absolute; padding-left: 3.33em; padding-top: 4.79em;">
<div style="font-size: 1.95em; font-weight: bold;">O</div>
</div>
<div style="position: absolute; padding-left: 3.15em; padding-top: 4.3em;">
<div style="font-size: 2.42em; font-weight: bold;">o</div>
</div>
<div style="position: absolute; padding-left: 3.01em; padding-top: 4.46em;">
<div style="font-size: 2.23em; font-weight: bold;">o</div>
</div>
<div style="position: absolute; padding-left: 2.88em; padding-top: 4.43em;">
<div style="font-size: 2.23em; font-weight: bold;">o</div>
</div>
<div style="position: absolute; padding-left: 2.81em; padding-top: 4.71em;">

<div style="font-size: 1.9em; font-weight: bold;">o</div>
</div>
<div style="position: absolute; padding-left: 3.69em; padding-top: 4.74em;">
<div style="font-size: 1.97em; font-weight: bold;">o</div>
</div>
</div>
<div style="color: #CDB26F">
<div style="position: absolute; padding-left: 3.7em; padding-top: 4.4em;">
<div style="font-size: 2.06em;">o</div>
</div>
<div style="position: absolute; padding-left: 4.57em; padding-top: 5.44em;">
<div style="font-size: 0.95em;">)</div>
</div>

<div style="position: absolute; padding-left: 4.49em; padding-top: 5.66em;">
<div style="font-size: 0.88em;">b</div>
</div>
<div style="position: absolute; padding-left: 4.01em; padding-top: 5.14em;">
<div style="font-size: 1.48em; font-weight: bold;">o</div>
</div>
<div style="position: absolute; padding-left: 3.37em; padding-top: 4.84em;">
<div style="font-size: 1.83em; font-weight: bold;">O</div>
</div>
<div style="position: absolute; padding-left: 3.21em; padding-top: 4.38em;">
<div style="font-size: 2.27em; font-weight: bold;">o</div>
</div>
<div style="position: absolute; padding-left: 3.07em; padding-top: 4.54em;">

<div style="font-size: 2.09em; font-weight: bold;">o</div>
</div>
<div style="position: absolute; padding-left: 2.95em; padding-top: 4.53em;">
<div style="font-size: 2.08em; font-weight: bold;">o</div>
</div>
<div style="position: absolute; padding-left: 2.88em; padding-top: 4.78em;">
<div style="font-size: 1.78em; font-weight: bold;">o</div>
</div>
<div style="position: absolute; padding-left: 3.71em; padding-top: 4.79em;">
<div style="font-size: 1.85em; font-weight: bold;">o</div>
</div>
<div style="position: absolute; padding-left: 2.87em; padding-top: 4.59em;">
<div style="font-size: 1.93em; font-weight: bold;">o</div>

</div>
<div style="position: absolute; padding-left: 3.09em; padding-top: 4.55em;">
<div style="font-size: 1.93em; font-weight: bold;">o</div>
</div>
<div style="position: absolute; padding-left: 2.73em; padding-top: 5.03em;">
<div style="font-size: 1.44em; font-weight: bold;">o</div>
</div>
<div style="position: absolute; padding-left: 2.59em; padding-top: 5.77em;">
<div style="font-size: 0.82em; font-weight: bold;">o</div>
</div>
<div style="position: absolute; padding-left: 3.04em; padding-top: 6.4em;">
<div style="font-size: 0.16em; font-weight: bold; font-style: italic; color: #000;">/</div>
</div>

<div style="position: absolute; padding-left: 3.03em; padding-top: 6.4em;">
<div style="font-size: 0.16em; font-weight: bold; font-style: italic; color: #000;">/</div>
</div>
<div style="position: absolute; padding-left: 3.02em; padding-top: 6.4em;">
<div style="font-size: 0.16em; font-weight: bold; font-style: italic; color: #000;">/</div>
</div>
</div>
<div style="position: absolute; padding-left: 3.24em; padding-top: 2.49em;">
<div style="font-size: 2.76em; font-weight: bold; color: #000;">•</div>
</div>
<div style="position: absolute; padding-left: 3.34em; padding-top: 2.68em;">
<div style="font-size: 2.49em; font-weight: bold; color: #fff;">•</div>
</div>
<div style="position: absolute; padding-left: 4.2em; padding-top: 4.26em;">
<div style="font-size: 0.28em; font-weight: bold; color: #000;">•</div>

</div>
<div style="position: absolute; padding-left: 3.9em; padding-top: 4.05em;">
<div style="font-size: 1.47em; font-weight: bold; color: #000;">•</div>
</div>
<div style="position: absolute; padding-left: 3.99em; padding-top: 4.23em;">
<div style="font-size: 1.2em; font-weight: bold; color: #FED90E;">•</div>
</div>
<div style="position: absolute; padding-left: 3.66em; padding-top: 4.7em;">
<div style="font-size: 10px">
<div style="width: 4.6em; height: 3.88em; background-color: #FED90E;"></div>
</div>
</div>
<div style="position: absolute; padding-left: 3.68em; padding-top: 3.36em;">
<div style="font-size: 1.2em; color: #000;">_</div>
</div>
<div style="position: absolute; padding-left: 3.68em; padding-top: 4.03em;">

<div style="font-size: 1.2em; color: #000;">_</div>
</div>
<div style="position: absolute; padding-left: 3.64em; padding-top: 4.03em;">
<div style="font-size: 1.2em; color: #000;">_</div>
</div>
<div style="position: absolute; padding-left: 1.96em; padding-top: 2.33em;">
<div style="font-size: 3.04em; font-weight: bold; color: #000;">•</div>
</div>
<div style="position: absolute; padding-left: 2.06em; padding-top: 2.5em;">
<div style="font-size: 2.77em; font-weight: bold; color: #fff;">•</div>
</div>
<div style="position: absolute; padding-left: 2.67em; padding-top: 4.23em;">
<div style="font-size: 0.28em; font-weight: bold; color: #000;">•</div>
</div>
<div style="position: absolute; padding-left: 1.46em; padding-top: 5.18em;">

<div style="font-size: 0.66em; color: #000;">C</div>
</div>
<div style="position: absolute; padding-left: 1.47em; padding-top: 5.4em;">
<div style="font-size: 0.66em; color: #000;">C</div>
</div>
<div style="position: absolute; padding-left: 1.62em; padding-top: 5.53em;">
<div style="font-size: 10px">
<div style="width: 2.2em; height: 2.2em; background-color: #FED90E;"></div>
</div>
</div>
<div style="position: absolute; padding-left: 1.45em; padding-top: 5.19em;">
<div style="font-size: 0.8em; font-weight: bold; color: #FED90E;">O</div>
</div>
<div style="position: absolute; padding-left: 1.58em; padding-top: 5.47em;">

<div style="font-size: 0.25em; font-weight: bold; font-style: italic; color: #000;">(</div>
</div>
<div style="position: absolute; padding-left: 1.62em; padding-top: 5.46em;">
<div style="font-size: 0.25em; font-weight: bold; font-style: italic; color: #000;">-</div>
</div>
</div>
</div>
</div>
</div>

20 Comments
  • 770

快毕业了,面临就业,在阿里市场部实习半年,最大的收获是明确了自己的方向,比如我在做的事情分为视觉设计 交互设计和前端界面开发,比如打好了XHTML+CSS的基础,比如我想去的地方是UED!

在进入一个专业团队之前,我选择了前端界面开发:(Justin同学写的基本要求如下)

if (
( (JS>60 || AS>60) && CSS>60 && XHTML>80 )
&& (scriptLanguage + CSS +XHTML) > 220
&& teamWork>80
&& serverEndLanguage>60
){
alert(’Come on!’);
}

和Justin交流了下,确认了自己在JS和服务器终端语言上还有差距以及具体的距离

做这行最重要的是
1,思想;2,基础;

妙语连珠的前提是对文字深刻的理解

还有两个月,QQ MSN offline,种子停止发送,有事email或GT联系,非礼勿聊

感谢我爱水煮鱼推荐的PHP教程,感谢Justin一直以来的帮忙和热心的建议
不管最后是否能加入阿里国际站UED,相信对我都是很大的提升:)

嗷呜~

26 Comments
  • 769

呃,阿里妈妈被丢了有几个广告了,好玩的是广告主制作的Banner是按着大猫脑袋来发挥

哈哈,Google Adsense不如ADWords就是因为投放的匹配度不高,这次简直是量身定做

其实好玩儿的banner不失为对blog的一种推动

还记得上上个星期的内裤广告么...绝对orz

就连最近黄站上的广告条子也变得好看了点...»»

恩,当然还有送给妈妈的祝福

可见其实丢广告条还是不错的

但是,粗糙,闪啊闪过头,很扰人的广告条绝对会有反作用
能避免还是尽量去避免

为了答谢那个谁,插播一条文字广告

伊世界服饰网除了卖Bra内裤什么的,还是是一家主营原仿单外贸服装、日韩仿单服饰、品牌时装的批发网站  总之适合爱漂亮的MM和爱MM的GG

在销售心理学中,站到客户的角度,客户都有以下几个疑问:

1、你是谁?
2、你要跟我介绍什么?
3、你介绍的产品和服务对我有什么好处?
4、如何证明你介绍的是真实的?
5、为什么我要跟你买?
6、为什么我要现在跟你买?

如果搞定了这些疑问,相信电子商务网站转化率会提升N个百分点

啊,啥,你要黄站?Ok~我们有贴心的阿里妈妈黄站黄页

10 Comments
  • 768

呃,在Alipay主办的08年D4 Design Exchange上遇到李坏,不知道是不是犯贱报那娃儿,特水灵,特清秀,准备的资料也特有味道

这次合法集会对于不懂设计不懂体验的我来说,如标题图左下角的2008.S.B所述,大部分时间都很无聊+枯燥,快进balabalabala

李坏很提神,坏同学提出

1 » 交互设计师不仅仅要让用户感觉爽,考虑技术可行性也是必要的

2 » 在用户体验与商业利益产生冲突的时候,无奈还是钱说了算
例如:淘宝的弹出广告,这年头谁管钱谁有权,最终还是放上了广告,后果很明显,遭遇了一次损失,才重视起用户体验

3 » 正在兴头上,时间到了...妈的

我一直思考的是:如何避免能预见的危害,在没有有力的数据支持下,又如何寻找利益最大化那个点,并说服所有人往这个点切.

扯2点具体的用户体验问题吧

一点.旺旺(淘宝)为什么不能拒绝陌生人消息?整天被垃圾群发消息弄的恶心死了
旺旺(贸易通)都有一个选项 只接受好友的消息 可自由开关
QQ则对非好友添加了一个友好的小秘书
归根到底技术手段杜绝群发软件则是治本之道

二点.淘宝网页有个mm会在你有消息的时候提醒你有消息,切换个页面提醒一次,一直提醒一直提醒直到你崩溃或查看了所有那该死的垃圾消息
你有新短消息,请注意查收,呕!!! 谁能告诉我怎么关掉,而不影响其他声音

---update------------
感谢伶航同学:
关闭MM呻吟方法是 进入站内信页面,列表下方有个关闭呻吟的按钮
但大猫觉得这个选项应该放到[基本设置]-[网站提醒设置]里面,虽然我用淘宝有些年头,但是我不会浪费时间仔细挖掘每个角落,相信大部分的用户上淘宝都是直奔主题

30 Comments