Summary

使用段落样式(用于文档)或标题标签(用于网页)来组织文档. 标题使屏幕阅读器可以访问文档的结构,同时提高了可扫描性和可维护性.

您可以在任何书面媒体中应用标题最佳实践, 从电子邮件到研究论文再到博客文章. 无论你写什么,文档结构都可以帮助你组织工作.

作为奖励, 如果您的标题样式正确,并决定稍后更改字体或其粗细或大小, 你可以做一个改变,你所有的标题都会改变, 节省你大量的时间.

影响

结构对于适应性技术用户来说至关重要, 谁会依赖正确格式的标题来理解和浏览文档和网页. 没有这个结构, 没有简单的方法来导航文档,因为文档被读取为单个长节.

屏幕阅读器示范

观看一段视频,展示屏幕阅读器如何使用标题导航网页. 

Dos和不

使用标题样式

学会在描述性标题下组织你的段落,并对这些标题应用“风格”. 这个习惯会让任何人更容易浏览你的文档,找到他们想要阅读的文档部分, 一个称为“可扫描性”的属性."

  • 在大多数软件应用程序和web内容管理系统中, 您可以使用格式工具栏上的样式菜单突出显示您想要成为标题的文本,并应用内置样式.
  • 如果你正在开发一个网站, 你可以类似地使用CSS将网站上所有标题的样式设置在一个地方.

正确做法:将标题级别与内容结构相匹配

在网页上

  • 使用一级标题来表明每一页的标题、主题或目的.  
  • 在网页的浏览器页面标题中重复全部或部分第1级标题. 
  • 使用二级标题来表示文档的每个主要部分.  
  • 使用3级标题来表示子部分. 
  • 使用4级、5级和6级标题来表示子部分.

