Ramp for the site
Hi, Habr. I am Ivan Bakaidov. Today I want to share with you my report “Why I can not use your site?”. In this report, I talk about the problems of accessibility of the modern Web for people with special needs. I am sure that you did not think about this problem, although for some users this may be a decisive factor in the use of your resource. Even ordinary articles on Habré are poorly readable by screen readers, since no one specifies the description of the image in alt.
A short description of the content of the Video, as well as useful links on the topic, as well as excerpts from my posts about the battles with Yota and Sberbank will be presented under the cut.
In this report, I did not try to describe in detail the technical details of the question, but just wanted to draw attention to the urgency of the problem and, in general terms, to talk about possible difficulties for people with different limitations.
')
The first step is to designate an approximate audience. According to WHO, 10% of the world's population has health problems, of course, this does not mean that they all have difficulties in using websites, but the figure is impressive.
The following statistics, which I gave in my report, was the result of a survey on Habré (link to which I cannot find, heh, everything must be recorded, but nothing, we repeat? (-:), only 12 percent of developers think about accessibility, and its decision is only 2 percent. The question in the hall confirmed the ratio of these figures.
Now in Russia, more and more people with disabilities have the opportunity to integrate into modern society. A society that is based on the Internet. Accordingly, for a full life, you must have the opportunity to use it.
I am often asked a stupid question: “Why don't you make a separate social network for the disabled?”, This very idea closes the circle of communication between people within the non-thematic community. I raised this issue in my article in the UN voices of youth .
The basis of the report I took the posters of the British government, which cover six areas in the development of accessibility. Now I found, by the way, that they were translated into Russian. GitHub is a great power.
I started the report with my difficulties.
Dyslexia is a specific reading disorder. The cause of this disease is associated with neurological disorders of a genetic nature. A person suffering from dyslexia finds it difficult to master reading and writing skills. (googled)
A person with Dyslexia sees the text as follows.
You can help him to comfortably visit your site by adding infographics to the text, breaking the text into short paragraphs and using captcha-proven services like Google, since they figured out accessibility issues. For example, I am very comfortable reading the code and articles with code.
Because of these disorders, it may be difficult to use the Mouse. For example, I need to hold it with two hands to use it, and that is a great chance to introduce her to the floor or wall. Gain out touch pads. I also avoid GUIs: mkdir and our shortcuts are everything.
You can help me use your site by making large buttons (tie a label to the checkbox), making a drop-down menu on click, not just hovering, taking important buttons away and remembering that my friend comes to your site from a tablet she uses by foot.
And lay more time entering code from SMS. Do not have time, damn it!
It would seem that printed text is everywhere on the Internet, but there are situations where the impossibility of hearing the text by ear or voice confirmation is decisive in the availability of the service. A simple example, video recording of reports, lectures and other teaching materials without subtitles (Vadim Makeev, by the way, did not add subtitles to the video, although I drew attention to this during the report) or call back forms without the ability to write. Here I want to stop and tell a few stories from my life.
Text reader. Used by people with visual or dyslexic problems. Oriented to the markup of the page. Therefore, it is important to use the alt attribute for its intended purpose, it is necessary to describe what is depicted in the picture, and not just the “image”, as the authors, by the way, do on Habré (hello), since the screen reader will read it.
It is important to use html5 markup and get off the divitosis, since the utility program will find it easier to navigate through your page.
My father has a test for the direct hands of the coder: Ctrl + +. If the site does not spread out from scaling, then my father puts him a plus sign and can order, for example, an auto part on it.
Also important is the support of screenreaders and high contrast content.
I hope that my report motivates you to think more often about accessibility for sites and you dive into this topic. It is not as difficult as it seems. alt, alt, alt!
–- My site .
–- Project site .
A short description of the content of the Video, as well as useful links on the topic, as well as excerpts from my posts about the battles with Yota and Sberbank will be presented under the cut.
Video content:
In this report, I did not try to describe in detail the technical details of the question, but just wanted to draw attention to the urgency of the problem and, in general terms, to talk about possible difficulties for people with different limitations.
')
0. How much?
The first step is to designate an approximate audience. According to WHO, 10% of the world's population has health problems, of course, this does not mean that they all have difficulties in using websites, but the figure is impressive.
The following statistics, which I gave in my report, was the result of a survey on Habré (link to which I cannot find, heh, everything must be recorded, but nothing, we repeat? (-:), only 12 percent of developers think about accessibility, and its decision is only 2 percent. The question in the hall confirmed the ratio of these figures.
0.1. Is it relevant? Why do you need the Internet, where lie? You have your own available forums.
Now in Russia, more and more people with disabilities have the opportunity to integrate into modern society. A society that is based on the Internet. Accordingly, for a full life, you must have the opportunity to use it.
I am often asked a stupid question: “Why don't you make a separate social network for the disabled?”, This very idea closes the circle of communication between people within the non-thematic community. I raised this issue in my article in the UN voices of youth .
1. What?
The basis of the report I took the posters of the British government, which cover six areas in the development of accessibility. Now I found, by the way, that they were translated into Russian. GitHub is a great power.
I started the report with my difficulties.
1.1. Dyslexia
Dyslexia is a specific reading disorder. The cause of this disease is associated with neurological disorders of a genetic nature. A person suffering from dyslexia finds it difficult to master reading and writing skills. (googled)
A person with Dyslexia sees the text as follows.
You can help him to comfortably visit your site by adding infographics to the text, breaking the text into short paragraphs and using captcha-proven services like Google, since they figured out accessibility issues. For example, I am very comfortable reading the code and articles with code.
1.2. Physical and Motor Disorders
Because of these disorders, it may be difficult to use the Mouse. For example, I need to hold it with two hands to use it, and that is a great chance to introduce her to the floor or wall. Gain out touch pads. I also avoid GUIs: mkdir and our shortcuts are everything.
You can help me use your site by making large buttons (tie a label to the checkbox), making a drop-down menu on click, not just hovering, taking important buttons away and remembering that my friend comes to your site from a tablet she uses by foot.
And lay more time entering code from SMS. Do not have time, damn it!
1.3. Hearing and / or speech impairment
It would seem that printed text is everywhere on the Internet, but there are situations where the impossibility of hearing the text by ear or voice confirmation is decisive in the availability of the service. A simple example, video recording of reports, lectures and other teaching materials without subtitles (Vadim Makeev, by the way, did not add subtitles to the video, although I drew attention to this during the report) or call back forms without the ability to write. Here I want to stop and tell a few stories from my life.
How I bought the router Yota.
Fast.
We have worked with Yota!
Prehistory
I decided to order the Yota router as a New Year's gift. This company is the only one in the market that provides unlimited mobile Internet, I use it in a tablet, but unfortunately, Yota does not allow distributing internet via wifi from a tablet to a computer, even for money. Guys, common, dragging a router along is not cool, but these are details. In general, I decided that it was important for me to be able to go somewhere to the sea and be a patent to respond conveniently to working emails, log in to the server via ssh, or even be engaged on Skype with school teachers or tutors. In a great time we live the same!
I chose the right device on the site, placed the order on Yota’s own phone number, and saw the inscription: “Your order number is 01091939, we will call you to clarify the details of the delivery”. I open the Yota application, I write to the support chat that it is impossible for me to call, whether it is possible to discuss delivery in any of the chats or via SMS. They answer that they don’t, go to the sales center, they’ll sell you everything, and they can communicate in sign language! Although I know only one gesture and guess what.
Okay, I decided to write their posts on Facebook in the messages, since it is more convenient to write on a laptop. To do this, actually buy a router.
Support on FB offered me two more options, either to arrange delivery to the number of the speaking person, or by proxy to buy a router in the sales center. Then I posted all the correspondence on Facebook, calling this IT company Sberbank. Yota offended, decided nevertheless to try such a complex and dangerous thing as a correspondence with the client with text messages. In personal messages, they requested my number, which was originally in the application.
Story.
Today at 9:15 am SMS came from a private number with a request to send a convenient delivery time and address. I smashed my eyes at 10:34 and passed all the information on the means of the short message service. I was warned to prepare 2900 Russian rubles and a passport. Having finished the morning need in the bathroom with the door open for Jim Morrison’s story about the murderer who got up at dawn and did not find breakfast, I checked the availability and started looking for a passport, because a real man never knows where his passport is. Mom at this time was at the doctor, and then in the hypermarket. This is what I tell the reader about why I try to do everything on my own.
At 11:31, an enemy sms came clearly with the text: “I am equipped with equipment at the entrance”. I did not find a passport and ran to wear shoes. Going down the stairs, I listened to the arguments of a neighbor who went out to walk the eternal puppy Lyolik, that I was not dressed enough. Having escaped from the offender, I opened the door and found ... No one! Having deftly deftted, I went in the opposite direction, writing a funny thing: “You are not there”, but on the second flight the courier caught up with me. It was a woman of retirement age, who rose with me to the second. After that, I opened the door and let it go ahead, for it is very important in my position to show that you are smart. I immediately went to my room, took out a metal box from a New Year's gift, by the way, it turned out not long ago that one of the oldest friends kept money in exactly the same way, I laughed for a long time ... Oh yes, I took out three rubles, gave them to the courier She confusedly found a piece of paper and wrote “Passport”. My aunt clearly did not understand what I was hearing. I expressly retired to the room to shuffle the papers, went to another head, expressing my whole desire to find the ill-fated document, while having a bright idea to show the passport on the laptop screen, because a real man knows that he has done it, and keeps copies of documents on the computer next to photos of the girl. An employee of the yota arranged an electronic version of my document and she began to fill in forms.
Then Mom entered the apartment, greeted her and asked if everything was all right. The courier replied: "Yes, yes, everything is in order, we are finishing the paperwork, well, then I will explain everything to you, and you will translate." To which my mother answered in surprise: "He hears everything." We listened to the alternate speech about the guarantee, talked a little about my turbulent, and about the seals, my mother put the signature and the courier left.
We have worked with Yota!
Prehistory
I decided to order the Yota router as a New Year's gift. This company is the only one in the market that provides unlimited mobile Internet, I use it in a tablet, but unfortunately, Yota does not allow distributing internet via wifi from a tablet to a computer, even for money. Guys, common, dragging a router along is not cool, but these are details. In general, I decided that it was important for me to be able to go somewhere to the sea and be a patent to respond conveniently to working emails, log in to the server via ssh, or even be engaged on Skype with school teachers or tutors. In a great time we live the same!
I chose the right device on the site, placed the order on Yota’s own phone number, and saw the inscription: “Your order number is 01091939, we will call you to clarify the details of the delivery”. I open the Yota application, I write to the support chat that it is impossible for me to call, whether it is possible to discuss delivery in any of the chats or via SMS. They answer that they don’t, go to the sales center, they’ll sell you everything, and they can communicate in sign language! Although I know only one gesture and guess what.
Okay, I decided to write their posts on Facebook in the messages, since it is more convenient to write on a laptop. To do this, actually buy a router.
Support on FB offered me two more options, either to arrange delivery to the number of the speaking person, or by proxy to buy a router in the sales center. Then I posted all the correspondence on Facebook, calling this IT company Sberbank. Yota offended, decided nevertheless to try such a complex and dangerous thing as a correspondence with the client with text messages. In personal messages, they requested my number, which was originally in the application.
Story.
Today at 9:15 am SMS came from a private number with a request to send a convenient delivery time and address. I smashed my eyes at 10:34 and passed all the information on the means of the short message service. I was warned to prepare 2900 Russian rubles and a passport. Having finished the morning need in the bathroom with the door open for Jim Morrison’s story about the murderer who got up at dawn and did not find breakfast, I checked the availability and started looking for a passport, because a real man never knows where his passport is. Mom at this time was at the doctor, and then in the hypermarket. This is what I tell the reader about why I try to do everything on my own.
At 11:31, an enemy sms came clearly with the text: “I am equipped with equipment at the entrance”. I did not find a passport and ran to wear shoes. Going down the stairs, I listened to the arguments of a neighbor who went out to walk the eternal puppy Lyolik, that I was not dressed enough. Having escaped from the offender, I opened the door and found ... No one! Having deftly deftted, I went in the opposite direction, writing a funny thing: “You are not there”, but on the second flight the courier caught up with me. It was a woman of retirement age, who rose with me to the second. After that, I opened the door and let it go ahead, for it is very important in my position to show that you are smart. I immediately went to my room, took out a metal box from a New Year's gift, by the way, it turned out not long ago that one of the oldest friends kept money in exactly the same way, I laughed for a long time ... Oh yes, I took out three rubles, gave them to the courier She confusedly found a piece of paper and wrote “Passport”. My aunt clearly did not understand what I was hearing. I expressly retired to the room to shuffle the papers, went to another head, expressing my whole desire to find the ill-fated document, while having a bright idea to show the passport on the laptop screen, because a real man knows that he has done it, and keeps copies of documents on the computer next to photos of the girl. An employee of the yota arranged an electronic version of my document and she began to fill in forms.
Then Mom entered the apartment, greeted her and asked if everything was all right. The courier replied: "Yes, yes, everything is in order, we are finishing the paperwork, well, then I will explain everything to you, and you will translate." To which my mother answered in surprise: "He hears everything." We listened to the alternate speech about the guarantee, talked a little about my turbulent, and about the seals, my mother put the signature and the courier left.
How to reissue a Sberbank card.
Fast.
I have two cards open in Sberbank, openly not entirely legal, since they were drawn up without a power of attorney - I just put a cross instead of a signature.
Due to the fact that Sberbank is a monopolist in the field of social cards for pensions, they go "towards" people with special features and open cards without a signature and without a power of attorney. Not always, not everyone, but lucky. Having opened the card in Roketbank (also a “cross”), I decided to transfer money from Sberbank to Rocket, since Rocket has chat support and 7.5% for the rest. I found a limit on the transfer operation of 30 thousand, said: “Well, okay, finally, I will enter the code from the SMS and say goodbye”. It was not there, after the second tranche Sberbank requested a call to confirm identity. I, as you know, do not speak, wrote an angry post on FB, in the comments “Sberbank” asked to write to e-mail. The bank asked me for a list of ten items: from the card number and code word to the passport and disability certificate. After I sent everything, Sberbank took five days to make a decision on my question.
In the meantime, I decided to transfer money from my second “pension card”, because, for obvious reasons, I want to keep my savings on a card with a percentage on the balance. If anyone does not know the percentage on the balance, this is a monthly payment for keeping money in the bank. A kind of contribution, the money of which you can freely dispose of. I started the transfer again, the communication failed, the SMS arrived late, and I made a mistake in entering one code from the SMS. A minute later came SMS, that my card will be checked for fraud, and ten minutes later it was reported that it was blocked.
Then my mother and I ran in a wheelchair to the bank, as we had to receive money on the account of this card for a trip to international competitions. Money for the whole team. In Sberbank, we were accepted, told that the system is blocking the card and they cannot explain why it was blocked, but the situation can be corrected only by reissuing the card. We ordered reissue, did not have to sign, I confirmed the operation with another card (working). Everything is polite, but very stupid.
Today I received an SMS on my tablet that the card is ready and I can pick it up at the Sberbank branch. My mother and I decided to do this: I’ll drive up to the unit on the trike, and she will do it only to guard my transport on the street. So did. At the bank, I was met by familiar counselors, read my paper note about the fact that I came to pick up the card. A paper note is an ancient means of communication, but when your hands are busy, it has no equal. I was taken to the table without a queue, a very frightened consultant met me there, checked my passport and sent an assistant for a card.
Everything seemed to be going well, but only to the question “Where is your guardian?” (Still an insult to the individual, I tell you). I replied that I did not have a guardian, finding it a pity that DisType does not have the function of emotional speech synthesis. After running around the bank, I was asked a question about the location of my mother, with whom I had come the last time. To this saying, I replied that I have no power of attorney issued to my mother, and added that I am 18 years old. Did not help.
Having surrendered to the power of the caught psycho, I gave the coordinates of the location of the mother. With a bicycle they set a consultant to stand, the mother was led to investigate. With the help of the mother, the question was solved in the following way: they asked for her passport, which she did not refuse, then the human factor was turned on and they accepted her signature without a passport. Accordingly, anyone could sign for me, but my cross didn’t suit you instead of a signature?
Imagine the reverse situation, I come to you and ask where your guardian is. And I do not care that you are all right with the psyche.
I have two cards open in Sberbank, openly not entirely legal, since they were drawn up without a power of attorney - I just put a cross instead of a signature.
Due to the fact that Sberbank is a monopolist in the field of social cards for pensions, they go "towards" people with special features and open cards without a signature and without a power of attorney. Not always, not everyone, but lucky. Having opened the card in Roketbank (also a “cross”), I decided to transfer money from Sberbank to Rocket, since Rocket has chat support and 7.5% for the rest. I found a limit on the transfer operation of 30 thousand, said: “Well, okay, finally, I will enter the code from the SMS and say goodbye”. It was not there, after the second tranche Sberbank requested a call to confirm identity. I, as you know, do not speak, wrote an angry post on FB, in the comments “Sberbank” asked to write to e-mail. The bank asked me for a list of ten items: from the card number and code word to the passport and disability certificate. After I sent everything, Sberbank took five days to make a decision on my question.
In the meantime, I decided to transfer money from my second “pension card”, because, for obvious reasons, I want to keep my savings on a card with a percentage on the balance. If anyone does not know the percentage on the balance, this is a monthly payment for keeping money in the bank. A kind of contribution, the money of which you can freely dispose of. I started the transfer again, the communication failed, the SMS arrived late, and I made a mistake in entering one code from the SMS. A minute later came SMS, that my card will be checked for fraud, and ten minutes later it was reported that it was blocked.
Then my mother and I ran in a wheelchair to the bank, as we had to receive money on the account of this card for a trip to international competitions. Money for the whole team. In Sberbank, we were accepted, told that the system is blocking the card and they cannot explain why it was blocked, but the situation can be corrected only by reissuing the card. We ordered reissue, did not have to sign, I confirmed the operation with another card (working). Everything is polite, but very stupid.
Today I received an SMS on my tablet that the card is ready and I can pick it up at the Sberbank branch. My mother and I decided to do this: I’ll drive up to the unit on the trike, and she will do it only to guard my transport on the street. So did. At the bank, I was met by familiar counselors, read my paper note about the fact that I came to pick up the card. A paper note is an ancient means of communication, but when your hands are busy, it has no equal. I was taken to the table without a queue, a very frightened consultant met me there, checked my passport and sent an assistant for a card.
Everything seemed to be going well, but only to the question “Where is your guardian?” (Still an insult to the individual, I tell you). I replied that I did not have a guardian, finding it a pity that DisType does not have the function of emotional speech synthesis. After running around the bank, I was asked a question about the location of my mother, with whom I had come the last time. To this saying, I replied that I have no power of attorney issued to my mother, and added that I am 18 years old. Did not help.
Having surrendered to the power of the caught psycho, I gave the coordinates of the location of the mother. With a bicycle they set a consultant to stand, the mother was led to investigate. With the help of the mother, the question was solved in the following way: they asked for her passport, which she did not refuse, then the human factor was turned on and they accepted her signature without a passport. Accordingly, anyone could sign for me, but my cross didn’t suit you instead of a signature?
Imagine the reverse situation, I come to you and ask where your guardian is. And I do not care that you are all right with the psyche.
1.4. Screenreaders
Text reader. Used by people with visual or dyslexic problems. Oriented to the markup of the page. Therefore, it is important to use the alt attribute for its intended purpose, it is necessary to describe what is depicted in the picture, and not just the “image”, as the authors, by the way, do on Habré (hello), since the screen reader will read it.
It is important to use html5 markup and get off the divitosis, since the utility program will find it easier to navigate through your page.
1.5. Visually impaired
My father has a test for the direct hands of the coder: Ctrl + +. If the site does not spread out from scaling, then my father puts him a plus sign and can order, for example, an auto part on it.
Also important is the support of screenreaders and high contrast content.
1.6. Autism
Conclusion
I hope that my report motivates you to think more often about accessibility for sites and you dive into this topic. It is not as difficult as it seems. alt, alt, alt!
2. References
- Very cool and detailed article "Inaccessible web: how we lit such a mess . "
- Checklist for developers "State site accessible to people with disabilities . "
- An article on the medium "Inclusive design" .
- Plugin for testing sites aXe .
- Links from comments:
- Tbutnyakov : Plugin for simulating features of Funkify .
–- My site .
–- Project site .
Source: https://habr.com/ru/post/346238/
All Articles