每日 30 秒 ⏱ 千裏姻緣一線牽

時間 2019-11-07

標籤每日千里 1000裏姻緣一線简体版

原文原文鏈接

簡介

SEO、連接、a 標籤、HTTP 狀態碼、link 標籤、alternate、canonicalphp

唐朝有個小夥叫韋固喜歡在河邊玩，一天遇到一個老伯伯在月光下把兩塊石頭系在一塊兒。小夥看到很好奇便問道「系石頭作什麼呢？」老伯伯說「我在給當婚人牽線，這對石頭是一對夫妻。」小夥問道：「那個人妻子是誰呢？」老伯伯說：「就是村頭看菜園子的女孩兒。」html

小夥就好氣，本小夥玉樹臨風、風流倜儻怎麼能夠和菜園窮醜丫頭一塊兒呢？次日路過菜園，抄起石頭就往女孩兒頭上砸過去，女孩兒便倒地不起，小夥也嚇得畏罪潛逃。前端

後來小夥當了大學士，看上了張員外的外甥女拖媒人提請。洞房花燭夜時發現妻子頭上有個疤痕，問道怎麼回事。才發現原來這就是菜園的窮醜丫頭，把月下老伯的話告訴了妻子，才相信緣分是拆不散的。git

這個即是 千裏姻緣一線牽 故事來源，這要是換到如今怕是 想去醫院看看 wifi 快不快了。不過這句話常說，可是故事並非全部人都知道，你們能夠講給女友聽聽加點小內容，確定撩妹滿分。程序員

程序員心中的女神是計算機，怎麼會有女友呢？-- by 又背鍋的魯迅先生github

連接網

是什麼

原本只想講 a 標籤，可是其餘內容關聯性也挺強的，因此本文篇幅會比較大。安全

爲何會取這個標題呢？在使用網絡的時候，一個個網站經過 連接 被鏈接到一塊兒，好似月老的紅線一圈圈的纏繞着。有時候不得不佩服中文的博大精深，互聯網 這個詞真的是很是恰當經過 連接 互相聯繫在一塊兒的網狀結構。bash

懷舊的同窗能夠看看《天庭外傳》小豬八戒牽紅線那段真的是笑死小二了。微信

爲何

當 搜索引擎 派出 小蜘蛛 在爬取當前連接頁面時，頁面上會有不少其餘相關連接，小蜘蛛 會順着這個連接繼續爬取下去到必定的深度，並對這些相關連接和 當前連接作出關聯，相關連接的好壞會影響到當前連接的天然排名。網絡

舉個最簡單的例子，閩南風俗裏在結婚前有個 考察環節，男女方各自會組成相親考察團到對方的村裏面打聽 對方 人品、行爲等在鄰居口中的評價來從側面瞭解對方的狀況。

小二的朋友小四由於外婆在幾十年前 偷過一隻鴨 被鄰居告知了 考察團，致使 相親考察團 對他的印象分有所下降。這裏的 外婆 和 小四 即是 相關連接 和 當前連接 的映照。

a 標籤

在頁面上出現的連接幾乎離不開 a 標籤，咱們經過一個個的 a 標籤 去往不一樣的頁面。你們最常用也是最常常忽略的即是 a 標籤 中的文本內容，當 搜索引擎 中的 小蜘蛛 爬取當前頁面，發現頁面上有 a 標籤 時會繼續爬取下去，而文本內容會做爲連接的描述參考。

通常的連接結構是<a href="https://juejin.im/timeline/frontend" >前端</a>。其中前端就是文本內容也叫作錨文本，一般狀況下搜索引擎會經過錨文本來理解https://juejin.im/timeline/frontend這個頁面的內容是什麼。爲了告訴 小蜘蛛 哪些能夠爬取哪些不能夠爬取，能夠利用 rel 來指明：

rel 值	解釋
external	表示這是一個站外連接
nofollow	搜索引擎 `不該該` 抓取 `相關連接` 並記錄權重。
noopener、noreferrer	使得 opener 和 referrer 屬性無效，防止 target="_ blank" 帶來釣魚安全問題

例如在掘金中用戶評論中使用 noopener、noreferrer 和 nofollow 來防止評論裏使用了一些危險連接：

target="_ blank" 相關內容能夠查看你們一塊兒被捕吧。

友鏈

相關連接 除了壞處也有好處，若是是一個知根知底且不錯的網站，能夠相互關聯來提高網站的權重，這個方式叫作友情連接 從名字上就很是好理解。像京東 就有專門的友情連接 http://club.jd.com/links.aspx：

友情連接的好處簡單說來就是：一個網站被越多站點說起，越知名站點說起，它很大程度上是一個好網站。例如 BAT 要是掛上了小二的連接，你們是否是也會更相信小二這我的？

robots

利用 robots.txt 來告訴 小蜘蛛 哪些頁面是能夠爬取的那些是不能夠爬取的:

