Главная > ASP.NET > Title, Meta и другие теги из HEADER в ASP.NET.

Title, Meta и другие теги из HEADER в ASP.NET.

Казалось бы, что нового можно здесь написать? Ну почти ничего, в статье будет так скажем "подведение итогов", однако, хочу обратить ваше внимание на слово "почти". В статье затрагивается один, очень важный со стороны SEO, момент, который в рунете (да и в глобальной сети) практически не освещен, но имеет важное значение.

Часть первая. Сказ о метатегах.
Что такое мета-теги, вебмастеру объяснять обычно не приходиться, каждый seo-оптимизатор знает о важности этих тегов, любой поисковый робот работает с содержимым этих объектов. Мета-теги представляют собой атрибуты, которые размещаются в так называемом "хедере" страницы, другими словами между тегами <head></head>, обычно содержат в себе описание страницы, ее ключевые слова и прочую информация, которая представляет ценность для SEO и посковых роботов. Я не буду говорить про каждый из них, об этом вам лучше узнать на специализированных форумах, здесь будет руководство по их динамическому генерированию. Расскажу про два способа, которыми пользуюсь сам.

Способ №1 (using System.Web.UI.HtmlControls;).
Будем использовать классы из пространства имен System.Web.UI.HtmlControls. На деле все делается очень просто:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        // В коде страницы получим: <meta name="keywords" content="Программироание, сео, советы, уроки..." />
        HtmlMeta meta = new HtmlMeta();
        meta.Name = "keywords";
        meta.Content = "Программироание, сео, советы, уроки...";
        this.Header.Controls.Add(meta);

        // В коде страницы получим: <meta name="description" content="Блог участников проекта WEBFeria..." />
        meta = new HtmlMeta();
        meta.Name = "description";
        meta.Content = "Блог участников проекта WEBFeria...";
        this.Header.Controls.Add(meta);
    }
}

Вы можете добавлять какие нужно мета-теги аналогичным способом. meta.Content может определяться результатом выборки из БД, чтением из файла или любым другим способом. Задавая значение динамически, у вас появляется возможность установки мета-тегов для каждой страницы отдельно. При таком генерировании не нужно лазить в HTML-код страницы, все делается программно.

Способ №2 (DataBind();).
Устанавливаем мета-теги через механизм привязки данных. Нам понадобится сделать заготовки в HTML-коде страницы, к которым будут привязываться сгенерируемые данные. Ничего сложного:

<meta name="description" content="<%# description %>" />
<meta name="keywords" content="<%# keywords %>" />

В разделенном коде страницы:

public partial class _Default : System.Web.UI.Page
{
    protected string description;
    protected string keywords;

    protected void Page_Load(object sender, EventArgs e)
    {
        description = "Какой-то текст";
        keywords = "Какой-то другой текст";
        DataBind();
    }
}

На мой взгляд, так выглядит удобнее: у нас есть упонимание о мета-тегах в HTML-коде страницы.

Часть вторая. Песнь о CSS и скриптах.
Аналогичными действиями мы можем динамически подключать таблицы стилей и какие-либо java-скрипты на каждую страницу в отдельности:

HtmlLink css = new HtmlLink();
css.Href = ResolveUrl("~/lightbox2.04/css/lightbox.css");
css.Attributes["rel"] = "stylesheet";
css.Attributes["type"] = "text/css";
css.Attributes["media"] = "screen";
Page.Header.Controls.Add(css);

HtmlGenericControl js1 = new HtmlGenericControl("script");
js1.Attributes["type"] = "text/javascript";
js1.Attributes["src"] = "lightbox2.04/js/prototype.js";
Page.Header.Controls.Add(js1);

При подключении CSS или скриптов я не рекомендую использовать DataBind() (привязку данных), поскольку в данном случае строки получаются довольно длинными и содержат в себе всякие служебные символы — «; . / \» и другие.

Часть третья. Пути Microsoft неисповедимы.
Собственно, подошли к тому, ради чего была задумана эта статья, здесь я расскажу про то самое «почти», которое озвучил в анонсе.

ASP.NET предоставляет разработчику огромные возможности, однако, при всем удобстве технологии, некоторые вещи, мягко говоря, удивляют. Я рассказал вам про МЕТА, про CSS и скрипты, но не затронул самый важный тег из хедера — это тег «title». Title — это заголовок вашей страницы, это первая строчка, которую вы видите у сайта в выдачи поисковика, она крайне важна. ASP.NET предоставляет те же возможности по генерации Title — это DataBind(); или установка значения из разделенного кода. Казалось, что тут интересного, а интересно то, как выглядит результат в сгенерируемом коде страницы. Установим значение программно:

protected void Page_Load(object sender, EventArgs e)
{
   Title = "Название страницы";
}

Посмотрим HTML-код:

<title>
	Название страницы
</title>

В самом браузере заголовок отображается нормально. Теперь обратите внимание на то, что заголовок страницы написан с новой строки, да еще и с символом табуляции!!! Я раньше не обращал на это внимание, поскольку, как уже сказал, в браузере название страницы выставляется хорошо. Однажды, решив проверить сайт сервисом, определяющим SEO-параметры сайта, я был крайне неприятно удивлен — этот сервис не видел заголовок страницы, другой сервис учитывал символы перевода строки и табуляции в заголовке, другие подобные сервисы выдавали одинаковый результат. Дело в том, что поисковый робот может точно, так же работать с заголовком и, например, не видеть его. Самое интересное, что просматривая сайты на ASP.NET, стало ясно, что у многих наблюдается такой же глюк, даже у знаменитой CMS DotNetNuke. Напрашивались два вопроса: «Зачем так?» и «Что делать?». На первый я так ответа и не нашел, со вторым пришлось работать. На русскоязычных форумах этот вопрос не задавался, а вот на англоязычных интересовал очень даже многих. Для тех кто не понял, заголовок страницы в HTML-коде должен выглядеть так:

<title>Название страницы</title>

в ASP.NET выглядит так:

<title>
	Название страницы
</title>

Для SEO такой вывод заголовка недопустим. Единственным действующим решением стало следующее:
в HTML-коде страницы, в хедере (между

) заменяем

<title><title>

на

<title visible="false"></title>
<asp:ContentPlaceHolder id="seo" runat="server" EnableViewState="false" />

В ContentPlaceHolder`е добавляем код для привязки данных:

<title><%# title %></title>

в разделенном коде при помощи привязки данных генерим Title:

public partial class _Default : System.Web.UI.Page
{
    protected string title;

    protected void Page_Load(object sender, EventArgs e)
    {
        title = "Заголовок страницы";
        DataBind();
    }
}

Я в подобном ContentPlaceHolder`е при использование MasterPages добавляю всю необходимую мне SEO-информацию (мета, таблицы стилей, скрипты), в том числе и Title, вы можете делать без ContentPlaceHolder, а прямо в код страницы. Никакими другими словами, кроме как «Извращенство» это не назовешь. При таких манипуляциях мы получаем хороший заголовок, который читается всеми, будь то пользователь или поисковый робот.

Вообщем все, надеюсь кому-нибудь пригодится.

Categories: ASP.NET Tags: , ,
  1. gofor
    11 ноября 2012 в 02:35 | #1

    Спасибо, информация полезную статью)

  1. Пока что нет уведомлений.