Search
Items tagged with: WebDesign
Today's Web Design Update: https://groups.google.com/a/d.umn.edu/g/webdev/c/r9j4JYAKXfs Subscribe info: https://www.d.umn.edu/itss/training/online/webdesign/webdev_listserv.html#subscribe #Accessibility #A11y #WebDesign
Featuring @siblingpastry, @TPGi, @stvfrnzl, @aardrian, @a11ytalks, @SteveFaulkner, @zeldman, @fastfinge, @chrisdavidmills, @adactio, @feather, @nethermind, @intopia, @dennisl, @hdv, @scottohara, @scottohara, @cory, @PK_info, @berry220, @gerrymcgovern, et al.
Web Design References: Webdev Newsletter
Web Design References: News and info about web design and development. The site advocates accessibility, usability, web standards and many related topics.www.d.umn.edu
A terrific 3-part series on colored blindness, accessibility, and data visualizations.
Part 1: https://blog.datawrapper.de/colorblindness-part1/
Part 2:
https://blog.datawrapper.de/colorblindness-part2/
Part 3:
https://blog.datawrapper.de/colorblindness-part3/
#a11y #webdesign #UIDesign #color #dataviz #colorblindness
What’s it like to be colorblind - Datawrapper Blog
'One notices being colourblind more often when looking at data visualizations': Ten experiences.Lisa Charlotte Muth (Datawrapper Blog)
Designing better target sizes
An interactive guide on designing better target sizes on the web.ishadeed.com
One point I’m always at pains to make to my web design students is that accessibility isn’t an add-on to your design. You have to be as inclusive as possible from the outset.
Anyway, I thought this was a great article on designing for people with colour blindness:
https://www.smashingmagazine.com/2024/02/designing-for-colorblindness/?ref=web-design-weekly.com
A Practical Guide To Designing For Colorblind People — Smashing Magazine
Color accessibility is more than just ticking boxes. Even with good contrast, some color palettes can make interfaces challenging for users. Here are some practical guidelines to ensure more inclusive design for colorblind people.Smashing Magazine
One thing the article omits is the fantastic accessibility in Firefox Developer Edition.
Perhaps these tools aren't well known — they're in the web inspector. It’s a great way to test your site.
Have we forgotten how to build ethical things for the web? - Nic Chan
Reflections on the arcane art of making good, ethical websitesNic Chan
Back to Basics: 5 HTML attributes for improved accessibility and user experience - HTMHell
A collection of bad practices in HTML, copied from real websites.Back to Basics: 5 HTML attributes for improved accessibility and user experience - HTMHell
Today's Web Design Update: https://groups.google.com/a/d.umn.edu/g/webdev/c/R0cUyaP2cJw Subscribe info: https://www.d.umn.edu/itss/training/online/webdesign/webdev_listserv.html#subscribe #Accessibility #A11y #WebDesign
Featuring @alyssapanetta, @accessible_community, @davidofyork, @TPGi, @tempertemper, @dequesystems, @yatil, @trys, @knowbility, @mgifford, @chipcullen, @cferdinandi, @craigabbott, @harrybr
@harrybr, @Meyerweb, @j9t, @vitalyf, @smashingmag, et al.
Web Design References: Webdev Newsletter
Web Design References: News and info about web design and development. The site advocates accessibility, usability, web standards and many related topics.www.d.umn.edu
https://noti.st/cariefisher/1gWjQz/css-accessibility-inclusion-through-user-choice
Presentation slides from WordPress Accessibility Day by Carie Fisher
#css #a11y #webdesign #webdev
CSS + Accessibility: Inclusion Through User Choice by Carie Fisher
Every day we have a series of choices to make. Get up early to work out or hit the snooze button? Double foam mocha latte or decaf green tea? Tabs or spaces? Our choices — even the small ones — shape our identities and help frame how we see the world…noti.st
Please, don’t force me to log in
The current accelerating trend of requiring accounts and logins for everything has to stop.Juha-Matti Santala
Designing better target sizes
An interactive guide on designing better target sizes on the web.ishadeed.com
16 Lesser Known Accessibility Issues [and Tips]
https://toward.studio/latest/16-lesser-known-accessibility-issues
"12. Don’t hide labels. Ever."
#a11y #accessibility #webdev #webdesign #tips #UIDesign #forms
16 Lesser Known Accessibility Issues | Toward
In this post Matt discusses 16 accessibility issues and solutions we've encountered while building a bi-lingual website application for a public sector…Toward Studio
Let me say it louder for the people in the back… heading levels (h1, h2, h3…) in html are not about size, they are about structure. They communicate the organization of your page.
An h2-heading in one part of your page or site does not have to be the same size as an h2-heading in another part or your page or site. The purpose of the heading is to semantically communicate hierarchy.
In fact, deciding that all h2 headings must be the same size across your website will usually lead to poor decisions with regards to the underlying structure of your page.
So yes, the heading in your footer should likely be an h2 but it doesn’t have to be the same size as the h2 in an article. And no you shouldn’t make it an h4 ”because I want it smaller”!
This may be one of the most misunderstood elements of web design.
How do folks feel about links not being underlined but instead being in inverted colors? (that is, if the page is a "light mode" black text on white background, links are white text on black background)?
#WebDev #WebDesign #Accessibility #WebAccessibility #A11y #HTML #CSS
Today's Web Design Update: https://groups.google.com/a/d.umn.edu/g/webdev/c/NGlXwhBqUTc Subscribe info: https://www.d.umn.edu/itss/training/online/webdesign/webdev_listserv.html#subscribe #Accessibility #A11y #WebDesign
Featuring @aardrian, @siblingpastry, @theaccessibilityguy, @intopia, @mgifford, @Kilian, @hexagoncircle, @michelle, @Myndex, @huijing, @stephaniewalter, @a11ytalks, @ItsCrisDiaz, @lara_amalia, @hwsanden, @melaniersumner, @j9t, @cferdinandi, @maggie, @Meyerweb, @nilsbinder et al.
Web Design References: Webdev Newsletter
Web Design References: News and info about web design and development. The site advocates accessibility, usability, web standards and many related topics.www.d.umn.edu
Accessibility Tools and Resources for Designers • DigitalA11Y
A comprehensive list of accessibility tools and resources for designers to achieve accessibility from start.Raghavendra Satish Peri (DigitalA11Y)
https://chrome.google.com/webstore/detail/text-spacing-editor/amnelgbfbdlfjeaobejkfmjjnmeddaoj
#a11y #wcag #tools #text #css #accessibility #webdesign
Text Spacing Editor
A tool for editing text spacing properties on web pages. WCAG conformance information included.chrome.google.com
Creating Accessible UI Animations — Smashing Magazine
Animation and accessibility are often seen as two separate powers at odds with one another. How is it possible to strike a balance between elements that move and the possible negative effects they expose to users who are sensitive to motion? Oriana G…Smashing Magazine
Answers to common (web) accessibility questions
Common questions I hear about web accesssibility with short, low on nuance answers.Hidde's blog
Related: 4 examples of web-accessible date pickers...
WAI: https://www.w3.org/WAI/ARIA/apg/patterns/dialog-modal/examples/datepicker-dialog/
Deque: https://dequeuniversity.com/library/aria/date-picker
U.S. Web Design System
https://designsystem.digital.gov/components/date-picker/
Tommy Feldt: https://fymmot.github.io/inclusive-dates/
#date #calendar #UIDesign #webdesign #webdev #a11y
Date Picker Dialog Example
Accessibility resources free online from the international standards organization: W3C Web Accessibility Initiative (WAI).W3C Web Accessibility Initiative (WAI) (Web Accessibility Initiative (WAI))
Today's Web Design Update: https://groups.google.com/a/d.umn.edu/g/webdev/c/k7yhNjn4jc8 Subscribe info: https://www.d.umn.edu/itss/training/online/webdesign/webdev_listserv.html#subscribe #Accessibility #A11y #WebDesign
Featuring @siblingpastry, @aardrian, @rachael, @ben, @reidmore, @ericwbailey, @cferdinandi, @karlgroves, @matuzo, @michelle, @adactio, @baldur, @mgifford, @andy_blum, @screenspan, @gerrymcgovern et al.
Web Design References: Webdev Newsletter
Web Design References: News and info about web design and development. The site advocates accessibility, usability, web standards and many related topics.www.d.umn.edu
https://chriscoyier.net/2023/11/08/everything-about-seo-is-obnoxious/ Yes! #webdev #webdevelopment #webdesign #SEO
Everything about SEO is obnoxious
“Search Engine Optimization” Blech. I hate it. This is what SEO should be: Write content on the internet. Make sure it is output in semantic, accessible HTML. Make sure the performance …Chris Coyier
https://ashleemboyer.com/blog/don-t-use-fixed-css-height-or-width-on-text-containers #a11y #css #webdev #webdesign
Don't Use Fixed CSS height or width on Buttons, Links, or Any Other Text Containers | Ashlee M Boyer
Fixed heights and widths risk 'loss of content' when text is resized.ashleemboyer.com
Ensuring negative numbers are available for everyone. "The minus character (−) yields great support in most screen readers, and suffers less situational gotchas than the hyphen-minus character"
https://www.deque.com/blog/ensuring-negative-numbers-are-available-for-everyone/
Great article written by 2 of my favorite comrades.
Russ Weakley / What makes an accessible date picker? Is it even possible? #id24 2023
You’ve seen them in the wild, maybe even audited them. The stuff of nightmares. But what makes a truly accessible date picker? This presentation will explore...YouTube
4 design principles I use every day to avoid bad UX and create products that work for everyone (by Adam Silver)
Principle 1: Good design works for everyone
Principle 2: Good design makes things obvious
Principle 3: Good design puts users in control
Principle 4: Good design is lightweight
#UXDesign #UIDesign #webdesign
4 design principles I use every day to avoid bad UX and create products that work for everyone
Adam Silver – interaction designer - London, UKAdamsilver.io
Modern Health, frameworks, performance, and harm
https://ericwbailey.website/published/modern-health-frameworks-performance-and-harm/
"Performance, accessibility, and usability are more than inconvenient truths you can pretend don’t exist. They have a direct impact on the quality of someone’s life."
#webdev #webperf #ux #usability #a11y #uxd #webdesign
Modern Health, frameworks, performance, and harm
Performance, accessibility, and usability are more than just inconvenient truths you can pretend don’t exist. They have a direct impact on the quality of someone’s life…ericwbailey.website
Today's Web Design Update: https://groups.google.com/a/d.umn.edu/g/webdev/c/Y2ZVUOQaSuI Subscribe info: https://www.d.umn.edu/itss/training/online/webdesign/webdev_listserv.html#subscribe #Accessibility #A11y #WebDesign
Featuring @karlgroves, @jspellman, @rachael, @ericwbailey, @mgifford, @SteveFaulkner, @schalkneethling, @racheled, @dboudreau, @theadamsilver, @matthiasott, @shadeed9, @matuzo, @ItsCrisDiaz, @huijing,
@baldur, @gerrymcgovern, et al.
Web Design References: Webdev Newsletter
Web Design References: News and info about web design and development. The site advocates accessibility, usability, web standards and many related topics.www.d.umn.edu
The problem with input masks and what to do instead
Adam Silver – interaction designer - London, UKAdamsilver.io
The problem with automatically focusing the first input and what to do instead
Adam Silver – interaction designer - London, UKAdamsilver.io
Avoiding Dark Patterns in Web Design
Make the case against dark patterns and learn more ethical alternatives.frontendmasters.com