HTML 元标记 - 为iPhone配置您的Web

Posted 2021-05-24

<!--Change the Appearance of the iPhone's Status Bar-->
<meta name="apple-mobile-web-app-status-bar-style" content="default" />
<!--The values that you can change for content are default (white), black and black-translucent.-->

<!--Prevent Users From Scaling (Pinching)-->
<meta name="viewport" content="user-scalable=no, width=device-width" />

<!--Icon for Bookmarked Website - 57 x 57 pixel .png file-->
<link rel="apple-touch-icon" href="bookmark-icon.png" />

<!--Create a Splash Screen for iPhone Website - 320x460 .png file-->
<link rel="apple-touch-startup-image" href="splash_screen.png" />

HTML 元标记是不是足够？

【中文标题】HTML 元标记是不是足够？

【英文标题】：Are HTML meta tags enough?HTML 元标记是否足够？

【发布时间】：2011-09-26 08:25:58

【问题描述】：

我有一个网页，它是免费应用程序的下载页面 (http://dragonfli.es)。由于极简设计，该页面几乎没有文字。我想知道 HTML 元标记是否可以对 SEO 有所帮助，还是我必须在其中添加一些文本？

【问题讨论】：

@Auxiliary 为什么没有文字？您不想向访问者介绍您的产品吗？

@Auxiliary 我推荐一个大的绿色“下载”按钮。那个箭头圈的东西没有剪掉它...:)

@Auxiliary - 搜索引擎往往不喜欢损坏的链接......所以也许修复你的博客链接！

@Auxiliary 那么，它是什么？它是 Windows 程序吗？支持哪些操作系统版本？安装文件有多大？程序最后一次更新是什么时候？它有什么特点？ ...

请通过 JavaScript（或 CSS）预加载您的三个图标；当您第一次将鼠标悬停在它们上方时，它们会暂时消失。

【参考方案1】：

元标签只会做这么多。谷歌实际上完全无视关键字元标记。你最好的选择是有一个好的 URL、好的页面标题、好的 h1 标签和一些相关的文本。尝试用图片替换你的标题而不是图片。

【参考方案2】：

您绝对必须输入文字。搜索引擎会读取元标签，但它们通常用于欺骗网站内容（想想内容镜像、虚假下载网站等）

搜索引擎优化考虑的真正价值是文本及其语义（如<h1>、链接等）。 URL 也很重要：尝试优化其可读性。

【参考方案3】：

在您的页面中，您有许多空元素：

<div class="window"> 
    <div class="image_reel"  style = "border: 1px #707070 solid; "> 
        <a href="#"><img src="reel_1.png"  /></a> 
        <a href="#"><img src="reel_2.png"  /></a> 
        <a href="#"><img src="reel_3.png"  /></a> 
        <a href="#"><img src="reel_4.png"  /></a> 
    </div> 
</div> 
<div class="paging"> 
    <a href="#" rel="1">1</a> 
    <a href="#" rel="2">2</a> 
    <a href="#" rel="3">3</a> 
    <a href="#" rel="4">4</a> 
</div>

比有一个像样的页面描述更重要的是在你的<a>标签中包含内容，并具有对图像进行合理描述的alt属性。

通常在这样的页面中，我有如下内容：

HTML：

<div id="frontImage">
    Here is some descriptive text which goes over
    the contents of this page, and which pertains
    to the image background I'll be using.
</div>

CSS：

#frontImage

    position: relative;
    display: block;
    width: 400px; /* the width of the bg image */
    height: 400px; /* the height of the bg image */
    background-image: url(/img/someImage.png);
    background-repeat: no-repeat;
    text-indent: -999em; /* move the descriptive text off the screen */

这将允许您在页面上添加文本并将该文本转换为大多数人都会看到的图像。只需确保您使用的文本确实适用于与之相关的内容。

【参考方案4】：

添加更具描述性的标题。想想可能对您的应用感兴趣的人会寻找什么，并尝试在您的标题中使用该查询字符串。它必须相当简短，但具有描述性。

不要使用图像徽标，而是将其设为文本徽标。 “最简单，最快的...... TODO 列表”作为图像毫无意义。它应该是一个文本元素。如果你真的想坚持使用图像，至少添加一个具有相同文本的 alt 属性。 请注册 Google 网站管理员工具。