最近上線的項目中 後期客戶提出一個明顯的需求是:在不增加推廣費用成本前提下 技術層面盡量保證baidu搜尋引擎排名的靠前
其實這個設計到搜尋引擎的優化技巧, 從以前推廣的成功案例來看, 基本能夠保證客戶的網站或社群主題在百度搜尋引擎的前三頁, 不包括百度推廣連結, 核心還是與百度進行一定層面上合作, 對與搜素引擎中關鍵字定位也極其重要, 在某些行業内關鍵字使用頻率很高,例如房地産行業 基本目前關鍵字都被注冊, 這樣的服務我們是能做的, 但是對于大量普通客戶來講, 現實中高額的推廣費用 而且短期内難以看到具體的效益 這也是難以接受的,但是相對而言對于一些比較冷門的行業，簡單頁面優化同樣達到這樣的效果.
問題關鍵在頁面的Title和Meta标簽,在沒有搜尋引擎的時代，Meta标簽僅用于記錄這個網頁的作者，版權資訊等内容；但随着搜尋引擎的出現，Meta出現了新的含義：它可以給搜尋引擎提供諸多方面關于目前頁面的基本資訊。大多數網站開發者主要重視和優化兩個對搜尋引擎非常重要的标簽，分别是description标簽——用于描述網頁的概要資訊和keywords标簽——用于描述網頁的關鍵字資訊。一些搜尋引擎，比如Google，可能将description标簽中的内容作為頁面的概要資訊清單在使用者的搜尋結果中。但并不是所有搜尋引擎都這麼重視Meta标簽，以Baidu為例，它就不怎麼重視一個頁面的Meta資訊。
<meta name = “keywords” content = “關鍵字1,關鍵字2,關鍵字3,關鍵字的詞組,等等.”>
關鍵字之間用逗号隔開,個人建議使用英文格式下的逗号而非漢字下逗号,占的資料量小,且在頁面顯示時易于顯示和識别
<meta name = “description” content = “萬科房産 中國房産标志品牌 居易中國”>
Meta中Description主要用于描述一個頁面的主要内容,長度最好不要多于80字，而且盡量的簡潔和明确，以能說服使用者點選你頁面的詞句為佳。過長的字句是沒有用的，因為它們會被搜尋引擎截斷
Meta标簽已不在作為搜尋引擎衡量一個頁面權重的決定因素。就算一個頁面沒有Meta标簽，搜尋引擎同樣可以根據這個頁面的關鍵字密度（有搜尋者決定的關鍵字）和該頁的外部導傳入連結接權重決定。搜尋引擎會自動提取頁面中的前幾句作為頁面的描述資訊顯示在搜尋結果索引頁中.
Title标題就比較簡單 就不做介紹,示範一下動态設定:
Aspx頁面
<head runat="server" >
<title id="testtitle" runat="server">居易中國 品味生活從這裡開始</title>
</head>
修改:
// 對應元素:System.Web.UI.HtmlControls.HtmlTitle
this.testtitle.Text = "萬科房産 中國房産标志品牌";
//簡單設定 一下 标題就顯示也頁面頂部 效果附圖
簡單設定一下 在背景動态修改Title标簽中内容 看下效果:
Meta在頁面中:以中國房産資訊網的标頭: meta的關鍵字和描述說明
<head runat="server" >
<meta http-equiv="Content-Language" content="zh-cn">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<META name="keywords" content="房地産, 房地産開發，房地産投資，住房建設，房屋價格，統計資料，統計資訊，買房, 租房, 業主論壇, 業主俱樂部, 社群, 住宅, 新房, 樓盤, 房子, 網上房展, 二手房, 土地, 地産營銷, 地産金融, 企業管理, 房産評估, 寫字樓, 商鋪, 裝修, 家居, 建材, 家具, 房地産新聞, 業内精英, 房地産動态">
<META name="description" content="中房網，中國房地産專業網站，提供最全面最及時的房地産新聞資訊内容，是國内房地産媒體及業内外網友公認的最受歡迎的專業網站和房地産資訊庫">
<title>中國房地産資訊網</title>
同樣像類似于Title一樣 meta 修改成伺服器端runat="server" 背景調用動态修改;另外一種動态添加Meta:
//頁面标題
Title = "This is a title and meta test page.";
//Encode/Content type
HtmlMeta encode = new HtmlMeta();
encode.HttpEquiv = "Content-Type";
encode.Content = "text/html; charset=utf-8";
Page.Header.Controls.Add(encode);
//Language
HtmlMeta lang = new HtmlMeta();
lang.HttpEquiv = "Content-Language";
lang.Content = "zh-cn";
Page.Header.Controls.Add(lang);
//Description
HtmlMeta desc = new HtmlMeta();
desc.Name = "Description";
desc.Content = "Test the meta controls";
Page.Header.Controls.Add(desc);
//Keyword
HtmlMeta keywords = new HtmlMeta();
keywords.Name = "keywords";
keywords.Content = "title,meta,test,page";
Page.Header.Controls.Add(keywords);
//Link/CSS
HtmlLink cssLink = new HtmlLink();
cssLink.Href = "MasterPage.css";
cssLink.Attributes.Add("rel", "stylesheet");
cssLink.Attributes.Add("type", "text/css");
Page.Header.Controls.Add(cssLink);
以上操作以另外一種方式在背景進行添加設定，看看效果:
當然以上隻是一個操作小技巧，算不上什麼操作 隻是這塊很容易讓人忽略到這點.
本文轉自chenkaiunion 51CTO部落格，原文連結:http://blog.51cto.com/chenkai/765367
![2018年不想被web前端開發淘汰，你需要掌握哪些技術？[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)