使用 CSS，我可以通过允许用户单击整个列表项而不是其中的 anchor 来获得更好的外观、感觉和功能。悬停等看起来更好， anchor 标签对顶部和底部填充很挑剔。但是我不想牺牲谷歌搜索的抓取能力。刚刚加入 Angular 潮流，但从过去的经验中知道 anchor 标签是网站其余部分的关键。 Angulars 路由会处理这个问题吗？添加 rel="me" 会有帮助吗？

不管我的问题是 - 哪个更适合谷歌抓取:

 <li ng-repeat='item in mainNav' ng-click="{{item.url}}">{{item.nav}}</li>

或:

 <li ng-repeat='item in mainNav'><a href="{{item.url}}" title="">{{item.nav}}</a></li>

还是根本不重要？

其他代码:

function nav($scope) {
    $scope.templates =[
        { name: 'header.html', url: 'templates/header.html'},
        { name: 'footer.html', url: 'templates/footer.html'}
    ];
    $scope.header = $scope.templates[0];
    $scope.footer = $scope.templates[1];
    $scope.mainNav = mainNav;
    $scope.footNav = footNav;
    $scope.showMobileNav = function(){
        $('#mainNav').slideToggle('fast');
    }
    $scope.go = function ( path ) {
        $location.path( path );
    };
}

var app = angular.module("app", ["ngRoute"]);

app.config(function($routeProvider) {
    $routeProvider.when('/',
      {
        templateUrl: "templates/home.html",
        controller: "AppCtrl"
      }
    )
    $routeProvider.when('/web/',
      {
        templateUrl: "templates/web.html",
        controller: "AppCtrl"
      }
    )
})

最佳答案

毫无疑问，如果您正在寻找最好的 SEO 和可用性，您会希望使用链接(标签)。这意味着您可以使用键盘切换到元素，内置点击状态(:active、:focus)等，任何分析页面的前向链接的东西都应该能够找到这些。

关于您关于在应用于 LI 时能够更好地设计样式的评论，您可以通过定位 li > a 来获得相同的控制。在 HTML5 中，将 block 元素放在 A 标记中是合法的，如果这让您望而却步？如果您提供带有更完整示例的 jsfiddle，我们很乐意为您提供帮助。

关于javascript - Angularjs编码偏好查询: Is it bad to code ng-clicks on divs vs using anchors for google search seo?，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24565963/