阅读 245

博客功能篇:seo优化工作,为文章和页面设置tdk(title,keywords,description)

一个网站是否对搜索引擎友好,除了内容质量和用户体验外,还有一个重要的因素,就是tdk的设置。tdk是页面三要素title、keywords、description的首字母简称。这一节,我们介绍如何使用golang给博客设置tdk。

文章的tdk在我们发布文章的时候,有可供填写的输入框,可以保存到数据库中,然而首页、列表页需要手工去设置。首页的tdk信息又是seo优化中重中之重的部分,我们需要合理给的博客各个页面设置好tdk信息。

定义页面tdk结构信息

我们在 controller/common.go 文件中,增加一个WebInfo 的struct结构体,并声明使用它:

type WebInfo struct {
	Title       string `json:"title"`
	Keywords    string `json:"keywords"`
	Description string `json:"description"`
	NavBar      uint   `json:"nav_bar"`
}

var webInfo WebInfo
复制代码

结构体信息中,包含TitleKeywordsDescriptionNavBar,他们分别对应的是:

  • Title 对应的是当前页面的SEO标题,往往,页面SEO标题跟展示给用户看的标题还会略有不同,比如增加站点后缀等。SEO标题如果包含多个隔开的短语,建议使用下划线_连接它们,比如“Golang实战教程_iris博客”。示例:搜外网:SEO培训入门图文教程、网络营销技术视频网课
  • Keywords 对应的是页面的SEO关键词,多个关键词使用英文逗号,隔开。关键词不宜过多,一般一个页面设置三到五个关键词即可,并且这些关键词最好是标题的一部分,关键词也要在页面中存在。设置关键词的时候,需要优化的大词在前小词在后,页面还要注意关键词的密度,太高关键词密度会形成关键词堆砌,太少的关键词密度则起不到优化的效果。示例:SEO,SEO培训,SEO教程
  • Description 对应的是当前页面的描述。描述往往采用一句话说明的方式来呈现。示例:搜外网专注SEO培训以及网络营销技术视频网课。为搜外用户提供符合SEO的建站系统搜外6系统、设计小程序的搜外七巧板、滴滴友链等工具平台。
  • NavBar 这个字段主要用于设置导航部分的选中效果。

在前端页面调用tdk信息

tdk信息对应的html标签分别是<title></title>标签、<meta name="keywords" content="">标签、<meta name="description" content="">标签。

因此,我们打开 template/partials/header.html,在head标签内部,增加这三个标签:

<title>{% if webInfo.Title %}{{webInfo.Title}}_{% endif %}{{SiteName}}</title>
{% if webInfo.Keywords %}<meta name="keywords" content="{{webInfo.Keywords}}">{% endif %}
{% if webInfo.Description %}<meta name="description" content="{{webInfo.Description}}">{% endif %}
复制代码

title标签每一个页面都会显示,在显示了设置的 webInfo.Title 外,在它后面再增加上网站的小尾巴SiteName

keywords标签不是必须的,现在我们就把它做成有则显示,没有则不显示来处理。

同样,description标签也是一样,如果没有设置description信息,则不显示这个标签。

分别给每一个需要给搜索引擎抓取收录的页面设置tdk信息

上面我们已经定义好了tdk信息的结构内容,现在我们就将他们分别的添加到每一个控制器中。

首页控制器IndexPage()

为了方便设置首页的tdk信息,我们将首页的tdk信息放到config.json中,server部分,扩展server信息:

//...
"server": {
  "site_name": "看到你博客",
  "env": "development",
  "port": 8001,
  "log_level": "debug",
  "title": "看到你博客:Golang实战开发入门图文教程、Golang实战技术在线学习网站",
  "keywords": "golang,golang实战开发,golang实战学习",
  "description": "网上有很多的golang开发教程,他们都是从最基础的安装环境、golang语法开始的,对于一个小白,他是有帮助的。然而大家都知道,一味地接受学习,是一个枯燥到让人窒息的过程。更多的时候是,学完就完了,该忘的、不该忘的大部分都忘记了,没有根据自己的实际需求学习,大多都记忆不够深刻。为了打破这种低效率的学习过程,我将从这里开始,介绍一种带着需求学习的golang实战学习方式。",
  "icp": "粤ICP备19130249号-2"
}
//...
复制代码

再在config/server.go处理文件中,扩展server结构体:

type serverConfig struct {
	SiteName    string `json:"site_name"`
	Env         string `json:"env"`
	Port        int    `json:"port"`
	LogLevel    string `json:"log_level"`
	Title       string `json:"title"`
	Keywords    string `json:"keywords"`
	Description string `json:"description"`
	Icp         string `json:"icp"`
}
复制代码

接着,我们在IndexPage()中增加调用代码:

webTitle := config.ServerConfig.Title
	if category != nil {
		webTitle += "_" + category.Title
		webInfo.NavBar = category.Id
	}
	webInfo.Title = webTitle
	webInfo.Keywords = config.ServerConfig.Keywords
	webInfo.Description = config.ServerConfig.Description
	ctx.ViewData("webInfo", webInfo)
复制代码

首页中默认调用设置的title。如果存在分类筛选条件的话,则附加分类标题。首页描述、首页关键词则逐一调用。

文章详情控制器ArticleDetail()

webInfo.Title = article.Title
webInfo.Keywords = article.Keywords
webInfo.Description = article.Description
ctx.ViewData("webInfo", webInfo)
复制代码

文章详情页面中,我们则直接调用文章填写的tdk信息即可。

其他页面为了页面的信息完整,我们也添加上。

Install(ctx iris.Context)

webInfo.Title = "博客初始化"
ctx.ViewData("webInfo", webInfo)
复制代码

AdminLogin(ctx iris.Context)

	webInfo.Title = "登录"
	ctx.ViewData("webInfo", webInfo)
复制代码

至此,tdk信息算是设置完毕了。我们重启项目,来检查一下tdk信息,如果正常,则表示填写正确。

完整的项目示例代码托管在GitHub上,需要查看完整的项目代码可以到github.com/fesiong/gob… 上查看,也可以直接fork一份来在上面做修改。

文章分类
后端
文章标签