User-agent: *

# agency和user禁止訪問
Disallow: /timeline
Disallow: /submit-entry
Disallow: /new-entry
Disallow: /edit-entry
Disallow: /notification
Disallow: /subscribe/subscribed

# agency中容許訪問的目錄
Allow: /agency/join
Allow: /agency/personal
複製代碼

meta robots

若是想當前連接 和 相關連接 徹底不出如今搜索結果中，例如能夠利用 meta 標籤：

<meta name="robots" content="onindex,nofollow">
複製代碼

name 和 content 值部分參考以下：

name 值

name 值	解釋
robots	泛指全部小蜘蛛
Baiduspide	指百度小蜘蛛
Googlebot	指谷歌小蜘蛛

content 值

content 值	解釋
index	搜索引擎 `應該` 抓取該 `當前連接`
noindex	搜索引擎 `不該該` 抓取 `當前連接`
follow	搜索引擎 `應該` 抓取 `相關連接`
nofollow	搜索引擎 `不該該` 抓取 `相關連接` 並記錄權重

真假首頁

是什麼

https://juejin.im/
https://www.juejin.im/
複製代碼

對於用戶來講這兩個連接都是掘金的首頁，但是對於 搜索引擎 來講這兩個連接分別對應的是兩個不一樣的網站。

爲何

在搜索引擎裏，包括參數的不一樣，只有連接徹底同樣，纔會認爲是同一個連接。內容類似頗有可能被搜索引擎判讀爲做弊，而且會致使權重被分散掉。就比如一條街上開兩家 萬達廣場 直接會把客源稀釋成兩部分。

更多 URL 相關能夠閱讀 URL 大爆炸。

重定向

喜歡動手的同窗可能會去試試訪問 https://www.juejin.im/，就會發現連接會被重定向到 https://juejin.im/，確實這個方法便能幫助掘金主頁從兩個入口變爲一個。可是細心的同窗還會打開 控制檯 發現跳轉的 HTTP Status Code 爲 301 而不是 302，這是爲何呢？

ps: 小二沒收一分錢廣告費哦，只是單純的舉例子。

301 狀態碼

301 (Permanently Moved)顧名思義指的是永久性轉移，搜索引擎讀取到 301 狀態碼時候會把跳轉後的網站當作真正的連接，這樣多個連接都會被當作同一個連接權重也獲得了保持。使用的場景：

域名改變，告訴搜索引擎新域名和對新的域名進行收錄。
短連接，利用短連接來方便分享不利於記憶和過長的原連接。
網頁擴展名改變，有的站點在連接會帶上 .php、.html、.aspx，當用戶保存連接爲書籤和搜索引擎收錄後，從新更改網頁擴展名會致使原連接失效顯示爲 404 Not Found，訪問流量白白流逝。
確認主頁，就如開頭給出的兩個掘金主頁連接，告訴搜索引擎哪一個纔是須要收錄。

302 狀態碼

302 Found（Moved Temporarily ）表示的是暫時性的轉移，因爲是暫時性的轉移搜索引擎和人不同不能作到精確的分辨出哪一個纔是該收錄的。使用的場景：

頁面刷新跳轉，例如建立發佈文章後，跳轉到文章的發佈頁面。
回到原先頁面，例如未登陸前先使用302重定向到登陸頁面，登陸成功後再跳回到原來請求的頁面。
移動端和PC端，例如在手機訪問 https://juejin.im/ 跳轉到 https://m.juejin.im/，不過有的公司用的是 301，最好仍是作成響應式的網站。

注意：搜索引擎 有可能就會把跳轉後的網站歸結爲是原網址的內容，好比 baidu.com 跳轉到 juejin.im 可能會把掘金的內容歸結爲百度的，這也叫作 網址劫持。最簡單的例子就是超市裏的 康師傅 和 康帥傅：

ps: 小二真真真的沒收一分錢廣告費哦，只是單純的舉例子。

利用 html 標籤

https://pushme.top/index.html?from=juejin
https://pushme.top/index.html?from=baidu
https://pushme.top/index.html?from=taobao
複製代碼

在爲何裏提到了 參數 的不同也會被當作不一樣連接，這裏的三個連接其實都是主頁，只不過是利用了 from 來判斷用戶的來源，能夠利用 rel="cononical" 來告訴搜索引擎這幾個連接都是表示哪一個連接。

<link rel="cononical" href="https://pushme.top/index.html" />
複製代碼

固然上面 302 狀態碼中提到的 移動端和PC端 也能夠用 rel="cononical" 和 rel="alternate" 來幫助搜索引擎理解兩個網站的關係：

<!--PC頁面用 alternate 指向移動頁面-->
<link rel="alternate" href="http://m.abc.com/">

<!--移動頁面用 canonical 指向PC頁面-->
<link rel="canonical" href="http://www.abc.com/">
複製代碼