Instant Install

Tired of uploading and unzipping the latest build of your favorite CMS when you start a new project? Here's a time saver, just upload one php file and click a button. Instand Install from 9miles Media (NC). It loads the latest to your server and unpacks it, then takes you to the install page to connect to the database! I was floored when I first tried it with how fast it worked. I was finding that I did this so often and got tired of waiting for all the files to upload, since I can't unzip a file via transmit, and I was searching around to find a terminal tutorial to hlep me learn to do this via the command line… But this app came up in a post and I tried it, which proves that I can continue to avoid the terminal in favor of using better designed (at least as fast) solutions. =)

Anyone have any experience with the app or any others they prefer (or even a detail to how to do it via command line)?

Embedded Link

Instant Install – Quickly and easily install WordPress, Drupal, Joomla, and more
An easier way to install web applications.

"Common" Breakpoints are missing the point

Great article from Jeremy Keith about the nonsense it is to use breakpoints determined by devices. The whole point of responsive web design is to make your designs flexible. Let's not only target certain widths, let's just finish the thought and make it a great experience no matter what width it is. Let the content determine the breakpoints.

Embedded Link

Adactio: Journal—Fanfare for the common breakpoint
“Common” breakpoints are the new fold.

Is webkit the new ie6?

All browsers are on the verge of implementing the webkit vendor prefix because developers have been building for webkit only specifically. This old article from Bruce Lawson (of Opera) rings even more true today. He states that the horrid broken non standard state of the ie6 web was not always seen as that. IE6 was the first to support many features of CSS and honestly was a step in the right direction. The main problem was that it was only one step, and then no more for years. The web dev community built according to the browser rather than according to standards! Doing this created the trap that is IE still today, as it's forced to support old specific non-standards code as well as future thinking standards based and everything between. Let's build for standards and let the browsers support it rather than bend to each browsers whim and build for them specifically. This creates a disjointed complicated setting where we worry about browsers and OS still. In a time when we are diverging and numbers of browsers and devices are compounding, standards is our sanity! Please, for the sake of … well, standards!

Embedded Link

Bruce Lawson’s personal site 
: In praise of Internet Explorer 6

Bruce Lawson's blog, focussing on web accessibility, web standards, travellers tales, and music

Boston Globe Responsive Process Interview w Scott Jehl

Some good insight into the thought process behind the "famous" responsive web (re)design for the Boston Globe. I think the discussions about the fallbacks and technical challenges very important. Sites should be optimized to have a low overhead and build with the worst oldest devices in mind as well as the latest and best.

Embedded Link

Scott Jehl on the responsive Boston Globe site | Interview | .net magazine
Opera’s Bruce Lawson talks to Scott Jehl of The Filament Group about developing the highly-regarded and responsive website for The Boston Globe

CSS3 Only Cycle

Here is a great example but an even better writeup on the full process. Some great details on the inner working on css3 animations and the different browser implementations. It's amazing the things that css can accomplish now, especially when we don't support ie! Jokes!

Embedded Link

A Pure CSS3 Cycling Slideshow | Smashing Coding
Thanks to CSS3, we can create effects and animations without using JavaScript, which will facilitate the work of many designers.

Exploring the Javascript requestAnimationFrame API

Here's a great overview and explanation of the new-ish requestAnimationFrame API for javascript. This makes the animations happen in sync and controlled by the browser. This is something that will really help javascript come up to par with animations we are used to and use hardware acceleration. Although it still requires vendor prefixes for all browsers there is a polyfill available to make it happen. I want to see some more demos, (the one linked here in jsfiddle –http://jsfiddle.net/wMkJg/ is more jumpy than my first flash animation 7 years ago).

Embedded Link

requestAnimationFrame — The secret to silky smooth JavaScript animation
Do you often find yourself lying awake at night wondering how you, too, can get your JavaScript animations to be as smooth as those silk sheets of yours? I can’t say for certain that all of us on the CreativeJS team actually have silk sheets, but we did want to show you how to make your animations rock, so we created a page over in our Resources section dedicated to the new(ish) requestAnimationFrame API. Go take a look!

Responsive Images Recap

Here's another recap on the state of responsive images. This one from the Filament Group, who was involved in the Boston Globe redesign. It discusses their solutions and the problems with them and then the newly suggested picture html element and a call for the need of bandwidth detecting media queries. I'm still concerned about bandwidth detection. I think somehow there should be a setting that lets users decide if they want high res images (when supported) or the faster low res images. If I'm just browsing on a laptop tethered to a phone with 4g and paying for every kilobyte, I may not want to download a large image just because I can. I agree we need better ways to server appropriately sized images, but I don't want to force anything on a user. Although a popup asking them if they want every large image is not practical either… I'm glad this discussion is continuing though!

Embedded Link

The state of responsive images | Feature | .net magazine
Designer/developer Mat “Wilto” Marquis takes a look at the img tag, explains why a largest-size-fits-all approach to images is untenable and discusses different solutions in this ongoing saga

The CSS Vendor Prefix Debacle continues

The Opera Browser will soon be released to support the webkit prefix, which was designed and spec'ed to only be supported for css properties in development by webkit browsers (safari and chrome). Who is to blame? Opera points the finger squarely at webkit for not following standard procedures and at developers who aren't writing according to standards and aren't even including the prefix-free version of properties in their code. I'd be interested in seeing some real data as to how many sites are doing this and what properties they are using. It seems like a horrible practice and I've not met anyone who's fessed up to doing it on production level projects. They should be at least using the non vendor property and are most likely using some sort of starte package, boilerplate, framework or preprocessor or tool that does all the prefixing for them. So where's the data?

Embedded Link

Opera confirms WebKit prefix usage | News | .net magazine
Open web under fire as Opera argues author errors forced its hand

TILT your website with CSS

Great bookmarklet to apply a 3D tilt effect to any site. Reminds me a bit of the upcoming firefox inspector 3d view how it shows the DOM structure with nested items at a higher depth. I hope no one ends up using something similar to make the page rock like the ocean: I can't imagine trying to read while getting seasick. Maybe it would be applicable for a game or something…

Embedded Link

CSS Tilt
We're not quite at the stage where we can fly through the Internet in 3D à la Johnny Mnemonic, diving between skyscrapers of data and a

Separate HTML and CSS for fast clear & clean code

Another great article from Jonathan Snook reasoning thorugh the benefits of specific css class selectors with some good examples. Really calls to mind his SMACSS principles I've been loving.

Embedded Link

Decoupling HTML From CSS | Smashing Coding
For years, the Web standards community has talked about the separation of concerns. Separate your CSS from your JavaScript from your HTML. We all do that, right? CSS goes into its own file; JavaScript…