The Internet's Accessibility Problem — and How To Fix It | Clive Loseby | TED

翻译人员: Yip Yan Yeung 校对人员: Grace Man

Hi, everyone. I'm Clive Loseby

大家好，我叫克里夫·罗瑟比 （Clive Loseby），

and I am passionate about changing the world,

我有志于 用一个个网站改变世界。

one website at a time.

As Dale said I was in a bad car crash a long time ago.

如戴尔（Dale）所说，很久以前， 我出了一场严重的车祸。

It left us all with life-changing injuries.

它让我们所有人都 留下了一辈子的损伤。

And that's why accessibility and website accessibility

这也就是为什么无障碍 和网络可访问性

has become my passion.

成为了我的追求。

The accident also left me with a very bad memory,

车祸也导致了我记性很差，

so please forgive me if I keep looking at my notes.

所以如果我不停地看笔记， 请各位多多包涵。

OK. Does everybody know what a cookie banner is?

大家都知道

储存在用户本地终端上的数据 （cookie）横幅是什么吗？

Those annoying banners that pop up on a website

这些讨厌的横幅 会从网页上跳出来，

asking for consent to put cookies into your browser?

询问你是否允许 向你的浏览器里放置 cookie。

It may say something like, "This website uses cookies

表述大致如下： “本网站会通过 cookie

to give you the best online experience.

为您提供最佳的线上体验。

Follow this link to confirm that you consent to this.”

点击这个链接， 确认您对此表示同意。”

Does everyone know what I'm talking about?

大家都知道我在说些什么吧？

(Audience: Yes!)

（观众：“知道！”）

Good. Right, now I want you to imagine

很好。我想请你们想象一款

a different kind of browser.

与众不同的浏览器。

This one says the following:

这个浏览器会显示：

"This website is designed for white people only.

“这个网站专为白人设计。

Follow this link to confirm that you are white."

点击这个链接， 确认您是个白人。”

Or, "This website is for men only.

或者：“这个网站为男性专用。

Follow this link to confirm that you are a man."

点击这个链接， 确认您是男性。”

Or, "This website is for straight people only.

或者：“这个网站为 异性恋人士专用。

Follow this link to confirm that you are straight."

点击这个链接， 确认您是个异性恋人士。”

Or even, "This website is for people who have hair.

甚至是：“这个网站 为有头发人士专用。

Follow this link to confirm you have hair."

点击这个链接， 确认您有头发。”

OK.

好吧。

These don't happen in the real world,

这些情况不会在现实世界中发生，

but what I do need to tell you about is another banner that does exist

但是我有必要告诉你 另一种确实存在的横幅，

on over 97% of the world's websites.

它会出现在 全球超过 97% 的网页上。

"This website is for people who are not disabled.

“这个网站为非残障人士专用。

Follow this link to confirm that you are not disabled."

点击这个链接， 确认您不是残障人士。”

This may not be as apparent as the cookie banner.

它没有 cookie 横幅 那么显眼。

Believe me, this banner exists.

但是请相信我， 这种横幅确实存在。

Ninety-seven point four percent of 1 million website home pages

一百万个网站首页中 有 97.4%

tested last year

在去年的测试中

had detectable accessibility failures.

出现了检测得到的 可访问性漏洞。

So how many disabled people are there in the world?

那世界上有多少残障人士呢？

In 2010, the World Health Organization

2010 年，世界卫生组织

estimated that 1 billion people on the planet

估算世界上大约有 10 亿人

live with some form of disability,

存在某种形式的残疾，

with over 110 million having highly significant difficulties in functioning.

有超过 1.1 亿人的 身体机能存在严重问题。

We are talking about a lot of people.

我们说的可是很多很多人。

They also would like to use the web as much as you or I do.

他们也会像你我这样上网。

They also want to become your customers and spend money with you,

他们也想成为你的顾客， 让你赚钱，

if you make it possible for them to do so.

前提是你得让他们 真的能做到这个动作。

The title of this talk is a direct quote from somebody I met last year.

这个演讲的标题 是我去年见到的一个人说的话。

She works in health, safety, employee well-being

她的工作内容包括医疗、 安全、员工健康，

and has done for 20 years,

从业 20 年，

