Press enter to see results or esc to cancel.

怎样设计一个极致用户体验的网站

设计一个极致用户体验的网站,打通营销任督二脉,提高转化率,才是网上推广成功的关键。

1。 首先你要设计一个靠谱的网站,这个是一个非常艰巨的任务,也许需要3个月到半年的时间才可以达到你想要的理想状态,或者说用户觉得可以使用的状态。先说说目前我观察到的大部分SEO站长类型网站所面临的一些重要问题,小的细节都不多说了。

首先是网站的设计问题,通常内容布局的不是太合理,主页的内容都是太多了,如果你的网站有很多内容,你觉得都要塞到主页里面,那你就错了,布局内容有很多隐藏的方法。如果你内容隐藏起来了,重点在主页展示用户最喜欢的内容,让他们没有选择性的阅读困难。如果主页内容太多了,那么会造成阅读的疲劳。

不信,什么事情你都不要问别人,问你自己的体验就很清楚了,你去别人网站浏览的时候,是不是会觉得这个网站设计很舒服,简洁,浏览起来很方便,而且也有挺多的内容,那是他们花了很多精力在网站的用户体验上面。还有的网站一进去看起来就觉得很不舒服,浏览起来很困难。所以,我的建议是不管做什么事情都要先问下自己的内心,如果你去看了设计不好的网站,体验是怎么样的?如果你自己都不喜欢这些设计,那别人怎么会喜欢呢?通常人性都是一样的。

***查看下面网页隐藏内容的设计方法:

-问号提示内容设计:

-手风琴内容设计:

-选项按钮内容设计:

 

还有就是视频内容设计,你可以把大部分的内容设计成视频模式,然后让它变成一个小的按钮,用户点击下就可以放大播放视频。

-如果内容太多,应该尽量把你的内容分成更多的网页,用户点击一下,打开新的窗口来查看。然后把 ’主页菜单‘

设计成下滑点击的菜单,所有的网页可以一目了然的看到。总之你的目的就是所有的设计应该是讲究简洁,用户可以很快的找到需要的内容,主题突出,没有选择性的困难。这样的话会大大增加网站的用户体验。

网页设计工具推荐: http://www.bootcss.com/

 

2。 网站颜色搭配问题: 通常你的网站应该要有一个主要的颜色,比如HTML颜色代码-‘粉色’#CC0099 , 还有的2个基本搭配颜色就是 ‘白色调’ 和 ‘黑色调’ 的搭配,通常背景为白色调,文字为黑色调。所以通常这3个颜色应该是你网站的基本色调,其他的内容元素可以增加一些不同色调,但是网站的80%内容应该主要是3个色调,根据主题来调整你的主要粉色色调。

如果你知道一些颜色搭配的设计,你就会发现通常颜色太多的话反而让人看的很不舒服,好像很乱的感觉。因为颜色代表了人的情感。比如红色让人看了有冲动的感觉,紫色的话显的高贵,白色代表简单,纯洁,黑色代表大气,粉色代表情趣,等等。

HTML颜色代码: http://www.w3school.com.cn/html/html_colors.asp

帮你挑选网页颜色主题工具: https://color.adobe.com/create/color-wheel/

 

3。 文字设计问题: 通常很多中文网站用的都是自定义的文字,其实网上有成千上万不同云端的免费文字来供你使用,不同的字体会为你的网站体现不同美感。你应该找个合适你的网站风格,用户群体的文字来为你的网站增加美感。建议文字尽量少使用粗体,这样会体现网站的笨拙。细的字体看起来是比较体现美感的。

通常的做法是使用云端字体,就是找到这个字体的代码,然后嵌入到你的网页头部的部分就可以了,在 <head> </head> 的中间嵌入这个文字的代码,然后你的网页字体就会变成这个风格。

网上免费字体:

http://www.youziku.com/

https://www.google.com/fonts

 

4。 图片问题: 通常很多网页的图片会有模糊现象,这个是不好的做法,会影响用户对你网站的信誉。图片不是原创,或者说太土了,这个也不妥。最好自己设计,或者要找免费资源的话,一定要注意图片的质量。

图片内容和你的网站主题不相关,这个应该也要避免。图片的内存太大,如果一个网页如果有很多图片内存太大,没有优化的话,那对于这个网页的速度会影响的,速度太慢,也会严重影响用户体验的。

图片背景没有去掉,这个问题最好也要解决掉。 图片的后缀名jpg的内存会小点,但是失去一点清晰度,小的图片基本没有问题。png的话内存大点,不过清晰度会高点。

图片没有SEO优化代码? 代码格式: <img src=”your-image.jpg” width=”” height=”” alt=”你的图片描述写在这里,给搜索引擎看的” />, 图片的宽和高最好都要定义,让浏览器更快的下载你的图片, alt=””里面填写你的图片描述。

图片优化工具: http://www.imageoptimizer.net/Pages/Home.aspx

了解更多网站优化细节: http://metricbuzz.com/cn

 

5。 网站内容质量问题:

