在asp.net 2.0中結合母板頁使用meta標籤(擴充@Page指令)

來源:互聯網
上載者:User
asp.net

介紹
母板頁是asp.net 2.0中的一個非常強大的特性,但是它卻不能提供一個實現最基礎的針對搜尋引擎最佳化的方法。如果你想你的web頁被搜尋引擎收錄並提高排名,那麼你就需要在每一個頁都指定一個title和meta標記。本文將說明如何擴充你的asp.net頁,以使得在使用母板頁的時候你可以直接在你內容頁的@Page指令中指定你的meta標籤的描述和meta標籤的關鍵字


背景
當你要針對搜尋引擎最佳化你的web頁的時候,設定頁的title標籤和頁的meta描述是其中最重要的因素之一。<title>和meta標籤實際上是在每個頁的HTML的<head>部分,下面出示一個Rhinoback online backup的例子。

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>
   Rhinoback Professional Secure Online Backup Services for Small and Medium Business - SMB
</title>
<meta name="description" content="Professional Online Backup Services. 
      Rhinoback provides robust backup functionality at affordable prices.  
      Premium features, premium services, low prices.  Get the most for 
      your money with Rhinoback!" />
<meta name="keywords" content="backup, online backup, secure backup, cheap backup, 
      free backup, offsite backup,internet backup, secure files, offsite data storage, 
      privacy, security, features, low prices, premium service, remote backup" />
</head>
<body>
     <!-- page content -->
</body>
</html>


<title>標籤的文本顯示在瀏覽器的頂端。從下面的例子中可以看到<title>在IE中的顯示


當你的頁被搜尋引擎收錄的時候,meta描述的文本則在搜尋引擎的列表中顯示。下面的例子來自google。帶底線的標題的下面的文本就來自頁的meta描述標籤。如果沒有meta描述標籤,那你的頁在搜尋引擎的列表中將顯示為你的頁上的某一處的文本。指定你的每一個頁的描述文本要比把這些事情交給搜尋引擎做好的多。

母板頁已經被證明是asp.net 2.0中非常有用的一個特性。本文不是來說明母板頁的細節或是如何?它,因為這樣的文章太多了。當我們在母板頁中使用了<head>的話,那麼母板頁下的所有內容頁都將自動的包括這個<head>。幸運的是開發人員可以在內容頁中直接在@Page指令中修改title屬性來修改內容頁的title。

<%@ Page Language="C#" MasterPageFile="~/PageTags.master" AutoEventWireup="true" CodeFile="home.aspx.cs" Inherits="home" Title="My home page title" %>


上面的@Page指令說明了這是一個使用了母板頁的內容頁。如果你要指定meta標籤的話,應該在內容頁中指定。你可以看到@Page指令中有一個“Description”屬性,但是它不能在你的頁上建立meta描述標籤。事實上,即使你指定了“Description”屬性,最後也會被忽略掉而不做任何事的。

我不可能讓網站的所有頁都使用同一個描述,而且我想給每一頁都加一個關鍵字。我們首先想到的解決辦法就是在後置代碼中插入我們想要的meta標籤到每一個頁的<head>裡,就像如下的做法
C#

protected void Page_Load(object sender, EventArgs e)
{
    HtmlMeta tag = new HtmlMeta();
    tag.Name = "description";
    tag.Content = "My description for this page";
    Header.Controls.Add(tag);
}


VB

Sub Page_Load()Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
    Dim tag As HtmlMeta = New HtmlMeta()
    tag.Name = "description"
    tag.Content = "My description for this page"
    Header.Controls.Add(tag)
End Sub


這種解決方案有一個問題,就是頁的標題,meta描述,meta關鍵字都是相互關聯的,所以我們想的是最好讓標題和描述在同一個檔案中指定。在Page_Load方法裡確實可以很簡單的在.aspx頁中加入一個<script>標籤,但是我想要一個更簡單的設定和檢查每一頁標籤的解決方案。

在接下來的方案中我們會看到如何通過擴充@Page指令給每一頁加上meta標籤。