so she has a real understanding of inclusivity.

所以她对包容性深有体会。

Lovely, caring person,

她是个可爱、体贴的人，

but she just could not understand how blind people could use the internet

但是她就是无法理解 视障人士该如何上网，

because they couldn't see the screen.

因为他们看不了屏幕。

I explained to her what a screen reader was

我向她介绍了屏幕阅读器，

and she got it.

她就懂了。

A screen reader, by the way,

屏幕阅读器就是

is a piece of software that reads out the content of a website

一种用计算机语音 朗读网页内容的软件。

using a computerized voice.

If you're blind, you can't use a mouse because you can't see where to put it.

如果你失明了，你就无法使用鼠标， 因为你不知道把鼠标放在什么位置。

So you will use your keyboard instead in conjunction with the screen reader.

所以你会转而使用 键盘加上屏幕阅读器。

It's not that easy to do

操作起来没那么容易，

but cookie banners make life so much worse.

但是 cookie 横幅 会让一切雪上加霜。

And in some cases, they actually prevent blind people

有些时候，他们真的 会让视障人士

from accessing the website beyond it.

无法进入下一步的网页。

We are in the year 2022.

如今是 2022 年。

The first set of guidelines for websites

第一套网页规范

to help ensure that they met the needs of disabled people

要求网页必须满足残障人士需求，

were released quite recently, actually, in 1999.

于“近日”公布， 其实是 1999 年。

A mere 23 years ago.

仅仅在 23 年以前。

Yep. I'm not joking.

没错，我没在开玩笑。

All the information has been available to everyone since then.

自此所有的信息都 开放给了每一个人。

It is also a legal requirement in most countries,

很多国家都将其定为了法定要求，

but above everything else,

但是最重要的是，

it helps every business and every organization

它让每家公司、每个组织

become more inclusive.

更具包容性。

And yet, 97% of websites

但是，即使在去年， 仍有 97% 的网站

contained detectable accessibility failures last year.

包含检测得到的 可访问性缺陷。

Think of a website as a building,

把网页想作一栋楼的话

it becomes even more obvious.

就更明显了。

After all, websites are physical buildings.

说白了， 网页就是实体建筑物。

They're your window on the world, aren't they?

它们就是你 看世界的窗户，不是吗？

Legislation for access to physical buildings

针对实体建筑物的无障碍规定

has always made allowances for very old buildings

通常都会对老旧建筑物 网开一面，

where it's simply not possible to make them fully accessible

因为让老旧建筑物 做到对残障人士的完全无障碍

for people with disabilities.

是不可能的。

We all understand that.

我们都可以理解这点。

So actually, I think it's perfectly fair

所以其实我觉得

that you shouldn't expect a website over 23 years old

你也不能指望一个 存在了超过 23 年的网页

to cater for disabled people either.

能满足残障人士的需要。

I'm actually not sure the last time I went on a website

我都记不太清楚上一次访问 一个超过 23 年的网页

that was over 23 years old.

是个什么情形。

But what about five years old or about three years old?

但是，5 年的网页呢？ 3 年的网页呢？

What about last year? This year?

去年的网页呢？ 今年的网页呢？

Typically, websites get replaced every three to five years

网页通常每三到五年就会被替换，

as a new one is built to cater for the latest trends.

人们为了紧跟时代的潮流 会搭建新的网页。

Is it really OK that websites that are recently built

那最近才搭建的网页

依旧让残障人士难以访问， 这合理吗？

are still inaccessible for disabled people?

If not now, when?

现在不解决，更待何时？

OK, so what does accessible web design actually mean?

好，那可访问的网页设计 到底是什么意思？

Please take a look at these doors.

请看这几扇门。

They both go into the same building.

它们都通向同一栋楼。

Both sets of doors have level access.

两组门都是水平入口。

The door on the left slides open automatically as you approach it.

左侧的门 会在你靠近的时候自动打开。

The doors on the right have to be pulled open.

右侧的门需要你手动拉开。

I would like to ask you all a question,

我想问你们一个问题，

and if you are able,

如果可以的话，

I would like you to either raise your left hand

请举起你的左手

or your right hand in answer.

或者右手回答这个问题。

