Tracking the Worst Sci-Fi Movies With Angular and Slash Grap...

Tracking the Worst Sci-Fi Movies With Angular and Slash Grap…

I originally discovered Mystery Science Theater 3000 (MST3K) by mistake.

In order to avoid missing a movie premiere on the HBO network, I set my VCR to record the program. However, when I started to watch the recording, I quickly realized I had recorded “Mystery Science Theater 3000: The Movie” instead of the HBO premiere production. After recognizing the images of Mike Nelson and the two robots from years of scanning channels, I decided to give my mistaken recording a try.

After five minutes of watching the critiqued version of “This Island Earth,” I knew I was hooked. I was already in tears from gut-busting laughter. These guys were comic geniuses.

For those who have no idea what I am talking about, MST3K was an American television comedy series that ultimately ran for 12 seasons. At the heart of the series is a lead character who gets captured by an evil villain and shot into space, then forced to watch really bad movies. Along the way, the main character builds a couple robots to keep him company while watching these bad films. Their silhouettes can be seen in the corner of the screen as the subpar movies unfold. Their quite-comical observations poke fun of the production and make the series a lot of fun to watch.

Since I was still interested in doing more with Slash GraphQL, I thought it would be really cool for us to create a modern-day MST3K wish list. You know, in case the series were to be picked up again. 

Selecting Dgraph’s Slash GraphQL

A graph database is an ideal solution when the source data handles recommendation and personalization needs. Such functional requirements often place the value of data relationships on the same level as the attributes which are being persisted. In this example, the use of ratings for a given movie title is just as important as the title attributes which will be analyzed and presented, making a graph database the preferred approach.

Since September, Dgraph has offered a fully managed backend service, called Slash GraphQL. Along with a hosted graph database instance, there is also a RESTful interface. This functionality, combined with 10,000 free credits for API use, allows us to rely fully on the Dgraph services. That way, we don’t have to introduce another layer of services between the graph database and web-based client. 

Our technology stack will be quite simple, but effective:

  • Dgraph Slash GraphQL to house the data
  • Dgraph Slash GraphQL to provide a GraphQL API for accessing the data
  • Angular CLI to create an application for presenting the data

With service/storage choice set on using Slash GraphQL, our next step is to figure out how to get data for the project.

Getting Data From IMDb

Internet Movie Database (IMDb) has been my primary source of film data for the better part of twenty years. In addition to the details of any movie, there is a crowd-sourced five-star rating system available for each title. At a glance, the consumer can see both the average rating and the number of votes used to reach the current score. These data points will be perfect for our new application.

For the modern-day MST3K wish list, we’ll use the following criteria to build our list of bad sci-fi movies for consideration:

  • genre must include “Sci-Fi”

  • limited to movie types (exclude shorts, made-for-TV movies, series, etc.)

  • excludes titles with fewer than 500 ratings

We will focus on the bottom 125 of movies ranked by

IMDb Datasets

IMDb Datasets make subsets of IMDb data available to customers for personal and non-commercial use. On a periodic basis, a series of TSV files are available for download. Upon reviewing the list of files, two of those seem to fit our needs:

  • title.basics.tsv.gz — contains basic information for IMDb titles
  • title.ratings.tsv.gz — contains the ratings and votes for IMDB titles

As one might imagine, these files are quite large — especially when extracted. We need a mechanism to filter these data source files.

Filtering the TSV Files Using Java

Using IntelliJ IDEA, I created a simple class which would accomplish the following steps:

  • read each line of the title.basics.tsv file
  • determine if the line contains the “Sci-Fi” genre
  • if so, capture the title ID attribute as the key to a Map<String, String> and place the entire line as the value of the map
  • if any match is found, process the title.ratings.tsv file:
  • read each line of the ratings file and capture the title ID
  • if the title ID attribute exists in the Map<String, String>, add the rating and votes data to the value of the map entry
  • create a new TSV file which contains the Sci-Fi title information, plus the average user rating and number of votes

