hyperlink - 语义 UI - 使用响应类避免重复链接(SEO 麻烦)

Question

我正在开发一个网站，我正在使用 SemanticUI . 我准备了这个例子来解释这个问题:

<header>
    <div class="ui vertical large menu red item page fluid grid">
        <div class="mobile only row">
            <div class="ui icon dropdown fluid center align massive button">
                <i class="content icon"></i>
                Menú
                <div class="ui vertical menu">
                    <a class="item" href="#"> Home </a> <!-- ¡¡Repeted link!! -->
                </div>
            </div>
        </div>
    </div>
    <div class="ui six menu red item fluid grid">
        <div class="tablet only row">
            <img src="http://goo.gl/ToQcwM" width="20px"/>
            <a class="item" href="#"> Home </a> <!-- ¡¡Repeted link!! -->
        </div>

        <div class="computer only row">
            <img src="http://goo.gl/ljDWQ7" width="20px"/>
            <a class="item" href="#"> Home </a> <!-- ¡¡Repeted link!! -->
        </div>
    </div>
</header>

麻烦(SEO问题)是我必须复制上面的三个链接，当然，我不想这样做。实际上，该网站是用 PHP 构建的，我并没有真正加倍代码(它包含在 PHP 中)。

我还准备了一个fiddle .要对其进行测试，您必须重新调整窗口尺寸以查看效果。

当然，这不是真实情况。你可以看到 real web如果你愿意的话。

那么，有人有解决方案吗？关于此的最佳实践？

PD:对不起我的英语! :)

Answer 1

最后，我只维护一个 div，所有链接都没有重复，然后用 CSS 样式为手机菜单。