yuridevat / accessibility-first

Hi there, I'm Julia

         

I am a Dev & UX Accessibility Specialist at Atos. I love to learn about new technology, connect with people around the world and help others get into tech as well.

I am Google Developer Expert for Web Development.

I am the founder of Accessibility First, where I share articles, tutorials and more about web accessibility in UX Design, Web Development, Testing and more. I give talks and attend discussions about accessibility and how to get into tech as a selftaught developer.

Some doors have to be closed to make room for something new.

Until Spring 2024

• I was an Open Source Maintainer and founde of YurisCodingClub, an inclusive open source community. The projects were part of Hacktoberfest to help CodeNewbies get into open source and tech from an early stage.
• I was a mentor and CoC responder by 💟 at The Collab Lab since 2021.
• I was regularly writing blog posts on DEV.to since 2021.

Achievements

• 🏆 Runner Up - MindsDB x Hashnode Hackathon 2023. Check out my article about the project Develop Interview Winning Portfolio Projects With Mindsdb Predictions article for this challenge.
• 🏆 Winner - Hashnode DebuggingFeb Writeathon 2023. Check out my article How Debugging For Accessibility Helped Me Finally Understand useRef for this challenge.
• 🏆 Winner - Hashnode Writeathon 4 articles 4 weeks 2022. Check out my most engaged article How I got my first job as a developer for this challenge.
• 🏆 Runner Up - Clerk x Hashnode Hackathon 2021. Check out my article about the project SOS Animals App for this challenge.

💼 Languages and Tools

📕 Latest Blog Posts

Blog Posts Hashnode

• Develop Interview-Winning Portfolio Projects with MindsDB Predictions

... Read more articles on Hashnode

Blog Posts Dev Community

• LeetCode 2667. Create Hello World Function (Easy)
• LeetCode 2620. Counter (Easy)
• How to create a good README.md file
• LeetCode 2634. Filter Elements from Array (Easy)
• How to create cool color contrast widgets design

... Read more articles on Dev.To

I have been granted "trusted" user on DEV Community built on Forem 🤝

accessibility-first's Issues

[ENHANCEMENT] Update HEAD

To enhance performance of the website content in the head should be restructured.

[ENHANCEMENT]: Update content Accessibility Statement

Update following components:

• https://www.w3.org/WAI/WCAG22/Understanding/target-size-minimum.html

• https://www.w3.org/WAI/WCAG21/Understanding/visual-presentation.html

• https://www.w3.org/WAI/WCAG22/Understanding/target-size-enhanced.html

• https://www.w3.org/WAI/WCAG22/quickref/#target-size-enhanced

• Update Accessibility Statement recordingly!

[ENHANCEMENT] Add reading time to articles

Description

As a user I want to know how long it will take to read the article.

Can be calculated using https://niram.org/read/

Screenshots

No response

Additional information

No response

[BUG]: Color bug on breadcrumbs

The colors do not update respectively on the breadcrumb links.

[BUG] Language switch not announced

When interacting with the language switch, it is not announced that the drop down is open or that a new theme is set. The page reloads and says the page title again.

[ENHANCEMENT]: Update thumbnails to corresponding language

Currently, the thumbnails for the posts are still in English, even though the user may switch to the German or Japanese Version.

[ENHANCEMENT] Update Accessibility Statement

Update links in statement and add bug report.

Also update content to make it more clear what is being supported on the website.

[ENHANCEMENT] Image load is slow

Description

Due to the high resolution of the image for the thumbnail the page load is slow.

Screenshots

No response

Additional information

No response

[BUG] dark mode not available after refresh

Description

As a user I want to have my preferred mode available even after a refresh. Currently, it is going back to light mode / default after refreshing the page, or open a post in a new tab.

Screenshots

No response

Additional information

No response

[BUG]: Color issue in Markdown for code and blockquote in darkmode

When perceiving the website in dark mode, the blockquote and the code do not have sufficient or wrong color.

Can be found in https://prod-accessibility-first.netlify.app/posts/accessibility-the-what-why-&-how

[ENHANCEMENT] Automatically add label to specific issue

Description

As a user who reports a bug, I want to automatically have the label set.
Additionally, I want to have the title startet with [BUG] as well.

Screenshots

No response

Additional information

No response

[BUG] Skip link to theme, bug,..

Description

As a user I want to have immediate access to the theme switcher, maybe also to the bug report.
Maybe, other things would make sense as well.

Screenshots

No response

Additional information

No response

[BUG] Part of Logo not visible in dark mode

Description

One of the dots (the black one in the lower left) is not visible when on dark mode, which is irritating.

Screenshots

No response

Additional information

No response

[FEATURE] Dark and Light Mode Icons Placement

Description

I suggest relocating the dark and light mode icons to the top right of the web page, adjacent to the "Accessibility First" section. This placement ensures easy accessibility and enhances user experience.

Currently, the icons are located bottom of the page . By moving them to the suggested position, users can quickly toggle between dark and light modes without scrolling or searching for the controls.

I have tested this layout adjustment and found that it improves the accessibility and visibility of the dark and light mode options. Users can now seamlessly switch between modes, aligning with the "Accessibility First" principle.

Please consider implementing this change for a more user-friendly interface. Thank you!

Screenshots

Additional information

No response

[Bug] Typography not accessible for reading disability

Description

The current font face has similar or identical characters for at least the letters uppercase I, lowercase L and most likly number 1.

Screenshots

No response

Additional information

No response

[ENHANCEMENT] Link to "all posts by"

As a user, I want the possibility to see all posts written by one contributor.

[ENHANCEMENT]: remove focus on post img

As a keyboard user, I want to have as little steps possible to go to the wantend blog.

As aria-hidden="true" and "tabindex=-1" to image.

[ENHANCEMENT]: revise content package.json

Update package json regarding text as well as German, Japanese.

[BUG]: Dark Mode Toggle does not receive focus

When navigating the website with the keyboard, the dark mode toggle does not receive focus.

[ENHANCEMENT]: Reading time on preview

As a user I want to see the reading time already on the preview.

[ENHANCEMENT] Add Search Functionality throughout website

As a user I want to search for specific terms throughout the whole website.

[BUG] Skip link language switch not working

When clicking on the skip link language switch focus does not move to this area but stays in the skip link navigation.

[ENHANCEMENT]: Add link to event

As a user I want to access the event page when clicking on the event card.