Imagine you're in a wheelchair and you want to enter this building.

假设你坐在轮椅上， 想进入这栋楼。

Which of the doors do you think you would be most likely to use?

你更有可能选择哪一种门？

The automatic doors on the left or the heavy doors on the right?

左侧的自动门还是右侧沉重的门？

Could you please raise your left or your right hand accordingly?

请你们举起左手或者右手回答。

Well, I think it's fair to say the consensus is on the left. Interesting.

哇，很显然大家一致 选择了左边的门。有意思。

OK. Now instead of being in a wheelchair, you're using a walking frame,

现在假设你不坐轮椅， 而需使用助行器，

so you can walk,

你能走，

but you need to have both of your hands on the frame.

但是你的双手都得 放在助行器上。

Which set of doors do you think you would be likely to use now?

这种情况你会选择哪种门？

Could you raise your hands if you're able to?

如果可以的话，请举起你的手。

I'm really surprised. Everyone's going left.

我惊了。大家都选了左边的。

OK. Right.

好的。

Now you're pushing a child in a pushchair so you can walk quite normally,

假设你推着婴儿车，孩子坐在车里， 你能正常地走路，

but you've got a pushchair and both of your hands on it.

但是你推着婴儿车， 而且两只手都得放在车上。

Which set of doors now?

选哪种门呢？

Left or right?

左边还是右边？

I'm staggered.

我惊呆了。

OK. Final example.

好。最后一个例子。

Let's assume that you've actually gone in through the doors on the right.

假设你通过右侧的门走进了楼。

You're coming out, you want to come out the building,

然后你要出来， 你要从楼里出来，

but you've actually got boxes of files under both arms.

但是你手臂下夹着几箱文件。

Which of the doors would you go then?

那你会选哪种门呢？

Yeah. Hmm.

嗯……

I'm really staggered.

我震惊了。

In pretty much every example

几乎每个例子，

pretty much everybody raised your left hand.

几乎每个人 都举起了你们的左手。

Why was this?

为什么呢？

After all, you’re free to choose which door to use at each time.

其实你每次选哪种门都行。

Why would so many people go for an automatic door?

那为什么这么多人都要选自动门呢？

Maybe because it's easier.

也许是因为比较容易。

Nobody's forcing you to use it.

没人逼你用它。

It's there as an alternative to the other doors.

它只是作为另一种门的替代品。

Accessible web design is exactly the same,

可访问的网页设计也是如此，

offering people with different needs

给予有不同需求的人群

alternative ways of using a website to get the same information.

通过网页获取相同信息的不同方式。

Most countries around the world have anti-discrimination laws,

世界上的大多数国家 都制定了反歧视法，

and websites fall under these laws.

网站也在这些法律的管辖范围内。

However, for me, it's not about complying with the law.

但是对我来说， 重点不在于遵守法律。

It is about becoming more inclusive, more welcoming to everyone,

而在于更包容， 更欢迎每个人，

regardless of their ability or their disability.

无论他们健全与否。

Disabled people have money to spend on your goods and services

残障人士有钱 购买你的商品和服务，

and if they can't spend it with you,

如果他们没法花在你家，

they're going to spend it with somebody else.

也能花在别家。

So what should you do with regard to your own website?

那么你该如何处理你自己的网页呢？

Well, you need to have two things.

你需要做两件事。

You need to have an audit of your website,

你需要对你的网站进行一次审查，

and then you need to put

还得把可访问性声明 放在你的网页上。

an accessibility statement on your website.

I'll explain what I mean in this photograph.

我来解释一下 这张照片是什么意思。

This hotel, it's a beautiful building.

这家酒店是一座美丽的建筑。

There’s downstairs seating. There’s upstairs seating.

楼下有座，楼上也有座。

There's beautiful staircases everywhere, but unfortunately, there isn't a lift.

到处都是漂亮的楼梯， 但是不巧的是没有电梯。

The restaurant itself is run by an outside catering company.

餐厅由外包餐饮公司运营。

It's not their fault there's no lift.

没有电梯不是餐饮公司的问题。

It's not their building, they're just renting the space.

也不是建筑的问题， 因为地产商只是在出租这个空间。

However, if you're in a wheelchair, you can't use the upstairs seating.

