网页版面布局设计的原则是什么?

一个好的网站必须要体现在整体的策划、设计、布局、网站的定位、色彩搭配，最重要的是网站页面的小细节处理。整体感觉是否符合行业的需求、符合公司的文化。有许多企业都会说我要做一个大气的网站、实际上从专业的角度来讲应该要做一个最适合你的网站，你搞机械销售的不可能去像广告设计公司的搞得很花哨的的，现在网站都讲究简洁，适用，用户体验好。网站设计中结构布局就显得尤为重要，需要注意的以下方面：

网站的框架要简约明了，主题思想明确，导航要设计合理，核心信息放在网站的左上侧，这个地方搜索引擎爬虫程序最感兴趣先行抓取，客户也最感兴趣这里。制作网站框架要清晰，布局要合理，拒绝杂乱的代码，拒绝大量的js脚本和flash动画，这样会影响网站的访问速度，栏目设置要清晰易见，让用户浏览起来简洁舒服。一个网站一处滚动就已经OK了。网页布局应该遵循一个原则，即“先上后下，先左后右”原则。由于搜索引擎在执行搜索的时候，其搜索的顺序跟我们浏览页面的顺序是一样的，即前面说的原则。遵循这个原则有助于搜索引擎蜘蛛抓取页面快速收录。

由于搜索引擎爬虫程序是直接识别页面代码来得到信息的。这样制作网站的目的也就是为了让网页蜘蛛能够毫不吃力地顺利爬行完网页。当然没什么好办法控制搜索引擎，但有办法改变页面。制作网站过程中，标签的使用也是很有讲究的，通常要把握下面几个原则：保持良好的层次框架，近似h1h2h3等标签都应依照标签本身的用处来使用，比方：h1标签表示网页主标题，且在一个网页中只能使用一次。在部分权重较高的标签中，合理的融入关键词，如h1、strong等标签。

css命名规则符合一定标准规范，较长名称选择驼峰式命名规则，如.tophead。代码尽量做到简洁，禁止使用代码生成工具制作网页。代码在实现基本的框架、样式、和行为分离的基础上，还要做到可用、精简、有序而且符合seo代码标准规范。网站js结构选择jquery，全部脚本尽量封装到一个包内。网站flash调用代码尽量要确保浏览器兼容性，这些结构问题都要在制作中要先行规划。

SEO可以概括为六个部分:

1、关键词分析（也叫关键词定位）

这是进行SEO最重要的一环，关键词分析包括:关键词关注量分析、竞争对手分析、关键词与网站相关性分析、关键词布置、关键词排名预测。

2、网站架构分析

网站结构符合搜索引擎的爬虫喜好则有利于SEO。网站架构分析包括:剔除网站架构不良设计、实现树状目录结构、网站导航与链接优化。

3、网站目录和页面优化

SEO不止是让网站首页在搜索引擎有好的排名，更重要的是让网站的每个页面都带来流量。

4、内容发布和链接布置

搜索引擎喜欢有规律的网站内容更新，所以合理安排网站内容发布日程是SEO的重要技巧之一。链接布置则把整个网站有机地串联起来，让搜索引擎明白每个网页的重要性和关键词，实施的参考是第一点的关键词布置。友情链接战役也是这个时候展开。

5、与搜索引擎对话

在搜索引擎看SEO的效果，通过site:你的域名，知道站点的收录和更新情况。更好的实现与搜索引擎对话，建议采用Google网站管理员工具。

6、网站流量分析

网站流量分析从SEO结果上指导下一步的SEO策略，同时对网站的用户体验优化也有指导意义。流量分析工具，建议采用Google流量分析。

SEO是这六个环节循环进行的过程，只有不断的进行以上六个环节才能保证让你的站点在搜索引擎有良好的表现。

