音效素材网提供各类素材,打造精品素材网站!

站内导航 站长工具 投稿中心 手机访问

音效素材

网站加入搜索功能后 如何设计好自己的搜索框呢
日期:2017-03-14 11:07:24   来源:脚本之家

稍微具有一定规模的网站,在网站建设上可能都会考虑加入网站搜索功能,前期网站内容较少,网站搜索功能显示不出威力,但是,随着网站内容越来越多(一个运营良好的网站,内容不断的增加应该是常规性工作),那么,搜索功能的作用就日益凸显出来。

谈到搜索功能,当然绕不开百度、谷歌。普及大家一个知识,百度搜索框大小是356*28,谷歌为448*28。打开搜引擎,在这个搜索框中输入关键词,那么,你想要你想了解的大量信息就像哆啦A梦的口袋一样,全部显现出来,它就这么神奇,但是,在很多网友眼里,已经变成显而易见的事情,就好比空气和水一样。

搜索框究竟有什么用?一些站长片面的认为,那是搜索引擎的标配,我做个小网站,几乎是不需要的,也有的比较牛的科技则说,搜索毕竟有点傻,要做就来个智能语音,就好比微软,扬言要在十年后取消搜索框,全部变成人工智能。其实,细心的用户已经发现,百度在移动端,早已经实现了语音搜索,不过,当用户进行搜索的搜索的时候,也需要在搜索栏中找到语音按钮,而且搜索结果和普通文字搜索结果展示方式并无二致。使用语音的网友也发现,语音搜索并不像传说中那么智能,如果用户放言较重,可能会出现大量的错误,这显然在用户体验上还需要加强。

不管未来技术发展如何牛,对于大多数的网站来说,“活在当下”最为重要。我们接着看搜索引擎如何对搜索框进行优化的,还是以百度为例,当你在百度上输入“网站”的时候,百度会智能出现关于“网站”最热词汇的下拉框,这可是百度精心设计的,不要小看这一功能,如果你是一个观察细致的站长就会发现,搜索框提升的部分关键词和产品优化的关键词是重合的。作为SEOer经常会为关键词选择而苦恼,特别是面对大量备选关键词的时候,其实百度搜索框就给了你提醒。当然,百度在经过一系列复杂的算法后,会将最热的词和你输入的关键词结合,达到与时俱进的效果,这显然对选择长尾关键词有一定的借鉴意义。

在电商网站,搜索框也经常可见,电商网站以淘宝为例,更尊重用户体验,它们会对用户搜索的内容进行分门别类,手机为例,当你输入手机这个关键词的时候,淘宝会根据手机品牌、价格、屏幕大小、系统等细分让用户进行选择,以便于让用户在最短时间找到最合适的产品。

话归正题,网站搜索框该如何设计呢?和专业的电商网站、搜索引擎网站比较,也许不必追求的那么精确,那么,普通网站在加入搜索这一功能的时候,还是以满足用户体验为主要前提,具体做到这几点就可以了:

1、把搜索框放到显眼的位置上

研究表明,右上角的区域是用户搜寻输入框的首选区域,最好在搜索框附近做一个显著的标示,比如放大镜就能让用户很快理解和找到这个功能。

2、关键词设置不要过于繁琐

本身网站的行业性特别明显,在关键词的设置上,不必电商网站那么繁琐,如果真要划分,把导航的关键词归类即可,这样用户可以很舒服的利用搜索框,如果过于繁琐,会对陌生用户造成使用障碍。

3、每页都保留搜索框

在SEO优化理论上,引导用户主要是依靠链接做到的,但是,链接容易打乱用户的思维,比如用户正在看一个文章,中间出现一个链接,他们是点击这个链接查看,还是看完这篇文章再回头点击这个链接呢?如果在内页中加入搜索框,给用户一个新的选择,无论他在网站哪个地方,都可以立刻获取内容,显然这比强加的“内部链接”要自由多了。

对于普通网站来说,大概这三个功能就可以了,当然,想要给用户更好的体验,需要在用户反馈中不断完善,因为,在互联网鲜有那种按部就班的事情,不断的升级改造,才是一个网站逐渐走向成熟的正确姿势!

