95%的中国网站需要重写CSS网页设计(整理4篇)由网友“你最爱的狗”投稿提供,这里给大家推荐分享一些95%的中国网站需要重写CSS网页设计,供大家参考。
篇1:95%的中国网站需要重写CSS网页设计
很长一段时间,我都使用12px作为网站的主要字体大小,10px太小,眼睛很容易疲劳,14px虽容易看清,却破坏页面的美感。唯独12px在审美和视力方面都恰到好处。
谁对我的网站字体大小有意见?
我老爸,他是第一个向我反映看不清我的网站文字的人。这使我意识到12px,其实只是让我觉得很不错而已,而对于那些视力下降明显的中年以上的人来讲,几乎等于10px对于我的感觉。
于是我告诉他,在“查看”里调整“文字大小”就可以了。但是却发现这是徒劳的。在Firefox能轻易调整的字体大小,怎么在IE就变得如此”坚不可调“?
问题出在哪?
我又试着打开中国的三大门户—新浪,网易,搜狐。它们的字体无一例外的在IE里失去可调性。看来这不是我网站独有的毛病。再看看MSN,Google,A list apart,华盛顿邮报,在IE里却是可调的。难道IE在字体调整上也搞歧视不成?
困扰我的问题直到看到这篇大作:How to size text using ems,才得到彻底的解决。
关键点:
1. IE无法调整那些使用px作为单位的字体大小;
2. 国外的大部分网站能够调整的原因在于其使用了em作为字体单位;
3. Firefox能够调整px和em,但是96%以上的中国网民使用IE浏览器(或内核)。这意味这中国网站的字体大小可以被认为不可调。
95%的中国网站需要重写CSS
在我所观察的中国网站中,包括三大门户,以及“引领”中国网站设计潮流的蓝色理想,ChinaUI等都是使用了px作为字体单位。只有百度好歹做了个可调的表率。
而在大洋彼岸,几乎所有的主流站点都使用em作为字体单位,也就是可调的。
没错,px比em更加容易使用,我也敢打赌大部分读者不知道em为何物或者它相当于多少px。
国外人士如此重视网站易用性(Accessibility),不仅因为其根生蒂固的人文精神,直接原因可能是因为有一部法律来约束他们—例如美国的Section 508,强制网站达到一定的易用性。所以没有哪个主流站点愿意被那些视力下降或是残缺的人告上法庭。
注: 在中国, 可能把微软告上法庭来的更简单点,为什么IE对于px那么死板。
如何重写你的网站CSS
Jorux.com作为一个对视力下降人士负责任的站点,已经重写了CSS的Font-size部分。在这里,Jorux和各个有人文精神的网站主讨论如何用em重写Font-szie的问题。
emvs.px
em是何物?
em指字体高,任意浏览器的默认字体高都是16px。所以未经调整的浏览器都符合: 1em=16px。那么12px=0.75em, 10px=0.625em。为了简化font-size的换算,需要在css中的body选择器中声明Font-size=62.5%,这就使em值变为16px*62.5%=10px, 这样12px=1.2em, 10px=1em, 也就是说只需要将你的原来的px数值除以10,然后换上em作为单位就行了。em有如下特点:
1. em的值并不是固定的;
2. em会继承父级元素的字体大小。
重写步骤:
1. body选择器中声明Font-size=62.5%;
2. 将你的原来的px数值除以10,然后换上em作为单位;
简单吧,如果只需要以上两步就能解决问题的话,可能就没人用px了。经过以上两步,你会发现你的网站字体大得出乎想象。因为em的值不固定,又会继承父级元素的大小,你可能会在content这个div里把字体大小设为1.2em, 也就是12px。然后你又把选择器p的字体大小也设为1.2em,但如果p属于content的子级的话,p的字体大小就不是12px,而是1.2em=1.2 * 12px=14.4px。这是因为content的字体大小被设为1.2em,这个em值继承其父级元素body的大小,也就是16px * 62.5% * 1.2=12px, 而p作为其子级,em则继承content的字体高,也就是12px。所以p的1.2em就不再是12px,而是14.4px。
3. 重新计算那些被放大的字体的em数值。避免字体大小的重复声明,也就是避免以上提到的1.2 * 1.2= 1.44的现象。比如说你在#content中声明了字体大小为1.2em,那么在声明p的字体大小时就只能是1em,而不是1.2em, 因为此em非彼em,它因继承#content的字体高而变为了1em=12px。
诡异的12px汉字(原因待查)
本人在完成em转换时还发现了一个诡异的现象,就是由以上方法得到的12px(1.2em)大小的汉字在IE中并不等于直接用12px定义的字体大小,而是稍大一点。这个问题我已经解决,你只需在body选择器中把62.5%换成63%就能正常显示了。原因可能是IE处理汉字时,对于浮点的取值精确度有限。阅读本篇的读者还有其他解释吗?
本现象只发生在12px的汉字,英文不存在此现象。你可以在这里下载到此表现此现象的文件。下载后请读者用IE打开sample.htm, 可以看到第一段文字明显长于第二段。然后你可以用编辑器打开style.css,看看究竟发生了什么。解决方法就是把style.css中的62.5%换为63%。演示链接
还可以做哪些改进
为什么还需改进:
1. 你的网站css过于复杂,以至于不知道元素的从属关系,很难重写css;
2. 绝大部分人看了本文之后仍然不会重写css;
3. 很大部分人不知道浏览器可以调整页面的字体大小。
所以你需要一个诸如本站信息框中的字体大小调整控件。
相信本站读者的英语能力,这里就不再罗嗦了,请参看:The Text Changer
Important reference:
1. How to size text using ems
2. The Text Changer
备注:
1. 自网站Reboot以来,老爸又反映我整天在”属性一”“属性二”的,看不大明白,已经拒绝访问Jorux.com了;
2. 读者对如何用em重写css,或是对字体大小调整控件有任何疑问,请留言;
3. 本站在加强易用性上做了如下改进:a. 用em重写了css;b. 去除了51.la和文本广告代码,提高了网页加载速度;c. 增加了字体大小调整控件;
4. 重新整理”Other Blogger”链接,请发现被摘掉链接的网站自行摘除链向本站的链接,本站停止交换友情链接。尚保留的网站有如下特点:a. 非日记式博客;b. 内容优秀;c. 原创为主;
5. 本站常规在周一发表post,间隔为一到两周,感谢读者对本站的关注, 以后除星期一以外,您都不需更新本站Feed了。
[END]
来自:jorux.com/archives/95-websites-of-china-need-to-rewrite-css/
52 Responses So Far
红鼻子Says:
嘿嘿,标题就吓我一跳。很多的网站放弃了易用性,最显而易见的就是广告堆砌。
你的老爸也很有意思啊
发发Says:
临时调整字体大小也不是什么好的方法。
用大字体才是解决问题的根本,你说14px虽容易看清,却破坏页面的美感,那是浏览器的渲染问题,IE7的AA系统就很出色,不信你去看看,字体很光洁。对于网页设计师的确IE有种种诟病,但作为普通的用户,才不在乎这些(例如你老爸)。我觉得IE7的AA系统足够吸引大多数用户了。
所以,我觉得不老说IE这不好那不好的,从用户的角度考虑IE做的还是挺好的。
发发Says:
PS
你写的文章还是挺好的,都讲的很透彻,这里说声,谢谢
piaolingdySays:
很多人用ie根本就不知道ie可以调字体大小,所以我觉得还是根据内容的定位设置字体大小为好,还有就是某些固定的单张图片上的字体用em这类单位不好,一旦改变字体大小很可能布局就被搞乱了
另外,我是初学者,不明白为什么在ff和opera中某些用em和百分比的中文字体显示看上去会小很多,但是ie就没有发生过这种情况?
Jorux/BluecssrSays:
To 红鼻子:
标题是有点吓唬人,有点过了。我老爸确实比较新潮,比较能跟上形式。
To 发发:
1. 谢谢你的留言。对于AA系统我可能尝试不了了。因为我只在调试网页时用免安装的IE7;
2. 我所指的破坏页面美感,不是浏览器的渲染问题,而是其占用空间,使版面不协调;
3. 我本人对IE没有太多意见。倒是对FF占用我的XXXMb内存比较在意;但,事到如今,我已经没法常规用IE了,因为我百分之六十的网络活动都依赖FF及其插件;
4. 如果微软的防盗版抓得紧点,估计没有多少人能尝试IE7了;
5. 如果windows同时预装了IE和FF,我估计还是IE占上风。
To piaolingdy:
1. 你说的问题其实不是不可以解决的,建议看看这篇: Text-Resize Detection
与其说用户调整字体会破坏布局,还不如说是设计者为了图方便;
2. FF和opera不是对与em和百分比的中文字体显示过小,你用px也是一样。要解决这个问题,需要重复声明字体大小,比如说你在body里声明了12px, 对于content的字体也需要再次声明字体大小为12px。
鬼仔’s Blog » links for -11-14Says:
[…] 95%的中国网站需要重写CSS (tags: CSS) […]
springSays:
已读,等下做测试
网摘日日看 » links for 2006-11-14Says:
[…] 95%的中国网站需要重写CSS (tags: css) 归类于: 网摘 — kunshou @ 7:39 am […]
luSays:
写得好, 顶一下
luSays:
其实做一点点的小改动就能帮到那么多的人,为什么就是不愿意改呢,而是选择忽视那些智势群体,意识不好哟
Jorux/BluecssrSays:
To Lu:
其实他们不是忽视弱势群体。他们只是没有意识到珍惜每一个可能成为其未来客户的访客重要性,损失的那一部分潜在客户最终会让他们尝到苦头。
xwingSays:
不愿调整的可能还是因为有种根深蒂固的潜意识吧,例如我,
不知道在界面上提供一个调整字体(正常,大字体)的选项会不会方便一点。
Jorux/BluecssrSays:
To xwing:
1. 添加一个选项是个不错的选择;
2. 但如果什么都不做,这不是潜意识可以搪塞得过去的。如果你曾有过调试各个浏览器下的网页兼容性的经历,应该想想为什么。无非就是让使用各种不同浏览器的访客都能收到同等的待遇。浏览器就是访客的虚拟眼睛,如果你在字体大小上拒绝了那部分实际上存在的眼睛,那么为了那些虚拟眼睛还有必要调试网页么?
win-fireSays:
一个字:顶!
vvSays:
网站的可用性和无障碍性,现在中国大部分网站连可用性都没达到,更别说无障碍性了,不过据说最近咱们国家也要针对网站的“无障碍性”立个什么法了~~
哈哈,我们期待着~~~
千LSays:
Jorux,你好,我把你的这篇文章摘到自己的Blog上了,可以吗?
你看下:feng7.blogcn.com
Jorux/BluecssrSays:
To 千风:
你能说一声我已经很满足了。不过,要是事先通知,那会更好一些。
千LSays:
Jorux,谢谢你了。我下次会事先得到你同意的,你写的内容对我很有帮助啊!上次意外停了,好几天,我都以为你不再开了,很是心痛,心里想要是把你写的内容都记下来。。。所以我才会这样的,请原谅呵。
我发现你的网页在我的浏览器里显示有点不正常,也不知是不是我的浏览器出问题了,我有的是我用的是Firefox 2.0.0.1,你看下:images.blogcn.com//1/5/5/qfeng7,200701059612.bmp
Jorux/BluecssrSays:
To 千风:
谢谢你的提醒!可能是字体的问题,我过段时间会处理这个问题。
Thanks
netpodSays:
站长好,你上边的导航为什么一点过就黑了?这样再去点的时候总是觉得有点模糊,不知道目前所在哪个栏目了(特别是把所有栏目点过后,情况很糟糕)。是不是我浏览器问题,还是你应该设置下链接的颜色,多设置个颜色指示点击后的状态会不会better?
呵呵。喜欢你的站。
joruxSays:
谢谢你的建议,有机会一定改进。
RelaxxxSays:
hi,Jorux,请问如何在各种浏览器中使文字的大小都保持一致,如IE,FF,NETSCAPE,一段文字在这三中浏览器中显示大小都不一样,该如何调整CSS呢?谢谢!(改成形如html>body>table {font-size:80%}后不行)
Jorux/BluecssrSays:
To relaxxx:
你的代码可能不兼容所有的浏览器,最好分别声明字体大小,即对各个元素声明字体属性。
ZhangSays:
for me, 你正文的字体小了点,留言中的字体大小比较好
liuSays:
firefox下,如果不设定最小字体大小,jorux.com的正文字体是10px(几乎不可读);如果设定字体大小(显然,国内一般只会设为12px),那么正文字体是14px(比IE下大很多,正如你所说的,“破坏页面的美感”)。
百度也并非所有页面都可调字号,首页就不行。
在浏览器默认字号统一之前,与其特立独行,反倒同时牺牲美感和可读性,不如中庸一些,跟大家一起用px。
liuSays:
况且,有调整字体特殊需要的,何妨用firefox,反正它免费,开源,而且足够优秀。
倒是该期待期待IE新版也有调整固定单位字号的功能。用固定单位,问题或许不在网站,而是在浏览器呢?
Jorux/BluecssrSays:
To liu: 我一直使用Firefox,但没有遇到你说的问题。
读者Says:
209.85.135.104/search?q=cache:hw8UxRCRuf0J:homepage.yesky.com/492/2455492.shtml+css+em&hl=zh-CN&ct=clnk&cd=10&lr=lang_zh-CN
上面这篇文章也很有道理。 em理论很好,用起来不易。
其实,个人认为,要做到易用性好,只要多设计几个css 版本,比如 黑白版本,纯文字版。 字体大小则也调用 不同的 css 文件 就好。 这样 css写起来也方便。 否则很难保证css 在不同 浏览器上的显示效果一致。
hohoSays:
你的h字很漂亮
lboySays:
也不用这么说国人的WEB,CSS,
其实这个做习惯CSS的人有很多都是知道是什么回事,
最初我还不知道PX来锁定字体大小呢,用IE可以调。
只是该大就大不该大就没必要大。字体大小调整的功能用的人也不多。有很多人也不清楚。不过国人还算是人性化设计的,一般新闻信息网站的内容字体都在14PX或以上。或有大、中、小、字体大小设置等等,其实这就是弥补了这一点。
如果说非要整体字体放大的话,这是将来必然的事了。IE7.0也开始慢慢多起来。用IE7试下ctrl++,Ctrl+-试试,看网站有什么没化,有多大有多大,要多小有多小。这是发展了。95%这说明了必然性的,而不是去跟着去改变的,还有5%的也没必要去改变。这是选择。
只要选择过程中考虑到功能与形式的侧重性就可以了。
显示细腻的“微软雅黑”造价在100美元左右。这也说明了微软用心良苦。vista和WINxp sp3横行的时候,就是“微软雅黑”霸道的时候了,切低改变“12PX宋体”的概念了。。
交流学习
QQ214424352
BorgSays:
值得我们学习!
朱高Says:
有些时候,国外的东西不一定就适合中国。看看下面这篇,写得很实在。
hi.baidu.com/weijisifu/blog/item/7db995ca7a3e6786c81768f9.html
Doris ZhuangSays:
Jorux, hi! 我对你的这篇文章非常感兴趣, 而且不觉得夸张。因为我看到我们业内的一位前辈也这么评价我们国内的商用网站,就是各大中小企业的公司英文网站。他的看法基本与你的一致。
现在我想改进我们公司的网站,但是请您能否指点一下具体怎么操作。用FRONTPAGE是否可以改过来?
d12zSays:
这就使em值变为16px*62.5%=10px, 这样12px=1.2em, 10px=1em, 也就是说只需要将你的原来的px数值除以10,然后换上em作为单位就行了
我觉得这个算法不对:)
应该是XP/16=em
gushenSays:
谢谢
MYSays:
好文章啊!!
门户网站源码Says:
看来还是国外网站的做法对用户比较有好啊。
gmhvfSays:
我把字体改过来了,可是设置的#content的宽度也跟着变。不明白是怎么回事,请lz讲一下,谢谢!
gmhvfSays:
就是这个,
body{
font-size:62.5%;
}
#content{font-size:1.2em;
width:78em;
border:0.1em solid #ccc;
left: 50%;
margin-left:-39.1em;
position:relative;
}
当我改变字体大小时,#content的宽度也跟着变大!
有什么解决方法吗?
Jorux/BluecssrSays:
To gmhvf:
可以将content的宽设为780px, 只是字体使用em作为单位。
gmhvfSays:
解决了 呵呵
谢谢!自己太死板了!
gmhvfSays:
FF的插件都有什么啊,能具体说一下吗,还有插件在哪里下啊?
Jorux/BluecssrSays:
To gmhvf:
参考:jorux.com/archives/jorux-firefoxportable/,由于下载源已丢失,插件明细及下载地址参考:jorux.com/archives/jorux-firefoxportable/#comment-2319
freeherSays:
找着找着找来的……明白em是啥了。
笑煞天Says:
又学到了,呵呵.
我的验证码还不错>plan
superGSays:
很久以前的文章
这篇文章说的东西很多本身已经落伍了
RocSays:
写了一大段,结果发表不成功。~
简单来说:
1、字体的可调性,是需要成本,但在国内一个网站,给设计师用于增加网页可用性的空间太小。
2、不是所有网页都适合字体的可调。我经常遇到有人指着网页向我求救,说页面字体太小。无一例外,都是无疑中点了ie中的查看》字体大小》最小。目前比较成熟的做法是大部分新闻网站中采用的,在新闻页中用js的方式增加字体调整功能,大、中、小分开。
3、msn、华盛顿邮报、alistapart之类的网站,之所以使用字体可调,是和它们的页面风格有关,简洁的线条布局让这样的网站在字体调整的同时,布局不会被破坏。有一个比较可以看看,nba.com为什么没有采用可调;espn.com为什么采用了可调,可调后对页面布局的又造成了什么影响。
RaymondSays:
从tony那里连过来,写的不错!受益了!
creepSays:
博主我还不太明白你说的
MSN,Google,A list apart,华盛顿邮报,在IE里却是可调的
是什么意思,怎么个可调法?
dtSays:
一般是为了网页美观不变形才使用px固定字体大小的吧。
楚云Says:
很漂亮的模版,是自己做的吗?能否提供模版下载?
Jorux/BluecssrSays:
To superG:
确实很老的文章了,IE7不存在这种问题。
篇2:移动网站开发――CSS网页设计
上一篇我们谈到了移动网站中的标签,想必很多人也很想了解Mobile CSS的情况吧,本文将和大家一起探讨移动网站中的CSS标准,
介绍
Mobile css的标准也是有些复杂的,与前一篇文章中提到的类似,之前存在着一个W3C制定的CSS Mobile Profile 1.0以及OMA的WAP CSS 1.0,事实上它们都是CSS 2.1的子集,而且内容非常接近,不同的是,WAP CSS 1.0针对移动设备加入了一些扩展,这些扩展通过-wap-前缀来实现。
后来,W3C将二者进行了整合,吸收了WAP CSS1.0的一些优点,推出了CSS Mobile Prifile 2.0规范,它也是CSS 2.1的一个子集。我们本文将主要讨论这个规范。
CSS Mobile Profile 2.0中的CSS支持
因为这是CSS 2.1的一个子集,那么我们对这个规范的内容应该不会陌生,我们通过这个表格可以很直观的看到CSS MP对CSS的支持情况:
支持的不支持的选择器全局选择器(*)、类型选择器(比如h1, div, p等)、子选择器(p>span)、链接伪类 (:link,:visited)、动态伪类(:active, :focus)、类选择器、id选择器、分组(h1,h2,h3{}…):first-child、:hover 、:lang 伪类, :first-letter 、:first-line 伪元素, 兄弟选择器(比如h1 + p),属性选择器 (比如 a[href], a[target=”_blank"])背景和边框background, background-color, background-image, background-repeat, background-attachment, background-position, border, border-width, border-color, border-style(注1)无定位position, top, right, bottom, left, z-index无列表list-style, list-style-image, list-style-typelist-style-position基本的盒模型display(注2), margin, padding, height, min-height, max-height, width, min-width, max-width, float, clear, visibility, overflow(注3), overflow-style(注4)无色彩color无字体font, font-family, font-style, font-variant, font-weight, font-size(注5)无文字text-indent, text-align, text-decoration(注6), text-transform, white-spaceword-spacing, letter-spacing, unicode-bidi线形vertical-align(注7)line-height基本的用户界面utline, outline-color, outline-style, outline-widthcursor滚动marquee-style, marquee-direction, marquee-play-count, marquee-speed无@规则@charset, @import, @media(注8), @namespace@page注1:border-style只支持常用的none、dotted、dashed、solid和inherit,其它的几个并没有被列入规范。
注2:display仅限于inline、block、list-item、none和inherit,不支持run-in和inline-block
注3:overflow只支持auto
注4:overflow-sytle只支持marquee值
注5:font-size只支持大小关键词,比如small、medium、bigger等,px、pt和百分比等不被支持,
注6:text-decoration只支持none、blink、underline和inherit等,overline、line-trough不被支持。
注7:vertical-align 只支持top, middle, bottom, baseline 和inherit。sub, super, text-top, text-bottom, 百分比和长度不被支持
注8:@media规则只支持 handheld 和all 媒体类型。
用法与浏览器支持
就像之前文章里面提到的那样,目前绝大多数的手机是支持XHTML Basic 1.0和XHTML MP 1.0标准的,这就意味着在某种程度上移动网站的HTML/XHTML代码是可以与桌面版的相兼容甚至完全一致的。甚至有些网站的移动版直接使用HTML 4/5或者XHTML 1.0的DTD。这样移动版网站可以直接通过handheld的media type来制定一个移动页面专用的CSS文件:
1
绝大多数传统手机上的浏览器都支持handheld媒体类型,包括opera mini和windows mobile中的IE。
其实考虑到传统手机的自身的限制和移动网络速度的限制,通过media type来加载外部样式是不可取的,通常用于移动版页面的样式不多,而多加载一个外部样式的代价是巨大的。所以,大部分的网站的移动版采用在head中嵌入样式表的方式。
如果,你一定要采用外部样式的话,最好不要用@import,因为有些手机浏览器并不支持。
特别值得一提的是,mobile webkit(包括iphone safari和android chrome lite等)不支持handheld。
而在视觉上的差异,主要是字体的表现差异,这和各个手机浏览器有关,想要做的像素完美,不是件容易的事情。
总结
虽然,移动网站貌似不用考虑太多的功能,布局简单,功能简单,但是现实并没有想象中的那么简单。移动网站面临的最大的问题是浏览器众多,手机终端差别又很大,开发的时候,会遇到这种细节问题。
目前国内移动网站的前端开发,还处于起步阶段,随着iPhone和Android等智能手机的流行,针对高端智能手机设备的网站开发将逐渐盛行,对于这个相对较新的领域,我们还有很多事情要做。
其实本文仅仅涉及到Mobile CSS的一些非常基础的方面,希望可以抛砖引玉,引起更多的人研究和分享移动网站开发的前端技术和技巧,如果你有较深入的研究,欢迎通过前端观察与大家分享。
参考
www.w3.org/TR/css-mobile/
Mobile style. – CSS Mobile Profile 2.0
complete css guide Mobile profile
本文来自:www.qianduan.net/mobile-web-development-css.html
篇3:网站是否需要在线客服?网页设计
【说明】:本文所有截图源于网络,与本身截图的产品无关,仅为举例说明,同时本文讲的很浅显,改天从技术层面讲一下行业网站怎么应用。
昨天和一个朋友聊起网站在线客服的事情,即:
要不要在线客服功能?就是这个:
弹出的时候,好恶心!
要不要电话通话功能?就是这个:输入手机或电话后接通电话,对方公司付费。
在线电话,真的要在首页弹出吗?
好了,图看完了,说正事吧。网站,需要这个功能吗?可以肯定的一点就是,存在就是有价值的,但问题是这个价值对网站有多少意义呢?坦白的讲,我个人观点,在线客服可以有,在线通话也可以有,但必须有限制的去使用这两个功能。网站存在的意义,就是希望用户可以自行查看内容,然后做出自己的选择判断,从而降低客服人员成本。如果花大价钱做个网站,然后马上让用户电话咨询,那么请问,你做出来的网站还有什么意义呢?
相信大家都会碰到这样的问题,正在看网页的时候,突然弹出一个对话框,然后提示你要不要帮助,要不要在线咨询。当时的你是什么感觉?是不是有一种被强迫购买(恩,和谐的词汇,自己理解!)的感觉?
事实上这种感觉就和大家去超市购物一个道理,本身超市商品罗列已经有了一定的规则,而我们在购物时也习惯自己先做判断,如果有需要的时候在看看说明来决定要不要买。但是超市有导购吗?有的。聪明的导购会在你选择为难时帮你选择,这个时候你也会很欣慰有人能帮你。但,如果你刚走进超市的大门,就冲上来一群导购拉着你问你有什么需要,你又作何感想?
这个道理,凡是用过互联网的人都知道。可是为什么还要在网站首页弹出呢?这让我想起早年的工具条,甚至更早期的无限网站弹窗。很恶心!当看到这样的网站时,我有一种说不出来的感觉,而且一旦发现这样的弹窗,我直接关闭网站,管你是啥。
而事实上,我们也会发现,凡是用这样做法的网站,都是一些传统企业网站。很伤感,也很无奈。就比如这家我无意中发现的企业网站:
可怜的老板,你的钱浪费在什么地方你都不知道!
当我看到这个网站时,我只能悲哀的说,老板,你太可怜了。你不仅被忽悠去了N多钱,而且失去了N多本来你可以得到的客户!
然后我又打开了某提供这种功能的公司网站,惊喜的发现,他们所有客户的首页都有这种弹窗,可偏偏他们公司的首页没有弹窗!老板们,花自己钱的时候好好想想吧。而且,我发现了一个很巧合的事情,他们首页的这个数字大概4-5秒钟自动增加一个,真是神奇的事件!就是这个数字:
每隔4-5秒钟加1的神奇数字
其实这种事情完全可以避免,比如:在线客服固定位置,电话帮助只在特定位置出现等等。只可惜的是,传统企业老板根本不知道。他们只知道这个功能很炫,很酷,但最终结果呢?甚至于如果我填了一个信息台的电话应该怎么办呢?对方无语!
在线客服的应用
在线客服的形式:
1、基于IM工具的在线客服,如QQ,阿里旺旺;
优点:无需再次开发,只要拥有客户端软件即可;同时后续客户管理容易。
缺点:与客户端的安装数量有密切关系,与用户是否注册有关(运营出来的人为障碍,不在本文评论范围)。
2、第三方的在线客服工具,如53客服,live800等;
优点:无需客户端软件支持,点击即可使用,
缺点:后续客户管理异常困难。
在线客服的原理:
1、IM工具本身就是聊天、在线沟通用的,开发在线客服只是将IM窗口转变为web窗口而已。
2、第三方客服工具的原理是早期的网页聊天室原理,只是变成了1对1的聊天而已,这种技术N年前就已经实现了。
谁要用在线客服?
1、首先需要明确网站的产品是销售驱动还是产品驱动。
销售驱动就是需要业务员电话外呼,行业网站多属于这种情况。为销售网站会员或广告或其他产品,需要人为销售的行为,称为销售驱动。——举例:你不想买东西,然后有人使劲和你说,最后你也许就会买了。
产品驱动就是不需要更多的介绍,全靠网页内容介绍来促使用户完成交易。为销售产品,基本脱离人为销售,依靠网站产品介绍为主的销售行为,称为产品驱动。——举例:你看中某一产品,看完介绍后就买了,中间无销售人员。
2、其次再对“在线客服”做一个细化,即分为售前支持和售后服务。
售前支持指用户在未完成产品购买前的咨询,即用户有很多的为什么,需要你来解决。——B2C,C2C网站经常需要。(我的总结是网站产品说明做的很垃圾,客户看不到想要的资料,只能问客服。参见等下的第4条。)
售后服务指用户完成了购买以后,产生的使用困惑或者需要的帮助。——这个只要是产品都需要。
3、接下来需要对网站用户群做一下细化,简单分为网络应用不熟练和网络应用熟练两种,仅此而已。(恩,读者请不要在这里和我较真,要对用户细分是很困难的事情,我这里只是简单的区分。这个要分的非常清楚很难,也和用户的知识结构、学习能力等等有很大的关系。)
网络应用不熟练指对网络一点不懂或者说对电脑都不懂,或者只懂得一点点的。——举例,我见过一个销售人员指导一个完全不懂得网络,甚至打字都很困难的人使用自己网站,是通过在线客服工具完成的,不停的截图加文字指引来帮助客户使用网站。
网络应用熟练指相对网络操作、应用等都比较懂的。——举例,依靠网络发展客户或谋生或购物的人等等。相对来说他们已经非常熟悉购物流程。但他们还在不停的找客服问来问去,又为了什么呢?
4、你的网站将产品说明都列清楚了吗?
直接举例:昨天我想在网上买一个锡制茶叶罐,对于这种茶叶罐,我需要知道的是茶叶罐的大小尺寸、盒盖方式、内部做工、密封性、锡含量、单体重量、外部花纹这几个关键指标。但是郁闷的是没有找到一家网店可以把这几个指标说的清楚的。要么缺这个要么缺哪个,总之没有一家店能让我看完以后就能马上下单的,因为我有太多的疑问不得不通过在线交流来寻找答案。
开始总结吧:
销售驱动型产品,是需要在线售前支持和售后服务的。
产品驱动型产品,还是不要用了,你需要用你的网站来减少客服的工作,当然,前提是你的产品要货真价实。赚钱诚可贵,诚信价更高!
如果是企业网站,我是真的建议你不要做在线客服了。
本文出自“我是webplanner” 原文链接:www.54wp.com.cn/?p=147 和 www.54wp.com.cn/?p=162
篇4:网站改版前需要注意的几个问题网页设计
随着互联网的快速发展,越来越多的网站面临着改版的需求,当我们隔一段时间再上某网站时,有时会惊讶的发现该网站已经改版了,其实网站改版就像是做整容手术一样,在焕发另一春的同时,也可能面临着手术失败而导致毁容的结局。整容是因为对自己的相貌不满意或者是想让自己变得更漂亮才去做的手术,而网站改版却不仅仅只是因为相貌的原因,还有很多其他的因素影响着,在这些略显杂乱的关系中需要理清几个问题:
是否真的需要改版?
这是在网站改版之前最需要也是最必要处理的一个问题。究竟网站改版只是一时的兴起,还是经过深思熟虑的事情。决策层是最重要的层面,决策层的任何一个决策都会影响到整个网站。所以在网改版之前请确保这次改版并不是因为一时兴起。
究竟是为了什么而改版?
既然已经决定了要对网站做一个改版,那么接下来就需要明白的一个问题是,究竟是为了什么而改版?
通常情况下,网站改版有两种情况:一是因为网站本身的内容扩充导致现在的网站架构承载不下更多的内容,二是基于网站用户需求的转变而导致网站转型。当然也不能排除纯粹是为了网站的相貌而做出改版的决策。
改版后的期望是什么?
当然这也是在网站改版之前所需要面对的一个重要问题。网站改版之前,就需要对改版后的网站做出一个期望,期望改版完成后的网站能给网站带来什么?需要评估改版过程中投入的时间、人力、物力以及其它方面的资源能否在改版后的网站中得到体现,也就是说改版后的网站能否带来此前投入的同等价值或者是最大的价值(这个当然是最好的了)。
改版时网站的架构是否需要重建?
由于网站本身内容的扩充而产生的改版需求是最为常见的,因为网站的设计并不是在一开始就是定性的,网站的设计是具有一定的流动性的,随着网站在发展中对于用户以及内容的积累,网站的运营方向需要做出阶段性的调整。这个阶段性的调整可以是大到整站的信息架构重建,也可以小到仅仅只是修改页面中的某一处细微的地 方。但是不管这个阶段性的调整是大是小,都会涉及到网站的改版,只是这个改版也是随着调整力度的大小而改变。
如果是做出大的调整,那么无疑就需要重新梳理网站原有的信息架构,并且设计出更加合理的升级版的信息架构,而这也是网站改版成功与否最为关健的一点,
改版时是否需要引入最新技术?
如果把这个问题问上十个人,相信有六个或者以上的人会认为应该引入最新的技术,因为对新技术的追求是永无止境的,而且如果能在新网站中引入最新的技术,从另一方面上也证明了网站的技术实力。
但技术实力仅仅只是网站的一部分,一个完整的网站需要的是各方面的资源综合发展,技术强运营弱或者是运营强技术弱都是不行的,“短板效应”是很多人都知道的原理,决定最终储水量的往往是木桶上那块最短的木板。
对新技术的追求本身没有错,但在这个追求过程中所投入的成本是否能有效的控制是个很大的疑问。如果不能控制这个成本,那选择适合网站目前的技术无疑是最明智的作法。
改版时需要什么样的数据支持?
有句话叫做“有钱并不是万能的,但没钱是万万不能的”,数据之于网站也是最样的道理,有数据支持并不是万能的,但没有数据支持无疑会使网站的改版陷入很被动的境地。
用户使用网站的习惯?页面上哪些内容是用户最常点击的?用户访问网站的一般路径?用户在网站的平均停留时间?以及用户的忠诚度等一系列的数据都是需要做出正确合理的分析的,因为改版后的网站肯定会引起这些数据的波动,而引起的这些波动是否会导致网站的用户流失?以及如何尽可能平缓的减少这些波动性?
改版后给用户带来的影响?
虽然网站改版的前提大部分都是为了让用户在使用网站时有更佳的体验,但事物皆有两面性,有利必然就有弊。面目全非给用户带来的影响远远大于某一处细节的修改,无论这个影响是好是坏。
如前面所说的数据的波动性,用户如何使用网站就是这些数据当中重要的一环,改版时需要尽可能的提取出数据中不能被影响到的部分,如果必须影响到用户的使用,那应该是让用户有一个平缓的过渡还是快速的过渡呢?如果改版后是一个更好的设计,当然可以使用户快速的过渡到新网站中去;但如果用户在使用网站时已经积累了长期的习惯,并且短时间内很难更改的话,那选择给用户一个平缓的过渡时间无疑是最合适的。
本文出自:www.prower.cn/interaction/1134
★ 前端工程师简历
★ 联想面试笔试题
★ 软件公司实习报告
★ 软件开发实习报告
【95%的中国网站需要重写CSS网页设计(整理4篇)】相关文章:
网页制作毕业生求职信2023-05-25
计算机专业毕业生求职简历的示范2022-08-27
教你如何用ISAPIRewrite做IIS防盗链2022-09-24
seo面试题与答案2023-02-15
程序员实习报告2023-10-28
安全操作规范2022-12-15
详解CSS定位的应用及注意事项2022-12-06
.net面试项目介绍范文2022-11-16
java飞机大战心得体会2023-07-20
网站建设实验心得体会1000字2022-05-06