Categories


Tags


响应式网页设计与SEO

所谓“响应式网页设计(Responsive Web Design)”也就是自适应,就是可以自动识别屏幕宽度、并做出相应调整的网页设计。目前这种设计已经出现在越来越多的国内网站上,目前Google已经明确表明鼓励响应式网页设计。

响应式网页设计与SEO 网站设计 经验心得 第1张

(图一,响应式网页设计)

通常在浏览网页时,手机上和电脑上无法显示同一个网页,这也导致许多网页设计会自动转到特定的链接上,如上图所示,无论在PC端还是移动端,网页的显示其实都是一个版本,会随着屏幕的大小网页而改变。

下面是一些例子:

响应式网页设计与SEO 网站设计 经验心得 第2张

(图二:响应式网页设计例子)

响应式网页设计与SEO 网站设计 经验心得 第3张

(图三:迪士尼公司的网页)

使用自适应网页设计有5个好处:

1, 随着移动设备越来越多,可以提升用户体验。

2, 该设计没有网页版本区分,所以SEO的策略保持一致。

3, 可以避免重复内容,专心维护这一个网页。

4, 保持网页的原有链接。

5, Google也建议优先采用响应式设计,因为无论是什么网页版本都是相同的HTML、相同的内容,Google最容易处理。

响应式网页设计对SEO是友好的,这些相关技术还在不断演化中,还有许多尚待客服的地方。下面来说说它的缺陷:

1, 对老版本IE支持不好,这是一个致命的问题,尤其是IE6,如果你的网站用户大多还采用老版本的IE的话(建议在统计工具里看一下),就不适合做响应式网页设计了。

其实我一直想采用响应式网页设计,从新设计卢松松博客的网页,但看到统计里的老版本IE用户依然很多,只好放弃。

2, 例如一些小游戏站、视频站,如果仅仅是网页采用了响应式设计,但里面的内容依然是只能在PC端打开的话,这时候就要认真考虑了。

国外copyblogger的博客提到了一个很特别的案例,就是迪士尼公司的网页。他说在迪士尼网页中有许多给小朋友玩的网页游戏,有些游戏可以在桌上型电脑玩,但是如果使用移动设备就可以无法使用。因此这个情况下,就必须做出抉择,放弃使用Responsive Web Design,或是修改游戏。

写在最后:

从今年开始,响应式网页设计逐渐流行开来,虽然很热门,但是并没有太多网站采用这类的设计方式。

而关于响应式网页设计技术方面,也越来越简单,有兴趣的朋友可以阅读下《自适应网页设计(Responsive Web Design)》一文。

来源:卢松松博客


Public @ 2023-01-31 15:20:26

百度MIP出现在网页搜索结果中

是因为百度已经开始对移动网页进行了优化,即采用了移动优先索引的策略,将移动网页优先于桌面网页进行索引和展示。而MIP(Mobile Instant Pages)是百度推出的一种加速移动网页加载速度的技术,所以使用MIP技术建立的移动网页能够更快地加载,更好地适应不同的移动设备。因此,百度在移动搜索结果中推荐使用MIP技术建立的移动网页,以提高移动搜索的体验和效果。

Public @ 2023-03-26 03:00:11

Google的AMP-加速移动页面

Google的AMP(Accelerated Mobile Pages)是一项开源计划,旨在加速移动web上的页面加载速度。它基于HTML和JavaScript,并在页面结构上施加了严格的限制,以便效率更高地加载内容。AMP主要有以下优点: 1.快速加载:AMP页面加载速度比非AMP页面快,通常快2-3倍。 2.提高搜索排名:Google已将其搜索算法调整为 AMP优先,因此对于移动搜索,AM

Public @ 2023-03-29 04:00:23

响应式网页设计的快速教程(适合个人站)

响应式网页设计(Responsive Web Design,RWD)是一种能够适应不同屏幕尺寸,布局自适应的设计技术,使得网页能够在不同的设备上有更好的表现和用户体验。 以下是适合个人站快速学习响应式网页设计的教程: 1. 初步了解CSS媒体查询(Media Query) CSS媒体查询是实现响应式网页设计的关键技术之一,它可以根据浏览器的屏幕尺寸及设备类型等信息,动态地改变网页的样式。例如

Public @ 2023-04-01 16:00:48

响应式网页设计的快速教程(适合个人站)

1.了解响应式设计的概念 响应式网页设计是一种能够适应不同屏幕大小的设计方式,使得网页在不同设备上都能够获得良好的访问体验。响应式网页设计涉及到页面布局、图像和文本大小等元素的缩放和自适应。 2.选择适合的网页框架 在开始设计之前,您需要选择一个适合您需要的网页框架。Bootstrap是一个非常流行的框架,但还有其他可选项,例如Foundation和Semantic UI。 3.创建一个网

Public @ 2023-04-21 06:00:18

更多您感兴趣的搜索

0.494421s