Issue #102  (Screen Reader Settings)04/03/24

Advertisement
Techpresso: Get Smarter About AI and Tech in 5 mins

Receive a daily summary of the most important AI and Tech news, carefully selected from 60+ media outlets.

Techpresso

Also includes a good dose of tech tools and programming-related apps and resources. Join 30,000+ professionals from OpenAI, Meta, Google, Microsoft, Hugging Face, JP Morgan, and more.


If you require the use of a screen reader when using VS Code, it's good to know that there are a number of accessibility features built into the editor and its UI, besides anything that's common to your operating system.

For example, you can search for the words "screen reader" in your settings and you'll see a few options listed specifically for screen reader users.

The first setting that appears, enabled by default, is whether a screen reader should announce inline suggestions.
 
Inline Suggestions for Screen Readers in VS Code

That, of course, won't have any effect on users that don't have a screen reader enabled.

Another one that's interesting is the "Accessibility Page Size" setting. This controls the number of lines that will be read out by a screen reader at once. You'll notice that this is defaulted to 10. But, as the description points out, this will change to 500 if a screen reader is detected.
 
Accessibility Page Size in VS Code

There's also a warning about performance problems if you set this to higher than the default.

There's also an option to optimize the UI for use with a screen reader, which is the default, but if you want you can turn this off. I don't see why you'd turn this off, though I suppose if you have some kind of custom setup that doesn't require VS Code's built in features, then maybe that would be a reason.
 
Accessibility Support in VS Code

And the last one that currently shows up when searching for "screen reader" is to enable whether to read out inline completions shown (this one is off by default).

If you don't need a screen reader but are curious what the experience is like in VS Code when one is enabled, you can try your OS's default screen reader. On Windows you can search for "Narrator" and on Mac you can enable VoiceOver. There's also the free NVDA screen reader for Windows.

When any of these tools are enabled, you'll see the following message appear in VS Code:
 
Optimizing for Screen Reader Use in VS Code

If you click "Yes", you'll then see a message in your status bar indicating that you're now running VS Code in a mode that's optimized for screen reader use. You can click that part of the task bar to disable this.

Now on to this week's hand-picked links!
 

VS Code Tools

Next.js File Generator — A VS Code extension designed to accelerate the development of Next.js apps by automating creation of common file types, such as pages, layouts, templates, errors, not-found, route, etc.

Bracket Select — A simple VS Code extension that adds support for quickly selecting text between matched brackets, with support for parentheses, curly braces, square brackets, and single/double quotes.

Meco — Free your newsletters from the inbox. Move your newsletters to a space built for reading and declutter your inbox in seconds.   Sponsor 

Data Wrangler — A code-centric data viewing and cleaning tool integrated into VS Code and Jupyter Notebooks. It provides a rich UI to view and analyze your data, show insightful column statistics and visualizations, and more.


VS Code Theme of the Week

Pitaya Smoothie — This is a dark theme with strong contrast for better accessibility that was apparently inspired by Pantone's 'colour of the year' in 2018 – Ultra Violet.

Pitaya Smoothie Theme for VS Code

It includes two themes, one with italics and one without. Lots of nice purples, pinks, etc., but the one aspect I don't like too much is the teal color choice for the menubar. But I suppose that's easy enough to change if necessary.

VS Code Articles & Videos

Create VS Code Extension with React, TypeScript, Tailwind — A ground-up approach to making an extension for VS Code with a particular technology stack.

Introducing the Data Wrangler Extension for Visual Studio Code — Accompanying article for one of the extensions mentioned above, described as "a revolutionary tool for data scientists and analysts who work with tabular data in Python."

📺 VS Code Tips — Paste as HTML — A neat tip for copying and pasting HTML content in VS Code.

The Morning Paper for Tech — Want a byte-sized version of Hacker News that takes just a few minutes to read? Try TLDR's free daily newsletter. It covers the most interesting tech, startup, and programming stories in just 5 minutes. No sports and no politics.  Sponsor 

Best of the Rest

Morioh — Includes some interactive playgrounds for front-end technologies along with some threads for 'social networking' for developers.

Difftastic — A CLI diff tool built in Rust that compares files based on their syntax, not line-by-line, for more accurate diffs that are easier for humans to read.

Top Gold IRAs — Safeguarding your retirement with a Gold IRA can help you shield your wealth from market shifts, economic uncertainty, and inflation. With gold’s value projected to increase in 2024, now is a good time to invest. See our list of Best Gold IRA companies to start planning a better retirement.  Sponsor 

Lazarus — A Delphi-compatible cross-platform IDE for rapid application development. It has variety of components ready for use and a graphical form designer to easily create complex graphical user interfaces.

Suggestions?

If you have any link suggestions, including a tool, article, or other resources related to VS Code or another IDE, send it via DM on X: @LouisLazaris or just hit reply on this email.

That's it for this issue.

Happy VS Coding!
Louis
VSCode.Email
@LouisLazaris
Copyright © VSCode.Email. All rights reserved.

Not affiliated with Microsoft, Visual Studio Code, or any of its trademarks.