然而，如果你坐着轮椅， 你就无法坐楼上的坐席。

But if there was a sign near the entrance saying something like,

但是如果入口附近有这么一个告示：

"Patrons in wheelchairs, please note that although we've got upstairs seating,

“使用轮椅的顾客，请留意 虽然我们有楼上雅座，

we do not have a lift.

但我们没有配备电梯。

However, we do have some reserved seating for you

但是，我们为您预留了

with extra turning space and raised tables."

有额外转向空间和 加高餐桌的坐席。”

Think about raised tables.

想象一下加高餐桌。

If you're in a wheelchair and you try to go into a restaurant anywhere,

如果你坐着轮椅 进入任何一家餐馆，

you can't quite get under the table.

餐桌底下的空间一般 都放不下一把轮椅。

Easily fixed, just put them on some small wooden blocks.

解决方法很简单，只要在 桌子底下垫几个小木块就行了。

Anyway, if you just put up that sign,

如果你贴上这张告示，

somebody in a wheelchair who reads that sign,

坐着轮椅的人看到了告示，

are they going to feel more or less included?

他们是不是或多或少 会感到被人接纳了呢？

The cost of doing this is almost nothing, but the effect is huge.

这么做的成本几乎为零， 但是效果显著。

It's not the catering companies fault there's no lift.

没有电梯不是餐饮公司的错。

They've just gone out of their way to offer an alternative

他们只是特意提供了一个选项，

despite the limitations of the hotel.

就算酒店本身有一些限制。

In other words, the catering company themselves

换句话说，餐饮公司自身变得

have become more welcoming, inclusive and accessible.

更加热情友好、兼容并包， 也让人更容易到访。

So the first part of this story

我在故事的第一部分

where I explained the restaurant has upstairs seating, but no lift.

描述了一个有上层坐席 但没有电梯的餐厅。

That could be seen as an audit.

审查可能会记录以下内容。

"We realize there's no lift to the upstairs seating

“我们发现并没有 通往楼上坐席的电梯，

so disabled people in wheelchairs cannot use it."

所以乘坐轮椅的残障人士 无法使用楼上坐席。”

But the sign at the entrance telling everyone

但是入口的告示告诉大家

that there is accessible seating downstairs as an alternative

楼下设置了无障碍坐席 供顾客选择，

is like their accessibility statement.

这张告示就类似于 一份无障碍声明。

"We've discovered that wheelchair users cannot use the upstairs seating.

“我们发现轮椅人士 无法使用楼上坐席。

This is what we've done instead."

于是我们采取了这些措施。”

So how does all this apply to a website?

这又该如何应用到网页上呢？

Well, as far as the audit goes,

如果要做审查，

you can either pay somebody or you can do it yourself.

你可以花钱请别人做 也可以自己做。

And the same goes for an accessibility statement.

无障碍声明也是如此。

Sadly, I don’t have time to go into the details

虽然我没时间展开详细讲一讲，

but I do want to say one thing.

但是我想说一点。

Make your accessibility statement real.

你的无障碍声明得是真的。

What do I mean by this? Simple.

什么意思？很简单。

I see website after website with an accessibility statement

我看到过无数个网站 有这样的无障碍声明，

that begins with a slightly pompous tone, and it says something like,

开头口吻略带浮夸， 写着如下内容：

"We fully care about people with disabilities.

“我们深切关心残障人士。

We want to ensure that everyone is able to fully utilize our website.

我们希望每个人都能 充分利用我们的网站。

It meets the following standards, blah, blah, blah."

网站遵守以下规范云云。”

I don't actually really care what you say.

我对你说的根本没有任何兴趣。

If somebody can't use your website, they can't use your website.

如果有人没法使用你的网站， 他们就是无法使用你的网站。

I've got an idea.

我有个主意。

Why not instead use this as a wonderful opportunity

我们何不利用这个好机会

to reach out to disabled people?

向残障人士抛出橄榄枝呢？

The first line of your accessibility statement

你的无障碍声明 第一行可以这么写：

could be something like,

“We’re aware that there’s some problems with our website

“我们知道本网站存在一些问题，

that might make the experience

可能会对残障访客的体验造成影响。

