Welcome to my weekly roundup of web design and development resources. Each week I gather my favorite resources and news from the past week for user experience, accessibility, WordPress, CSS, HTML, and responsive design and compile it into a resource post.
In this week’s roundup, you’ll learn how slow pages on mobile devices hurt the entire user experience, find out what web professionals need to know about the 21st Century Communications and Video Accessibility Act, discover how to implement responsive images in WordPress and more.
Today’s photo is from my yard, showing the maple tree buds bursting. It’s wonderful to see this sure sign of spring in southeastern Michigan.
— Brad Frost (@brad_frost) April 3, 2014
- How Slow Pages Hurt the Entire User Experience [slides]: Slides from Tammy Everts RWD Summit 2014 presentation on how mobile users interactions on ecommerce sites are affected by slow performance.
- April Fool’s Surprise: Sears circa 1897: While April Fool’s online jokes were everywhere this week, I loved the backstory behind the Sears home page, what the UX team created, and the support they received from business stakeholders.
— MD (@_MDigital) April 2, 2014
- Content Quality Checklist: Use this free resource to check the quality of your content, with guidelines for usefulness and relevance, clarity and accuracy, completeness, voice and style.
- CVAA with Larry Goldberg: Sarah Horton interviews Larry Goldberg about the 21st Century Communications and Video Accessibility Act (CVAA). They discuss what web professionals need to know about CVAA and where to look for guidance on CVAA compliance.
- I Will Tell You Later: If you’re publishing video or audio online, caption it before you publish it, says Sveta Kouznetsova. Make it accessible to everyone, not just those who can hear.
- Dropping the Ball on Disabilities: This post by Allie Grasgreen, highlighting the challenges and barriers students with disabilities face in the classroom, generated a lot of discussion in the comments from faculty and college disability services providers. Good read.
It is a good thing that technology & its access is allowing usage to level the playing field for all humanity. In #a11y & elsewhere
— Lawrence Meckan (@absalomedia) April 4, 2014
- Web Accessibility Tutorials: The W3C have started a new set of accessibility tutorials for the Web Content Accessibility Guidelines (WCAG). Note: the tutorials are an in-progress, unapproved draft which currently include tutorials for images, tables, forms, and sliders/carousels.
- How to Fetch Feeds in WordPress Using WP RSS Aggregator: Using the WP RSS Aggregator plugin, you can create an aggregation website for a specific topic,import feeds as posts or custom post types, and keyword filter sources.
- Distraction Free Writing Mode Will Be Responsive in WordPress 3.9: If you’ve been frustrated with the editor getting cut off in Distraction Free Writing Mode when you’re on small screens, you’ll be happy with the fix coming in version 3.9 that will patch the issue.
- Status Update On The WordPress Front-end Editor and How You Can Help: Are you a developer, or can you test and give feedback on a plugin whose goal is to merge the frontend and backend editors into one? Janneke Van Dorpe, the only person working on the WordPress Front End Editor, could use your help.
- How To Learn WordPress in a Week (For Free!):
Given you’ve used WordPress and are familiar with HTML, CSS, and some PHP, this step-by-step guide for intermediate users from WPMU lays out seven days of training where you’ll learn about the Codex, developing themes and plugins, hosting, backups, search engine optimization, customization, and the WordPress community.
- Hassle-Free Responsive Images for WordPress: Tim Evko describes how you can add responsive image functionality to WordPress with his plugin, which offers support for shortcodes. Note: his plugin is hosted on Github, not the WordPress repository.
- Case Study: RNIB: In this case study, Precedent describes the goals and objectives of the responsive redesign of the Royal National Institute of Blind People website.
- Bringing Responsive Images to Browsers: Though the post was published on April Fool’s Day, the news about bringing responsive images to the browser is true. With funding provided through an Indiegogo campaign, Yoav Weiss will work on the Blink and WebKit implementations of
picture. With Firefox’s implementation expected soon,
picturesupport is expected for Firefox, Opera, Chrome, and possibly Safari, within the year.
- An Event Apart: The Future of Responsive Typography: Luke Wroblewski shares his notes from Nick Sherman’s responsive typography presentation this week at An Event Apart in Seattle. Nick discussed the challenges of typography on the web, shared three tips for improving web typography, and highlighted media query functionality.
CSS and HTML
- The Power of Em Units in CSS: Did you know when
eminits are declared on child elements that don’t have a
font-sizedefined, the child elements will inherit
font-sizefrom the parent element?
Easy to remember rule for CSS/Sass nesting: same as Inception rule. Never go more than 4 layers deep. #RWDsummit
— Veronica Dyer (@veronicawindus) April 3, 2014
- Recap: Responsive HTML Emails, RWD Summit 2014: My notes from Justine Jordan’s RWD Summit presentation on responsive HTML emails with strategies and tips for working with multiple email applications.
What I Found Interesting
- Often Be Coding: Engineer and architect Magee Mooney shares her tips for creating your own personal “Coding Practice”—the environment, work area, schedule, and community that allows you to grow and meet your personal goals.
- This is what the media’s gender gap really looks like: With men reporters dominating the media industry (63 percent men vs. 36 percent women, according to the Status of Women in the U.S. Media 2014 report), how does that impact the news that’s reported?
- The Best Online Tools To Know Everything About a Website: Want to learn whether a site uses WordPress? Curious about what organic keywords your competition is using? Check out this list of helpful online tools to learn more about a website.