现在的位置: 首页 > 综合 > 正文

设计对浏览器更加友好的网站——整合搜索功能(针对Google Chrome)

2012年06月13日 ⁄ 综合 ⁄ 共 1968字 ⁄ 字号 评论关闭

设计对浏览器友好的网站,是一个很大的话题。本篇文章想讨论一下的是,如何在Google Chrome中直接整合网站所带的搜索功能。

很多网站都有搜索功能,例如以博客园的搜索中心地址是:http://zzk.cnblogs.com/

image

我们可以进入这个网页,然后输入关键字进行搜索,例如

image

这没有任何问题,但有时候可能你会想,为什么每次都要输入地址,然后进入到搜索页面,然后再输入关键字才能搜索呢?有没有更加简单的方法?

Google的Chrome浏览器在这方面有一些不错的创新,首先,它支持直接在地址栏输入内容,进行搜索,例如

image

此时他会调用默认的搜索引擎(我的本机设置为Bing)进行搜索

image

默认的搜索引擎肯定只有一个,那么我们是否有办法添加更多的搜索引擎,并且用某种方式在地址栏直接搜索呢?

在Google Chrome的设置页面中,你可以看到可以管理搜索引擎

image

点击“管理搜索引擎”按钮可以看到如下的界面

image

如果我们希望能快速地访问博客园的搜索功能,可以在“其他搜索引擎”中添加一个定义

image

第一个参数是一个描述名称,第二个参数是你可能会在地址栏中输入的地址,第三个字符串是将要访问的搜索页面的地址,用%s表示你的搜索关键字。

那么,这样定义好之后,如何使用它呢?

你可以在地址栏输入zzk.cnblogs.com(通常会自动补齐的),然后注意看右侧会有一个提示“按Tab可通过博客园进行搜索”

image

我按下Tab键,然后输入要找的关键字,例如CLR

image

回车之后就可以直接看到搜素结果了。

image

这样看起来就好了很多,节省了我们一些时间,这是一个聪明的设计。

再往深入里面想一下,这个做法是很好,但是如果要求所有人都去手工地添加这个搜索设置,可能也不是很方便。有没有更加智能的做法呢

其实Google Chrome在设计上已经考虑了这个问题,如果我们的网站想自动地在Google Chrome中注册搜索引擎设置,可以参考这里的说明

http://www.chromium.org/tab-to-search

image

我们需要在搜索中心的页面的头部中,添加一个链接定义

<link type="application/opensearchdescription+xml" rel="search"        href="url_of_osdd_file"/>
然后设置一个文件内容
<?xml version="1.0"?>
<OpenSearchDescription xmlns="http://a9.com/-/spec/opensearch/1.1/">
 <ShortName>Search My Site</ShortName>
 <Description>Search My Site</Description>
 <Url type="text/html" method="get" template="http://my_site/{searchTerms}"/>
</OpenSearchDescription>
 
这里使用{searchTerms}代表要搜索的关键字。
这方面,很多网站都已经做到了,例如国外知名的问答社区stackoverflow.com 的定义是下面这样的:
<link rel="search" type="application/opensearchdescription+xml" title="Stack Overflow" href="/opensearch.xml">
image
希望博客园的搜索中心也加上这样的功能,也希望更多的浏览器也提供这样的设计。

抱歉!评论已关闭.