Tips, web design book reviews, resources and observations for teaching and learning web development.
Making websites accessible without sacrificing aesthetics. This is from nomensa.
Improving the accessibility of social media in government. Tips for Facebook, Twitter and YouTube.
Why do organizations hate their content management systems? I wanted to link to this just so I could quote this wonderful sentence: “A typical CMS is like a digestive system with no capacity to poop.”
Jump Start Responsive Web Design
The first part of the book talks in general about responsive design. Then it goes into fluid grids. The explanation of the mathematical underpinnings of grids and font-size decisions in this section were clear. However, some parts of this discussion made almost no sense to me because the reader is expected to download files and be at a computer while reading. The code examples printed in the text are not adequate for someone like me who was reading an electronic version of the book to follow the discussion. There were references to things unseen and comments you couldn’t follow unless you were working in the downloaded code.
The adaptive images chapter gave us several alternate ideas for working with images. There was no definitive best practice set forth in this section because we really don’t have a definite answer yet, or even a final choice as to the HTML elements that will format responsive images.
In the section on understanding media queries there was excellent detail and advice. I was impressed with some of the solutions the authors pointed to dealing with the constantly changing number of potential breakpoints in responsive designs.
The chapter I found most fascinating was the one on responsive content. Discussion focused on ways to structure content with metadata and supporting structure that allow for the reuse of chunks of content in various ways. This is part of the overall concept of responsive design that seldom gets mentioned. The book is worth reading for this chapter alone.
The final chapter looked at various boilerplate solutions and how they can be adapted to your individual needs.
Summary: Lots of tips for making responsive web design work for you.
A review by Virginia DeBolt of Jump Start Responsive Web Design (rating: 3 stars)
Disclosure: I received a free copy of this book from the publisher for this review. Opinions are my own. Links to Amazon are affiliate links. You can buy the book from O’Reilly, as well as Amazon. The link to O’Reilly is not an affiliate link. Here is my review policy.
Mozilla’s Tantek Çelik discusses how new HTML5 elements and microformats offer a simple way to represent web data without additional URLs, file formats, or callbacks. Microformats2 and HTML5 improvements bring better accessibility, simpler markup, improved semantics, and a direct mapping to JSON APIs for data consumers.
Tantek’s slides are here: http://tantek.com/presentations/2013/07/microformats2/
Browser zoom great for accessibility is from AlastairC and talks about the accessibility difference in normal browser zoom and text only zoom. This is really interesting and can affect your results when zooming to 200% to test your WCAG compliance.
Open Glass Project Demos how Useful Glass Can be if You’re Visually Impaired. Fascinating and creative project.
Tom Green has a series of tutorials fluid grids on Dreamweaver 6 at WebDesign Tuts+, including the first in the series: Fluid Grids. He has downloadable files. And his video doesn’t blur out frequently the way the one I showed you from Adobe/Lynda.com did the other day. Thanks, Tom, for letting me know about these terrific tutorials.
A Universities offer of credit for a MOOC gets no takers. The article has ideas about why.
Today, I did an accessibility presentation for the DOE InterLab conference of national labs. It was a review and refresher with a few new things about ARIA roles added in. The slide deck is available at vdebolt.com/interlab.
The agenda for the InterLab conference shows an interesting list of speakers in addition to my small part. Among the speakers are Emily Lewis and Chantal Forster. Kudos to the DOE organizers of this event for getting so many brilliant women as speakers.
This is an Adobe/Lynda.com video tutorial explaining how to use fluid grid layouts in Dreamweaver 6. It blurs out during scrolling or fast movement sections for me, which is a bit distracting, but doesn’t affect the information you want to learn.
Adobe TV has a number of excellent tutorials for learning Dreamweaver 6 online, some with downloadable files to let you work along with the tutorial. This is the only one I’ve seen that has the blurring issue.
I recommend these videos for anyone who is transitioning from versions of Dreamweaver prior to 6, since the interface in DW6 is quite different from previous versions.
Memorability is a free photo book app for iPad. It uses a simple drag and drop interface to allow you to create photo books. The completed photo book can be shared on Facebook, by email, or on a private Memorability social network.
There are many themes available for the photo books. Quite a few come installed with the app, others currently cost $0.99. The themes are attractive and the finished photo books are lovely and professional looking.
I met the developer of the app at BlogHer13. She told me if I used the Promo code BLOGHER I could get a theme free. Feel free to use the promo code yourself. I should have entered the promo code the moment I downloaded the app on iTunes. Later, when I selected one of the $0.99 apps to download it was too late and I had to pay for it. Learn from my mistake.
I gave the app a test run. I didn’t have any particular topic in mind like a family event that I wanted to make a photo book for, so I just randomly choose some photos from my iPad. I selected the theme I’d purchased and was ready to go. Each theme has a number of page options, so I first selected a page type, then dragged a photo into it. Some pages allow the addition of text. Some allow the addition of sound. Some have areas for more than one photo per page. All the page options are obvious and simple to use.
I made several pages. A double tap let me preview. I selected to share on Facebook and the app created an mp4 file, which it sent to Facebook. Later I decided to email the file to myself, so I selected share by email. The iPad went through the process of creating the video file all over again and sent it to me.
Unfortunately the mp4 file created by Memorability is too large for WordPress to accept, so I can’t show it to you here. Since I only had 5 or so images in the photo book, the large file size is a drawback to sharing for someone like me who was thinking of putting the video file on the web.
It’s easy to edit a photo book once after you’ve completed it. It’s easy to get to the list of all the photo books you’ve made. Really, this app is just plain easy to use.
As far as I can tell, it’s only available for iOS right now, but it’s early days for this app. I’m sure it will expand in future versions.
Memorability has a Facebook page and is @MemorabilityApp on Twitter.
