網頁轉址

2017-01-31 4

網頁轉址 URL Redirection

如何把網站轉到另一個網址?介紹各種轉址方法。

網域名稱轉址(英語:URL redirection,或稱網址重新導向或URL重定向),是指當使用者瀏覽某個網址時,將他導向到另一個網址的技術。

目錄

轉址的好處

轉址有兩大好處:

  1. 簡化網址
  2. 留住舊訪客

為了方便分享,你可以使用短網址服務(如 BitlyPicSee 皮克看見 等)縮短長網址,而且註冊後能查看點擊報告,追蹤成效。

不過短網址服務通常由英文字母及數字隨機組成,較難記住。如果你擁有自己的域名,建議使用 DNS 轉址。例如:

我的 YouTube 頻道網址是
https://www.youtube.com/channel/UCVcY0oInOCDO0QOKgj7g7WQ

這麼長的網址,我也不記得是甚麼。於是我加入子網域(Subdomain):youtube,把 http://youtube.alyssachan.space 轉址到上述長網址,簡潔方便。

轉址類型:常駐(301) VS 暫時(302)

常見的轉址類型主要分為常駐(301) VS 暫時(302),3XX 是 HTTP 狀態碼的一種,意義請參考下表:

HTTP 狀態碼狀態
200
OK
請求已成功,請求所希望的回應頭或資料體將隨此回應返回。
301
Moved Permanently
被請求的資源已永久移動到新位置。
302
Moved Temporarily
請求的資源現在臨時從不同的URI回應請求。
用戶端應當繼續向原有位址傳送以後的請求。
404
Not Found
請求失敗,找不到網頁。
500
Internal Server Error
伺服器遇到了一個未曾預料的狀況,導致了它無法完成對請求的處理。
503
Service Unavailable
由於臨時的伺服器維護或者過載,伺服器當前無法處理請求。

由此可見,如果是永久轉址,請選擇 301;而假如是特別情況臨時轉址,將來會繼續使用舊網址,則選擇 302。

轉址的方法

1. 利用 .htaccess 轉址(到新對應頁面,需 Apache 伺服器)

若新舊網站的結構一致,可使用此方法,做到一對一的轉址,即
http://olddomain.com/page-1.html → http://newdomain.com/page-1.html

建立「.htaccess」文字檔,或在已有的 .htaccess 中加上:

RewriteEngine on
RewriteRule (.*) http://newurl.com/\ [R=301,L]

http://newurl.com 修改為新網址,如臨時轉址,請把 R=301 改為 R=302

注意!如已有 .htaccess 檔,而你又並不熟識使用方法,請先做好備份再修改,.htaccess 出錯會導致伺服器錯誤(500)。

然後把改好的 .htaccess 上傳到網站的根目錄即可。如遇上在 Windows 無法建立以 「.」開首的檔案名稱,先隨便改名,上傳後再到伺服器修改。

2. 利用 HTML 轉址(到新首面)

<head></head> 之中加入 meta tag 以重新整理到新網站的首頁,即
http://olddomain.com/page-1.html → http://newdomain.com/

<meta http-equiv="refresh" content="0; url=http://newurl.com" />
<link rel="canonical" href="http://newurl.com" />

<meta> 中的 content 表示:在 0 秒後重新整理到 http://newurl.com。
<link> 中的 canonical 表示標準網址。如臨時轉址時,可不加此行。

3. 利用 PHP 轉址(到新首面)

在第一行使用 header() 函數,定義路徑。會新整理到新網站的首頁,即
http://olddomain.com/page-1.html → http://newdomain.com/

<?php
 header('HTTP/1.1 301 Moved Permanently');
 header('Location: http://newurl.com/');
 exit();
>

如臨時轉址,可不用加 header('HTTP/1.1 301 Moved Permanently'); 那一行的狀態。

4. 利用 JavaScript 轉址(到新首面)

原則上在 HTML 網頁任何地方貼上下列語法都可轉址,但放在開頭會比較有效率。同樣會新整理到新網站的首頁,即
http://olddomain.com/page-1.html → http://newdomain.com/

<script>document.location.href="http://newurl.com";</script>

簡短寫法可不用加 document. 宣告文件。

5. 例子:Blogger 轉址

站內轉址

如需在站內轉址,例如把永久連結(Permalink)由 http://my.blogspot.com/2017/01/post-1.html 改為 http://my.blogspot.com/2017/01/my-favorite-designs.html,以優化網址結構,可使用 Blogger 設定中的重新導向,把流量導去新網址。

  1. 前往 [設定] > [搜尋偏好設定]
  2. 在 [錯誤與重新導向] 中,按下 [自訂重新導向網址] 該行的 [編輯]
  3. 按 [新增重新導向網址](如首次新增,系統會自動省略此步驟)
  4. 在 [來源網址:] 一欄,輸入舊網址:/2017/01/post-1.html
  5. 在 [目標網址:] 一欄,輸入新網址:/2017/01/my-favorite-designs.html
  6. 剔選 [永久性:] 旁邊的 checkbox
  7. 按 [儲存]
  8. 按 [儲存變更]
  9. 重覆第 2–8 步,並於第 4 步中,在舊網址後面加上 ?m=1,即:/2017/01/post-1.html?m=1。以確保手機版網頁也能重新導向至新網址

