wordpress访问限制_使您的WordPress网站更易于访问的4种方法

wordpress访问限制

Most of the time, my writing focuses on search engine optimization techniques. So, why would I write about accessibility in WordPress?

大多数时候，我的写作都集中在搜索引擎优化技术上。 那么，为什么我要写有关WordPress中可访问性的文章？

Because, to a large extent, optimizing a site for search engines and optimizing a site for disability access amount to much the same thing. The same techniques that allow search robots to index a site properly allow screenreaders to correctly describe the content to users with visual disabilities.

因为在很大程度上，为搜索引擎优化站点和为残疾人访问优化站点在很大程度上是相同的。 允许搜索引擎正确索引网站的相同技术使屏幕阅读器可以向视障用户正确描述内容。

Similarly, structuring a page properly makes it machine-friendly, whatever that machine is. Add the kind of common sense techniques that allow users (including users with disabilities) and machines to get straight to meaningful content, and you are moving towards making your site both accessible and search engine friendly.

同样，正确构造页面可以使其对计算机友好，无论该计算机是什么。 添加一种常识性技术，使用户(包括残障用户)和机器可以直接获取有意义的内容，并且您正朝着使站点可访问和搜索引擎友好的方向发展。

We all know WordPress is a phenomenal tool that allows people to build blogs and websites with very little programming or coding knowledge. This platform is simple to set up, and provides a solid framework for the themes and plugins that will determine how your content and functionality is presented.

我们都知道WordPress是一种了不起的工具，它使人们能够以很少的编程或编码知识来构建博客和网站。 该平台易于设置，并为主题和插件提供了一个可靠的框架，该框架将决定如何展示您的内容和功能。

If you want your site to be accessible to individuals with disabilities, you’ll find that basic WordPress has much that is needed to facilitate the development of an accessible website, and it is not hard to take that further through the addition of plugins and good technique.

如果您希望残障人士可以访问您的网站，您会发现基本的WordPress具有许多便利性，以促进可访问性网站的开发，并且不难通过添加插件和良好的方式来进一步实现这一目标。技术。

Before we get started, there are two important caveats to be aware of. First, implementing these four technqiues alone will not make any website totally accessible to the extent of complying with all requirements of WCAG or Section 508, but it will address the most common barriers to web access and deliver much greater accessibility.

在开始之前，需要注意两个重要的警告。 首先，仅实施这四个技术并不能完全符合WCAG或508节的所有要求来完全访问任何网站，但是它将解决最常见的网络访问障碍并提供更大的可访问性。

Second, it’s important to understand that accessibility can only be achieved through the co-operation of design, development and content authoring practices. A designer may design an accessible theme, a developer might add accessible functionality, but if a content author inserts a meaningful image without an alt tag, the full meaning of the web page will be inaccessible.

其次，必须理解只有通过设计，开发和内容编写实践的合作才能实现可访问性。 设计人员可以设计可访问的主题，开发人员可以添加可访问的功能，但是如果内容作者插入没有alt标签的有意义的图像，则将无法访问网页的全部含义。

With that in mind, here are my four tips for making WordPress sites more accessible.

考虑到这一点，这里是我四个使WordPress网站更易于访问的提示。

用替代文字标记图像 (Label Your Images With Alt Text)

It is well documented that the single greatest barrier to web accessibility is using alt text properly to describe images on a web page. If this single point was addressed by everyone who builds websites, it would eradicate the largest number of accessibility complaints.

有据可查的是，网络可访问性的最大障碍是正确使用替代文本来描述网页上的图像。 如果建站的每个人都解决了这一点，它将消除可访问性投诉的最大数量。

The fundamental point to understand is that if you are going to put images on your site, it is essential that you label them correctly with alt text. To put that another way, every meaningful image on a web page must have an alt tag.

要理解的基本要点是，如果要在站点上放置图像，则必须使用替代文本正确标记图像。 换句话说，网页上每个有意义的图像都必须带有alt标签。

