翻译自一张外文图表,出处以下:http://sixrevisions.com/infographics/69-web-design-tips/
虽然图表里都是很简单的英文,但我花费一点点时间翻译它们能使得大家很清晰明白做者的意思。web
设计阶段Design:浏览器
一、调查(Investigate):弄明白谁是你的目标受众和他们所指望的东西;安全
二、有限的色彩(Limit colors):不推荐在你的网站里使用的颜色数量多于2~3个;框架
三、标志(Logo):标志是你品牌中主要的部分,是别人识别你的品牌的关键点;ide
四、文本校对(Text contrast):访问者更想要看到正确的文本内容,而不是出错的内容;工具
五、极端(Extremes):确保你的网站一直安全;学习
六、设计顺序(Design order):让事情按序而来;测试
七、使用网格(Use a grid):优选是使用一个12-列的网格;字体
八、简单化(Simplicity):在你的网站应该仅仅显示最本质的元素;优化
九、趋势(Trends):紧随最新的网站设计趋势,可是不要过分使用趋势;
十、要原创,不要买主题(Be original,don't buy a theme):你老是但愿你的网站是独一无二的;
十一、测试你的设计(Test your desings):在你将你的网站展示在你的用户以前,先完全测试过。
用户体验User experience:
十二、五秒法则(Five seconds):你有5秒的时间让用户清楚的明白你的意图;
1三、响应式设计(Responsive design):愈来愈多的人使用平板电脑,智能手机、电脑和手表去访问网站;
1四、导航(Navigation):导航是网站中最重要的部分之一,由于它指引访客快速的去到他们想去的页面;
1五、滚动VS点击(Scroll vs click):滚动容许你指引你的访客经过一个必然的故事。(这里翻译得不是很清楚,欢迎大牛更改:原文:Scrolling allows you to guide your visitors through a certain story);
1六、流程(The flow):向你的目标受众提供一个清晰的网站流程使得他们不须要去想下一步作什么;
1七、去除混乱-整理干净(Remove clutter):一些网站的元素一开始显得颇有用,但仅仅是相对一些分散的访客(不是相对主要用户的意思);
1八、不可回避的按钮(Unavoidable buttons):尽量的使你网站上的按钮精致,有吸引力,容易引发人们注意;
1九、可读字体(Readable fonts):确保那些网站上的字体不管在什么设备上访问网站都可以容易的辨识;
20、思考区域性(Think local):让访客明白你网站上的全部东西是你想要达成的目的(换句话说,就是来自不一样地区的人们访问你的网站都能明白你的网站上的东西到底在说什么);
2一、呼吸的空间(Breathing room):访客须要时间去消化他们所阅读的信息,不要将下一部分的内容立刻呈现到他们面前(换句话说,在各个元素之间须要喘息的空间,使得读者可以消化上一部分的信息再去阅读下一部分的内容);
2二、可用的连接(Working links):确保你网站上全部的连接是可用的,包括内部和外部的连接;
2三、连接本文/锚(Link texts/anchors):在你网站上的锚点须要提供一些关于他们点击后去到的页面的快捷信息(换句话说,你网站上的锚点须要提供给用户你这个锚点所去之处的信息);
2四、外部连接(External links):经过使用targer="_blank"让你的外部连接开启在一个新的窗口中(换句话说,不要让你的外部连接覆盖当前访问页,应该新建一个窗口,博主认为新建一个标签页是最好的方法。);
2五、短的form(Short forms):尽量的少使用form fields,避免验证码;
2六、自动完成的form(Auto-complete forms):容许forms经过浏览器自动完成;
2七、接收短信息(Message received):(这条跟16同样,正等待图表主人的更改);
2八、联系信息(Contact information):添加联系信息在你网站中每一个form的旁边。
内容Content:
2九、有限的页面(Limit pages):确保你的网站不会有太多页面,仅仅留下一些必需的页面;
30、首页(Homepage):首页仅仅是一个门口通往其余的页面,那些才是访客关心的页面;
3一、内容第一(Content is king):若是你不能清除明白的与访客传达你想要传达的信息,那你的网站将会失败;
3二、消息(Messaging):不要用大长段的文字去淹没你的访客;
3三、图片(Photography):一张图片每每能比一千字的文本表达更多的东西;
3四、视频(Video):最好的方式之一去解释你的产品或者装置是一个视频;
3五、保持新鲜(Stay fresh):给访问者一个你的网站的印象—你的业务是一个活跃的业务,经过按期更新您的网站
3六、博客(Blog):一个博客是一个最好的方式之一去让你的网站看起来积极,而且它能够容许你去展现你知道你在谈论什么;
3七、社交媒体(Social media):社交媒体是一个很好的方式去产生一个忠诚的受众,他能够成为你品牌的广告;
3八、受众(Audience):仅仅关注那些访问你网站的目标受众;
3九、拼写(Spelling):无时无刻要确保你网站上的拼写是正确的;(博主以为这是对于英文网站来讲,而对于中文网站,就是确保你的字是正确的)
40、向上折叠(Above the fold):向上折叠这部分的内容是你网站中最重要的部分;
4一、终页面(Landing pages):将你的每个页面都设计成最终页面的样子;
4二、搜索引擎优化(SEO):在你建立一个新网站的时候,在你的脑海里牢记保证你的搜索引擎优化;
4三、排名(Ranking):页面在谷歌里有排名,而网站没有。(博主也没有理解该段英文意思。。。)
发展development:
4四、内容管理系统(CMS):学聪明点,别浪费时间去创建一个内容管理系统
4五、安全(SECURITY):确保你的网站一直很安全;
4六、利益(BENEFITS):一旦你不顾你访客的利益了,那么你以前全部的辛苦都白费了;
4七、学习(LEARN):保持学习的状态,去学习最新的技术,工具等;
4八、研究(EXPERIMENT):开始研究新的事物,创建一个博客,经过博客去记录你所学习的东西(像博主如今这样);
4九、外包(OUTSOURCE):设计网站而后将代码交给专业人士去作;
50、清洁和评论(CLEAN AND COMMENTED):这条提醒在任何工做中都有用——工做整洁而且有组织;
5一、速度(SPEED):访客退出你的网站的最大缘由就是网站加载太慢了;
5二、图片(IMAGES):有图片的网站比通常的网站显得更好看而且具备更好的亲和力;
5三、特殊效果(SPECIAL EFFECTS):特殊效果每每会分散访客的注意力,使他们再也不关注网站的内容;
5四、滚动视差(PARALLAX SCROLLING):尽可能简单,少用;
5五、粘贴页尾(STICKY FOOTER):页尾须要一直在浏览器的底部;
将来Future:
5六、测试和更新(Test and update):一旦你完成了你的网站而且你的访客开始找到它,没有时间是能够放松的;
5七、向别人学习(Learn from others):分析你全部的对手并向他们学习,同时对于其余行业也是如此;
5八、领导人的方式(Lead the way):在今天,一个行业的领导者是一个懂得分享经验和知识的著名的商业人;
5九、保持(Keep up):不论你超越你对手多少你都要保持你的在线工做状态;
60、可穿戴技术(Wearable tech):你的品牌和商务也许将会从一个新的技术中获利,因此保证你的网站作好准备。
别作这些Don't do this!
6一、FLASH(Flash):不管你想用什么建立一个FLASH,使用普通的老的HTML,CSS和JS;(我也没明白。。。)
6二、忽然冒出忽然消失(Pop ups and pop unders):这会恼怒大多数人;
6三、自动播放(Auto play):当访客没有对其进行操做时,视频和音乐却自动播放了,这一般会令人恼怒;
6四、广告(Advertisements):每一个页面不要使用超过3个广告,这会使得访客注意分散而且所以恼怒;
6五、轮播和滑块(Carousels and sliders):轮播图片会让访客以你想象不到的速度点击后退按钮;
6六、老技术(Old tehniques):花费更多的时间在弄明白HTML5和CSS3的基础技术上,不去使用一个框架和表格;
6七、GIF图片(GIF’s):这是个好东西,但别用在不应用的地方;
6八、大写字母(CAPS):这让访客以为你在对他们尖叫;(意思就是,在内容中不要用全大写,会让人有压力)
6九、下划线(Underline):仅仅对连接使用下划线,对于通常的词和句子不要使用。
博主语:你们若是以为我翻译不许确的能够在评论给出合理的翻译,我会虚心学习并将其更改的,谢谢~