The easier it is to fill out forms automatically, the more likely you are to get users to submit them. But nobody likes filling out forms, and autocomplete is getting smarter and smarter — but in my experience, it’s rarely perfect. So it’s nice to know that the HTML standard has added an
autocomplete attribute to form fields that makes it easier for browsers to guess what data goes where.
Google has announced that Chrome now fully supports this spec, and there’s another page for developers that talks about how to make forms friendlier.
If you have a very long list of options, neither <select multiple> nor <input type=”checkbox”> is quite ideal. This combines the two using jQuery.
When an option is selected, a checkbox (with label) is automatically created using the same “name” and “value” attributes. When the checkbox is un-checked, it fades away (after a brief delay) and is re-attached to the single-select.
A List Apart has an article today about how you can use CSS selectors creatively to “count” the number of elements inside another element. This would be useful if, for instance, you wanted to style elements of a list differently when there’s more than six of them in the list.
Here’s the CodePen if you just want to see it in action.
I put “right” in quotes because, well, I’m opposed to gimmicky animations in web pages on principle. However, if you have to use them, they should be done efficiently.
To that end, I found this article on Medium from May 2014 that has a series of tips, at least four of which I’ve put into effect just this morning and one of which I never even knew existed before today.
A friendly developer on reddit pointed me to tryGit, and I finally was able to get a toehold on learning to use Git for website development at work.
Next stop, the Git book.
I’ve mentioned responsive images before, but this article from A List Apart does an excellent job of going over all the techniques available today, what they do, and when you should use them.
I pondered several possible solutions, and decided on this one: Instead of inline images, which show a “broken image” icon when the image can’t be found, I’d use a fixed-size
div element and a
style attribute to add the employee’s photo as a
background-image. When the employee photo couldn’t be found, the background image would simply be invisible. Continue reading