15 Comments

Not terribly original and freely borrowing from the demo:

https://codepen.io/romola/pen/zYZLEmq?editors=1100

Expand full comment
author

Nicely done!!! I appreciate that you rearranged the data so it made sense. I think it all looks great and works well -- and the markup is perfect. Great work!

Expand full comment
May 30, 2021Liked by Jen Kramer
author

🔥🔥🔥🔥🔥🔥 Very nice! Depending on how you look at things, the days of the week could also be <th>, or they could stay as is. Great job!

Expand full comment
May 31, 2021Liked by Jen Kramer

👍Thank you😊

Expand full comment
Apr 24, 2021Liked by Jen Kramer

https://codepen.io/jarchaff/pen/wvgNoqQ?editors=1100

I am thinking there is a more readable way for me to arrange this information in the table than what I have done...

Expand full comment
author

🔥🔥🔥🔥🔥🔥 Markup looks awesome! What if you alternated colors on your columns? There isn't a super easy way to do that, but you could give it a whirl. 😁

Expand full comment
Apr 23, 2021Liked by Jen Kramer
author

🔥🎉🔥🎉🔥🎉 Lovely job! Nice colors, and the code looks great!

Expand full comment
Apr 23, 2021Liked by Jen Kramer
author

Well done! This looks excellent - except... why did you comment out your <caption>? I see you moved it to a cell instead. This isn't the best in terms of accessibility, so maybe you can find a fun way to style your <caption> instead? If you are bothered by the empty corner, color it blue and be done 🔥🎉🔥🎉🔥🎉 Thank you for sharing again!

Expand full comment
Apr 23, 2021Liked by Jen Kramer

Tables are not used very often, and <caption> is only allowed in tables. (I actually need captions in <img> and <video>) Another tag that seems not worthy of learning :(

Expand full comment
author

It depends on what you do. <caption> is very important to some, and it's critical for good accessibility. You might find <track> helpful for audio and video? https://developer.mozilla.org/en-US/docs/Web/Guide/Audio_and_video_delivery/Adding_captions_and_subtitles_to_HTML5_video

Expand full comment
deletedApr 23, 2021Liked by Jen Kramer
Comment deleted
Expand full comment
author

🔥🎉🔥🎉🔥🎉 Interesting! Love your creativity in thinking about this problem. You've separated the course number and course name - something that's commonly done in course listing spreadsheets. However, your headings refer to a day of the week. I think you will need the weekend's information to get this correct for accessibility, because you need a double heading here, indicating the day of the week and the course number and course name. WAI hints at it here: https://www.w3.org/WAI/tutorials/tables/irregular/ One other thing -- it's col instead of column for the scope value. Otherwise, you did great!

Expand full comment