解決方案
我建立了一個繼承自System.Web.UI.Page的page基類,並且讓我的內容頁繼承自我的BasePage類。BasePage類包含了在.aspx頁中給header控制項中增加meta標籤的代碼,當我們繼承了BasePage的之後,這段代碼就只需要在一個地方存在,而不用每一頁都寫一遍。
C#

using System;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Text.RegularExpressions;

/**//// <SUMMARY>
/// 為了給內容頁增加meta標籤而擴充基類
/// </SUMMARY>
public class BasePage : Page
{
    private string _keywords;
    private string _description;
    // 建構函式
    // 增加一個Init的事件處理
    public BasePage()
    {
        Init += new EventHandler(BasePage_Init);
    }

    // 頁將使用這個基類初始化
    // 如果可用則增加meta關鍵字和meta描述
    void BasePage_Init(object sender, EventArgs e)
    {

        if (!String.IsNullOrEmpty(Meta_Keywords))
        {
            HtmlMeta tag = new HtmlMeta();
            tag.Name = "keywords";
            tag.Content = Meta_Keywords;
            Header.Controls.Add(tag);
        }

        if (!String.IsNullOrEmpty(Meta_Description))
        {
            HtmlMeta tag = new HtmlMeta();
            tag.Name = "description";
            tag.Content = Meta_Description;
            Header.Controls.Add(tag);
        }
    }

    /**//// <SUMMARY>
    /// 擷取或設定頁的meta關鍵字
    /// </SUMMARY>
    public string Meta_Keywords
    {
        get 
        { 
            return _keywords; 
        }
        set 
        { 
            // 刪掉多餘的空格
            // 譯者註:\s匹配任何空白字元,包括空格、定位字元、換頁符等等。等價於 [\f\n\r\t\v]。
            _keywords = Regex.Replace(value, "\\s+", " "); 
        }
    }

    /**//// <SUMMARY>
    /// 擷取或設定頁的meta描述
    /// </SUMMARY>
    public string Meta_Description
    {
        get 
        { 
            return _description; 
        }
        set 
        {
            // 刪掉多餘的空格
            // 譯者註:\s匹配任何空白字元,包括空格、定位字元、換頁符等等。等價於 [\f\n\r\t\v]。
            _description = Regex.Replace(value, "\\s+", " "); 
        }
    }
}


VB

Imports System
Imports System.Web.UI
Imports System.Web.UI.HtmlControls
Imports System.Text.RegularExpressions


' 為了給內容頁增加meta標籤而擴充基類

Public Class BasePageClass BasePage
    Inherits Page

    Dim _keywords As String
    Dim _description As String
    ' 頁將使用這個基類初始化
    ' 增加一個Init的事件處理
    Public Sub New()Sub New()
        AddHandler Init, New EventHandler(AddressOf BasePage_Init)
    End Sub

    ' 頁將使用這個基類初始化
    ' 如果可用則增加meta關鍵字和meta描述
    Sub BasePage_Init()Sub BasePage_Init(ByVal sender As Object, ByVal e As EventArgs)

        If Not String.IsNullOrEmpty(Meta_Keywords) Then
            Dim tag As HtmlMeta = New HtmlMeta()
            tag.Name = "keywords"
            tag.Content = Meta_Keywords
            Header.Controls.Add(tag)
        End If

        If Not String.IsNullOrEmpty(Meta_Description) Then
            Dim tag As HtmlMeta = New HtmlMeta()
            tag.Name = "description"
            tag.Content = Meta_Description
            Header.Controls.Add(tag)
        End If
    End Sub


    '擷取或設定頁的meta關鍵字
    Public Property Meta_Keywords()Property Meta_Keywords() As String
        Get
            Return _keywords
        End Get
        set 
            ' 刪掉多餘的空格
            ' 譯者註:\s匹配任何空白字元,包括空格、定位字元、換頁符等等。等價於 [\f\n\r\t\v]。
            _keywords = Regex.Replace(value, "\\s+", " ")
        End Set
    End Property


    ' 擷取或設定頁的meta描述
    Public Property Meta_Description()Property Meta_Description() As String
        Get
            Return _description
        End Get
        Set(ByVal value As String)
            ' 刪掉多餘的空格
            ' 譯者註:\s匹配任何空白字元,包括空格、定位字元、換頁符等等。等價於 [\f\n\r\t\v]。
            _description = Regex.Replace(value, "\\s+", " ")
        End Set
    End Property
