网站地图放到网页底部的好处和实例

所属分类: 网页制作 / 应用技巧 阅读数: 2032
收藏 0 赞 0 分享

在过去,几乎每个网站都有一个网站地图页列出它们所有的网页。网站地图页的作用是帮助访问者和搜索引擎蜘蛛去找到网站上的信息。现在,许多现代的网站已经去掉了网站地图,替代它们的是在网站页脚区域放置网站地图。脚本之家将列举20个网站(从大公司到小作品集网站), 看看它们是怎样灵活的组织它们的页脚的,以提高网站的有用性。

在页脚放置网站地图的好处

1,吸引用户点击和访问者逗留。

正如你所知,在线读者不会阅读页面上的任何内容,他们滚动和扫视。页脚是他们离开之前最后看的地方。在页脚放置一个网站地图或许能 吸引读者的注意,增加网页的点击数和阅读.

2.确保你的用户没有错过什么

有时你的访问者可能太懒不去点击进入网站地图页的链接而错过了一些东西,在页脚有一个网站地图可以确保你的访问者是知道了每一页。

3.使用你的页脚,以促进相关链接。

你并不一定要真正列出每一件事情在你的页脚。你可以把它作为一个替代位置来使用,以促进相关重要页面的阅读。

4.节省阅读者的时间

在页脚有一个网站地图可以允许用户快速的从一个页面跳转到另外一个页面。

5.你节省访问者的点击

在页脚放置一个网站地图,而不是放置一个单独页面里,你节省了用户的点击。

6.增强布局设计

不知道把什么放入页脚?网站地图可以用来填充,这样可以使你的网站看起来更大一些。

Digg

Digg通过只放置类别内容来保持好和清理的头部。头部的重点是用户,而页脚是着眼于公司。

Mozilla - Firefox

多谢网站地图,只需一眼,我就知道网站上有什么内容。

Apple

如果你有一个巨大的网站(在内容) ,把充分的Sitemap页脚可能是精神错乱?您可以了解从聪明Apple.com ,分裂的Sitemap到部分。例如,去苹果节中,您将只能看到苹果的Sitemap 。

GoodBarry

虽然GoodBarry的页脚网站地图没有列出他网站上所有的内容,但是它列出了重要部分的内容。

White House

在最近改版后的白宫网站上,通过下拉菜单和页脚的网站地图来浏览网站变得更加容易。

Miro

Miro网站通“Looking for something?”文字栏来分开页脚网站地图

Six Apart

你也可以象Six Apart 一样利用网站地图来连接你的网络站点。在页脚,博客部分,有一些链接到姐妹站点的链接:Typepad,Movable,and Vox.

Clearspring

在clearspring网站,它将它的服务分成两部分:Launchpad and WidgetMedia.

SqareSpace

SquareSpace的网站地图告诉你哪些网页已经访问过的。请注意访问的网页有一个微小的检测标记,而不是经常用的三角图标

SugarSync

SugarSync的页脚只列出了网站的主要等级,而单独的网站地图列出了所有页。



FreeAgent Central

FreeAgent Central的页脚有一个网站地图,同时有一个链接到单独网站地图的链接。

FiveRuns

FiveRuns创意性的组织了他们的网站地图,通过列举他们主要的产品。

Red Nose Day

我特别喜欢Red Nose Day的页脚,因为它使它的网站特别突出。

Tigers

在页脚有太多的空白,用网站地图填充它。制作一个网站地图,你不需要太多的网页(Tiggers是一个例子)

Get Satisfaction

Get Satisfaction通过在页脚放置网站地图节省了他们网站头部的空间.

Flashloaded

Flashloaded销售flash组件,从而他们的网站页脚只列出产品。

Jamie Oliver

Jamie Oliver的网站在页脚也只提供了一个简单的网站地图,同时有一个链接指向单独的网站地图页面。

Redbrick Health

好且干净的5列网站地图

FortySeven Media

我已经展示了许多大公司的网站,你有小公司的网站吗?FortySeven Media作为你制作作品集站点的一个好例子。他们用页脚来展示在他们的博客和作品集里的作品。

Jason Santa Maria

这个也是我最喜欢的,它不仅优雅,而且以一种漂亮的方式展示博客上的活动,来吸引读者。

设计网页页脚网站地图的技巧:

1.分类:用分类来组织你的链接;

2.使用标题:对每一个分类使用标题;

3.保持一致:链接应当保持一致有序;

更多精彩内容其他人还在看

sitemesh教程-页面装饰技术原理及应用

Sitemesh是一种页面装饰技术:它通过过滤器(filter)来拦截页面访问,据被访问页面的URL找到合适的装饰模板等等,感兴趣的朋友可以了解下哦
收藏 0 赞 0 分享

浏览器可以注册的事件小结

我们在网页制作中经常会用到浏览器事件,这里简单的整理下方便需要的朋友
收藏 0 赞 0 分享

从image/x-png谈ContentType(s)

今天在做一个文件上传的功能的时候,发现我总是上传不了png的图片。经过调试发现,应该是在ContentType的地方判断失误了。后来百度了一下发现一个有意思的现象,我发现png的图片的ContentType并不是我在注册表中看到的image/png,而是image/x-png
收藏 0 赞 0 分享

窗口中的各种距离/滚动距离的精确计算汇总

平时在项目开发中,没少跟边距,位置,坐标什么的打交道,悲剧的是,如果你对这些东西没有非常清晰的概念,编码的时候会非常痛苦,到处找资料寻求距离的精确计算,接下来本文提供一个示意他,希望对你有帮助
收藏 0 赞 0 分享

web的各种前端打印方法之CSS控制网页打印样式

使用CSS控制打印样式,握刚刚使用时一塌糊涂,根本不知道CSS中的midia的作用是什么,问到别人说导入这个样式,还傻乎乎的不知所措,接下来介绍CSS控制网页打印样式是如何实现的
收藏 0 赞 0 分享

响应式WEB设计学习(1)—判断屏幕尺寸及百分比的使用

现在移动设备越来越普及,用户使用智能手机、pad上网页越来越普遍,但是传统的fix型的页面在移动终端上无法很好的显示。因此,Ethan Marcotte提出一种响应式web设计的概念,响应式web设计的英文为Responsive Web Design,简写为RWD,感兴趣的朋友可
收藏 0 赞 0 分享

响应式WEB设计学习(2)—视频能够做成响应式吗

除了图片以外,还有一种常见的多媒体形式是视频。有时在web设计中,根据需要会在页面中加入视频,视频大小的自适应单靠CSS本身似乎是做不到的,感兴趣的朋友可以详细了解下
收藏 0 赞 0 分享

响应式WEB设计学习(3)—如何改善移动设备网页的性能

究竟是网页中的何种元素拉低了网页在移动设备中加载的速度呢?这些元素应该做何处理以提升页面在移动设备中的整体性能?是否存在一种设计模式可以同时满足移动端及桌面端的页面设计呢?带着这些疑问开始本文之旅吧
收藏 0 赞 0 分享

网页设计必备手册 216网页安全色大全

网页安全色是指在不同硬件环境、不同操作系统和不同浏览器中都能够正常显示的颜色集合(调色板或者色谱),也就是说这些颜色在任何终端用户的显示设备上都是相同的效果
收藏 0 赞 0 分享

网页设计中设计出有层次感的界面的经验介绍

很多网友常说自己的网站为什么色彩上总是有问题,总是看起来没什么精神,没办法吸引人注意。观察了一些网友们设计的网站发现他们在用色上不够大胆,同时也缺乏对色彩层次的理解。
收藏 0 赞 0 分享
查看更多