-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
392 lines (344 loc) · 23.6 KB
/
index.html
File metadata and controls
392 lines (344 loc) · 23.6 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Programação Acessível: Aprendendo Python com VSCode para pessoas cegas</title>
<style>
ol {
counter-reset: section;
list-style-type: none;
}
ol > li {
counter-increment: section;
}
ol > li > ol {
counter-reset: subsection;
}
ol > li > ol > li {
counter-increment: subsection;
}
ol > li > ol > li > ol {
counter-reset: subsubsection;
}
ol > li > ol > li > ol > li {
counter-increment: subsubsection;
}
ol > li > ol > li > ol > li > ol {
counter-reset: subsubsubsection;
}
ol > li > ol > li > ol > li > ol > li {
counter-increment: subsubsubsection;
}
ol > li::before {
content: counter(section) ". ";
}
ol > li > ol > li::before {
content: counter(section) "." counter(subsection) " ";
}
ol > li > ol > li > ol > li::before {
content: counter(section) "." counter(subsection) "." counter(subsubsection) " ";
}
ol > li > ol > li > ol > li > ol > li::before {
content: counter(section) "." counter(subsection) "." counter(subsubsection) "." counter(subsubsubsection) " "; /
}
</style>
</head>
<body>
<header>
<h1>Programação Acessível: Aprendendo Python com VSCode para pessoas cegas</h1>
<nav>
<h2>Índice</h2>
<ol>
<li><a href="#ferramentas-utilizadas">Ferramentas utilizadas nesse tutorial</a></li>
<li>
<a href="#tutoriais-acessiveis">Tutoriais Acessíveis</a>
<ol>
<li>
<a href="#traduzir-conteudo">Como traduzir o conteúdo em outros idiomas</a>
<ol>
<li>
<a href="#traduzir-por-pagina">Traduzir por página</a>
<ol>
<li><a href="#sem-conta-google-logada">Sem conta da Google logada</a></li>
<li><a href="#com-conta-google-logada">Com conta da Google logada</a></li>
</ol>
</li>
<li><a href="#traduzir-todas-paginas">Traduzir todas as páginas automaticamente</a></li>
</ol>
</li>
<li><a href="#w3schools">W3Schools</a></li>
<li><a href="#python-org">Python.org</a></li>
</ol>
</li>
<li>
<a href="#vscode">VSCode</a>
<ol>
<li><a href="#extensoes">Extensões</a></li>
<li><a href="#extensoes-python">Extensões para programar em Python</a></li>
<li><a href="#configuracao-acessibilidade">Configurações de acessibilidade</a></li>
<li><a href="#dicas-desenvolvimento">Dicas para auxiliar o desenvolvimento</a></li>
</ol>
</li>
<li>
<a href="#comunidades">Comunidades para programadores cegos</a>
<ol>
<li>
<a href="#reddit">Reddit</a>
<ol>
<li><a href="#rblind">r/Blind</a></li>
<li><a href="#rprogramming">r/learnprogramming</a></li>
</ol>
</li>
<li><a href="#freecodecamp">Freecodecamp</a></li>
</ol>
</li>
</ol>
</nav>
</header>
<main>
<article>
<h1>Aprendendo Python com VSCode para pessoas cegas.</h1>
<section>
<h2 id="ferramentas-utilizadas">Ferramentas utilizadas nesse tutorial</h2>
<p>Esse tutorial foi testado utilizando as ferramentas abaixo:</p>
<ul>
<li>Leitor de Tela: NVDA;</li>
<li>Editor de Texto: VSCode;</li>
<li>Navegador: Chrome.</li>
</ul>
<h2 id="tutoriais-acessiveis">Tutoriais Acessíveis</h2>
<p>
Para conseguir aprender Python tendo algum tipo de deficiência visual, é necessário ter acesso a plataformas que foram projetadas para serem acessíveis.
Nesse tutorial, vamos apresentar algumas plataformas que são acessíveis e que podem ser utilizadas para aprender Python.
</p>
<h3 id="traduzir-conteudo">Como traduzir o conteúdo em outros idiomas</h3>
<p>
A maioria dos tutoriais de programação são feitos em inglês, por isso, é necessário ter conhecimento do idioma ou traduzir a página para o português.
Listamos algumas maneiras de traduzir o conteúdo da página caso seja em inglês. Esse é um passo muito importante, pois sem o domínio da lingua ou uma
tradução, não será possível acompanhar o conteúdo desse tutorial e de outros da área de computação.
</p>
<h4 id="traduzir-por-pagina">Traduzir por página</h4>
<p>
É possível traduzir o conteúdo por página, porém esse método não é tão consistente pois vários fatores podem afetar a disposição do menu de tradução, e a
funcionalidade não é tão acessível.
</p>
<h5 id="sem-conta-google-logada">Sem conta da Google logada</h5>
<ol>
<li>Clique com o botão direito do mouse em qualquer local da página e pressione a tecla 'T', essa ação irá traduzir o conteúdo da página.</li>
<li>
Caso a página não seja traduzida é necessário clicar em algum outro local da página e tentar novamente, pois essa ação não deve selecionar nenhum
controle de formulário.
</li>
</ol>
<h5 id="com-conta-google-logada">Com conta da Google logada</h5>
<ol>
<li>Com o navegador aberto, pressione a tecla ALT para selecionar a opção de "Personalizar o Google Chrome" e pressione "Enter".</li>
<li>Pressione a seta para baixo até encontrar a opção "Traduzir", então pressione "Enter".</li>
<li>A página então será traduzida para o idioma do sistema operacional.</li>
</ol>
<h4 id="traduzir-todas-paginas">Traduzir todas as páginas automaticamente</h4>
<p>
É possível traduzir todas as páginas que estão em outro idioma além do português através de configurações do Google Chrome. Esse método é recomendado pois é
mais consistente e acessível, porém é aplicado para todas as páginas automaticamente.
</p>
<p>Para que isso seja possível, siga o passo-a-passo abaixo:</p>
<ol>
<li>Com o navegador aberto, pressionar a tecla ALT para selecionar a opção de "Personalizar o Google Chrome" e pressione "Enter".</li>
<li>Pressione a seta para baixo até encontrar a opção "Definições", então pressione "Enter".</li>
<li>A tela já irá abrir com a barra de pesquisa selecionada, então digite "Tradutor".</li>
<li>Pressione "Tab" até encontrar a opção "Adicionar Idiomas" da opção "Traduza automaticamente estes idiomas", então pressione "Enter".</li>
<li>
Irá abrir um menu onde é possível selecionar todos os idiomas que o Chrome irá traduzir automaticamente o conteúdo. Digite "inglês" e pressione "Tab"
até encontrar a opção com checkbox do "Inglês - English", então pressione "Espaço" ou "Enter" para marcar o checkbox.
</li>
<li>Com o checkbox ativado, pressione "Tab" até a opção "Adicionar" então pressione "Enter"</li>
</ol>
<p>
A partir desse momento, toda página em que o idioma original for inglês, será traduzida automaticamente para o Portugues/Brasil. Você pode adicionar mais
idiomas seguindo o mesmo passo a passo anterior.
</p>
<h3 id="w3schools">W3Schools</h3>
<p>
O W3Schools é reconhecido como uma das plataformas mais acessíveis para aprendizado de <strong>programação em Python</strong> e
<strong>desenvolvimento Web</strong>. Este site tem sido amplamente recomendado em várias comunidades de programadores e desenvolvedores.
</p>
<p>
Para acessar os tutoriais de Python, visite o
<a href="https://www.w3schools.com/python/" target="_blank" rel="noopener noreferrer">W3Schools Python Tutorial</a>.
</p>
<p>O tutorial do W3Schools é dividido em capítulos, que começam desde o básico da linguagem, até os conceitos mais avançados.</p>
<p>
A plataforma possui algumas áreas de 'Exemplo' em que é possível visualizar um exemplo em código do que está sendo ensinado no documento. Além disso, nessa
parte de exemplos, possui um botão de “Experimente você mesmo”, para que você possa executar o código no próprio W3Schools. Essa ação abrirá uma nova aba, o
que pode dificultar o acompanhamento da tarefa, por isso, a preferência será de executar os códigos no próprio VSCode.
</p>
<h3 id="python-org">Python.org</h3>
<p>
O site oficial da linguagem Python também oferece um tutorial para iniciantes. O tutorial serve como uma fonte de referência para os programadores, contendo
exemplos de código e explicações detalhadas sobre os conceitos de programação.
</p>
<p>
Para acessar o tutorial de Python, visite o
<a href="https://docs.python.org/3/tutorial/" target="_blank" rel="noopener noreferrer">Python.org Tutorial</a>.
</p>
<p>É recomendado que seja usado após o aprendizado básico da linguagem, que pode ser obtido no W3Schools.</p>
<h2 id="vscode">VSCode</h2>
<p>
O VSCode é um editor de texto gratuito e de código aberto, desenvolvido pela Microsoft. Ele é um dos editores mais utilizados por programadores, devido a
sua grande quantidade de extensões e facilidade de uso.
</p>
<h3 id="extensoes">Extensões</h3>
<p>
Para instalar uma extensão, pressione as teclas “CTRL + SHIFT + X” para abrir a aba de extensões. Nessa aba, digite o nome da extensão que deseja instalar e
pressione “Enter” para buscar a extensão. Após encontrar a extensão desejada, pressione “Enter” para selecionar a extensão e pressione "Tab"
consecutivamente até encontrar o botão de "instalar", então pressione "Enter" para instalar. Após a instalação, a extensão vai aparecer na lista de
extensões instaladas.
</p>
<h3 id="extensoes-python">Extensões para programar em Python</h3>
<p>Abaixo segue uma lista de extensões que devem ser instaladas para que se possa ter uma boa experiencia de programação em Python no VSCode.</p>
<ul>
<li>Error Lens</li>
<li>Python</li>
</ul>
<h3 id="configuracao-acessibilidade">Configurações de acessibilidade.</h3>
<p>
O VSCode possui algumas configurações de acessibilidade que podem ser ativadas para facilitar o uso do editor. Para acessar as configurações de
acessibilidade, pressione as teclas “CTRL + SHIFT + P” e digite “Preferences: Open Settings (JSON)”. Isso vai abrir um arquivo JSON com as configurações do
VSCode. Para ativar as configurações de acessibilidade, adicione as seguintes linhas no arquivo JSON:
</p>
<pre>
<code>
{
"editor.accessibilitySupport": "on",
"errorLens.editorHoverPartsEnabled": {
"messageEnabled": true,
"sourceCodeEnabled": true,
"buttonsEnabled": true
},
"errorLens.messageTemplate": "$severity $message"
}
</code>
</pre>
<h3 id="dicas-desenvolvimento">Dicas para auxiliar o desenvolvimento</h3>
<p>
Com as extensões instaladas anteriormente, será possível conferir erros diretamente no editor de texto do VSCode, sem a necessidade de abrir o terminal.
Abaixo existe uma lista de atalhos e quando devem ser usados, além de outras dicas gerais:
</p>
<ul>
<li>
Quando o modo de leitor de tela está habilitado no VSCode, um feedback de audio é tocado quando existe um erro na linha selecionada. Para saber do que
se trata o erro, basta pressionar "CTRL + K + I", então a mensagem do erro será lida pelo leitor de tela. Essa mensagem pode ser um pouco extensa
dependendo do erro, mas é possível ter uma ideia do que está acontecendo.
</li>
<li>
Se o documento tem muitos erros ou voce deseja navegar entre eles de uma maneira mais fácil, é possível pressionar o atalho "CTRL + SHIFT + M", isso irá
abrir o menu de "Problemas" que possue uma lista de todos os erros e avisos de todos os arquivos abertos no VSCode. Para navegar entre os erros, basta
pressionar a seta para cima ou para baixo, isso irá selecionar o erro e o leitor de tela irá ler a mensagem do erro. O VSCode também irá te levar
automaticamente para o arquivo e linha do erro, sendo possível corrigir o erro diretamente no editor de texto.
</li>
<li>
Alguns erros, como de importação, podem ser corrigidos automaticamente pelo VSCode. Para isso, basta pressionar "CTRL + ." e o VSCode irá sugerir uma
correção para o erro. Caso a sugestão seja a correta, basta pressionar "Enter" para corrigir o erro.
</li>
<li>Para navegador para uma linha específica do código, basta pressionar "CTRL + G" e digitar o número da linha que deseja ir, então pressione "Enter".</li>
</ul>
<h2 id="comunidades">Comunidades para programadores cegos</h2>
<p>
Segundo o IBGE (Instituto Brasileiro de Geografia e Estatística), mais de 7 sete milhões de pessoas apresentam alguma deficiência visual no Brasil. Deste
total, cerca de 580 mil são completamente cegas e os demais apresentam baixa visão, seja por consequências congênitas ou adquiridas ao longo da vida.
</p>
<p>
Muitas destas pessoas, já trabalham na área de programação, ou têm o interesse em aprender e se desenvolver neste mercado. Cada um dos programadores cegos
tem sua maneira de lidar com a deficiência e, ao final do dia, conseguem entregar bons resultados. Muitos têm dificuldade de atingir este objetivo e, ter o
contato com outras pessoas com a mesma condição, sem dúvidas, contribui no desenvolvimento. Seja compartilhando dicas de softwares ou extensões que os
ajudam, configurações que facilitam a compreensão do código, ou locais onde buscar e compartilhar conteúdos acessíveis para continuar evoluindo na
profissão.
</p>
<p>
Dito isso, reunimos algumas comunidades que podem ser de interesse para este público. As comunidades são no idioma Inglês, pois não conseguimos encontrar
links para o idioma PT/BR, mas é possível acessar o fórum usando a funcionalidade de tradução do navegador. São elas:
</p>
<h3 id="reddit">Reddit</h3>
<h4 id="rblind">r/Blind</h4>
<p>
No reddit temos a comunidade <a href="https://www.reddit.com/r/Blind/" target="_blank" rel="noopener noreferrer">r/Blind</a> que é uma comunidade geral de
pessoas cegas e que não é focada em Programação, porém nessa comunidade várias pessoas compartilham suas experiências e como conseguem vencer alguns
obstáculos.
</p>
<p>
<a
href="https://www.reddit.com/r/Blind/comments/k0zvqj/im_a_blind_programmer_developer_ama/"
title="Post no reddit sobre programador cego e dicas."
target="_blank"
rel="noopener noreferrer"
>Aqui</a
>, é possível encontrar um tópico de um programador cego que fez um AMA(Ask me Anything), que é um tipo de post onde as pessoas podem fazer perguntas
relacionadas ao assunto, e é possível encontrar diversas dicas.
</p>
<h4 id="rprogramming">r/learnprogramming</h4>
<p>
Ainda no reddit, temos a <a href="https://www.reddit.com/r/learnprogramming/" target="_blank" rel="noopener noreferrer">r/learnprogramming</a> que é o maior
fórum online para aprendizado de programação. Embora seja um fórum geral, por ser muito ativo, temos várias pessoas que fazem perguntas sobre como programar
sendo deficiente visual.
</p>
<p>
<a
href="https://www.reddit.com/r/learnprogramming/comments/tujc31/can_a_blind_person_learn_programming/"
title="Post no reddit pedindo dicas para programar sendo cego."
target="_blank"
rel="noopener noreferrer"
>Aqui</a
>, temos um exemplo de post perguntando se é possível programar sendo cego, e várias respostas com dicas valiosas.
</p>
<p>
<a
href="https://www.reddit.com/r/learnprogramming/comments/gvasrk/blind_and_visually_impaired_programmers_how_do/"
title="Post no reddit com dicas para programar sendo cego."
target="_blank"
rel="noopener noreferrer"
>Aqui</a
>, outro link com diversas dicas.
</p>
<p>Nada impede de que você abra seu próprio tópico para fazer perguntas especializadas para seu caso.</p>
<h3 id="freecodecamp">Freecodecamp</h3>
<p>No Freecodecamp, que é uma das maiores plataformas de aprendizado de programação, é possível encontrar diversas dicas para pessoas cegas.</p>
<p>
Um exemplo é esse
<a
href="https://www.freecodecamp.org/news/a-vision-of-coding/"
title="Blog no freecodecamp com dicas para progrmar sendo cego."
target="_blank"
rel="noopener noreferrer"
>blog</a
>, que fala sobre um programador que é cego de nascença e sua experiência com programação.
</p>
</section>
</article>
</main>
<footer>
<h2>Sobre este trabalho</h2>
<p>Autores: Anderson Candido, André Pedrofeza, Gabriel Bonatto, Pedro Henrique.</p>
<p>Coordenador: Leonelo Dell Anhol Almeida</p>
<p xmlns:cc="http://creativecommons.org/ns#">
Esta obra está licenciada como
<a href="http://creativecommons.org/licenses/by-nc-sa/4.0/?ref=chooser-v1" target="_blank" rel="license noopener noreferrer" style="display: inline-block"
>CC BY-NC-SA 4.0<img
alt="Creative Commons License"
style="height: 22px !important; margin-left: 3px; vertical-align: text-bottom"
src="https://mirrors.creativecommons.org/presskit/icons/cc.svg?ref=chooser-v1"
alt="Creative Commons" /><img
style="height: 22px !important; margin-left: 3px; vertical-align: text-bottom"
src="https://mirrors.creativecommons.org/presskit/icons/by.svg?ref=chooser-v1"
alt="BY" /><img
style="height: 22px !important; margin-left: 3px; vertical-align: text-bottom"
src="https://mirrors.creativecommons.org/presskit/icons/nc.svg?ref=chooser-v1"
alt="CC" /><img
style="height: 22px !important; margin-left: 3px; vertical-align: text-bottom"
src="https://mirrors.creativecommons.org/presskit/icons/sa.svg?ref=chooser-v1"
alt="SA"
/></a>
</p>
</footer>
</body>
</html>