The information in the alt tag allows users of screen readers (which read web pages aloud to users with visual disabilities), text only browsers and slow connections that won’t load images to understand the information conveyed by images.

alt标签中的信息允许屏幕阅读器的用户(向有视觉障碍的用户大声阅读网页)，纯文本浏览器和不会加载图像的慢速连接来理解图像所传达的信息。

If an image does not have meaning, for example it is used purely for decoration, there are two ways to deal with it. If you load it as a background image using CSS, screen readers will ignore it and the image does not require an alt tag (be careful, becuase this also applies to meaningful images: if you load it in background, the screen reader will ignore it). If an image is displayed using HTML but is purely decorative, then use the alt tag but leave it empty. That tells the screen reader that an image is present but has no meaning for the user and can be ignored.

如果图像没有意义，例如仅用于装饰，则有两种处理方法。 如果使用CSS将其加载为背景图片，则屏幕阅读器将忽略它，并且该图像不需要alt标签(请注意，因为这也适用于有意义的图像：如果在后台加载，则屏幕阅读器将忽略它。 )。 如果图像是使用HTML显示的，但纯粹是装饰性的，请使用alt标签，但将其留空。 这告诉屏幕阅读器存在图像，但对用户没有意义，可以忽略。

When you do label your images, use descriptive text that will allow people who cannot see to understand what the meaning of the image is. This requires judgement: what meaning is the image meant to convey, and what words will best convey that same meaning. Don’t get caught up in literal descriptions of every visual detail, convey the meaning.

在为图像加上标签时，请使用描述性文字，使看不见的人可以理解图像的含义。 这需要作出判断：图像要传达的含义是什么，什么词可以最好地传达相同的含义。 不要陷入每个视觉细节的字面描述中，要传达其含义。

A classic example is an image of a magnifying glass used as a button to start a search. The image has a meaning, so it should be described. Describing it as “a magnifying glass” does not help the user. What they need to know is that clicking on this button will start a search, so alt text of “click here to search” or even just “search” may be most appropriate.

一个经典的例子是放大镜图像，用作开始搜索的按钮。 图像具有含义，因此应进行描述。 将其描述为“放大镜”对用户没有帮助。 他们需要知道的是，单击此按钮将开始搜索，因此“单击此处进行搜索”或“搜索”的替代文字可能是最合适的。

Only images that serve a purpose must be labeled. Examples of these are as follows:

只有用于目的的图像必须被标记。 这些示例如下：

• Images that are used as buttons
  用作按钮的图像
• Images that are used as links
  用作链接的图像
• Images that are used for any other controls
  用于任何其他控件的图像
• Images that directly relate to the content
  与内容直接相关的图像

This technique applies to all websites, of course, not just WordPress sites. WordPress, however, makes it easier than most, firstly by allowing the content author to switch between Visual and HTML views, and secondly by providing a field for alt text whenever an image is inserted using Add Media functionality.

当然，这种技术适用于所有网站，而不仅仅是WordPress网站。 但是，WordPress比大多数工具更容易实现，首先是允许内容作者在Visual视图和HTML视图之间切换，其次是通过在使用添加媒体功能插入图像时提供alt文本字段。

使用插件增强可访问性 (Use Plugins to Enhance Accessibility)

WordPress accessibility can be enhanced by using a variety of plugins. These plugins are easy to set up, and they will enable users with a wide range of disabilities to access the site. Here are some plugins I’ve found useful.

可以通过使用各种插件来增强WordPress的可访问性。 这些插件易于设置，它们使残障用户能够访问该网站。 这是我发现有用的一些插件。

存取键 (Access Keys)

The Access Keys plugin allows access keys to be assigned to links and controls on your website. For instance, the home link may be assigned the access key combination alt+h and the search button may be assigned the alt+s key combination. Access keys, such as the examples provided, enable visually impaired users as well as those with mobility issues, to easily access what they want.