End Class


Meta_Keywords屬性和Meta_Description屬性是公用的,你可以在類執行個體化後設定它們。當某個類繼承自這個類並被初始化後,Base_Init將被調用並在頁中增加meta標籤

C#

public partial class home : BasePage 
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }
}


VB

Partial Class homeClass home
    Inherits BasePage
    Sub Page_Load()Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
    
    End Sub
End Class


注意每一個繼承自BasePage的頁都可以通過屬性或代碼來插入meta標籤。現在我們可以直接在.aspx檔案的@Page指令中指定Meta_Keywords屬性和Meta_Description屬性的值。樣本如下

<%@ Page Language="C#" MasterPageFile="~/PageTags.master" AutoEventWireup="true" CodeFile="home.aspx.cs" Inherits="home"  
    CodeFileBaseClass="BasePage" 
    Title="My home page title" 
    Meta_Keywords="page directive, extension, dotnet, asp.net"
    Meta_Description="This is the meta description for my home page."                          
%>

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
    <h3>My home page content<h3>
    <p>
    This is the content on my home page.  This page has an appropriate title tag and
    also has meta tags for keywords and description that are relative to this page.
    The title tag is essential to good search engine optimization and the meta
    description is the text that the search engine will display when your 
    page is listed in search results.  The title and meta description should be
    set specific to each page and should describe the content of the page. 
    </p>
</asp:Content>


注意這裡增加了一個CodeFileBaseClass屬性,這是必需的,它可以引用BasePage類的公用屬性


重點提要
你應該注意到了,在BasePage類裡使用了Regex。這是因為在你的.aspx裡添加描述和關鍵字的時候可能會是多行,就像下面這個例子似的

<%@ Page Language="C#" MasterPageFile="~/IdeaScope.master" AutoEventWireup="true" 
  CodeFile="is.aspx.cs" Inherits="_is"
  CodeFileBaseClass="BasePage" 
  
  Title="Effective Customer Feedback Management, Improve Customer Commmunication" 
  
  Meta_Keywords="Customer Feedback, Customer Opinion, feedback, opinion,
       idea, ideas, idea management, customer feedback management,         
        product management, product manager, product marketing,         
        product marketing manager"
                              
  Meta_Description="IdeaScope is an on-demand and embedded solution that allows 
       you to capture, prioritize and centrally manage customer feedback. Make your
       customer feedback process more efficient. Save time and involve more 
       stakeholders without significant cost."                          
%>


如果不用Regex轉換它們的話,這些標記就會包含很多的新行和空格,這會使一些搜尋引擎不知所措,所以我們要讓這些標記方便搜尋引擎的收錄。

還有另外一個問題就是,Visual Studio 2005不認識Meta_Keywords屬性和Meta_Description屬性。你如果在@Page指令中指定了這兩個屬性的話,將會看到這些屬性的下面會出現紅色的波浪線,VS2005會認為它們是無效的,但實際上它仍然可以正確的編譯和運行。如果你不想看到這些錯誤的話,你可以在Visual Studio的schema裡給@Page指令增加如下代碼。

<xsd:attribute name="Meta_Keywords" vs:nonfilterable="true" />
<xsd:attribute name="Meta_Description" vs:nonfilterable="true" />


這些節點應該作為<xsd:complexType name="PageDef">的子節點被插入,如果你把Visual Studio 2005安裝在預設路徑,那麼這個schema檔案的路徑則是

C:\Program Files\Microsoft Visual Studio 8\Common7\Packages\schemas\html\page_directives.xsd

本文示範了如何通過擴充@Page指令使其支援meta關鍵字和meta描述。你也可以使用相同的方法增加其他的meta標籤。原碼檔案和樣本項目包括了c#和vb兩種語言。感謝Scott Guthrie的部落格文章,Obsure but cool feature in ASP.NET 2.0一文為本解決方案提供了支援人員。



相關文章

E-Commerce Solutions

Leverage the same tools powering the Alibaba Ecosystem

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。