I wrote a quick tweet about teaching the basics of accessibility and colors to design students that go quite some attention. It brought up some interesting discussions. So I thought I would share with you all the resources, tips and tools I regularly use to build and check the color accessibility of my products in one place. Enjoy.
I get asked quite often for book recommendations on different design related topics. I finally found a little bit of time to go through my list of ebooks and paper books and picked a few ones. I ordered the list in different categories to help you go through. So here we go: my personal selection of book on UX design, user research, psychology, UI and web design, ethics, creativity, mobile and responsive web design, accessibility, collaboration, strategy, management and more.
👉 Your curated weekly Design and Front-End resources: public speaking diversity, UX research papers, observational user research, free illustrations, inspiring videos, CSS animations and transitions, accessible button generator, UI inspiration, design tool history, Chrome music lab, a CSS game tutorial, diverse stock photos, old book illustrations and more.
👉 Your curated weekly Design and Front-End resources: HTML/CSS stack, progressive enhancement, designing components, a beautiful typeface, motion and accessibility, CSS properties almanac, 2020 ipsum generator, terms and conditions, designer bias, infinite scroll, results of the NNgroup UX career survey, computer advertising pictures, an essay on newsletter, generative art, etc.
👉 Your curated weekly Design and Front-End resources: the cupcake model for product strategy, typography, CSS glitch effect, a nice color palette generator and a pattern generator, CSS animations tool, a fun pinkish platform game in the browser, accessibility anchor links, handling long content and centering in CSS, more UI game inspiration, etc.
👉 Your curated weekly Design and Front-End resources: you belong in tech, learning CSS, game UI inspiration, diversity in tech and design, some fun little browser games, UI history & the history of the burger menu, CSS variables, CSS scroll snap, figcaption and accessibility, contextual inquiry, next level PWAs on desktop, the “UX community” on Instagram, colorful inspiration, and so much more
👉 Your curated weekly resources: CSS full bleed content, a free UX design starter kit, why you should conduct user research, a cool accessibility project, 2 typefaces, testing the “abusability” of your product, CSS margin collapse explained, free icons, 3D art, diverse stock photos and books, 2 advent calendars (accessibility & UXD ), a cute mindmap tool, pure CSS Monument Valley, etc.
👉 Your curated weekly Design and Front-End resources: 10 NNgroup heuristics illustrated with posters, a UX tools database, teaching remotely, CSS aspect-ratio, a figma course, behavioral science, UX design interview tips, UX metrics, an accessibility buddy, cute manga font, 2020 state of CSS, and a lot of cool design, sound and video inspiration and tools to make your life easier.
👉 Your curated weekly Design and Front-End resources: a font with greater legibility, 10 CSS layouts, CSS masonry, fonts for coding, dataviz, foldable objects templates, why the HTML/CSS/JS separation is good, black and white design, accessibility & aria explained, CSS clip-path editor, design strategy, beautiful illustrations, a LGBTQ inclusive survey, a design challenge, some cool music, etc.
With CSS and JS progress, implementing animations on websites has never been easier. But how do we make sure that our CSS animations and transitions will be meaningful to our users? That they will not be just some annoying “in-your-face” eye candy? That they will not trigger motion sickness and cause accessibility issues to some?
You will find here a transcript with CSS codepen and video examples and LOT of resources to dig further in specific topics. I also published the PDF version of the slides at the end of the article.