通常很多网站的内容都不是原创的,这个也是不好的做法。基本上搜索引擎有算法技术会知道哪个网页是原创,哪个不是的。因为你复制的内容早已经被搜索引擎检索了,然后如果你再利用到你的网页里面的话,这应该是可以查出来的。而且,我觉得如果每个人都学会抄袭了,那整个行业就完全失去了创新能力呢? 我知道很多人的想法是,不抄袭没有办法啊? 短时间内写不出这么多原创的内容,或者希望要让网站快速的出现结果。但是你有没有想过,内容是一个网站的核心竞争力,一个人的灵魂,假设如果你不断抄袭的话,别人也会慢慢看出来的。而且目前主流的思想还是比较鄙视抄袭的。如果你不断的有原创的文章,好好学习,天天向上,看大量的书籍,那你肯定可以写出好的原创内容。 原创虽然慢点,但是慢工出细活啊。 慢慢的你就会看到有好的结果出现的,当然,我不得不说,这最后还得看每个人的知识结构水平。

如果你的原创内容是建立在你的专业上面,然后你也非常了解你自己这个生意的每个环节,用户群的各类属性指标,然后再针对性的为你的网站内容撰写软文,设计浏览效果,那你的网站从长远来看将会有正面的效果。

不过我必须要说,你可以研究很多其他设计好的网站,书籍,借鉴他们的方法,然后加以改进,这个方法是可以的,这不算抄袭,因为这是个互相学习,进步的结果。

建议学习的网站:www.producthunt.com

网站代码测试:https://validator.w3.org/

 

6。 独立网站域名问题: 我看过很多的中文网站,刚开始我看见他们域名的时候都觉得很怪的感觉,怎么会取这样的域名呢? 比如 dkdg.cn, eutnf.cn, dghid.com, 等等,你看这些域名的第一个感觉就是基本上不懂这些都是干嘛的? 而且不是少数的列子,SEO论坛的上超过80%的网站都是这样的?其实这是一个严重的错误,首先你要让你的网站,产品,品牌传播的话,那别人得要很容易记住你的域名,看到的话大概就知道是做什么的?而且输入进入的话很简单,所以域名越简短约好。

也许有人要说话了,好的域名都被注册掉了,这个我也不否认,我有过这样的经验,我曾经刚开始做网站的时候,没有经验,不知道原来短的,好记的域名都被被人注册掉了。我几乎中间断断续续花了3个月的时间来搜索一个理想的域名,当然中间也做了其他的事情。 但是我最后发现,好的,短的域名越难找,但是这越让我感觉到注册好域名的重要性,因为我意识到以后不管我的网站能做到多大,流量有多少,内容有多少,我还是要跟很多同类的网站竞争。所以,这时候,用户能不能记住你的域名,这个域名是不是让人对你的行业有无尽联想,输入进去是否简单,这些传播逻辑性都是很重要的,我自己就不愿意输入大概超过10个字以上的域名,因为太麻烦呢?除非这个网站是非常重要,非去不可的。 理由是现在每个人都太忙了。
*** 我的建议:网上营销不能输的第一步 -- 病毒营销传播三板斧绝招

一。 网站域名:如果你想让用户可以记住你的域名,传播容易,输入简单,那就花点时间,找个简单的,少字的域名,这个域名必须要有创意,让用户对你的生意有联想,因为这关系到你未来网站的传播,流量。一般的用户喜欢传播有用的网站,有趣酷酷的网站,比较容易记住的,两性关系的,或则让他们的内心产生共鸣的。

经典案例: 你可以看看 ‘小米公司’ 的书,他们对于域名就很重视,里面有很多的思想和理论。

二。 公司名字: 公司的名字应该和你的域名保持一致,基本思路也大概一致。不过应该要考虑的是,如果注册了这个公司的名字,域名可以拿下吗?如果域名已经被注册掉了,可以购买吗?

如果不行,那要再想一个统一的域名和公司名字才可以。最重要的还是要注意未来传播的便利和持续性。

三。 公司LOGO: 公司的商标应该具有创意,传播公司的形象和价值,和你的域名应该是具有关联。总之这三个条件都要仔细考虑,比如公司的长远发展,未来的方向,法律问题,等等。具体可以参考下其他成功公司的案例。

经典案例:我最喜欢的案例是 ‘SnapChat.com’

目前著名的阅读后即焚的社交应用公司,短短3年,市值$150亿,听说阿里巴巴也投资了这家公司。如果你好好研究下他们的域名,公司名字,LOGO,商业创意,传播价值,都是非常经典的案例,值得你做大量思考的。

他们的LOGO是一个幽灵,这个创意会让人具有无限想像空间,而且会让年轻人觉得很酷,然后它本身的社交工具也很酷,让你看完之后就可以把短信删掉。像幽灵一样消失了。我觉得就是因为他们的营销第一步做的极具创意,和传播价值,抓住了当下年轻人孤独的内心世界,以及目前所谓的 ‘亚文化现象’, 所以在短期内传播的很快,形成巨大的用户群,商业价值。

