导航栏是否应该始终以列表的形式实现?

2024-04-22

首先,非常抱歉,如果这不是一个“真正的”stackoverflow 问题。但这是我一直想知道的事情...

当您为网站(html)编写导航栏时,我读到这是非常好的实践,即使不是使用列表标签实现它的唯一实践。例如

<ul>
    <li> Home </li>
    <li>About Us</li>
    <li>Blog</li>
    <li>Contact Us</li>
</ul>

然后应用水平显示列表所需的样式等等。

但是这个标准是一成不变的还是只有在最好的选择时才这样做...因为目前我有一个导航栏可以这样做,这不是您的“标准”nv 栏,可以这么说,它是把它作为一个列表来实现是有一点点使命的。放置在某些 div 中的一些链接标签会很好地工作。但当然我不想这样做,如果它会让人们指指点点并嘲笑我......

提前致谢!


为什么使用列表进行站点导航?

使用网络标准设计网站的一部分涉及使用语义正确的代码。去引用 ”头脑风暴和狂欢 http://brainstormsandraves.com/articles/semantics/structure/":

良好的 HTML 结构基于逻辑、顺序并使用语义上正确的标记。如果您有标题,请使用标题元素,从 H1 元素开始。如果有段落,请使用段落元素。如果您有列表,请使用列表项元素。

在结构层面上,站点导航只是指向站点其他区域的链接列表。因此,标记站点导航的最佳方法(可以说)是使用列表元素。

如果您使用良好的 HTML 结构,那么基于文本的浏览器、屏幕阅读器、不支持 CSS 的浏览器、关闭 CSS 的浏览器以及搜索机器人将能够更轻松地访问您的内容。

关于此的一篇不错的文章是here http://dustinbrewer.com/the-importance-of-using-lists-for-navigation/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