来源:http://www.shwzzz.cn

    您感兴趣的教程

    在docker中安装mysql详解

    本篇文章主要介绍了在docker中安装mysql详解,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编...

    详解 安装 docker mysql

    win10中文输入法仅在桌面显示怎么办?

    win10中文输入法仅在桌面显示怎么办?

    win10系统使用搜狗,QQ输入法只有在显示桌面的时候才出来,在使用其他程序输入框里面却只能输入字母数字,win10中...

    win10 中文输入法

    一分钟掌握linux系统目录结构

    这篇文章主要介绍了linux系统目录结构,通过结构图和多张表格了解linux系统目录结构,感兴趣的小伙伴们可以参考一...

    结构 目录 系统 linux

    PHP程序员玩转Linux系列 Linux和Windows安装

    这篇文章主要为大家详细介绍了PHP程序员玩转Linux系列文章,Linux和Windows安装nginx教程,具有一定的参考价值,感兴趣...

    玩转 程序员 安装 系列 PHP

    win10怎么安装杜比音效Doby V4.1 win10安装杜

    第四代杜比®家庭影院®技术包含了一整套协同工作的技术,让PC 发出清晰的环绕声同时第四代杜比家庭影院技术...

    win10杜比音效

    纯CSS实现iOS风格打开关闭选择框功能

    这篇文章主要介绍了纯CSS实现iOS风格打开关闭选择框,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作...

    css ios c

    Win7如何给C盘扩容 Win7系统电脑C盘扩容的办法

    Win7如何给C盘扩容 Win7系统电脑C盘扩容的

    Win7给电脑C盘扩容的办法大家知道吗?当系统分区C盘空间不足时,就需要给它扩容了,如果不管,C盘没有足够的空间...

    Win7 C盘 扩容

    百度推广竞品词的投放策略

    SEM是基于关键词搜索的营销活动。作为推广人员,我们所做的工作,就是打理成千上万的关键词,关注它们的质量度...

    百度推广 竞品词

    Visual Studio Code(vscode) git的使用教程

    这篇文章主要介绍了详解Visual Studio Code(vscode) git的使用,小编觉得挺不错的,现在分享给大家,也给大家做个参考。...

    教程 Studio Visual Code git

    七牛云储存创始人分享七牛的创立故事与

    这篇文章主要介绍了七牛云储存创始人分享七牛的创立故事与对Go语言的应用,七牛选用Go语言这门新兴的编程语言进行...

    七牛 Go语言

    Win10预览版Mobile 10547即将发布 9月19日上午

    微软副总裁Gabriel Aul的Twitter透露了 Win10 Mobile预览版10536即将发布,他表示该版本已进入内部慢速版阶段,发布时间目...

    Win10 预览版

    HTML标签meta总结,HTML5 head meta 属性整理

    移动前端开发中添加一些webkit专属的HTML5头部标签,帮助浏览器更好解析HTML代码,更好地将移动web前端页面表现出来...

    移动端html5模拟长按事件的实现方法

    这篇文章主要介绍了移动端html5模拟长按事件的实现方法的相关资料,小编觉得挺不错的,现在分享给大家,也给大家...

    移动端 html5 长按

    HTML常用meta大全(推荐)

    这篇文章主要介绍了HTML常用meta大全(推荐),文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参...

    cdr怎么把图片转换成位图? cdr图片转换为位图的教程

    cdr怎么把图片转换成位图? cdr图片转换为

    cdr怎么把图片转换成位图?cdr中插入的图片想要转换成位图,该怎么转换呢?下面我们就来看看cdr图片转换为位图的...

    cdr 图片 位图

    win10系统怎么录屏?win10系统自带录屏详细教程

    win10系统怎么录屏?win10系统自带录屏详细

    当我们是使用win10系统的时候,想要录制电脑上的画面,这时候有人会想到下个第三方软件,其实可以用电脑上的自带...

    win10 系统自带录屏 详细教程

    + 更多教程 +
    网站运营微信营销网络赚钱