使用访问密钥插件，可以将访问密钥分配给您网站上的链接和控件。 例如，可以为主页链接分配访问键组合alt + h，为搜索按钮分配alt + s组合键。 访问键(例如提供的示例)使视障用户和行动不便的用户能够轻松访问他们想要的内容。

轻松转推 (Easy Retweet)

Easy Retweet is a plugin that will allow you to add accessible buttons to your page that facilitate sharing your content on Twitter. This way, if individuals with disabilities wish to share your pages with their friends, they can do so without any difficulty.

Easy Retweet是一个插件，可让您向页面添加可访问的按钮，以方便在Twitter上共享内容。 这样，如果残障人士希望与他们的朋友分享您的页面，他们可以轻松进行。

AStickyPostOrderER (AStickyPostOrderER)

AstickyPostOrderER lets you choose the order in which your content is displayed. You can choose to display content from oldest to newest or in the reverse order.

AstickyPostOrderER使您可以选择显示内容的顺序。 您可以选择从最早到最新或以相反的顺序显示内容。

Hackadelic SEO目录 (Hackadelic SEO Table of Contents)

The Hackadelic SEO Table of Contents plugin enables you to provide a table of contents for either your posts or your pages. This will make your content easy to find.

Hackadelic SEO目录表插件使您可以为帖子或页面提供目录。 这将使您的内容易于查找。

WP民意调查 (WP-Polls)

WP-Polls permits individuals with disabilities to participate in any polls you may have on your site

WP-Polls允许残障人士参与您在网站上进行的任何民意调查

New plugins are being developed all the time. Use the WordPress dashboard functionality to search for more. Try different plugins and ask your users with disabilities to give you feedback

新插件一直在开发中。 使用WordPress仪表板功能搜索更多内容。 尝试使用其他插件，并请残障人士给您反馈

When using any plugins, make sure the plugins use are compatible with your chosen theme, as well as with one another. If your plugins are not compatible with your theme, they will either not work or will cause more problems for disabled users who try to browse your site. If your plugins are not compatible with one another, your site can be rendered unusable or content may be displayed incorrectly.

使用任何插件时，请确保所使用的插件与您选择的主题以及彼此兼容。 如果您的插件与您的主题不兼容，则它们将无法正常工作，或者对尝试浏览您的网站的残疾用户造成更多问题。 如果您的插件彼此不兼容，则您的站点可能无法使用，或者内容显示不正确。

正确使用标题 (Use Headings Properly)

When you design pages, it is vital to structure the content using headings in the correct order: <h1>, <h2>, <h3> and so on. When you structure the content using headings, people using screen readers can get a summary of what the pages are about and navigate them more easily. Screen reader users can access the sections of content that they want by pressing the letter “H” to go forward and “shift+H” to go backwards.

设计页面时，至关重要的是使用标题以正确的顺序来组织内容： <h1> ， <h2> ， <h3>等。 当您使用标题来组织内容时，使用屏幕阅读器的人可以获得页面内容的摘要，并可以更轻松地浏览它们。 屏幕阅读器用户可以通过按字母“ H”前进和“ shift + H”后退来访问他们想要的内容部分。