导航栏是否应该始终以列表的形式实现? 的相关文章

  • jQuery 或 Javascript - 如何禁用窗口滚动而不溢出:隐藏;

    您好 是否可以在不使用的情况下禁用窗口滚动overflow hidden 当我悬停一个元素时 我试过 chat content on mouseenter function document scroll function e if e h
  • JavaScript 中带前导零的数字发生变化

    我使用 print 语句从 php 调用 javascript 函数来打印 html 代码 并且传入一个整数 但是 在 php 中传递的值与 javascript 函数接收到的数字不匹配 我不知道为什么 这是调用 javascript 函数
  • 使用绝对定位时文本被破坏

    我有一个小挑战 我在 Stack Overflow 上没有找到任何解决方案 这就是我得到的 这就是我想要的 为了产生这个标题效果 我使用绝对位置 我什至不知道我的标题的宽度和高度 因此 使用此解决方案时 大文本会中断 My HTML div
  • 滚动时将菜单栏固定在顶部[关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 我见过一些网站 当用户向下滚动页面时 会在右侧或左侧弹出一个框 另外 注意到这个模板 http www mvpthemes com m
  • 通过 jQuery 选择动态 HTML 元素

    我正在构建一个 ASP NET MVC 应用程序 并且正在使用jQuery Blueimp https github com blueimp jQuery File Upload动态添加到页面的 PartialView 上的插件 根据插件的
  • HTML:如何强制链接在新选项卡而不是新窗口中打开[重复]

    这个问题在这里已经有答案了 I use target blank 在新选项卡中打开链接 但在 IE 中它会打开一个新窗口 这是完全合乎逻辑的 因为这就是 blank应该做的 我不知道如何target blank 在其他浏览器中的行为 有什么
  • 使用 jQuery 更改父元素样式

    我有下一个 html 设置 div class one div class two a href class three Click a div div 我想更改具有类的元素的背景颜色 one当我点击元素时 three使用 jQuery 这
  • 为什么我的反应路由器链接将我带到页面中间?

    我的网站上有很多链接 但只有一个可以执行此操作 它没有将我带到导航栏的顶部 而是转到内容的中间 知道为什么会这样吗 这是一个页面 其中有一个 map经历一些JSON 这是渲染div页面下方的文本元素 如果重要的话 这是一些可能相关的代码 路
  • 如何处理 Django 中的错误

    我想让我的 django 应用程序尽可能对用户友好 并且我想处理适当的错误并让它推出类似于 javascript 中的警报的错误消息 我想在没有上传文件时执行此操作 因此 当按下上传按钮并且尚未上传任何内容时 将会发出一条警报消息 我的看法
  • CSS 无法从带有 php“includes”的相对路径工作

    文件夹结构 index php includes header html css style css 我的主项目文件夹中有 2 个子文件夹 一个是名为 includes 的文件夹 另一个名为 css 我有我的 index php主文件夹中的
  • MonoState、Singleton 或派生形式:CRUD 应用程序的最佳方法?

    我有一个相当大的 CRUD WinForm 应用程序 其中有许多对象 人员 注册 计划 案例注释等 该应用程序由 30 多种表单组成 UI 逻辑上被分解 会员 注册 计划 案例说明等 我正在尝试弄清楚如何创建我的人物对象搜索后搜索表格并将对
  • 我怎样才能让这个脚本在 WordPress 上运行?

    我有这个脚本 document ready function text1 click function this hide 代码html div class div1 p class text1 text to appear when th
  • 为什么此 TTF 字体在我的浏览器中无法使用?

    我下载了一种名为 Clunk 的 TTF 字体 并尝试将其应用于某些文本 这是我正在使用的代码 h1 Test h1 这似乎不起作用 Chrome 给了我两个错误 Failed to decode downloaded font path
  • UML类图:抽象方法和属性是这样写的吗?

    当我第一次为一个小型 C 项目创建 uml 类图时 我在属性方面遇到了一些麻烦 最后我只是将属性添加为变量 lt
  • 如何使整个跨度落入新行?

    这个片段显示了我想要的 http jsfiddle net 945Df 3 http jsfiddle net 945Df 3 div class sup strong a href Rosario Santa Fe Argentina a
  • 适用于移动设备的响应式订单确认电子邮件?

    我从未见过令人惊叹的订单确认 发票电子邮件 即使是最好的 html5 网站也会发送糟糕的订单确认电子邮件 有时是纯文本 我相信这是因为发票通常需要使用表格来显示购买的物品 这在移动设备上实现起来非常困难 我发现了一些让手机上的表格更易于管理
  • 将特定字形与网络字体一起使用

    使用网络字体 我想使用字体功能设置 CSS 中的选项以及跨度类HTML 中 以便使用字体集中的特定替代字形 我需要以正确的语法使用哪些值 GID Unicode 才能定位特定的目标glyph内glyph备择方案 这些功能使用 OpenTyp
  • 我可以使用 ASP.NET WebForms 母版页在每个内容页中包含不同的 javascript/css 文件吗?

    我有几个使用相同母版页的内容页 它们并不都需要包含在相同的 javascript 和 css 文件中 tag 是否可以更改内容来自内容页面的标签 确实如此 但我建议采取一些不同的做法 我在关闭正文标签的正上方放置了一个内容占位符 然后我填充
  • 如何垂直对齐div内的图像

    如何在包含的内容中对齐图像div Example 在我的示例中 我需要将 img in the div with class frame div class frame style height 25px img src http jsfi
  • 如何在数据列表 HTML PHP 中设置选择

    您好我想知道是否有一种方法可以在数据列表中设置选定的值 我想要这样的东西

随机推荐

  • 仅使用本机库的 C# 简单游戏

    我可以找到一组java 2D 游戏教程 http zetcode com tutorials javagamestutorial and 安卓游戏教程 http obviam net index php table of contents
  • 计算数组中向量之间的最大距离

    假设我们有一个包含 n 个向量的数组 我们想要计算这些向量之间的最大欧氏距离 最简单 天真的 的方法是迭代数组 并为每个向量计算其与所有后续向量的距离 然后找到最大值 然而 这个算法会增长 n 1 相对于数组的大小 对于这个问题还有其他更有
  • 继续阅读 JavaScript 中的链接

    我有一个像传记这样的字段 其中包含文本 我需要在第一页上显示该字段的一半 部分 文本 然后出现继续阅读链接 单击该链接后 剩余文本将显示在同一页面上 我需要在 HTML 中实现这一点 谁能帮我 请注意 这是快速原型设计 如果你使用jquer
  • 可以在 iOS 6 中显示“App Store 模式”吗?

    是否可以在 iOS 6 中显示一个模式视图控制器来在 App Store 中展示我的应用程序 是的你可以 iOS6 看一眼SKStoreProductViewController https developer apple com libr
  • 如何在 Laravel 7.x 中从控制器返回视图时传递 cookie?

    在 laravel 7 x 中 有什么方法可以在返回视图时将 cookie 传递给客户端吗 类似于 return view welcome gt cookie name value min 嗯 我做了一些研究 发现有一些方法 我熟悉的两个是
  • 当给定闪光角度和速度时,计算物体的轨迹

    我正在尝试从大炮中发射炮弹并使其遵循现实的路径 射击角度根据大炮的方向而变化 自动定向到鼠标指针 所以我想弄清楚的是 当给定角度和设定速度时 如何沿着抛物线路径移动炮弹 我读到 这可以在没有复杂的三角学的情况下完成 在高中时从未听过 并且可
  • Rails 3 ActiveRecord API:.build 方法

    我对 Ruby RoR 相当陌生 一年多了 我注意到 RoR 或 Ruby 内部有几种不同的方法基本上做同样的事情 我想要得到某种澄清的一种方法是 build方法 什么时候使用它是有效的 或者如何以最好的方式使用它 算是一回事 Thanks
  • 使用 JQuery css 方法自定义 CSS 光标

    有没有办法使用 JQuery 的 css 方法来提供以下光标样式 cursor url http www google com intl en ALL mapfiles closedhand cur default important jQ
  • 使用 pg-promise 查询多对多关系的最佳方法

    例如 我想从数据库获取用户信息 电子邮件及其角色 并创建一个如下对象 id 1 firstname John lastname Johnny emails type work email email protected cdn cgi l
  • 使用forever运行meteor生成的节点包的正确语法是什么?

    在文档中 在您自己的服务器上运行meteor的过程是运行 meteor bundle bundle tgz 然后提取这个 tarball tar xzvf bundle tgz 然后启动一个节点服务器 MONGO URL mongodb l
  • YouTube API v3 示例项目引发 GTLJSONRPCErrorDomain -32602 错误请求错误

    我刚刚下载了Google API 目标 C 客户端 https code google com p google api objectivec client source checkout 我在 Mac 上的 Xcode 中打开了 YouT
  • 如何在没有标志的情况下使用 ngx-bootstrap 角度折叠

    我正在尝试制作折叠动画 但没有布尔指示器isCollapsed 因为我有很多元素 并且我不想创建很多布尔值 所以有没有办法在没有布尔指示器的情况下做到这一点
  • 根据属性动态注册Spring Bean

    我正在使用最新的 Spring Boot 版本 并尝试根据中定义的内容动态创建 n 个 beanapplication yaml文件 然后我想根据 bean 名称将这些 bean 注入到其他类中 下面的代码是我想要实现的目标的一个非常简化的
  • JSpinner 编辑器区域设置

    我正在创建 JSpinner 并设置具有自定义格式的 NumberEditor 但无论我做什么 格式都使用 而不是 不根据我的语言环境 pt BR priceSpinner new JSpinner priceSpinner setEdit
  • ASP.NET UpdatePanel 错误 htmlfile:未知的运行时错误,updatePanelElement.innerHTML=rendering

    在触发 UpdatePanel 后调试 ASP NET Web 应用程序时 我收到此错误 htmlfile 未知的运行时错误 并且 updatePanelElement innerHTML rendering 在 ScriptResourc
  • 多用户聊天中的 smack 存在侦听器

    多用户聊天中的smack状态监听器没有被调用 使用Smack Api登录然后添加名册 addRosterListener mRoasterListener 但当聊天室其他用户的存在发生变化时 无法成功收听 我尝试使用以下代码来使存在侦听器正
  • 在 Mathematica 中使用图形进行渐变填充

    我如何使用以下内容创建Rectangle in Graphics Using Polygon 你可以 Graphics EdgeForm Black Polygon 0 0 3 0 3 1 0 1 VertexColors gt White
  • Backbone.Marionette 在路由更改时更改区域

    我的应用程序有一个主区域 有时主区域中会有一些应可通过 URL 访问的子区域 主要区域内容由应用程序路由器的功能更改 因为他知道主要区域 但是子视图中的临时区域呢 例如网址 docs将显示文档链接列表以及 doc id应在列表旁边显示文档的
  • 具有多个参数的 COM“获取属性”

    我正在尝试打电话WindowsInstaller Installer ProductsEx http msdn microsoft com en us library aa369461 28v vs 85 29 aspx来自 python
  • 导航栏是否应该始终以列表的形式实现?

    首先 非常抱歉 如果这不是一个 真正的 stackoverflow 问题 但这是我一直想知道的事情 当您为网站 html 编写导航栏时 我读到这是非常好的实践 即使不是使用列表标签实现它的唯一实践 例如 ul li Home li li A