• Flash的SEO 利用JS来做SEO [返回文章列表]     发表于: 2007-9-26  706人(次)浏览
  • 如何针对搜索引擎优化Flash
     
    抄自:http://hi.baidu.com/kule/blog/item/6b4e4f4acb22152109f7ef91.html
    　 Flash因为搜索引擎表现差饱受诟病，尽管我不这样认为。为什么搜索引擎优化业界关注
    Flash网站？如何优化Flash内容？Flash的主要缺陷是搜索引擎无法理解它，短期内可能还
    不行。Flash包括了逻辑技术并可以从访问者获得输入信息，但是搜索引擎却是为处理静态内
    容设计的。Flash实际上是一个运行中的程序，因此分析Flash要比分析纯html代码困难的多。
    主要的网页开发工具Adobe Dreamweaver将Flash用代码嵌入到网页中，但是却没有为不能处
    理Flash的访问者或搜索引擎蜘蛛程序提供访问入口。我建议不要使用默认模式，而是手工
    为主要内容是html内容的Flash页面编写代码，并使用能在插入Flash影片之前自动测试是否
    支持Flash的方法。 如果没有Flash影片，主要的html内容也可以针对搜索引擎进行优化，
    而Flash可以为那些有Flash播放器的访问者提供更佳的用户体验。

    2006年4月11日微软发布的IE浏览器提供了一个升级程序Enloas，该程序可以阻止基于
    Active-X的Flash控制器正常工作。当用户和Flash交互时，会出现一个工具帮助信息提示：“
    点击激活并使用这个控制器。”这个多余的点击非常烦人。幸亏本文中的编程技巧可以解决
    Enloas的问题。

    成功使用Flash的要求

    　　 Flash动画是一个非常好的展示复杂内容的方式，因为它可以允许设计师在有限的空间放置
    更多内容，而不损害页面设计。对技术站点来说，Flash为幻灯展示或复杂的产品说明影片
    提供了理想的解决方式。对艺术和娱乐等非常需要多媒体内容的站点，Flash是完美的解决方案。
    使用Flash时，应该实现下列目标：

    1. 设计干净
    2. 搜索引擎优化
    3. 兼容各种浏览器，包括读屏器（视障者使用的浏览器）和手机浏览器
    4. 编码验证使之符合标准
    5. 能在IE中正常运行

    Flash编程的搜索引擎优化

    　　 我推荐的Flash搜索引擎优化方法使用了一个带有搜索引擎可以抓取主要内容的DIV表格
    和一个叫做SWFObject()、能探测浏览器能否读取Flash的Javascript的功能。当探测
    到适宜的Flash播放器后，这个Javascript控制这个网页的文件目标模式（DOM）将主
    要文字内容替换为Flash影片。多数搜索引擎蜘蛛程序无法处理Flash，所以它们会读取
    主要内容，包括链接，标题，文字，图片等可以添加到普通html页面上的内容。有了经
    搜索引擎优化技巧编辑和编码的主要内容, Flash就无关紧要了。

    　　Flash可用性编程不是作弊方法，只要主要内容和可见的影片是相同的。W3C和WAI都
    明确表示多媒体内容应该有其他的展示版本。可用性编程既提供了影像信息又保留了访
    问者和依赖文字内容的搜索引擎。

    SWFObject and UFO

    　 　请访问Geoff Sterns的博客deconcept获取SWFObject()详细的解释并下载本解决方案所
    需的SWFObject.js文件。另一个开源的解决方案，UFO (Unobtrusive Flash Objects)可以
    从Bobby van der Sluis网站获得。它们是相似的。

    举例：制作Flash首页和可以被搜索引擎抓取的Flash菜单

    　　 下面的举例代码显示了Marc Abrahms Photography网站的部分Flash标题和菜单代码。
    这个网站的内页已经被搜索引擎收录，因为搜索引擎可以找到主要内容中的链接了。

    <head>
    <!--snip-->
    <script type="text/javascript" src="/jscript/SWFObject.js"></script>
    </head>
    <body>
    <!--snip-->
    <!--primary content, for non-Flash visitors-->
    <div id="flash" align="center">
    <p><a href="/gallery/index.php?category=gallery/1_Prints">prints</a> |
    <a href="/gallery/index.php?category=gallery/2_Posters">posters</a> |
    <a href="/gallery/index.php?category=gallery/3_Books">books</a> |
    <a href="/gallery/index.php?pageId=115&amp;start=0">my account</a>
    <!--snip, for brevity-->
    </p>
    </div>
    <!-- Flash player detection and Flash insertion -->
    <script type="text/javascript">
    var fo = new SWFObject("homepage_v1.swf","flash", "680", "390", "5", "#3a403c");
    fo.write("flash");
    </script>

    　 　

    　 　Flash可用性编程不会奇迹般的让一个网站的排名大幅上升，但是这个Flash优化方法可以消除
    由于Flash导致的排名不利因素。

    举例：制作搜索引擎可以读取的Flash幻灯片

    第二个例子网站是Virtutech。下面的代码显示了如何在
    固定的空间插入相当长的内容。我们使用一个DIV表格，
    并设定它的CSS属性为"overflow:auto"来生成一个可下
    拉的文本区。这样可以避免当替代内容出现时页面版面乱
    七八糟。要看替代内容，请在关闭了Javascript的浏览
    器中打开Virtutech网站的首页。

    <div id="movieAlt"><div id="movieAltInner">
    <h2><a href="/products/index.html">Simics</a> is
    used to develop the embedded
    software that runs electronic devices such as:</h2>
    <li>Aerospace hardware</li>
    <li>Automobile control systems</li>
    <li>Telecommunications infrastructure</li>
    <li> High-end servers</li>
    </ul>
    <p><em>Hardware:</em> <strong>Satellite Control
    System</strong></p>
    <p><em>Challenge:</em> Unable to test software with satellites
    on orbit.&nbsp; How
    to verify new software?</p>
    <p><em>Resolution:</em> Using Simics, the developers
    can run software
    quality tests on the ground, to ensure that the software works correctly
    before it's installed.</p>
    <h2>Industry: Automotive</h2>
    <p><em>Hardware:</em> <strong>Electronic Control
    Unit</strong></p>
    <p><em>Challenge:</em> Need to develop software now, but
    the ECU won't
    be available for months</p>
    <p><em>Resolution:</em> Simics enables programmers to
    develop and test
    the software before the hardware is available, reducing time to market.</p>
    <h2><em>Industry:</em> Telecommunications</h2>
    <p><em>Hardware:</em><strong> Wireless Network Equipment</strong></p>
    <p><em>Challenge: </em> You have twenty programmers. Each
    needs a complete
    system for testing. They cost MILLIONS.</p>
    <p><em>Resolution:</em> Using Simics to create a model
    of the target hardware,
    each programmer can have his or her own virtual device for software testing
    and debugging, without breaking your budget.</p>
    <h2>Industry: Internet</h2>
    <p><em>Hardware:</em> <strong>Network servers</strong></p>
    <p><em>Challenge:</em> Software bugs keep popping up.
    Some take weeks to
    reproduce and fix. You are running out of time.</p>
    <p><em>Resolution:</em> With Simics, programmers can
    run the program forwards
    and backwards to quickly identify, recreate and repair bugs.</p>
    </div></div>
    <script type="text/javascript">
    var fo = new
    SWFObject("flash/virtutech_intro.swf", "mymovie", "497", "287", "7", "#ffffff");
    fo.write("movieAlt");
    </script>
    CSS代码
    #movieAlt{
    height: 287px;
    width: 497px;
    overflow: auto; /*Scroll bar on HTML content div*/
    #movieAltInner {/*Avoids IE6 faulty box model*/
    padding: 10px 20px;
    　 　除了上面这些网站，我们还使用这个Flash优化方法在其他流量很大的网站上。这个
    代码已经究竟考验，还没有不满意的报告。使用这个Flash优化方法的网站都已经在查询
    仅在Flash内容中出现的关键词时获得了很高的排名。

    纯Flash网站

    　　 纯Flash网站有很多劣势因为它缺少组织内容，内部链接和独特页面标题的页面结构。补救
    的办法是为每个Flash页面创建一个不同的html页面，并将Flash电影插入到每个页面上。当访
    问者访问页面时，如果他们的浏览器支持他们就可以看到Flash。但是一个无法看到Flash的访
    问者，例如搜索引擎，也可以读取这个网站。如果一个用户从搜索结果访问该网站的内部页面，
    他们也可以得到相同的Flash体验因为影片在每个页面上都有。另一个方法是将Flash影片裁成
    数段分别放到每个页面上。

    剪裁Flash影片会导致产生不连续的页面过渡。使用FlashVars给Flash影片传递一个参数
    可以解决这个问题。同一个影片可以出现在相同的html页面上，但是鉴于该参数的值，影片可
    以在适当的时候显示和该页面对应的Flash内容。要删除多余的页面但仍然可以浏览影片的不
    同部分，在每个url后面添加一个#和一个tag标签，然后将这个标签传递给Flash。这个方法能
    使前进和后退按钮正常工作，并允许人们将Flash网站的特定部分添加到收藏夹。

    也可以用PHP脚本从MySQL中调用主要html内容和Flash内容。通过仅储存一次内容的排布方式，这个方法能很大地简化一个Flash网站的维护

Flash的SEO 利用JS来做SEO [返回文章列表]