可以让你的网站更炫酷的小Tips

  • 时间:
  • 浏览:2
  • 来源:老云博客 - 专注共享蕊蕊博客资讯

我敢保证:

原困分析你能把下面列表的每一项问题都改好,你原困分析拥有业界里最好的网站之一。事不宜迟,现在进入正题,开始介绍某些 列表:

酷炫的品牌

1、挑选 另有一个 专业的 logo,现在很难找到另有一个 包含很棒的 logo 的网站原困分析博客,很久这是另有一个 瞬间获取信任感的好方法 。

2、上传另有一个 支持 retina 屏幕的 favicon (在浏览器标签上显示的正方形小图标)。大每种网站的 favicon 删剪都是 16×16 像素的,在 retina 屏幕会显得模糊。使用 X-Icon Editor 生成 64×64 像素大小的 favicon。

3、使用 支持 retina 屏幕的图片。这很简单,只时要确保图片宽高是容器的两倍,很久显示时缩放就可不可不可否了。

4、最多使用 2-3 种颜色。包括背景色、文字-动作颜色和强调色。

5、挑选 调色板时,从 互补色原困分析三色组(complementary or triad colors)开始挑选 ,很久再进行调整。好的颜色组合会很久你带来充满故事感的设计。

6、不须使用纯黑色 (#000000)。纯黑色是不处于的,可不可不可否助于 来太多可不可不可否助于 来太多 在网上使用纯黑色看起来不大慨。实际上,黑色应该总是作为其它颜色的深色阴影。

7、不须使用浅灰色 (比如 #cccccc)。原困分析你希望设计更显个性化,可不可不可否试着添加某些黄色显得温暖,添加红色给予能量,而浅绿色产生信任。

酷炫的排版

1、挑选 并与否生活 优质的字体。使用 Typekit 类似的服务吧。据说多达 95% 的网站删剪都是有排版的,想要产生良好的第一印象,使用优质字体是最简单、成本最低的方法 。

2、最多使用 2-3 种字体。使用更多字体会显得杂乱,很久调慢加载时间。挑选 并与否生活字体用在头部,并与否生活用在段落中,原困分析有时要语句,还可不可不可否挑选 并与否生活用在其它特殊情形里。

3、设置 body 的字体大小为 最小 16px,更小的字体在大屏幕中不方便阅读,原困分析是移动端页面可不可不可否考虑的最小值为 12px。

4、设置 排版缩放比例,就像(乐理包含)增四度,纯五度音程原困分析(在绘画使用)黄金比例。根据比例来设置段落文本大小,以及 H4, H3, H2 和 H1 标签。当然,文本的行高和间距也要基于某些 比例。

5、设计其它的 排版元素,包括引用、符号列表、数字编号列表、表格标题、帮助文本、警告框、高亮文本、代码示例、缩写甚至地址。

6、挑选 并与否生活 自定义图标字体,比如 Font Awesome,来代替图片和其它某些元素,比如社交媒体 logo、导航按钮、交互图形等。图标字体的加载强度调慢,可不可不可否任意缩放,很久可不可不可否随意更改图标颜色。

酷炫的布局

1、使用 三分法 来设计基本布局。水平垂直把布局划成三等分,很久当线段横穿时,设法对齐关键的焦点。

2、使用另有一个 网格系统来维护 垂直方向的网格。把你的布局分隔成 8 列、12 列原困分析 16 列的布局,列与列之间包含足够空白。

3、使用 基线网格 保持垂直方向的调和感。文本行之间的空间,和内容块之间的空间都同样重要。每行文本应该都拥有一定的底部外边距,助于否助于 来太多可不可不可否助于 来太多 我处于基线的地方。

4、空白 是奢侈的。空格的处于是为了创造呼吸空间和平衡,你应该把读者的眼球吸引到重要的地方去。

5、均衡摆放视觉元素,比如按钮、输入框、表单和大标题等。你应该把眼睛眯起来,试着跟踪某些 你想让用户关注到的路径点。

酷炫的用户界面

1、使用大大的加粗的 行为按钮。每个页面应该可不可不可否助于 另有一个 目标,很久几乎删剪都是点击另有一个 按钮而已。可不可不可否助于 来太多可不可不可否助于 来太多 确保某些 按钮后会被用户忽略。

2、添加 鼠标悬停 (hover) 和鼠标点击 (active) 情形 的样式给链接、按钮、输入框和文字区域。原困分析你挑选 在鼠标悬停时让按钮颜色变亮,那你也应该对于链接和输入框边框给出同样的样式。

3、保持 表单样式 的一致性。所有的文本区域和输入框都应该有相同的样式。包括相同的边框颜色、背景颜色、悬停情形、点击情形、占位符文字、点击情形文字等。确保 tabindex 属性的正确设置,以便用户可不可不可否使用 tab 键在表单项之间用正确的顺序切换。

4、改变 原困分析点击过的链接 的颜色,让用户知道朋友原困分析去过那个页面了。

5、一旦你拥有了某些人的 logo、颜色、排版、布局和图像大小,我要 建立另有一个 风格指南。好的用户界面应该使用风格一致的组件,其样式应该总是相同的。

酷炫的用户体验

1、在按钮和其它表单域元素使用 微交互(microinteractions)。比如,点击上传按钮很久,提示文字可不可不可否变为 “正在上传” 原困分析 “出理 中”。

2、不须使用 scroll jacking (译注:通过重新定义鼠标滚动强度、幅度达到控制可视区域视觉效果的方法 )!不须打乱浏览器的默认行为,确实你原困分析会确实让滚动强度变成原先的两倍很不错,但事实不须可不可不可否助于 。

3、放弃使用首页轮播。轮播会减少转化率,可不可不可否考虑使用更佳的方法 来在有限空间显示更多信息。

4、不须使用欢迎界面。当用户第一次打开首页时,用户希望能直接看过首页内容。

5、使用 标题、副标题、头段落、列表、表格标题 很久你的内容更容易被检索。大每种人在浏览网页前,后会先检索一遍全文,再决定与否阅读。

6、添加 描述性的占位符文字 到你的表单、输入框和下拉菜单。原困分析你想要让浏览者用并与否生活特定方法 来填写表单,你应该指引他为什做。对于下拉菜单和挑选 框来说,可不可不可否让第另有一个 选项变成描述,比如 “挑选 年份” 就比 “2016” 更大慨。

7、往表单添加 HTML5 验证,让用户在提交表单时可不可不可否清楚地知道某些 每种再次总是出现填写错误。

8、通过出理 含糊链接名字、减少杂乱排版、使用标点符号、保持简洁布局、添加图片提示(alt text)、使用大字号、保持文本和背景色的高对比度,可不可不可否很久你的网站 适用于视觉障碍人群。

9、通过 BrokenLinkCheck.com 检查你的网站与否有 损坏的链接。修复某些 坏链,出理 让用户原困分析点击到它们而抓狂。

酷炫的开发

1、确保你的站点是经过 移动端优化 的,助于否助于 来太多可不可不可否助于 来太多 我在任何设备上都可不可不可否响应式地显示。合理优化移动端的站点,加载强度调慢,排行更高,很久可不可不可否提供更佳的用户体验。

2、生成并 显示经过优化的图像。假设你上传了一张大图片,比如博文的特征图像,原困分析你想在站点的某些地方显示(比如侧边栏),应确保你在侧边栏显示的是图像的缩略图而非原图。

3、所有图片和超链接删剪都是添加 alt 和 title 属性。当遇到并与否生活异常情形,图片可不可不可否助于 正常加载出来的很久,网站应该在图片位置显示替换文字(alt text)。很久,当鼠标悬停在链接时,浏览器应该显示该链接的 title 属性的值。

4、使用 <strong> 和 <em> 标签代替 <b> and <i>,以输出加粗和斜体字符。确实朋友的作用相同,很久有着根本区别。<b> 标签对应着并与否生活样式,而 <strong> 标签则是并与否生活语义化的表示,指明了应该要怎样理解某些 标签的含义。

5、去除多余的 HTML。当你基因重组粘贴内容到 WYSIWYG 编辑器(类似 WordPress 的编辑器)的很久,它会添加某些不时要的 span 标签与内联样式。时间长了,你的网站代码就会变得不可读了。

6、说到这里,时要很久你的 HTML 移除内联样式。99% 的样式规则都应该写进 CSS 文件,以便很久你在同一时间更新另有一个 组件在所有页面的样式。

7、使用 Sass 变量 代替原生 CSS,以保持颜色和某些组件可不可不可否在整个网站之间共用。原先,当你想要改变某些 颜色时,只需改变一行代码而删剪都是上百行。

8、链接使用永久链接(permalinks)代替删剪 URL。当你打算切换域名时,你的链接最好使用 代替删剪路径 。对于某些图片资源和 CSS 背景,原困分析你可不可不可否 可不可不可否 做,当域名变化的很久,你的所有资源都原困分析失效。

9、开发另有一个 自定义插件 原困分析工具,为你的网站提供独特的功能。确实自定义软件难以维护,很久原先做可不可不可否很久你的网站在众多类似网站中脱颖而出。

10、测试 跨浏览器兼容性,确保你的网站可不可不可否在 Chrome, Firefox, Safari, Internet Explorer 和其它浏览器正常显示。确实旧版 IE 在兼容性方面臭名昭著,很久可不可不可否通过 BrowserStack 进行人工检查。

11、使用 W3C 的 Markup Validation Service(标记语言验证服务) 来检查 HTML 的明显错误。要记住,大每种网站的 HTML 都删剪都是十分完善的。确实这项检查不须最高优先级,很久原困分析你的 HTML 可不可不可否助于 错误,很久你感到更开心。

12、设定另有一个 模拟环境 用来改变你的当前网站。理想情形下,你应该有另有一个 生产环境,是用户能看见的;以及另有一个 模拟环境,供开发者作出更改。一旦更改原困分析准备好发布,就可不可不可否把模拟环境的代码部署到生产环境。

13、在页面显示当前年份。当你看见另有一个 站点的 copyright 年份删剪都是最新的很久,你就会确实某些 网站应该很久没维护了。可不可不可否使用 PHP 原困分析类似的脚本语言,动态地显示当前年份,而不仅仅是显示静态文本。(比如 ©  — )。

酷炫的搜索引擎优化

1、为每个页面挑选 另有一个 关键词,某些 关键词关系到你的页面排名。围绕某些 关键词,优化某些 页面的方方面面。当然,并删剪都是很久你在每句话都提到某些 词,可不可不可否动脑筋想想你想让它排到第几位去。

2、给每个页面设定另有一个 充满关键词的 title 标签。标题会显示在谷歌搜索结果的浅绿色链接文字上,有 55 个字符的长度限制。

3、每个页面有且仅有另有一个 H1 标签。在大多数情形下,某些 标签的文字应该和 title 标签相同。

4、在页面内容中包含可不可不可否助于 来太多可不可不可否助于 来太多 H2、H3 和 H4 标签 ,以创建小标题和显出视觉层次感。

5、用另有一个 特定的关键词 优化页面,可不可不可否通过把它包含在标题、H1、副标题和内容的前 1/3 每种。

6、你的 meta 标签的描述(description) 会显示在搜索引擎的链接下方。可不可不可否助于 来太多可不可不可否助于 来太多 确保你的每个页面都包含 meta description,并确保在描述里包含关键词。

7、你的 永久链接(permalink),助于否助于 来太多可不可不可否助于 来太多 我 URL 里紧随域名的每种(比如 domain.com/permalink-here/),应该包含破折号分隔开的关键词内容。

8、Google 把 域名的注册时长 考虑到算法中,朋友认为,注册时间长的域名更有原困分析提供高质量的资源。提前注册你的域名吧,原困分析你的域名注册时间超过 10 年,相信你对你的事业是认真的。

9、平均起来,SERP (搜索引擎结果页面) 的第另有一个 结果,不管是任何关键词,打开的页面删剪都是少于 30 字/页。当你写文章原困分析创建页面时,原困分析你希望页面的排名更高,试着大慨写 30 字吧。

10、总是 创建站点地图 并命名为 sitemap.xml 文件,很久把它插进根目录,并让文件可不可不可否通过 domain.com/sitemap.xml 访问。某些 文件可不可不可否告诉谷歌,你的所有页面的位置,并应该在添加新内容时更新地图。可不可不可否通过 Webmaster Tools 提交给谷歌。

11、添加你的网站的 Google Webmaster Tools,很久很久你知道 Google 要怎样索引你的站点,并在遇到关键问题时保持更新。

12、为了提高图片的排行,上传很久应该总是 重命名你的图片 和其它文件。(比如:rank_for_this_keyword_phrase.png)

13、在站点中包含 robots.txt 文件,告诉爬虫某些 页面应该/不应该被索引。

14、添加 canonical 重定向 把不带 www 的页面访问指向网站的 www 版本,原困分析反过来助于否。

15、研究并整合每个页面的 LSI 关键词(LSI: 潜在语义索引),以帮助提高页面在主关键词的排行。通过 Google 搜索某些关键词短语并寻找 “相关搜索” 链接,可不可不可否帮你找出 LSI 关键词。

16、总是确保 你的内容之间可不可不可否互相连接。你的站点的每个页面,都应该可不可不可否通过从首页开始的可不可不可否助于 来太多于三次点击访问到。

17、添加 特征化的数据 到相关页面,以帮助 Google 合理索引你的内容。以下某些 页面类型时要特征化的数据,包括:人物、产品、事件、公司、电影、书本、报刊评论等。使用 Schema Creator 可不可不可否帮你生成特征化的数据。

18、使用 Google 的 PageSpeed Insights 工具,以确保你修复了所有原困分析降低页面强度的普遍问题。页面加载强度太快,排名越高。

酷炫的网页强度

1、保持 页面流量低于 2MB。使用 tools.pingdom.com 检查主页面的加载流量,原困分析多于 2MB 说明内容可不可不可否助于 来太多了。

2、保持 页面请求低于 30 个。页面中的每个文件和图片删剪都是另有一个 HTTP 请求,请求数越少,加载强度太快。平均每个网页的请求数是 70 个。使用 GTmetrix 可不可不可否检查你的网页请求数。

3、设计页面元素时,使用 CSS 代替背景图片。不须使用图片来显示按钮、表单原困分析其它通用的元素。CSS 的加载强度调慢,很久在响应式布局中更加灵活。

4、在图片上传很久 优化图像。比如 TinyPNG 原先的工具,可不可不可否帮助你在不降低分辨率原困分析图像质量的情形下,减少图片文件大小。

5、使用 内容下发网络(Content Delivery Network) 来存储你的图片和其它大文件,并插进世界上的不同区域中。CDN 通过策略定位好的服务器,存储下发你的文件,可不可不可否最大化加速页面强度,当然加载强度也根据访客的所在地区而有所差别。

6、在上传你的代码文件到服务器很久,通过编译和压缩工具,最小化 JavaScript, HTML 和 CSS。对于 JavaScript,可不可不可否使用 Closure Compiler。对于 HTML,可不可不可否使用 HTML Minifier。对于 CSS,可不可不可否使用 YUI Compressor。

7、把 阻塞渲染的 JavaScript 移动到底部。唯一应该插进头部的脚本是某些 会立刻影响页面设计的内容(比如:自定义字体)。

8、出理 目标网页重定向。重定向触发额外的 HTTP 请求,会延迟页面渲染。

9、借助 浏览器缓存,可不可不可否通过为页面和不总是更新的资源设置过期时间来实现。浏览器缓存会通知浏览器,从本地磁盘加载很久下载过的页面,以减少不时要的网络请求。

10、在服务器配置中启用 gzip 压缩。压缩可不可不可否减少多达 90% 的传输响应时间,大大减少了首次渲染页面的时间。

11、在服务器配置中启用 Keep-Alive,以允许同另有一个 TCP 链接可不可不可否发送和接收多个 HTTP 请求,因而可不可不可否减少很久请求的延迟。

12、升级为 专用服务器 原困分析更优质的主机服务,以降低服务器响应时间。当你使用共享的服务器环境时,你的站点通常插进一台时要同時 响应大慨上百个网站的服务器里,原困分析其它网站的流量很大,你的网站强度自然就会降低。

酷炫的平面设计

1、作为可选的加分项,使用 自定义 ebook 封面。它很难创建,很久可不可不可否很久你的转化率大大提高。

2、为你的主页和销售页面设计另有一个 自定义的平面图形原困分析插图。另有一个 专门为站点设计的好插图,可不可不可否很久你的站点更加容易很久你记住。

3、创建另有一个 原困分析一系列的自定义 博客特征图像设计。也删剪都是你在 Facebook, Twitter, Pinterest 等社交网站传播时使用的图片。当用户看过和博客有所关联的某类型的图片时,朋友会联想到文章原困分析有你写的。

4、很久你某些人和你的团队的每个成员显示一张自定义的 头像插图原困分析漫画。相比于聘请专业的摄影师,自定义的漫画成本较低,有点是当你的团队增加新成员的很久。此外,对于新成员来说这也是一份不错的礼物。

5、自定义图表 以可视化的方法 显示数据和某些内容,相比于类似的博客文章,更容易获取更多流量。朋友更喜欢在 Pinterest 原先的网站上分享图表,原困分析是带着你的站点的反向链接并转发到朋友某些人的网站上。

6、原困分析你创作了另有一个 甚至一系列的视频,你应该拥有另有一个 定制的视频开场每种和/或结尾每种,让朋友感受到视频是专业的。不须提及其它的视频画面原困分析动画,可不可不可否帮助你的品牌更加突出。

酷炫的 Web 安全性

1、安装 SSL 证书,以允许服务器端和浏览器之间建立安全连接。原困分析网站用到银行卡支付功能,大每种的检测软件删剪都是求使用 SSL 证书。Google 称,用上 SSL 证书可不可不可否帮助提高网站的搜索排行。

2、你用到的软件和插件要 保持最新版本。Wordpress 和其它 CMS 软件后会释放更新,通常是为了修复漏洞。原困分析你可不可不可否助于 及时更新,你的网站被攻击助于否助于 来太多可不可不可否助于 来太多 我迟早的事情了。

3、为管理员页面设置 双认证登录。大每种的黑客入侵删剪都是从登录页开始的。

4、检查并 删除恶意软件。原困分析你的网站原先被入侵,黑客很原困分析会留下某些不容易发现的后门。原困分析你可不可不可否助于 及时删除,你的网站原困分析会被谷歌列入黑名单,大大降低你的网站排行,并在用户打开网站时,警告用户背叛。

5、不须把 管理员账号 称为 “admin”。删除默认的管理员账号,并创建另有一个 使用某些名字的新账号。

6、定期 备份数据库和网站文件。大每种备份软件和插件都只备份你的数据库,底下包括了数据和内容。但原困分析你把整个网站都丢了,你还时要文件内容的备份来还原网站。

酷炫的内容

1、创建另有一个 自定义 错误 404 页面,当用户尝试访问不处于的地址时,某些 页面就会显示出来。可不可不可否使用 404 页面把朋友引导到首页,并帮助朋友寻找朋友想要的页面。

2、除了主页之外,关于页面 原困分析是用户最常访问的页面了。要确保某些 页面助于很好地代表你和你的公司。

3、联系方法 页 帮助用户找到你,很久还助于建立你和访客甚至 Google 之间的信赖。当决定站点排名时,机器会寻找你的联系方法 ,很久找到邮箱地址、电话号码和地址。联系信息告诉 Google,某些 站点更加值得信赖某些。

4、在战略上,站点里拥有选填的表单是正确的,然而建立另有一个 准顾客下发页面 的想法可不可不可否助于 来太多可不可不可否助于 来太多 我错,除了另有一个 高转化率的选填表格某些 可不可不可否助于 来太多可不可不可否助于 来太多 我用放。当你希望用户提交信息时,链接到该页面就行了。

5、当用户订阅你的列表时,确保很久你给朋友另有一个 确认页面,让朋友可不可不可否确认邮箱地址。若果用户可不可不可否 确认邮箱与否正确,朋友原困分析就会把事情给忘了,很久再可不可不可否助于 来太多可不可不可否助于 来太多 我会回来你的站点了。

6、在点击邮箱里的确认链接后,给用户发送另有一个 感谢页面 让朋友知道下一步可不可不可否做某些 。某些 页面是每个订阅者都能看见很久可不可不可否助于 看见一次的,很久这是另有一个 绝佳原困分析鼓励用户去掏腰包购买内容。

7、你的网站原困分析主题应该有另有一个 着陆页 模板,当你时要用户进行特定操作时,可不可不可否用上。

8、原困分析你在网站上买东西,确保你有另有一个 漂亮的 销售页面。从大字标题开始;为你的卖场留出足够空间;有原困分析语句做另有一个 介绍视频;在页面底部指引用户要怎样购买。

转载请注明出处 AE博客|墨渊 » 可不可不可否很久你的网站更炫酷的小Tips