At their last meeting, the Mobile Monday Grand Rapids (MoMoGR) group asked me to fill in for a speaker and panelist who had to cancel. The topic of the night was “Web Meets Mobile” so the responsive design talk I’d given at the Grand Rapids Web Development Group (GRWebDev) meeting the week before was a perfect fit. I revisited the talk over the weekend and made some changes to the slides to fit the shorter time limit and static format (slides only, no live action). Although I think the new version of the presentation was less impressive live, the slides from it are better for viewing afterwards. Here are the revised slides along with my notes, which are basically my whole script for the presentation: My Responsive Design Slides and Notes Rev. 3
Adaptive Images
One issue I mention in the talk which I hadn’t seen a solution to is adaptive image sizing. You use big images to make the big version of your site look good, but then you end up sending the same big images to mobile devices, which wastes bandwidth and mobile processing power while it downsizes the images on the device. I came across these two articles on the WebMonkey website today which address the problem. They both require Javascript, which is kind of a bummer, but beggars can’t be choosers, so here you go: Build Faster Mobile Websites With ‘Adaptive Images’ and JavaScript Package Offers a Smarter Way to Serve Hi-Res Images
Adaptive Menus
An issue which I haven’t touched on in the talks is adaptive navigation and menus. I came upon an article from The Filament Group which discusses some problems and strategies for dealing with these elements in responsive designs: A Responsive Design Approach for Navigation, Part 1