在数字文件

  • Some people use multiple level 1 headings and mark the document title with a tag.</li> <li>其他人则认为文档标题应该是一级标题,因此是唯一的标题1.</li> </ul><p>在 <a href="http://accessible-digital-documents.com/blog/one-or-more-h1s-in-pdf/" rel="nofollow">访问数字文件</a> 网站, Ted Page concludes that "sometimes it makes sense to use multiple <H1>s, 但大多数情况下只使用一个对可访问性更好."</p> <h3>错误做法:无序使用标题样式</h3> <p>不要因为喜欢某个标题级别的外观而乱用标题样式, 例如在标题2样式之后使用标题4样式.</p> </div> </div> <div class="block block-layout-builder block-inline-blocktext"> <div class="clearfix text-formatted field field--name-field-text-text field--type-text-long field--label-hidden field__item"><h3>应该做:创建一个目录</h3> <p>目录可以使人们更容易浏览和预览长文档或网页. </p> <p>标题使用样式菜单, 你的软件可能会根据标题自动创建一个目录.</p> <p>确保这些链接是锚,比如给它们一个标题,比如:</p> <ul><li>表的内容</li> <li>这一页上有什么</li> <li>在这一页上</li> <li>跳转到</li> <li>在本文档中</li> </ul><h3>不要:忘记指出锚点链接的作用. </h3> <p>不要在没有说明链接作用的情况下包含指向页面不同部分或目录的锚点链接.</p> </div> </div> </div> </div> </div> </div> </div> </div> </article> </div> <div class="views-element-container block block-views block-views-blockgroup-contact-details-block-1" id="block-views-block-group-contact-details-block-1"> <div> <div class="view view--group-contact-details view-group-contact-details view-id-group_contact_details view-display-id-block_1 js-view-dom-id-34851f881d859ee67b0499e698a147791fe4ddf7d365bdcb384a8fb405f02264"> <div class="view-content"> <div class="views-row"> <div class="group group--contact-details group--webWebsite-section"> </div> </div> </div> </div> </div> </div> </div> </div> </main> <footer class="footer region-footer"> <div class="footer__top"> <div class="footer__connect"> <span class="footer__connect-item">有一个 <span class="footer__enlarged-font">问题?</span> <a href="/contact-information">十大网堵靠谱网址平台!</a> </span> <span class="footer__connect-item"> <a href="/ul-prospectuses">索取一份推荐全球十大网堵正规平台的 <span class="footer__enlarged-font">招股说明书</span> </a> </span> </div> </div> <div class="footer__content"> <div class="layout-contained padding-horizontal"> <div class="anrt-row"> <div class="anrt-row__one-quarter"> <div class="footer__location"> <div class="block block-block-content block-block-content16a2252f-b3b7-4c49-a24a-5a909f805ed8" id="block-footer-address"> <div class="clearfix text-formatted field field--name-field-text-text field--type-text-long field--label-hidden field__item"><p>十大网堵靠谱网址平台<br/> 十大网堵靠谱网址平台<br/> V94 T9PX<br/> 爱尔兰</p> <p><a href="tel:+353-(0)61-202700" rel="nofollow">电话:+ 353 (0)61 - 202700</a></p> <p>注册慈善编号5806</p></div> </div> </div> </div> <div class="anrt-row__one-quarter"> <div class="footer__menu footer__block"> <nav aria-labelledby="block-footer-about-ul-menu" class="block block-menu navigation menu--footer--about-ul" id="block-footer-about-ul" role="navigation"> <h2 id="block-footer-about-ul-menu">关于推荐全球十大网堵正规平台</h2> <ul class="menu menu--footer--about-ul"> <li class="menu-item"> <a href="/study-ul">研究推荐全球十大网堵正规平台</a> </li> <li class="menu-item"> <a data-drupal-link-system-path="group/8/content/70" href="/faculties-and-departments">能力 & 部门</a> </li> <li class="menu-item"> <a href="/ul-campus">推荐全球十大网堵正规平台校园</a> </li> <li class="menu-item"> <a data-drupal-link-system-path="group/8/content/80" href="/about-ul/directory-of-services">所有的目录</a> </li> <li class="menu-item"> <a href="/hrvacancies">在推荐全球十大网堵正规平台空缺</a> </li> </ul> </nav> </div> </div> <div class="anrt-row__one-quarter footer__menu"> <div class="footer__menu footer__block"> <nav aria-labelledby="block-footer-useful-links-menu" class="block block-menu navigation menu--footer--useful-links" id="block-footer-useful-links" role="navigation"> <h2 id="block-footer-useful-links-menu">有用的链接</h2> <ul class="menu menu--footer--useful-links"> <li class="menu-item"> <a href="/academic-registry/academic-calendar">校历</a> </li> <li class="menu-item"> <a href="http://www.outlook.com/studentmail.scoringthird.com">学生的电子邮件</a> </li> <li class="menu-item"> <a data-drupal-link-system-path="group/8/content/124" href="/students">学生网关</a> </li> <li class="menu-item"> <a href="http://webmail.scoringthird.com/owa">员工的电子邮件</a> </li> <li class="menu-item"> <a data-drupal-link-system-path="group/8/content/121" href="/staff">工作人员通道</a> </li> </ul> </nav> </div> </div> <div class="anrt-row__one-quarter footer__menu"> <div class="footer__menu footer__block"> <nav aria-labelledby="block-footer-webWebsite-menu" class="block block-menu navigation menu--footer--webWebsite" id="block-footer-webWebsite" role="navigation"> <h2 id="block-footer-webWebsite-menu">网站</h2> <ul class="menu menu--footer--webWebsite"> <li class="menu-item"> <a data-drupal-link-system-path="group/8/content/88" href="/disclaimer">免责声明</a> </li> <li class="menu-item"> <a data-drupal-link-system-path="group/8/content/133" href="/cookie-statement">饼干的声明</a> </li> <li class="menu-item"> <a data-drupal-link-system-path="group/15/content/4524" href="/corporatesecretary/data-protection">隐私声明</a> </li> <li class="menu-item"> <a data-drupal-link-system-path="group/8/content/74" href="/contact-information">十大网堵靠谱网址平台</a> </li> <li class="menu-item"> <a data-drupal-link-system-path="group/55/content/11948" href="/accessibility/accessibility-statement" title="可访问性声明">可访问性声明</a> </li> <li class="menu-item"> <a data-drupal-link-system-path="group/17" href="/covid">新型冠状病毒肺炎</a> </li> </ul> </nav> </div> </div> </div> </div> </div> <div class="footer__bottom padding-horizontal"> <div class="layout-contained"> <div class="anrt-row anrt-row--centered"> <div class="anrt-row__one-quarter"> <div class="footer__bottom-block"> <a class="logo-link" href="/"> <img alt="十大网堵靠谱网址平台的家" class="footer__logo" src="/themes/custom/ul/assets/images/ul-logo.jpg"/> </a> </div> </div> <div class="anrt-row__one-half"> <div class="footer__bottom-block footer__bottom-block--stacked footer__bottom-center"> <a href="http://www.scoringthird.com/hr/athena-swan"> <img alt="大学附属雅典娜斯旺信息" src="/themes/custom/ul/assets/images/athena_bronze_hp.jpg"/> </a> <a href="http://www.scoringthird.com/hr/hr-strategy-researchers-and-open-transparent-merit-based-recruitment"> <img alt="卓越人力资源研究" src="/themes/custom/ul/assets/images/hr-research-excellence.jpg"/> </a> <img alt="由爱尔兰政府和E.U." src="/themes/custom/ul/assets/images/erdp-eusf-logos-18.jpg"/> </div> </div> <div class="anrt-row__one-quarter"> <div class="footer__bottom-block footer__social-media-links"> <div class="social-media-links"> <div class="social-media-links__title">关注推荐全球十大网堵正规平台</div> <ul class="social-media-links__list"> <li class="social-media-links__item social-media-links__item--facebook"> <a class="social-media-links__link" href="http://www.facebook.com/universityoflimerick"> <svg viewBox="0 0 320 512" xmlns="http://www.w3.org/2000/svg"><!-- Font Awesome Pro 5.15.1 by @fontawesome - http://fontawesome.com License - http://fontawesome.com/license (Commercial License) --><path d="M279.14 288l14.22-92.66h-88.91v-60.13c0-25.35 12.42-50.06 52.24-50.06h40.42V6.26S260.43 0 225.36 0c-73.22 0-121.08 44.38-121.08 124.72v70.62H22.89V288h81.39v224h100.17V288z"></path></svg> <span class="visually-hidden"> 在Facebook上关注十大网堵靠谱网址平台 </span> </a> </li> <li class="social-media-links__item social-media-links__item--twitter"> <a class="social-media-links__link" href="http://twitter.com/ul"> <svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><!-- Font Awesome Pro 5.15.1 by @fontawesome - http://fontawesome.com License - http://fontawesome.com/license (Commercial License) --><path d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z"></path></svg> <span class="visually-hidden"> 在Twitter上关注十大网堵靠谱网址平台 </span> </a> </li> <li class="social-media-links__item social-media-links__item--instagram"> <a class="social-media-links__link" href="http://www.instagram.com/universityoflimerick/"> <svg viewBox="0 0 448 512" xmlns="http://www.w3.org/2000/svg"><!-- Font Awesome Pro 5.15.1 by @fontawesome - http://fontawesome.com License - http://fontawesome.com/license (Commercial License) --><path d="M224.1 141c-63.6 0-114.9 51.3-114.9 114.9s51.3 114.9 114.9 114.9S339 319.5 339 255.9 287.7 141 224.1 141zm0 189.6c-41.1 0-74.7-33.5-74.7-74.7s33.5-74.7 74.7-74.7 74.7 33.5 74.7 74.7-33.6 74.7-74.7 74.7zm146.4-194.3c0 14.9-12 26.8-26.8 26.8-14.9 0-26.8-12-26.8-26.8s12-26.8 26.8-26.8 26.8 12 26.8 26.8zm76.1 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zM398.8 388c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1z"></path></svg> <span class="visually-hidden"> 在Instagram上关注十大网堵靠谱网址平台 </span> </a> </li> <li class="social-media-links__item social-media-links__item--linkedin"> <a class="social-media-links__link" href="http://www.linkedin.com/company/university-of-limerick"> <svg viewBox="0 0 448 512" xmlns="http://www.w3.org/2000/svg"><!-- Font Awesome Pro 5.15.1 by @fontawesome - http://fontawesome.com License - http://fontawesome.com/license (Commercial License) --><path d="M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z"></path></svg> <span class="visually-hidden"> 在Linkedin上关注十大网堵靠谱网址平台 </span> </a> </li> <li class="social-media-links__item social-media-links__item--youtube"> <a class="social-media-links__link" href="http://www.youtube.com/user/UniversityofLimerick"> <svg viewBox="0 0 576 512" xmlns="http://www.w3.org/2000/svg"><!-- Font Awesome Pro 5.15.1 by @fontawesome - http://fontawesome.com License - http://fontawesome.com/license (Commercial License) --><path d="M549.655 124.083c-6.281-23.65-24.787-42.276-48.284-48.597C458.781 64 288 64 288 64S117.22 64 74.629 75.486c-23.497 6.322-42.003 24.947-48.284 48.597-11.412 42.867-11.412 132.305-11.412 132.305s0 89.438 11.412 132.305c6.281 23.65 24.787 41.5 48.284 47.821C117.22 448 288 448 288 448s170.78 0 213.371-11.486c23.497-6.321 42.003-24.171 48.284-47.821 11.412-42.867 11.412-132.305 11.412-132.305s0-89.438-11.412-132.305zm-317.51 213.508V175.185l142.739 81.205-142.739 81.201z"></path></svg> <span class="visually-hidden"> 在Youtube上关注十大网堵靠谱网址平台 </span> </a> </li> <li class="social-media-links__item social-media-links__item--snapchat"> <a class="social-media-links__link" href="http://www.snapchat.com/add/uoflimerick"> <svg viewBox="0 0 496 512" xmlns="http://www.w3.org/2000/svg"><!-- Font Awesome Pro 5.15.1 by @fontawesome - http://fontawesome.com License - http://fontawesome.com/license (Commercial License) --><path d="M248 8C111 8 0 119 0 256s111 248 248 248 248-111 248-248S385 8 248 8zm169.5 338.9c-3.5 8.1-18.1 14-44.8 18.2-1.4 1.9-2.5 9.8-4.3 15.9-1.1 3.7-3.7 5.9-8.1 5.9h-.2c-6.2 0-12.8-2.9-25.8-2.9-17.6 0-23.7 4-37.4 13.7-14.5 10.3-28.4 19.1-49.2 18.2-21 1.6-38.6-11.2-48.5-18.2-13.8-9.7-19.8-13.7-37.4-13.7-12.5 0-20.4 3.1-25.8 3.1-5.4 0-7.5-3.3-8.3-6-1.8-6.1-2.9-14.1-4.3-16-13.8-2.1-44.8-7.5-45.5-21.4-.2-3.6 2.3-6.8 5.9-7.4 46.3-7.6 67.1-55.1 68-57.1 0-.1.1-.2.2-.3 2.5-5 3-9.2 1.6-12.5-3.4-7.9-17.9-10.7-24-13.2-15.8-6.2-18-13.4-17-18.3 1.6-8.5 14.4-13.8 21.9-10.3 5.9 2.8 11.2 4.2 15.7 4.2 3.3 0 5.5-.8 6.6-1.4-1.4-23.9-4.7-58 3.8-77.1C183.1 100 230.7 96 244.7 96c.6 0 6.1-.1 6.7-.1 34.7 0 68 17.8 84.3 54.3 8.5 19.1 5.2 53.1 3.8 77.1 1.1.6 2.9 1.3 5.7 1.4 4.3-.2 9.2-1.6 14.7-4.2 4-1.9 9.6-1.6 13.6 0 6.3 2.3 10.3 6.8 10.4 11.9.1 6.5-5.7 12.1-17.2 16.6-1.4.6-3.1 1.1-4.9 1.7-6.5 2.1-16.4 5.2-19 11.5-1.4 3.3-.8 7.5 1.6 12.5.1.1.1.2.2.3.9 2 21.7 49.5 68 57.1 4 1 7.1 5.5 4.9 10.8z"></path></svg> <span class="visually-hidden"> 在Snapchat上关注十大网堵靠谱网址平台 </span> </a> </li> <li class="social-media-links__item social-media-links__item--tiktok"> <a class="social-media-links__link" href="http://www.tiktok.com/@universityoflimerick"> <svg viewBox="0 0 448 512" xmlns="http://www.w3.org/2000/svg"><!-- Font Awesome Pro 5.15.1 by @fontawesome - http://fontawesome.com License - http://fontawesome.com/license (Commercial License) --><path d="M448,209.91a210.06,210.06,0,0,1-122.77-39.25V349.38A162.55,162.55,0,1,1,185,188.31V278.2a74.62,74.62,0,1,0,52.23,71.18V0l88,0a121.18,121.18,0,0,0,1.86,22.17h0A122.18,122.18,0,0,0,381,102.39a121.43,121.43,0,0,0,67,20.14Z"></path></svg> <span class="visually-hidden"> 在抖音上关注十大网堵靠谱网址平台 </span> </a> </li> </ul> </div> </div> </div> </div> </div> <p class="footer__copyright">©十大网堵靠谱网址平台</p> </div> </footer> </div> <script data-drupal-selector="drupal-settings-json" type="application/json">{"path":{"baseUrl":"\/","scriptPath":null,"pathPrefix":"","currentPath":"group\/55\/content\/11955","currentPathIsAdmin":false,"isFront":false,"currentLanguage":"en"},"pluralDelimiter":"\u0003","suppressDeprecationErrors":true,"cookiebot":{"message_placeholder_cookieconsent_optout_marketing_show":false,"message_placeholder_cookieconsent_optout_marketing":"\u003Cdiv class=\u0022cookiebot cookieconsent-optout-marketing\u0022\u003E\n\t\u003Cdiv class=\u0022cookieconsent-optout-marketing__inner\u0022\u003E\n\t\t\u003Cp\u003EPlease \u003Ca class=\u0022cookieconsent-optout-marketing__cookiebot-renew\u0022 href=\u0022!cookiebot_renew\u0022\u003Eaccept marketing-cookies\u003C\/a\u003E to view this embedded content from \u003Ca class=\u0022cookieconsent-optout-marketing__from-src-url\u0022 href=\u0022!cookiebot_from_src_url\u0022 target=\u0022_blank\u0022\u003E!cookiebot_from_src_url\u003C\/a\u003E\u003C\/p\u003E\n\n\t\u003C\/div\u003E\n\u003C\/div\u003E\n"},"user":{"uid":0,"permissionsHash":"e629d2550ada1172c13d023e783fae3d5b54609309778e68cebbed300419d2f6"}}</script> <script src="/Websites/default/files/js/js_I2CnSg6LHaODqh12Sj7FR9qVeq90HP9JZdSzZFjvuSE.js"></script> <script data-cookieconsent="ignore" src="/core/misc/drupalSettingsLoader.js?v=9.3.19"></script> <script data-cookieconsent="ignore" src="/core/misc/drupal.js?v=9.3.19"></script> <script data-cookieconsent="ignore" src="/core/misc/drupal.init.js?v=9.3.19"></script> <script src="/Websites/default/files/js/js_9viM3KDq1qj_S70ls5irun6Cm1HCpt0UjBAfORUKYpc.js"></script> </body></html>