more difficult for visitors with disabilities.

But if there’s anything that we can do to help you, give us a call.”

但是，如果有任何我们可以 为您提供帮助的地方，请联系我们。”

There's the phone number right there.

然后写上电话号码。

“Follow this link to send an email.” There’s the link right there.

“点击这个链接，电邮联系我们。” 放上一个链接。

“Or fill in the contact form.”

“或填写联络表。”

Right there you're reaching out to them.

你可以借此 主动向他们伸出援手。

Just by doing that, you're being inclusive.

你只需要这么做就能更包容。

You're going the extra mile

你付出了更多的努力，

and it speaks volumes about your ethos as a company.

也能彰显你公司的美德。

By the way, if you do have accessibility issues with your website,

顺带一提，如果你的网站 确实有可访问性问题，

you should give a time frame in which you're going to get them fixed

你就该设定一个期限， 什么时候可以解决这个问题，

or at least explain that it’s not possible on grounds of cost.

或者至少得出一个结论 说明由于成本无法解决这个问题。

It isn't about being perfect. It's about being honest.

我没有让你做到完美， 而是做到诚实。

OK, I'd like to finish by telling you all about a very simple test

作为结尾，我想向你们介绍 一个非常简单的测试，

that you can do on any website

适用于各种网站，

to find out if it has a basic level of accessibility.

检测它是否达到了 基本的可访问性。

Anyone can do it.

每个人都能试一试。

And I call it the Tab Test.

我称之为“Tab 键测试”。

If you're on a website, there will usually be

打开一个网页， 页面顶部通常会有

a row of page navigation buttons along the top.

一排页面导航键。

As you move your mouse over them,

如果鼠标扫过这一排导航键，

they will light up in turn

它们就会依次亮起，

and any subpages will appear as a kind of drop-down.

子页面会出现在下拉菜单中。

And they may also light up as you move the mouse over.

如果鼠标扫过这些键， 它们也会亮起来。

In other words, just by moving your mouse,

也就是说， 你只需要动动你的鼠标，

you can go to pretty much any page on the website with a single click.

就能单击去向网站里的任何网页。

Do we all understand that?

大家都懂这个意思吗？

Brilliant.

很好。

If you're blind, as I've said, you can't use a mouse.

如果如我所说，你是一个 失明人士，无法使用鼠标，

Instead, you use a screen reader and a keyboard.

而是使用屏幕阅读器和键盘。

If a website has a basic level of accessibility,

如果这个网站达到了 基本的可访问性，

you should be able to select every page and subpage

你就该具备选择 任何页面和子页面的能力，

by repeatedly pressing the Tab key.

只要你不停地按 Tab 键就行。

Not only that, each one should light up in turn,

不仅是能够选择， 每个按钮也该逐个亮起，

just as if you were using a mouse.

就和使用鼠标一样。

Not everyone who is visually impaired is completely blind.

不是每个视障人士都是 完全失明的。

In fact, most of them have some form of limited vision instead.

其实很多视障人士都只是 有某种形式的视觉限制而已。

So having page navigation light up as you move,

所以使用 Tab 键移动选项时 页面导航亮起，

as you Tab through them,

helps them know where they are.

可以让他们知道 选中了哪个位置。

So next time anybody here is on a website, just start pressing the Tab key.

大家下次上网的时候， 试试按下 Tab 键吧。

If you do not see all the pages and all the subpages light up in turn,

如果你没看到每个页面 和子页面依次亮起，

it's failed the test.

那就是测试不合格。

Please drop them an email informing them that because their website

请给他们发一个邮件， 告诉他们这个情况，因为他们的网站

does not meet that basic level of accessibility,

没有达到基本的可访问性，

it's failed this test and they really need to do something about it.

没有通过测试， 他们真的该处理一下。

They want to know more, they can do a quick internet search

他们想了解更多的信息的话， 只要动手上网搜一搜，

and actually it's fairly easy to fix.

其实解决起来真的很简单。

If you guys joined with me in doing this one simple thing,

如果各位可以加入我 就做这么一件小事，

we all will truly be changing the world, one website at a time.

我们真的可以通过一个个网站 改变世界。

Thank you very much.

谢谢。

(Applause)

（掌声）