***查找可注册域名工具:

1. http://www.shopify.com/tools/business-name-generator

 

7。 网页链接问题: 刚才上面分析了网站的独立域名,然后就是每个网页的独立链接问题,基本上也犯了同样的错误,独立网页链接出现各类奇怪符号,比如 fdff.com/#$#@.html, feiti.com/y*&(.).html, 这2种链接都是不好的,每个网页的链接最好包含关键词,不要有看不懂的符号,如果有的话,要修改链接。然后就是链接不要用下划线 _,应该用中划线 - 。 搜索引擎搜索你的网页的时候,第一要素是根据你的 ‘网页链接’ 和 ‘标题关键词’ 来查找相关的网页,然后才根据找到的其中100个相关网页,根据每个网页的流量,权重,知名度,新闻热度,等等来决定搜索排名先后。

通常你的网页链接可以自己在网站后台修改,如果不行的话,要修改这个文件-.htaccess, 它控制你的网站服务器方面的设置,包括你的网站链接。

文件路径:public_html/yoursite.com/.htaccess , .htaccess 这个文件就是你需要修改的,怎么修改的话,也许会有点困难。

查看修改链接范例: http://www.metricbuzz.com/htaccess.txt

查看坏链接: http://www.brokenlinkcheck.com/broken-links.php

 

8。 弹窗工具太多问题: 很多网站一进去主页就会出现很多弹窗工具,这个也是影响用户体验的设计。 建议尽量不要一下子显示太多的工具,让用户自由点击去浏览下一步的动作会比较好。就是你的设计应该是 ‘被动’ 的设计,让用户自己喜欢看哪里,就看哪里,而不是一下子太多的功能干扰到用户的正常浏览行为。如果非要做主动的设计,也要注意 ‘量’ 的问题。

弹窗工具中文版,主页底部有中文: http://www.jotform.com/

 

9。 网页速度问题: 网页的速度是很重要的,如果你的网站,第三方的工具代码安装的太多了,那会严重影响到网页的下载速度。

原因是浏览器必须要不断的访问第三方的服务器索取相关的代码内容。一个网页如果安装的第三方服务器工具代码太多,有可能每次更新浏览一个网页要做几百次以上的第三方服务器访问,所以网页当然速度变慢了。网页速度是以 千分之一秒 来计算的。 如果网页内容优化得当,一个网页下载速度在一秒之类也是可能的。

下载第三方代码还会出现的问题就是因为代码不在你的服务器里面,所以不能控制代码,如果对方代码出错,那你的网页也有可能会出现问题,还有就是可能出现的代码木马病毒问题。所以,使用第三方工具代码的时候要做长远,综合考虑。

通常网页速度太慢其他的2个原因是:

1). 网页内容太多,代码也太多,注意分布均匀。

2). 太多 javascript 和 Jquery 代码,如果这类文件太多的话,会严重影响网页速度。 还有就是太多 CSS文件,这个也会影响网页的下载速度。所以通常解决方法是,JS 代码放在网页的最下面,代码放在外部文件夹里面,在 </body> 之前。 CSS代码放在网站头部,在</head> 之前,代码也是最好放在外部文件夹里面。 还有就是可以利用 代码压缩工具 让太大的 JS 和 CSS 文件变小,但是通常效果不明显。

全方位速度测试工具: http://gtmetrix.com/

JS,CSS 代码压缩工具: http://refresh-sf.com/

 

10。 网站小图标-favicon, 在你的网页窗口上面左边,你可以看到你的网页小图标,这个必须设置下。

小图标favicon制作工具: http://www.atool.org/ico.php

 

11。 网站隐私,等各类条款问题: 你的网站必须要有这方面相关的申明,让用户了解你怎么搜集他们的信息,以及怎么去使用这些信息等等。一个详细的隐私条款会让你的网站看起来更有信誉和商业化感觉。

举例: 隐私政策网页

 

12。 ‘关于我们’ 的内容网页: 实体企业公司的网页应该要有详细的 ‘关于我们’ 网页, 它详细告知了对你感兴趣的用户个体关于贵公司的各种信息, 比如 公司的历史,产品服务,各项认证,客户对象,长远目标,使命,文化,联系方法,各类真实图片等等。 通过阅读这个网页,让用户很快的了解贵公司的基本情况,直接的有个具体的印象。
所以搜集内容,优化好这个网页是很重要的。 建议如果有第三方的认证信息,展示出来会比较好,公司内部环境的真实图片也可以让客户很快的对贵公司产生好感。

举例: 关于我们网页

 

13。 网站的安全性: 实体企业的公司,有必要在网站主页的底部,安装几个权威的网上安全认证,比如病毒检查认证,电子商务认证,行业专业认证,当地部门认证等等,这样会让用户很快的对贵公司产生信任感。

网站的安全工具: https://www.sitelock.com/


 

Share Button

Also published on Medium.

Comments

Leave a Comment