SEO（SearchEngineOptimization）:汉译为搜索引擎优化。搜索引擎优化是一种利用搜索引擎的搜索规则来提高目前网站在有关搜索引擎内的自然排名的方式。SEO的目的理解是：为网站提供生态式的自我营销解决方案，让网站在行业内占据领先地位，从而获得品牌收益；SEO包含站外SEO和站内SEO两方面；SEO是指为了从搜索引擎中获得更多的免费流量，从网站结构、内容建设方案、用户互动传播、页面等角度进行合理规划，使网站更适合搜索引擎的索引原则的行为；使网站更适合搜索引擎的索引原则又被称为对搜索引擎优化，对搜索引擎优化不仅能够提高SEO的效果，还会使搜索引擎中显示的网站相关信息对用户来说更具有吸引力。

移动端和PC端的优化大多数的点是相同的，针对如何做好移动端的优化，小编将从MATE标签、URL规范化、网站结构、网页简洁性以及技术优化方面来解答。

1、MATE标签

Title、keywords和description可以设置与PC端不一致，移动端字数显示会相对少，在此需要精短，一语中的，最好每个页面都能独立设置MATE标签，设置需要考虑的因素除字数限制外，其他因素、规律和PC端大致相似。

移动端网站的Title区别PC端，尽量简短，体现关键词，8个汉字以内把页面内容描述清楚并且包括频道名称，避免所有的页面描述使用同一个关键词。

2、URL规范化

虽说移动端网站是一个二级的域名，但是也是要注意除首页外其他页面域名的规范化，最好设置成关键词的拼音或者是英文单词的URL，能够相应的提升关键词的排名。

对于多个板块的二级域名或者目录来说，使用规范、简单的url，尽量去除与页面内容无关的参数，如用来区分手机型号、区分访问用户，方便统计等的参数。

另外，建议页面url链接跳转最好是正常格式的目标url，不要中间进行跳转。

3、扁平式树形结构

手机或平板的屏幕比较小，操作起来没有PC断方便，要尽可能的减少用户的对页面的点击次数，让用户通过最少的点击就能找到所需要的内容，建议移动站点应该借用企业网站结构的设计，也就是整体结构是“首页——栏目页——详情页”的三层树形结构，不但便于用户的操作也更利于搜索引擎对网站结构的了解和内容的抓取。

对于移动版的企业站来说，网站结构最好不要超过3层，层次过多是不利于搜索引擎蜘蛛的爬行的，深层页面的内容不容易被蜘蛛抓取出来，树形结构是目前相对理想的结构，对于搜索引擎的蜘蛛来说较为友善，程序写得过于复杂、不好抓取的移动端网站，搜索引擎蜘蛛是会直接放弃抓取，不予收录；然而，不被收录的网站是没有资格谈排名的。

面包屑导航对于移动端的网站来说在设计上要求更是严格了，设计栏目或者按钮更要清晰明了，能够指导用户该怎么点击和引导用户想要到达的页面。

4、遵循网页简洁原则

移动版的网页要注重简洁性，鉴于多数的智能手机对于JS弹窗、FLASH动、JAVA等的效果读取不正常，这些效果对于手机用户来说都需要耗费过多的流量和时间来打开极不利于用户体验。

遇及使用功能过于复杂的网站，用户也是没有耐心研究的，相对来说，用手机浏览网页的用户时间都是相对碎片化，目的性不强，多为娱乐，所以，一定要遵守简洁性原则。

5、避免使用Flash或Java

避免Flash的很明显的原因是Apple产品不支持Flash功能，并宣称他们也不打算在将来添加此功能，而iPhones占据智能手机市场30%的市场份额，因此如果你使用Flash，很大一部分智能手机用户用不了这项功能。

同样，很多Android智能手机也不支持Java，而因为受到网速的影响，Java还会大大延缓页面下载的时间。

6、使用规范化的协议

一般来说手机建站有xhtml、html5、wml三种协议，最好使用规范化、标准化的协议格式，避免造成不必要的麻烦，也能够减少移动端网页遇及的优化难题，当然也可以做多个版本的站点，站点进行不同版式的自动适配。

手机页面进行合适的DOCTYPE声明有助于搜索引擎识别该页面是否适合手机浏览，<!DOCTYPE>声明位于文档中的最前面的位置，处于标签之前。

