Welcome!

This is my personal website that I started building in 2020 to further my understanding of accessible web development. Its's built from scratch using Gatsby and is a constant work in progress. If you have any suggestions for improvement, I'm happy to hear them!

How to Deploy Changes

1. Make the changes locally (and commit to remote obvi)
2. Run npm run deploy

📙 Todo

1. Redesign/structure the core user experience
   • Redo landing page with a photo of ME !
   • Figure out the best way to display previews/info abt my projects on the site, instead of directing folks to Github
   • Finish moving my resume over to https://jsonresume.org, then integrate its data into my site in a visually appealing way
2. Fix the height issue on mobile devices where the vh is smaller than computed and content is hidden behind the navbar
3. Make the embedded pdf of my resume accessible to screen reader users
4. List some of the intentional choices I've made to improve site accessibility on my accessibility page
   • Atkinson Hyperlegible
   • Accessible color palettes
   • Focus indicators w/ focus-visible pseudo class
5. Add an easily-accessible way to contact me (like a form or smth)
6. Figure out if/how to add skip links back in
7. Create a way to automatically display and filter cool sites/resources on the resources page
   • also make an easy way to add links to the page, without deploying anything
8. Make sure the default font size is 16px, 18px, or 20px
9. Keep line lengths around 70 characters at most by setting max-width: 70ch; in the css
10. Add AAC Shim to this site to improve the experience for users of AAC
11. Give the mobile and web navbars the tag or otherwise specify that they are nav elements to make them more accessible
12. Make sure all images/logos are svg elements and not font glyphs, which are very inaccessible
13. Add animation for navbar links
14. Add an option to switch the site to the dyslexia-friendly font
15. Upgrade npm packages/dependencies
16. Add a page with they/them pronoun examples and FAQs
    • Use info from https://lgbtresourcecenter.uccs.edu/pronouns-101

🌟 Inspiration Sites

A redesign needs to happen, here's some inspo:

• https://brucelawson.co.uk/
• https://www.matuzo.at/
• https://www.tatianamac.com/
• https://cariefisher.com/
• https://brittanychiang.com
• so, so, so many more

🪲 Known Bugs

1. flash of light when loading page
   • especially noticeable on dark mode
   • common issue, should be an easy fix
   • I think this was fixed in one of the theme plugins I use, but I'm not totally sure.
   • note: this may have been fixed by a dependency the site consumes!

💥 Resources to Add (At Some Point)

• https://brucelawson.co.uk/

🚀 Gatsby Quick start

1. Start developing with Gatsby.

   Navigate into your new site’s directory and start it up.

   gatsby develop

2. Open the source code and start editing!

   Your site is now running at http://localhost:8000!

   Note: You'll also see a second link: http://localhost:8000/___graphql. This is a tool you can use to experiment with querying your data. Learn more about using this tool in the Gatsby tutorial.

🎓 Learning Gatsby

Looking for more guidance? Full documentation for Gatsby lives on the website. Here are some places to start:

• For most developers, we recommend starting with our in-depth tutorial for creating a site with Gatsby. It starts with zero assumptions about your level of ability and walks through every step of the process.

• To dive straight into code samples, head to our documentation. In particular, check out the Guides, API Reference, and Advanced Tutorials sections in the sidebar.