站外轉址

如果你有需要把舊的 Blogger 網誌轉到另一個新 Blogger 網址首頁,請把以下編碼複製到 <head> 的後面,並把 http://newurl.com 修改為新網址。

<script>
 var d='<data:blog.url/>';
 d=d.replace(/.*\/\/[^\/]*/, '');
 location.href = 'http://newurl.com';
</script>

此外也可使用 HTML 方法把 Blogger 轉址。

一對一轉介 Blogger 文章

如有時間,當然做一對一的轉介最好。同樣把以下編碼複製到 <head> 的後面,並修改網址。

<!-- 轉介網址格式 -->
<b:if cond='data:blog.url == &quot;舊網址&quot;'>
<meta content='0;url=新網址' http-equiv='refresh'/>
</b:if>

<!-- Refer Home Page to New Address -->
<b:if cond='data:blog.url == &quot;http://old.blogspot.com/&quot;'>
<meta content='0;url=http://new.blogspot.com/' http-equiv='refresh'/>
</b:if>

<!-- Refer Posts to New Address -->
<b:if cond='data:blog.url == &quot;http://old.blogspot.com/2017/01/post-1.html&quot;'>
<meta content='0;url=http://new.blogspot.com/2017/01/post-1.html' http-equiv='refresh'/>
</b:if>

<b:if cond='data:blog.url == &quot;http://old.blogspot.com/2017/01/post-2.html&quot;'>
<meta content='0;url=http://new.blogspot.com/2017/01/post-2.html' http-equiv='refresh'/>
</b:if>

注意!可能需要使用 https 及加上?m=1,照顧不同 Blogger 版本。

6. 例子:WordPress轉址

如果轉用 WordPress,可以安裝 Redirection 外掛。

建議在 Options 中的 Default query matching 選擇 Ignore and pass all query parameters,因為預設的 Exact match 會導致加了網址參數的轉介(例如 ?utm?fbclick)出現 404 錯誤。

如果從 Blogger 搬到 WordPress,需要解決 ?m=1 導致 404 錯誤。方法是在 .htaccess 中 #BEGIN WordPress 下面加上以下編碼:

# BEGIN fixing Blogger ?m=1 issue in WordPress
RewriteEngine On
RewriteCond %{QUERY_STRING} m=1
RewriteRule (.*) /\? [R=301,NE,L]
# END fixing Blogger ?m=1 issue in WordPress

轉址工具

有個 301 Redirect Code Generator 工具可以幫助產生不同種類的轉址語法,選項有:

轉址類型 伺服端/客戶端 舊網頁檔案類型 舊網址伺服器類型 是否永久301重新導向?
PHP 伺服端 .php Apache / Linux
ASP 伺服端 .asp IIS / Windows
ASP.NET 伺服端 .aspx IIS / Windows
Apache .htaccess 伺服端 全部 Apache / Linux
IIS web.config 伺服端 全部 IIS / Windows
HTML meta tag 客戶端 .html 全部
Javascript 客戶端 .html 全部
jQuery 客戶端 .html 全部

減少搬站對搜尋排名的影響:使用網址變更工具(Google Search Console)

改網址或多或少會影響SEO。如可使用 .htaccess 等永久 301 重新導向方法,記得到 Search Console 提交變更網址,以便 Google 為您的新網址建立索引,減少因搬站對目前的 Google 搜尋結果排名的影響。詳細做法請參考「使用網址變更工具 – Search Console 說明」。


參考資訊:

免費按讚支持創作

喜歡我的文章,請在下面按讚 5 下,助我得到 LikeCoin 獎賞,支持我繼續創作免費內容。

行有餘力,可以成為我的讚賞公民,每月送我一杯咖啡,從此每份贊助,都會化成實質支持。

作者簡介

香港斜槓族,喜歡學習的宅女。打工時期做過行銷、教育及IT行業。自學技能包括:網站開發、網路行銷、影片製作、平面設計等。

希望透過內在自我認知及外在技能培養的分享,幫助網路創業者實現理想生活,共建和諧美好的世界。

4 則評論

  1. 請問~~如果我要製作Blogger變成網站式的,舉例:關於我-必須先要建置文章在連結過去?

提交評論

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

本網站受 reCAPTCHA 保護,並適用 Google 隱私政策服務條款