This week’s roundup brings you news about the implementation of srcset
in Webkit, a tutorial on how to use the HTML5 API for form validation, a collection of paid and free user experience tools, and more.
If you’re new to my blog, I publish a post sharing some of my favorite CSS, HTML, accessibility, user experience and WordPress resources I’ve read in the past week. I’d love to hear how you use the resources in your projects. To my regular followers, I’ve changed the schedule to publish the weekly roundup on Fridays.
Favorite Tweet
I have this problem. There are too many interesting things to do.
— Dana Chisnell (she / her) (@danachis) August 20, 2013
CSS and HTML
- Tridiv: an amazing web-based CSS 3D editor: Julian Garnier created an amazing 3D editor that has caught a lot of people’s attention. Free and only available on Webkit, Tridiv creates complex animations and objects. Whoa, check out the animated spaceship demo on CodePen.
-
If you think progressive enhancement is stifling your creativity, you’re just being lazy. It’s not difficult, it just requires some thought.
— Aaron Gustafson (@AaronGustafson) August 22, 2013
- Using the HTML5 Constraint API for Form Validation: Sandeep Panda gives an overview of how to use the HTML5 constraint API to validate form entries in this SitePoint post.
- HTML5 Tools From Adobe: If you haven’t been able to keep up with Adobe’s new development tools, this summary highlights the features in Edge Code, Typekit, Edge Inspect, Edge Reflow, PhoneGap Build.
Responsive Design
- WebKit Has Implemented srcset, And It’s A Good Thing: With
srcset
available in WebKit, developers can now specify a list of sources for an image attribute, which is shown based on the pixel density of the user’s display. What I found interesting is thatsrcset
offers suggestions to the browser, that can be overridden by a user preference. Take time to read the discussion in the comments. - Responsive Interview with Val Head: In this interview by Responsive Web Weekly, Val Head shares her background, current projects, and her favorite responsive web design implementation from 2013. I met Val at Rustbelt Refresh earlier this year, amazing designer.
Aim to design systems, not pages and you’ll be much happier with the whole process.
- Building Responsive Websites Using Twitter Bootstrap: This tutorial by Syed Fazle Rahman is the second in the series of working with Twitter Bootstrap. Note: the tutorial is based on version 2.3.2. A tutorial for the 3.0 version is expected soon.
User Experience
- 30 Essential UX Tools: This collection of paid and free user experience tools is worth bookmarking. You’ll find mind maps, flow charts, site maps, wireframes, user testing, feedback, analytics, speed tests, and more. I was glad to discover Dr. Link Check, an online link testing site currently in beta.
- 10 Interface Typos You Don’t Even Know You’re Making: Is it “through” or “thru”? Georgina Laidlaw highlights ten of the most common typos in her SitePoint article. Yep, I’m guilty. I didn’t know “thru” wasn’t a word.
-
I'll hire the designer who is open, collaborative, and inclusive over the brilliant designer who lacks those qualities. Always. #ux
— Christine Perfetti (@cperfetti) August 21, 2013
- 17 Periodicals For Usability Research: Where do you find peer-reviewed research? Thanks to Jeff Sauro for compiling this excellent list of user experience research journals and periodicals.
Accessibility
- Accessibility Through Video Captions: Alistair Campbell of Nomensa explains how YouTube can automatically caption your videos. As Campbell points out, sometimes the captioning results aren’t what you expect. It’s up to you to edit the captions, and thankfully, YouTube makes it easy to do.
- Inequality and the Internet: Why Some Remain Offline: In her letter to The New York Times, disability rights lawyer Lainey Feingold points out their oversight in their recent article Most of U.S. Is Wired, but Millions Aren’t Plugged In for not discussing the digital divide between people with disabilities and those people who are not (yet) disabled.
- Using the ARIA Form Landmark: In this tutorial, Ted Drake explains the use of the ARIA form landmark. Though not currently supported by all browsers and screenreaders, Drake recommends including role=“form” as you add new code.
- Is Blu-Ray as Accessible as DVD?: Media Access Australia reports that the home entertainment industry hasn’t used the additional space available on Blu-Ray to increase accessibility. Rather the space has been used to add outtakes, story enhancements and interviews.
WordPress
- WP in Higher Ed Hangout: My former higher education colleagues Curtiss Grymala and Chris Wiegman launch their monthly chat about WordPress in higher education this week. Join the discussion on Fridays at 2PM EDT.
- How to Embed Audio and Video Players in WordPress: With the 3.6 version, you can now easily embed audio and video players in your posts and pages. Steven Gliebe walks you through the steps and shares what file types are supported. Gliebe also shows you how to embed with a URL, shortcode or from another site.
- Get Involved with Online WordPress Communities: Are you looking to join an online WordPress community? Austin Gunter of WP Engine shares four active communities where you can share your work, ask questions, give answers to others, and learn more about WordPress.
- How to Create Category Templates in WordPress: Category templates can be helpful when you want a unique look and feel, or different features shown for a specific category.
What I Found Interesting
- Eight Evernote Upgrades You Should Know About: Did you know you can merge Evernote notes? Or that you can link to another note?
- My process for being where my feet are: Loved reading this post from my friend Leslie Jensen-Inman who shares how she stays grounded, moves forward, and maintains balance.
Creativity happens when we make room for it to happen, when our spaces aren’t cluttered.
- 7 Proofreading Steps: What steps do you take for proofreading? This list of tips comes from one of my favorite blogs, Daily Writing Tips.