1、TDK优化
新网站一定要提前想好TDK,这将对SEO起到非常重要的左右,因为搜索引擎首先抓取的就是这个。
TDK指的是什么呢?
- T:title 网站的标题,包含网站名称和网站的定位关键词,不宜太长。
- D:description 网站简介,最好保持在50字以内。
- K:keywords 网站关键词,最好保持在2-30字以内。
TDK在页面头部的meta标签,还有一些其他的,比如:author 网站的作者等等。
代码如下:
<head><title>w3h5 - 前端资源网</title><meta name="description" content="w3h5资源网是一个WEB前端资源分享网站,提供技术经验和一些常用的网站工具等。"><meta name="keywords" content="WEB前端,前端资源网,w3h5">
</head>
2、习惯使用语义化标签,比如h1、h2…标题标签等。
url采用绝对网址,或者使用网站伪静态,因为搜索引擎是不会抓去动态内容的。
优化HTML、js、css、php等的代码格式。
3、路由跳转优化
使用React或者Vue开发的很多网站都是在click方法里跳转路由,修改为a标签跳转,方便爬虫的进一步抓取
<Linktarget="_blank"to={`/resource/roommeet/3?p=${getLocalStorage("ParkID")}`}onClick={() => {}}
>
</Link>
4、url优化
上一步中a标签的url爬虫会进行抓取,确保你的url可以包含下个页面需要的所有数据
http://localhost:8000/policy?p=1295034796212309&pr=0&pt=1%2C2%2C3
上述链接中就传了下个页面需要的三个参数
- 数据id
- 选项标签的选中状态(如下图)
状态标签选中变化url代码如下:
<Linkkey={tag.ID}to={changeUrlParams(window.location.search, { pt: this.changeValues(tag.TagValue, selectPolicyTypeValues) })}className={"classify" + (this.isContains(tag.TagValue, selectPolicyTypeValues) ? " classify-checked" : "")}onClick={() => mtaH5Click(statisticsEvent.policyFiltering)}
>{tag.TagName}
</Link>
// 判断多选是否包含
isContains(tagValue, tagValues: any[] = []) {if (tagValues.length === 0) return false;if (tagValues.indexOf(tagValue) > -1) return true;else return false;
}// 多选Value的更替
changeValues(tagValue, tagValues: any[] = []) {const newTagValues = this.isContains(tagValue, tagValues) ? tagValues.filter(t => t !== tagValue) : [...tagValues, tagValue];if (newTagValues.length > 0) return newTagValues.join(",");else return null;
}
/** 变更Url参数 */
export function changeUrlParams(url: string, params: {}) {let index = url.indexOf("?"), isOnlyP = true,beforeIndexUrl = index > -1 ? url.substring(0, url.indexOf("?")) : url,afterIndexUrl = index > -1 ? url.substring(url.indexOf("?")) : "",pIndex = afterIndexUrl.indexOf("p");if (pIndex > -1) {const afterP = afterIndexUrl.substring(pIndex);isOnlyP = afterP.indexOf("&") === -1 ? true : false;}for (let key in params) {if (params.hasOwnProperty(key)) {let value = params[key];const isValueNull = (typeof (value) === "string" && value.trim() === "") || value === null;value = isValueNull ? null : standardEncoding(value);if (afterIndexUrl.indexOf("&" + key + "=") > -1 || afterIndexUrl.indexOf("?" + key + "=") > -1) {if (isValueNull) {const regex = new RegExp("(&" + key + "=)([^&]*)+", "ig");afterIndexUrl = afterIndexUrl.replace(regex, "");} else {const regex = new RegExp("(" + key + "=)([^&]*)+", "ig");afterIndexUrl = afterIndexUrl.replace(regex, function (_matchStr, g1) {return g1 + value;});}} else {if (afterIndexUrl.indexOf("&") === -1) {if (!isValueNull) {const symbol = isOnlyP ? "&" : "?";afterIndexUrl = afterIndexUrl + symbol + key + "=" + value;}} else {if (!isValueNull) {afterIndexUrl = afterIndexUrl + "&" + key + "=" + value;}}}}}url = beforeIndexUrl + afterIndexUrl;return url;
}