Below is the very simple entry point into the Java program:

The main filtering code is shown below:

The code to process the average rating and total votes TSV file is shown below:

Finally, the following helper methods were added:

Locating the Bottom 125

With a filtered.tsv file now ready, we can use Microsoft Excel to narrow the data down to a manageable size of the 125 worst-rated Sci-Fi movies. Based on the Java program’s results, here are our columns:

  • id
  • titleType
  • primaryTitle
  • originalTitle
  • isAdult
  • startYear
  • endYear
  • runtimeMinutes
  • genres
  • averageRating
  • numVotes

The following actions were taken in Microsoft Excel:

  • only “movie” value for the titleType column
  • remove any values where isAdult is greater than zero
  • only items which have a value greater than or equal to 500 in the numVotes column

We can now sort the list by the averageRating column, where the lowest rating is at the top of the list.

Next, copy the top 125 records and drop this data into another sheet. Let’s also remove all but the following columns:

  • id
  • primaryTitle (which will become title)
  • startYear (which will become releaseYear)
  • runtimeMinutes
  • genres (which will become genre)
  • averageRating
  • numVotes (which will become votes)

To prepare for use by Dgraph Slash GraphQL, use the CONCAT function in Microsoft Excel to create a new column for each row of data which presents the data in the following JSON format:

At this point, the source data is ready for use by Dgraph Slash GraphQL.

Using Slash GraphQL

In the “Building an Amazon-Like Recommendation Engine Using Slash GraphQL” article, I walk through the necessary steps to create a free Dgraph Slash GraphQL account, which provides 10,000 free credits. Getting started is as simple as navigating to the following URL:

Since I still have a significant number of credits available for my account, I decided to create a new backend service called bad-scifi-movies to house the data extracted from IMDb. This action provided me with a GraphQL Endpoint value in the Overview section of the Dgraph user interface, which will be referenced in the Angular client setup.

Next, the schema for the new backend service needs to be created. We’ll keep things simple— the Slash GraphQL schema is noted below:

The Movie object will house all of the data filtered from IMDb. For the sample application, the User object will contain a unique username and a list of really bad sci-fi movies seen by that user.

With the schema created, it is time to insert data into Dgraph Slash GraphQL. To insert the Movie data, that JSON-based column in Microsoft Excel needs to be copied. 

Below, is an abbreviated example of the insert command:

Please note: at the end of this article, there will be a link to the GitLab repository, which includes the full list of 125 movies.

For the purposes of this example, we’ll utilize a single User object:

Once all of the Movie objects have been inserted, the johnjvester User has watched a total of 9 of the 125 really bad sci-fi movies.

At this point, the new backend service is available for use at the GraphQL Endpoint noted in the Overview section of the Dgraph interface.

Adding the Movie Poster

Showing only the raw data for these movies would be okay, but when the application’s user switches from the list-view to the detail-view, we want them to see the movie poster for the title. However, the IMDb extractions do not provide this information.

Using Google, I was able to locate the open-movie database (OMDb) API, which just happens to contain a link to the movie poster. Additionally, the OMDb API allows for items to be queried using the same unique key which is used by IMDB. However, an API key would be required.

In order to show the movie poster in the Angular application, a free OMDb API key is required:

  • Visit to request an API key.
  • Select the FREE option and provide an email address.
  • Single-click the Submit button and follow any required follow-up steps.
  • Note the “Here is your key” value provided via email from The OMDb API.

Now, when combined with the source data from IMDb, adding the movie poster image is a small API request, which Angular can certainly perform without much effort. In reviewing the Slash GraphQL documentation, I later learned the API call to retrieve the movie poster could have been added to the Slash GraphQL schema using the @custom directive – making it included in the GraphQL query.

Creating the Angular Application