7、移动端网站的关键词优化

因为移动端与PC端的显示媒介不一样，所以在选择关键词时也会有所差异，比如，你想在上海某个地方来个短途旅游，那么你就会搜索上海+地点+景点，所以，建议各位在优化移动端关键词时，应择优选择核心关键词的搜索下拉词或相关词作为目标关键词。

8、技术上的优化

（1）、确保在手机网站或者PC端网站各个页面上有相应的导航或者提示链接，让用户可以在手机版和PC版进行切换，也便于搜索引擎更好的收录。

（2）、与PC端页面优化方法一致，全站需使用静态化链接使用静态链接，避免使用带“？”带参数的动态URL做为超链接。

（3）、注意移动端网站的死链问题，如果网站存在过多的死链时，技术上要做好404页面和301重定向的设置，其次便是要去百度快照投诉删除移动端的死链页面快照。

（4）、技术上要处理好兼容问题，解决浏览器或者是不同牌子手机的兼容性，这样是能增加页面的好感度，网站的回头率、访客也会增加，那么网站点击的次数多也是能提升网站的排名。

（5）、robots不要设置任何的限定，避免百度爬虫抓取不了，不久前百度官方声明百度spider的爬虫无论是移动端还是PC端的Baiduspider都是一致的，所以，这点上移动端和PC端的设置是一致的。

（6）、改版时，要做好移动端的重定向转向，减少用户的流失。

从用户角度出发，优化是要遵守“用户为王”，除此外，移动端的外链工作跟PC端是同步的。

总的来说，只有了解了移动端和PC端的区别后，才能更好的去着手优化问题。

三、移动端SEO优化的策略

如今，移动搜索、移动互联网将占据整个互联网的主体，换句话说现在已经进入了移动互联网时代，那么在移动互联网时代移动站点做SEO优化应该采取何种策略呢？

1、移动站和PC站彼此独立

百度对于移动端的排名规则是独立的移动站点优于适配站，适配站优于百度转码站，百度转码站优于PC站，如果有条件的话，建议大家还是做独立的移动站，将移动站和PC站分开。

也许有些人觉得两个站点维护起来比较麻烦，马海祥给出的建议是采用“一套人马两个班子”的策略，也就是移动站和PC站只在WEB端独立，二者共用数据库，这一点大家不用担心，小编也敲过两天代码，对编程也了解一些，这个问题对技术来说是简单的不能再简单的问题了，完全可以实现。

如果朋友们有做外贸生意的，网站的主要人群是外国人，重点关注的是谷歌，那么恭喜你，上面的策略可以忽略了，谷歌在移动端更推荐采用适配技术，也就是说偏向于谷歌的站点只需要从新设计模板或者是重新制作CSS样式达到网站自动适应PC端和移动端即可。

2、地区性移动站点的地域优化策略

地区性移动站点在标题中显示地域名称添加百度官方的地域扩展代码，当大家用手机通过百度搜索答案时，百度移动搜索将根据用户地理位置信息优先将具有地域属性的内容展现给用户，比如，网友在上海通过手机搜索“上海婚纱摄影”，百度会优先展示在移动站点中添加了百度地域扩展代码的站点。

具体的地域Meta协议如下：

<meta name="location" content="province=北京city=北京coord=116.306522891,40.0555055968">

name属性的值是location、Content的值为province=北京city=北京coord=116.306522891,40.0555055968；

province为省份简称，city为城市简称，均不可为空；

coord是页面信息的经纬度坐标，采用的是bd09ll坐标，若页面信息为城市级别，填写城市中心点即可。若页面信息有具体的地址，经纬度坐标填写该具体地址的坐标（可以通过百度地图的地址解析API获取）。

3、使用html5+css3建设站点

无论是彼此独立还是自动适配，采用html5+css3建设网站都是有利于网站排名的，百度给出的官方文档中也有说明，采用html5技术的移动站排名更有优势。

此外，在移动站点中还应该尽可能少的使用js文件。

---