You can label your content using headings one through six. Check how your theme uses headings (for example, your theme may or may not apply <h1> to the site title and that site title may or may not appear on every webpage. Either way, make sure the first heading used is <h1> and the following headings (page title, page sub-sections, paragraph headings) descend in order through to <h6>, where appropriate.

您可以使用标题1到6标记内容。 检查您的主题使用标题的方式(例如，您的主题可能会或可能不会将<h1>应用于网站标题，并且该网站标题可能会或可能不会出现在每个网页上。无论哪种方式，请确保使用的第一个标题为<h1>适当时，以下标题(页面标题，页面子节，段落标题)按顺序<h6>到<h6> 。

There is some flexibility about the ordering, but the most sensible option is to keep headings in numerical order and don’t mix them up (<h1>, <h4>, <h2>, etc).

排序有一定的灵活性，但最明智的选择是使标题保持数字顺序，不要混淆标题( <h1> ， <h4> ， <h2>等)。

<html> 
<head> 
    <title>Must See Horror Movies</title> 
</head>   
 
<body> 
    <h1>Horror Movies of the Decade </h1> 
    (This is the title of the page that will be assigned a header by default in most WordPress themes. 
    This header is always assigned to h1. Structure the rest of the content to follow what has been started)   
 
    <h2>Horror Movies for 2012</h2> 
    (The list of 2012 horror movies will go here)   
 
    <h3>2012 Cult Movies</h3> 
    (a sub-list of 2012 movies)   
 
    <h3>2012 Sci Fi Horror Movies</h3> 
    (another sub-list of 2012 movies)   
 
    <h2>Horror Movies for 2011</h2>
    (The list of 2011 horror movies goes here)   
 
    <h2>Horror Movies for 2010</h2> 
    (The list of 2010 horror movies goes here)   
 
    <h2>Horror Movies for 2009</h2> 
    (The list of 2009 horror movies goes here)
 
    <h2>Horror Movies for 2008</h2> 
    (The list of 2008 horror movies goes here)   
 
    <h4>Why Use Our Horror Movies Reference </h4> 
    (This gets a new, lower header level due to the fact that this section of the page comes after those 
    listing the movies, and it is not as important as the movie listings) 
</body> 
</html>

使用导航链接 (Use Navigation Links)

Finally, you need to have navigation links in your site design. These navigation links will allow users with disabilities to skip past the navigation bar or other menus and search boxes and jump to certain places on the page by clicking these links. Or, the user can quickly jump to desired sections on the site. These links need to appear wherever it is necessary for users to skip to meaningful content. Examples of what these links may say are:

最后，您需要在网站设计中具有导航链接。 这些导航链接将允许残障用户跳过导航栏或其他菜单和搜索框，并通过单击这些链接跳至页面上的某些位置。 或者，用户可以快速跳转到站点上所需的部分。 这些链接必须出现在用户需要跳到有意义内容的任何地方。 这些链接可能说的例子是：

• Skip to Main Content
  跳到主要内容
• Jump to Navigation Bar
  跳转到导航栏
• Jump to Search
  跳转到搜索

Some WordPress themes may already provide such links. If this is the case, you will need to check to these links to see if you have to add any of your own. Other themes, however, will not provide navigation links. Thus, you will need to add these links yourself.

某些WordPress主题可能已经提供了此类链接。 在这种情况下，您将需要检查这些链接以查看是否必须添加任何自己的链接。 但是，其他主题将不提供导航链接。 因此，您将需要自己添加这些链接。

结论 (Conclusion)

I will emphasize again that none of this will guarantee that your website will be 100% accessible.

我将再次强调，这些都不保证您的网站将100％可访问。

However, if you employ these four techniques, then you can count on your WordPress site being more accessible than 90% of WordPress sites out there, and that you have addressed the issues that are raised by 90% of people who point out web inaccessibility.

但是，如果您采用了这四种技术，那么您可以指望WordPress网站比其中90％的WordPress网站更易于访问，并且您已经解决了90％指出网络无法访问的人提出的问题。

People with disabilities will be able to better access your site, along with all of your other visitors. Since these visitors also include search robots, you can be assured that making your site accessible will also benefit your business model and help maximize your profit making potential.

残障人士将能够与您的所有其他访客一起更好地访问您的网站。 由于这些访问者还包括搜索机器人，因此您可以放心，使您的网站可访问也将有益于您的业务模型，并有助于最大程度地发挥获利潜力。

翻译自: https://www.sitepoint.com/4-ways-to-make-your-wordpress-site-more-accessible/

wordpress访问限制