The Angular CLI is very easy to use. Our sample application will use the base component to serve as the view into the Slash GraphQL data. As one might imagine, this data would be presented in a table format. When the user clicks on a row in the table, a basic modal will be displayed, showing the full details for the title (including the movie poster) via the integration with the OMDb API.

Interacting directly with Dgraph Slash GraphQL is handled by a service called graph-ql.service.ts:

The communication to the OMDb API utilizes the omdb.service.ts:

The Angular environment.ts file includes a few custom attributes as shown below:

The API value should be replaced with the GraphQL Endpoint value for the backend service with Dgraph Slash GraphQL. The omdbKey is the unique value received via email from “The OMDb API.”

When launching the Angular application, the following OnInit method is executed:

The GraphQlService is used to make a GraphQL API call to Slash GraphQL. That call, which eliminates the need to massage data in the Angular application, retrieves the list of 125 really bad sci-fi movies. The list is then sorted by title, by default.

When users click a movie, a modal opens and the following OnInit is executed:

The OmdbService is used to retrieve the URL for the movie poster and the GraphQLService retrieves the list of movies for the user. The user data determines the value of the hasSeenThisMovie boolean attribute. The simple boolean will determine if the Mark as Watched button in the template will be active or inactive.

To make things appear a little nicer, try including the following packages in the Angular project:

  • @ng-bootstrap/ng-bootstrap: ^5.3.1
  • angular-star-rating: ^4.0.0-beta.3
  • bootstrap: ^4.5.2
  • css-star-rating: ^1.2.4

Running npm ci (or npm install) made sure all the Node modules were installed. Now we can start the Angular application, using the ng serve command.

Using the Angular Application

With the Angular application running and the Slash GraphQL running, the following screen should be displayed:

Single-clicking an item on the list for a movie not seen by the johnjvester user appears as shown below:

Notice the Mark as Watched button is active.

Single-clicking an item on the list for a movie in which johnjvester has watched appears as shown below:

Notice the Mark as Watched button is inactive, since this movie has already been seen.


In the example above, we created a fully functional application using an instance of Dgraph Slash GraphQL and the Angular CLI. While the example provided here was on the simple side, the GraphQL features made available by Slash GraphQL allow for diverse and complex graph-database operations. This approach abstracted the design to not require use of any GraphQL libraries, resulting in a really nice GraphQL database backend from the Slash service that can be treated just like any other API.  However, if additional needs are required which fall into the graph database realm (as found in my “Connecting Angular to the Spring Boot and Slash GraphQL Recommendations Engine” article), Slash GraphQL is ready to assist with meeting any functional needs. 

This article has demonstrated that it is possible to leverage Slash GraphQL as both a data source and a service layer with your application. This could translate to impressive cost savings over the life of an application.  When including the @custom directive, the Angular client no longer has to make a second call for the movie poster, which is handled and included in the payload provided by Slash GraphQL.  In fact, the design of the application becomes simplified with the API key moving from Angular into the Slash GraphQL instance – which is a lot easier to secure from anyone with source control access.

If you are interested in the full source code for the Angular application, including the Java code referenced above, please visit the following repository on GitLab:

Have a really great day! 

Source link

Old is Solid; New Gets Talked About

Old is Solid; New Gets Talked About

When Chris asked me to write about “one thing I learned about building websites this year” I admit my brain immediately went through a list of techniques and CSS properties I started using this year. But then I paused. Other people can write about that much better than I can. What’s something that I specifically have learned?

Then I realized that I’ve been “learning” the same lesson for the last five years, yet I keep falling into the same trap time and time again. I always think that far more people are using the latest, coolest technology out there than there really are.

I think most of you feel the same. If you follow Twitter or any web development blog, it’s almost like everyone is using the latest and the greatest. And the latest and the greatest also seems to change weekly, if not daily. “What’s your favorite React state library? Well it’s Redux, no wait MobX, no wait Unstated, no wait Recoil, no wait, Jotai, no wait, Valtio, no wait…” The constant change can be exhausting, like you’re always falling behind compared to your peers.

