A Responsive Accessible Table | Adrian Roselli


61 bookmarks. First posted by anglepoised november 2017.


Painfully slow demonstration of the example table resizing and different media queries kicking in. After writing (again) that it is ok to use tables, and after providing quick examples of responsive tables, I received questions about why I used some of the code I did. I am going to attempt…
html  accessibility 
december 2017 by barbarian_geek
After writing (again) that it is ok to use tables, and after providing quick examples of responsive tables, I received questions about why I used some of the code I did. I am going to attempt to break it down to give you enough information to make your own responsive, accessible table because my example will likely not fit your case precisely (or closely?).
webdev  responsive  accessibility  tables  a11y  css  tutorial 
december 2017 by Jolantis
a <table> that is responsive to resizing
responsive  chart 
november 2017 by ElliotPsyIT
November 2, 2017 ; Painfully slow demonstration of the example table resizing and different media queries kicking in. After writing (again) that it is ok to use…
november 2017 by wesleythill
Painfully slow demonstration of the example table resizing and different media queries kicking in. After writing (again) that it is ok to use tables, and after providing quick examples of responsive tables, I received questions about why I used some of the code I did. I am going to attempt…
responsive  table  ui  css  design  data  mobile  admin  grid  reference 
november 2017 by michaelfox
I am going to attempt to break it down to give you enough information to make your own responsive, accessible table because my example will likely not fit your case precisely (or closely?).

This approach is different from others you may have seen in that it uses a valid <table> (and child elements) and acknowledges that screen readers no longer consider <table>s to be tables when you start messing with their display properties.

-- Adrian Roselli
Adrian Roselli | adrianroselli.com | 2 nov 2017
4web-warriors  coding  HTML/CSS  HTML/CSS-responsive  HTML/CSS-tables  web-accessibility  type-article 
november 2017 by tometaxu
on building an accessible table
accessibility  webdesign 
november 2017 by jshwlkr
This is such an amazing deep dive into how to create a responsive accessible table from Adrian Roselli. I've been using Filament Groups Table Saw for as long as I can remember but this is perfect for building one out yourself and understanding the things you've got to think about.
tutorial  283  newslettered  newsed 
november 2017 by justinavery
Painfully slow demonstration of the example table resizing and different media queries kicking in. After writing (again) that it is ok to use tables, and after providing quick examples of responsive tables, I received questions about why I used some of the code I did. I am going to attempt…
accessibility  css  responsive  html  table  a11y 
november 2017 by alienlebarge
cool screen fx on the code samples
hxgf_sites_src 
november 2017 by jyoungblood
A Responsive Accessible Table ::

(And also scrolls horizontally if it has to.)
from twitter_favs
november 2017 by davidhund
An article showing how to implement a responsive and accessible table.
tables  responsivewebdesign  webdev  html  accessibility 
november 2017 by angusm
After writing (again) that it is ok to use tables, and after providing quick examples of responsive tables, I received questions about why I used some of the code I did. I am going to attempt to break it down to give you enough information to make your own responsive, accessible table because my example will likely not fit your case precisely (or closely?).
a11y  css  html  responsive  tables  accessibility 
november 2017 by abberdab
Great article on creating responsive tables.
tables  responsive 
november 2017 by number10
After writing (again) that it is ok to use tables, and after providing quick examples of responsive tables, I received questions about why I used some of the code I did. I am going to attempt to break it down to give you enough information to make your own responsive, accessible table because my example will likely not fit your case precisely (or closely?).
fridayfrontend  html  tables  responsive  accessibility  javascript  css 
november 2017 by spaceninja
The Example
eco 
november 2017 by degerstrom
How to mark up and style a responsive <table> while retaining accessible semantics. (Surprise: screen-readers have CSS heuristics to guess if a table is for data or layout.)
a11y  css  html 
november 2017 by tigt
After writing (again) that it is ok to use tables, and after providing quick examples of responsive tables, I received questions about why I used some of the code I did. I am going to attempt to break it down to give you enough information to make your own responsive, accessible table because my example will likely not fit your case precisely (or closely?).
wd  wd-accessibility  wd-tables  wd-tables--responsive 
november 2017 by ericwbailey
November 2, 2017 ; Painfully slow demonstration of the example table resizing and different media queries kicking in. After writing (again) that it is ok to use…
from instapaper
november 2017 by anglepoised