当前位置: 首页 > 图文教程 > 网络编程 > ASP.NET > ASP.NET教程:友好的Html和JS适合SEO

ASP.NET
使用函数传递参数来执行相应的数据库操作
如何实现在窗体和窗体之间进行传递数据
ASP.NET中文显示之两种解决方法
ASP.NET、JSP及PHP之间的抉择
ASP.NET 2.0发送电子邮件中存在的问题
谈谈HtmlControl与WebControl的区别与用途
从ASP.NET 1.1升级到ASP.NET 2.0要考虑的Cookie问题
通过系统配置来提高ASP.NET应用程序的稳定性
妙用ASP2.0中的URL映射改变网址
AJAX实现web页面中级联菜单的设计
ASP.NET跨页面传值技巧总结
再议ASP.NET DataGrid控件中的“添加新行”功能
Geometry 对象浅析
重构CollapsibleSplitter
如何利用.NET Framework使用RSS feed
ASP.NET获取IP与MAC地址的方法
在ASP.NET 2.0中使用样式、主题和皮肤
ASP.NET中为GridView添加删除提示框
ASP.NET 2.0，无刷新页面新境界
看看一个.net版对话框控件

No. « 3 4 5 6 »

技术文章搜索

关键字

ASP.NET教程:友好的Html和JS适合SEO

出处:互联网   整理: 软晨网（RuanChen.com）   发布: 2010-03-17   浏览: 131 ::
收藏到网摘: n/a

假设你需要从一个页面转向其他页面，下面有很多种方式，你是如何选择的呢？你能清晰的说明理由么？

        <%--链接的表现形式--%>
        <asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl="~/Default2.aspx">HyperLink</asp:HyperLink>
        <asp:LinkButton ID="LinkButton1" runat="server" PostBackUrl="~/Default2.aspx">LinkButton</asp:LinkButton>
        
        <%--出于美观的考虑，很多网站都会用button来替换掉link--%>
        <asp:Button ID="Button1" runat="server" Text="Button" PostBackUrl="~/Default2.aspx" />
        
        <%--用图片做链接，也有两种选择方式--%>
        <asp:ImageButton ID="ImageButton1" runat="server" PostBackUrl="~/Default2.aspx" ImageUrl="~/upup.gif" />
        <asp:HyperLink ID="HyperLink2" runat="server" NavigateUrl="~/Default2.aspx" ImageUrl="~/upup.gif"></asp:HyperLink>      

如果你还有些迷茫，我建议你查看他们生成html之后的源代码。

        <a id="HyperLink1" href="Default2.aspx">HyperLink</a>       
        <%--HyperLink解析成Html之后对应的就是一个单纯的超链接，href指向了要跳转的页面 --%>
        
        <a id="LinkButton1" href="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;LinkButton1&quot;, &quot;&quot;, false, &quot;&quot;, &quot;Default2.aspx&quot;, false, true))">LinkButton</a>
        <%--LinkButton1虽然也是一个锚标记，但实际上是利用的JavaScript进行的跳转--%>
        
        <input type="submit" name="Button1" value="Button" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;Button1&quot;, &quot;&quot;, false, &quot;&quot;, &quot;Default2.aspx&quot;, false, false))" id="Button1" />
        <%--button被解析成type="submit"的input元素，同样通过JavaScript进行页面的跳转--%>
        
        <input type="image" name="ImageButton1" id="ImageButton1" src="upup.gif" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;ImageButton1&quot;, &quot;&quot;, false, &quot;&quot;, &quot;Default2.aspx&quot;, false, false))" style="border-width:0px;" />
        <%--ImageButton被解析成type="image"的input元素，同样通过JavaScript进行页面的跳转--%>
        
        <a id="HyperLink2" href="Default2.aspx"><img src="upup.gif" style="border-width:0px;" /></a>
        <%--给HyperLink的ImageUrl属性赋值后，解析成Html之后对应的就是一个超链接中“夹”了一个img，但href仍然指向的要跳转的页面 --%>

知道了这些又有什么用呢？

用处很多，但我们今天只谈论SEO。

就目前的搜索引擎技术手段，JavaScript（当然也就包括了AJAX）、表单元素（如input）、Flash和Image都无法（或者很难）被读取。“蜘蛛”倾向于读取简单的html格式的文本。所以，从SEO的角度出发：

1. 不要使用JavaScript或表单进行页面跳转链接，如果一个普通的<a></a>也能完成同样的功能。一般来说，任何不能通过标准锚标识符<a></a>进入的导航，都不会被蜘蛛检索到。如果本来就使用的客户端元素，我们应该比较容易注意到这一点；但当使用经过封装处理过后的服务器端控件时，我们就可能会大意了。

2. 注意UpdatePanel里没有文本内容的情况。我们可以做一个简单的测试：

        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <asp:Label runat="server" ID="lbl" ></asp:Label>
                <asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
            </ContentTemplate>
        </asp:UpdatePanel>

    protected void Button1_Click(object sender, EventArgs e)
    {
            this.lbl.Text = "我是UpdatePanel生成的，所以你看不见我！";
    }

解析成Html后的源代码部分：

        <div id="UpdatePanel1">
            <span id="lbl"></span>
            <input type="submit" name="Button1" value="Button" id="Submit1" />
        </div>

这是很好理解的，因为UpdatePanel一样是通过页面的JavaScript函数来生成页面内容的。查看源代码，我们能看到相关的JavaScript函数，但不能看到函数生成的内容。而搜索引擎的蜘蛛，它也是只看源代码的。

3. 当我们需要使用弹出页面时，通常的做法是：

<a href="#" onclick="window.open('popup.html','common','height=600,weight=800');">common popup</a>

根据我们上面的交代，这样的写法，对SEO而言，无疑也是不利的。所以我们应该使用下面的代码，即保证了弹出窗口的效果，也是SEO友好的。而且即使客户的浏览器不支持或者禁用掉JavaScript，页面一样能够顺利的跳转。

<a href="popup.html" onclick="window.open(this.href,'seo','height=600,weight=800');return false;" target="_blank">seo popup</a>
<%--注意：这里的return false语句不能省略。--%>

4. 当我们希望使用一种特殊的字体（常常是栏目标题之类）的时候，我们经常使用一张汉字图片来代替。这也是一个比较麻烦的事情，因为作为标题，其内容常常是相当重要的关键字，如果使用图片，蜘蛛是也无法读取的。一种可能的解决方案是sIFR，但这方面我并不是很熟；网上搜了一下，似乎还不能应用于汉字。

对于图片，我们常用的SEO方法是注明title和alt，如

<img alt="ASP.NET搜索引擎优化" title="使用ASP.NET技术开发网站时应注意到的一些SEO技术" src="seo.gif" />

不过这也属于“不可见的页面元素”，具体效果如何也很难精确衡量。但有总比没有强！

5. 其他一些注意事项：

5.1 将html标签的语义和css结合起来，和《span》和《div》不同，《h1》意味着标题、《b》意味着强调、《ul》《li》意味着列表……，这些语义标签能给搜索引擎更清晰的指示；

5.3 重要的内容放在html页面（指源代码，而不是浏览器显示结果）的顶端

5.5 将大段的JavaScript放在页面底部或者单独的js文件中；

5.2 最好不要使用框架（frame）布局；

5.3 大量的VIEWSTATE可能会对“蜘蛛”造成干扰；

5.5 牢记：就目前的搜索引擎技术手段，JavaScript（当然也就包括了AJAX）、表单元素（如input）、Flash和Image都无法（或者很难）被读取。

作者：自由飞 http://www.cnblogs.com/freeflying/archive/2010/02/19/1669469.html