But that’s not remotely the case. The vast majority of web developers use “boring” or “old” technology. That makes sense intuitively: most of the stuff on the web today was built …before today. When that needs to be maintained, it’s in the technologies that were in use when it was built. And herein lies the crux: We all maintain old things more than we build new things.

“The best bet for 2030” by CommitStrip

So you feel like everyone else gets to play with cool stuff like “auto-reloading serverless static deploys” while you’re still updating your configuration. Trust me, there are way more people updating their Grunt configuration right now than doing a serverless static deploy (whatever that may be).

That web dev you admire that’s all-in on Tailwind 2.0? They’re still maintaining a Bootstrap 2.3 website. That JavaScript guru that switches state libraries every week? They’re still maintaining a huge application using Flow. New just gets talked about more often.

I could mention the percentage of websites that run WordPress versus the percentage of sites that run React, but that’s not really the point. If you spend time in the web dev community, it feels like one is old-hat and the other isn’t.

Old can be solid, it can be dependable and it can be predictable. There are times where it’s fun to try new stuff and tell people about it, and there’s times to reach` for the technology you know so you can get stuff done. 

My guess is that I’ll keep thinking, “Well no one really uses $foo anymore,” well into 2021 and beyond—it’s such an automatic thought. But I have to keep reminding myself that it’s wrong. For whatever value of $foo, there are tons of people still using it, and it’s still valuable.

Source link

r/graphic_design - Need help fitting in additional information on a brochure

Need help fitting in additional information on a brochure : …

Disclaimer – I’m a graphic designer but admittedly kind of a novice. I studied graphic design in college but I only just started freelancing so apologies, I’m still learning.

I’ve got a client who wants an 8.5 x 33″ trifold brochure (that folds up to be 8.5 x 11″).

For background, they provide coaching and training services to children/teenagers who are looking to pursue a career as professional Squash players.

For the center pages (“Methodology” and “Benchmarks”), they have a very wide chart detailing the various steps of their program sorted by what skill level each player is at. I just got a request from the client asking that I add another column to this chart – they want me to split the “College Athlete Pro Player” category into two more columns (“College” and “Pro”).

The information in the chart is already written at 9 and 8 pt Montserrat font. I was always under the impression that 8 point font was pretty much the smallest you should go when designing a brochure for print. Does anyone have a feasible/creative way to fit this information in properly or should I warn them that the brochure is going to start getting to unreadably tiny font?

Here’s some pictures for reference, I’ve also included a screenshot of the InDesign file so you can see where the margin/fold lines are. Ignore some of the minor design changes between the two, I’ve been reworking the front page.

TD;DR: Having trouble fitting an additional column into this brochure without shrinking the font size below 8pt. Any suggestions?

r/graphic_design - Need help fitting in additional information on a brochure
r/graphic_design - Need help fitting in additional information on a brochure
r/graphic_design - Need help fitting in additional information on a brochure

Source link

r/webdev - 1. Simple question, drawn horribly, 2. What

1. Simple question, drawn horribly, 2. What’s the best way t…

Thanks to anyone who can understand this image. I appreciate any help greatly!!!!!

r/webdev - 1. Simple question, drawn horribly, 2. What's the best way to find a good webdev?

I hope this image is readable. Otherwise, let me explain.

I have began building a website and I have quickly realised that I will need to purchase plugins.

So far I have a Hostgator hatchling plan with wordpress installed. Within wordpress, I have started building from a “futorio” theme, using elementor.

Ultimately, I want forms that can be filled out by visitors, and for the form entries to be databased (sql). I then want to be able to reference the inputs from those forms, to display parts of them in other areas, where new users can interact with them.

I have seen a few plugins which appear to be able to solve this, although, it is hard for me to commit to paying for one until I know it will be able to meet my ends. WPForms seems to allow for this, is this what they call “offline forms”? Without one of the paid versions, I can’t access/use the form data easily (to my knowledge)


Second question,

How do I find a good webdev to consult?

I have some (not so close) friends, although they won’t take my money for the help they have given me so far, and I feel bad overusing them. Ultimately, I’m looking for someone who I can ask questions like the following, who will point me in the direction of tools etc. to achieve my goals. Once my idea is more developed, and I need further help, I would likely be looking to contract someone to finish the job in its entirety. I don’t need a super-mega-pro, just someone who is accessible, who I can ask questions regularly. (hostgator support seems wrong, now that I’m building on wordpress?)

Source link

What’s New in WCAG 2.1: Label in Name

What’s New in WCAG 2.1: Label in Name

WCAG 2.1 Recommendations rolled out in 2018. It’s been a couple years now and there are some new Success Criterion. In this article, I will discuss Label in Name, which is how we visually label components. We’ll take a look at what some failure states look like, how to fix them, and examples of how to do them correctly.

You lost me at Success Criterion…

Success Criterion are testable statements that aren’t technology-specific. They’re the baseline from which we determine whether our work is “accessible.” In this case, “Label in Name” is the thing being evaluated, which is among a whole slew of other criterion. WCAG 2.1 is the current version of the spec and “Label in Name” is item 2.5.3, indicating it is in the second category (“Operable”) of criterion, under the fifth section (“Input Modalities”) of that category, marked as the third item in the section.

WCAG 2.1 is backwards-compatible with WCAG 2.0, meaning it’s an extension of WCAG 2.0. Further, the releases of WCAG 2.1 and 2.2 are in conjunction with each other and they all work together.

Label in Name

So, getting back to things, 2.5.3 Label in Name (Level A) is new and defined in the WCAG 2.1 Success Criterion. Here’s how it’s described:

For user interface components with labels that include text or images of text, the name contains the text that is presented visually.

The intent of this Success Criterion (SC) is to ensure the words which a label has visually on the component are also included in the words that are associated with the component programatically. This helps ensure that anyone — whether it’s someone using voice recognition software or someone who is visually abled — can rely on labels to describe the intent of a component, or how to interact with it. The visual text label and the programmatic name do not have to be exact, mind you, but they should contain a common work that associates them (e.g., “Submit” with “Submit Now”).

The point is that there isn’t confusion, because of a discrepancy, between what is read and what is seen.

Assistive technology in action

Let’s use the example of an HTML contact form. A user may use voice recognition software to fill out a form and come to the end where the form is submitted and the form is sent.

Say the label of the button and the visual text in the button are inconsistent:

    <textarea name="message"></textarea>

  <button aria-label="Submit">Send</button>

In the above example, the button doesn’t function properly for assistive technology. The button contains the text “Send” but its aria-label is “Submit.” This is where the failure lies. The visual label (“Send”) is inconsistent with the programmatic name (“Submit”), providing no association between the two.

When these match or have a common term, users of speech recognition software can navigate by speaking the visible text labels of components such as links, buttons, and menus. In this case, we could fix it by matching the label and the text. But since the aria-label adds no value, removing it altogether is a better fix:

    <textarea name="message"></textarea>


Sighted users that use screen readers will also have a better experience if the text they hear is the text that’s similar to the text they see on the screen.

When the label and visual text don’t match, speech-input users attempting to use the visible text label as a means of navigation (e.g. “move to First Name”) or selection will get stuck because the visible label spoken by the user does not match or is not part of the accessible name that is enabled as part of the speech-input command.

Also, when the accessible name is different from the visible label, it may function as a hidden command that can be activated accidentally by speech-input users. SC does not apply where a visible text label does not exist for a component.

Code in action

Here are three different failure states.

Again, these are all examples of poor practices, according to the 2.5.3 Label in Name SC.

In 2020 the WebAIM Million project evaluated 4.2 million form inputs and found that 55% were improperly unlabeled, either via <label>, aria-label, or aria-labelledby.

When working with forms, most of us are pretty used to pairing a <label> with an <input> or some other form control. That’s awesome and a great way to indicate what the control does, but there’s also the control’s programmatic name, which is also known as the “accessible name” using an aria-label.

We get a better user experience when the name of the <label> can be associated with the programmatic (or accessible) name in the aria-label. For example, if we’re using “First Name” for an input’s <label>, then we probably want our aria-label to be “First Name” or something to that effect as well. A failure to draw a connection between programmatic names and visible labels can be more of a challenge for users with cognitive challenges. It requires additional cognitive load for speech-input users who must remember to say a speech command that is different from the visible label they see on a control. Extra cognitive load is also created when a text-to-speech user needs to absorb and understand speech output that can’t be connected to the visible label. These forms will submit, but it comes at a cost to accessibility and disabled users.

Here are those three examples from above fixed up!

Text in Label specifics

Per the WCAG SC, text should not be considered a visible label if it is used in a symbolic manner instead of expressing it directly in human language. A rich text editor is a good example of this because an editor might use images as text (which is included in 1.4.5 Images of Text).

To match the label text and accessible name with one another, it is important to determine which text should be considered the label for any component for any given control. There are often multiple text strings in a user interface that may be relevant to a control. There are reasons why the label in close proximity should be considered the text label. It’s about establishing a pattern of predictability for users interacting with a component. Those reason suggest that visible labels should be positioned:

  • immediately to the left of text inputs, dropdown boxes, and other widgets or components.
  • immediately to the right of checkboxes and radio buttons.
  • inside buttons or tabs or immediately below icons serving as buttons.

Punctuation and capitalization may also be considered optional if used in a symbolic manner. For example, “First Name” is just fine instead of “First Name:” and “Next” is okay instead of “Next…” and so on.

Another thing to consider: components without a visual label are not considered by the WCAG SC.

Proper labeling has its perks

The core benefit of matching a component’s labels with its corresponding accessible name is that it gives speech-input users the ability to activate controls on a page without having to change focus or make guesses between two different terms.

In the end, using clear, consistent terminology between what is seen and what is spoken provides a more enjoyable user experience — for everyone — because the labels that get read by assistive technologies match the visible labels that can also be seen and read. This is what we talk about with inclusive design — everyone wins and no one is left out.


We just broke down some of the finer points of the WCAG 2.5.3 Success Criterion for labels in names. It sounds like a simple thing to follow. But as we’ve seen, there are situations where it’s not so clear-cut.

The goal of adhering to this criterion is, of course, to make our work accessible and inclusive for all people. The WCAG helps us know if we’re successful not only by providing guidelines, but by settings grades of compliance (A, AA, AAA, where AAA is the highest). Text in Label falls into the A grade, meaning it’s a base level of compliance. To earn the grade, the WCAG is looking for:

[…] user interface components with labels that include text or images of text, the name contains the text that is presented visually.

We can test and make certain that our code is complete and correct by looking at the source code of the site, using a browser’s DevTools, such as Chrome or Firefox, or running an accessibility audit using such tools as the WAVE browser extension (Chrome and Firefox) and Axe from Deque Systems (Chrome).

In short, there are real people on the other side of the glass and there are things we can do in our code and designs to help them enjoy interacting with the components we make. Text in Label is just one of many criterion outlined in the WCAG and, while it may seem like a small detail, adhering to it can make a big impact on our users.

Source link

Representation Matters | CSS-Tricks

Representation Matters | CSS-Tricks

This year I had the pleasure of re-launching The Accessibility Project. I spend a lot of time researching and writing about accessibility and inclusive design, so this felt like the cumulation of a lot of that effort. The site now uses all sorts of cool web features like CSS Grid, @supports, and media features, aria-current, Service Workers, and Eleventy. But that’s really not the important bit.

The important bit I learned this year is the same thing I learn over and over again: When it comes to disability, representation matters.

In my exploration, the importance of representation is a layered truth I find myself re-internalizing as I learn more about the different communities that make up the accessibility space. I am extraordinarily thankful to be welcomed into these communities, and grateful to be able to participate in them. 

We must, however, acknowledge that it is a lot easier for me to enter into these communities than the other way around. Disabled people frequently face many barriers towards representation in many industries, ours included. Considering that, I thought I’d ask disabled people who work on the web what they’ve learned. Here’s what they told me:

Developer Jennilee Rose comments on increased awareness of accessibility in the framework space:

As an advocate for accessibility in web design/development, something I’ve noticed (not exactly learned per-say, but a trend I’ve seen) is that in probably the last 2-3 years there has been a shift in prioritizing accessibility in JavaScript libraries. I think some of it is that there are devs out there like me who care and are holding devs who create these libraries accountable and helping to create change.

Software Engineer Nadhim Orfali comments on their experience working with design systems, accessibility, and documentation:

Using Vue and scoped packages made it easier and quicker for teams to adopt the design system. Bonus: fair amount of accessibility work is done and documenting all this is a lot easier than previous versions. […] This means that if we need to update documentation about a prop, we can make the change in the prop file itself within a component and only that package will get released (thanks to CI/CD).

User experience designer Francis C. Rupert comments on how quarantine has affected everyone:

In 2020 everyone was struck with a shared Situational Disability by everyone wearing a mask. Hearing loss isn’t necessarily always about volume, but speech discrimination. We collectively lost the ability to distinguish between consonants and vowels, and everyone else sounds garbled through their masks.

Speaking of quarantine, web designer Jen Diaz tells us about some benefits that come with remote work becoming mainstream:

Clients are super-keen to work with remote business partners now that they have little or no choice not to. Which is great — it truly levels the playing field. On a Zoom call, nobody knows that my hands are shaped like lobster claws or that I physically cannot participate in the company bowling league — both things that have raised eyebrows for me at in-office jobs.

Anne Berlin, technical SEO and web manager, also comments on some remote work benefits:

I don’t have to worry about someone coming in with strong fragrance, which can send my brain into haywire. I can control the light level of the room and brightness level of my monitors, and a bit more control over the noise level.

It’s not all good vibes, however. Web developer Olu also chimes in about remote work: 

Quarantine has also shown how adaptable companies can be when their backs are against the wall. It’s funny how disabled people can ask for accommodations for years and then when they have no choice suddenly these accommodations are becoming permanent for everyone. 

Anne also mentions:

Pressure to pass as abled due to ignorance about “invisible” disabilities or lack of proactively inclusive culture for a range of things including cognitive styles, or issues with overstimulation.

Disability is more than physical access. Managing Director Josh Clayton mentions the cognitive fatigue that comes with framework churn:

The continued use of React is concerning. The JavaScript ecosystem is fragmented, with a lot of people doing a lot of work and nobody producing anything new. I don’t mind investing in technology where I feel like I’m getting something. There’s just so much churn, I don’t bother to keep up. I would like to think it’s not sacrificing future employability if I was going to look for a new job, but when it comes to other person’s money, there’s the “newshiny,” or “is this actually the right thing you should be doing right now?”

Developer EJ Mason doesn’t mince words:

What I have learned about the industry is that it is unrepentantly ableist.

While I’m happy to see progress being made on some fronts, we need to understand that doing technical work to make websites accessible is only part of the picture. We need to realize that usable products can be created in exclusionary spaces. Only by including disabled people in the product creation process can we truly improve as an industry.

Thank you to Jennilee Rose, Nadhim Orfali, Francis C. Rupert, Jen Diaz, Anne Berlin, Olu, Josh Clayton, EJ Mason, and everyone else who shared their experiences with me.

Source link