XHTML和搜索引擎优化



我是编码和XHTML世界的新手。我正在将示例页面放在一起,但是在阅读了许多相互矛盾的文章后,有人建议导航div 块出现在内容div 块上方,反之亦然,或者这根本不重要?下面是我的基本代码作为示例。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta http-equiv="Content-Language" content="en-us" />
    <meta http-equiv="imagetoolbar" content="no" />
    <meta name="MSSmartTagsPreventParsing" content="true" />
    <meta name="keywords" content="" />
    <meta name="description" content="" />
    <meta name="author" content="" />
    <title>Sample page</title>
    <link rel="stylsheet" type="text/css" href="web.css" media="all" />
    <style type="text/css" media="all">
    body {
        margin: 0;
        padding: 0;
        font-family: arial, verdana, sans-serif;
        font-size: medium;
        font-weight: normal;
        font-style: none;
        text-decoration: none;
    }
    #wrapper {
        border: 1px solid #eeeeee;
        width: 960px;
        margin: 0px auto;
    }
    #header {
        background-color: orange;
    }
    #leftnav {
        background-color: yellow;
        float: left;
    }
    #rightnav {
        background-color: blue;
        float: right;
    }

    #content {
        background-color: gray;
    }

    #footer {
        clear: both;
        background-color: green;
    }
    </style>
</head>
<body>
    <div id="wrapper">
        <div id="header">
            header
        </div>
        <div id="leftnav">
            leftnav
        </div>
        <div id="rightnav">
            rightnav
        </div>
        <div id="content">
            content
        </div>
        <div id="footer">
            footer
        </div>
    </div>
</body>
</html>

我认为你需要详细说明你的问题。我无法弄清楚您是否关心SEO或HTML代码。在任何地方声明潜水都不是SEO问题。但是为了更好的可读性,最好使您的网页井井有条。

比如顶部的标题。内容位于中心,页脚位于底部。可以在内容之前或之后提及左或右导航菜单,但我建议首先您应该先进行左导航,然后是内容,然后是右导航。

理想情况下,从SEO的角度来看,您希望最重要的代码在HTML源代码中排名最高。这是可能导致页面中某些内容对搜索引擎的重要性的众多因素之一。

如果是我,我会对提供的基本模板进行以下调整

  • 将内容div 移动到源代码中的导航元素上方。
  • 将内联 CSS 代码移动到外部 CSS 文件,以帮助减少页面加载时间,并允许最重要的内容在源代码中移动到更高的位置。

将导航块放在内容块之前的建议与SEO无关,但与可用性有关,特别是对于那些使用屏幕阅读器的人。

这个想法是将第一个(对图形浏览器不可见)链接到页面内容,以便可以绕过导航。

你的代码是错误的,但你可以通过以下方式修复它:您正在使用 XHTML,因此必须包含 XML 语言信息,也应该在 HTML 声明中包含常规语言信息,如下所示:

Microsft的Bing会将其标记为错误,并通知您对其进行适当的更改。

不要使用边距或浮动!这就像在说,好吧,请把这个元素向左移动一点,然后向右移动一点。没道理!使用绝对位置和百分比在网页 CSS 中放置元素。今天有太多不同尺寸的屏幕和太多的分辨率。浮点数和保证金是 1995 年,我不知道为什么人们仍在使用这些方法。我们还有一个现在由移动驱动的社会。请注意,设备上的一个像素将大于或小于另一台设备上的一个像素。您可以拥有 5 台笔记本电脑,它们都是 17 英寸,并且都具有完全不同的分辨率!可以为图像和元素指定固定的像素宽度和高度,但在放置这些元素时必须使用百分比,否则它们将不会显示在备用设备和 LCD 屏幕上的正确位置。

如果使用带有百分比值的绝对定位来定位元素,例如:

"立场:绝对;左: 30%;top: 5%;",那么该特定元素将显示在屏幕上,从左侧开始 30%,从屏幕顶部显示 5%,无论渲染它的设备如何!但是,如果您定位具有固定像素值的元素,请说:

"立场:绝对;左:160px;顶部:45px;" 这不会在您正在查看它的屏幕以外的任何屏幕上正确呈现。别这样!想想吧?您有 2 种单独的分辨率,一种是 1024x768,另一种是 1366x768,显然使用固定值会导致严重问题。百分比是屏幕或浏览器分辨率的百分比,而像素值是几乎不变化的固定值。

至于您的问题,您可以按照任何方式包含您的导航或任何其他内容,只需确保使用映射回它们的 CSS ID 和相应的 DIV 标签即可。在CSS中指定它们的地点或时间根本不重要。这完全取决于你。只要远离所有"填充"和"边距"的东西,它毫无意义。使用绝对定位,您不必浮动任何东西,因为所有内容都从屏幕的左上角或右下角精确地移动到您想要的位置。

相关内容

  • 没有找到相关文章

最新更新