Webdesigninformer.com

Snook Go to the source

Using CSS transitions can be quite fun. But what’s not fun is when you want to transition something that needs to use display:none or visibility:hidden (or really, any non-transitionable property). For example, let’s say you have a dialog. When the user clicks on the close button, you want the dialog to fade out — a simple transition from opacity:1 to opacity:0 . The problem is that the element is still there, even though you can’t see it… Read the rest here

Cameron Moll Go to the source

Of Mice and Markets : Zeldman: In the short run it’s going to be hell, just as the browser wars and their lack of support for common standards were hell. But it is the short run…. When I see fragmentation, I remind myself that it is unsustainable by its very nature, and that standards always emerge, whether through community action, market struggle, or some combination of the two. This is a frustrating time to be a web designer, but it’s also the most exciting time in ten years. We are on the edge of something very new. … Read the rest here

Mezzoblue Go to the source

Take it with the usual grain of salt that should accompany any news of global browser trends, but, extrapolating out from the 2011 trend in StatCounter’s Global Stats Chrome appears set to surpass IE as the most-used desktop browser some time next summer. And that will finally end the 13 year domination of the market by Internet Explorer. Though, I’m a little sad that Chrome’s market share is also coming at the expense of Firefox. … Read the rest here

Eric Meyer Go to the source

For very little reason other than I was curious to see what resulted, I’ve compiled a list of various CSS modules’ version histories, and then used CSS to turn it into a set of timelines . It’s kind of a low-cost way to visualize the life cycle of and energy going into various CSS modules. I’ll warn you up front that as of this writing the user interaction is not ideal, and in some places the presentation suffers from too much content overlap. This happens in timelines where lots of drafts were released in a short period of time. … Read the rest here

Cameron Moll Go to the source

A Farewell to CSS3 Gradients : Alex Walker: While the idea of programmable gradients is great, using them is seriously messy. Even in perfect-​​browser-​​utopia, gradients are consciously limited to rudimentary linear or radial application. You certainly can’t combine them, or make them contour a shape or anything useful like that…. In short, [CSS gradients are] a blunt instrument with cranky syntax and patchy support. … Read the rest here

Jason Santa Maria Go to the source

Golden Grid System , a folding grid for responsive design. I’m not big on frameworks, especially when we’re talking about baseline grids, but this one is really well done. And I can get behind this sentiment from its creator: “Take it apart, steal the parts that you like, and adapt them to your own way of working.” Plus it’s a beautiful design to boot. Be sure to resize your browser a lot and play with the little grid reveal button on the top right of the page. … Read the rest here

SimpleBits Go to the source

There’s no doubt that employing a mobile first , responsive design approach to a new project is a wonderful way forward for many sites. I think the most exciting thing about seeing these best practices develop over the last few years is that it finally feels like web design. Finally. That we’re not designing sheets of paper that happen to be on screen. So yes, for new projects under the right circumstances a responsive plan is often the ideal… Read the rest here

Cameron Moll Go to the source

Spin.js, a Loading Spinner Sans Images : Uses CSS3 to render the animation, falling back to VML for Internet Explorer (all the way back to IE6). 2.8K of total code and supported by newer versions of most browsers. /via @ jc … Read the rest here

Cameron Moll Go to the source

Amazon’s Kindle Cloud Reader : Neato. An in-browser reader. Now I can read my Kindle books on every piece of Apple hardware I own. Update: @ nicjohnson informs me they’ve already got Kindle for Mac in the App Store, while John Gruber explains why a non-native web app is probably a response to Apple’s new rules . … Read the rest here

Cameron Moll Go to the source

Redesigning the Browser Window : Henrik Eneroth: Most scre­ens today are widescre­ens, so why are we not put­ting the left and right hand sides of the screen to bet­ter use, ins­tead of for­cing eve­ryt­hing into a bar on the top of the window? /via Hacker News … Read the rest here

Cameron Moll Go to the source

How to Get the New Gmail ‘Preview’ Theme : I’ve been using this new theme for about a week, and it’s utterly fantastic. (I prefer the Dense version.) For the record, I’ve been using the gmail.com interface — not through an email client, but the in-browser version — since 2006. I’ve yet to find a more efficient interface for email, including Sparrow . I do, however, use Mailplane , which I’ve stuck with for about a year now. It helps with switching between accounts (easier than the Gmail option in the upper right), gives my mail a place in the dock, and retains the in-browser experience… Read the rest here

Eric Meyer Go to the source

Can CSS create art? That’s a question I set out to explore recently, and I like to think that the answer is yes. You can judge for yourself: Spinning the Web , a photo set on Flickr. To be clear, when I say “Can CSS create art?” I don’t mean that in the sense of wondering if art, or artful designs, can be accomplished with CSS. … Read the rest here

SimpleBits Go to the source

So I’ve been learning the banjo. At the beginning of 2011, I set out to learn something new—something that had nothing to do with pixels, browser bugs, typing, or angle brackets. I’m not calling it a resolution, as I can’t think of another resolution I’ve ever followed through on completely. But I’ve fallen through on the banjo. Specifically, clawhammer banjo, which is an old time style of playing without finger picks… Read the rest here

Cameron Moll Go to the source

I’ve had a BlackBerry PlayBook for about 24 hours now, and I’m fairly impressed. If history is any precedent, I’ll probably not make time for a full review, so my review in a tweet will have to suffice. The PlayBook was purchased to round out the devices I use for testing , specifically adaptive/responsive web design in this round of testing. Capturing screenshots is critical for sharing the results of my testing with the developers who assist me. Thankfully, taking screenshots on a PlayBook is a snap… Read the rest here

Cameron Moll Go to the source

CSS Mask-Image & Text : Here’s something I wasn’t aware of: Add a texture to HTML text using the CSS property mask-image and a transparent PNG. Currently works only in WebKit but degrades nicely for other browsers. Thanks, Trent. … Read the rest here

Hicksdesign Go to the source

Two media-centre related things I’ve done recently: Jailbreak my Apple TV to install ATV Flash Black , and update my Boxee Box to v1.1. Heres a quick report of how it went: First the ATV : When the beta of ATV Flash Black was announced last December, I looked into and disregarded, the jailbreak process. Too much hassle if you had updated your ATV from the factory supplied version. Now, the process is straightforward with Firecore’s Season Pass app and a micro-usb cable. Likewise, installing ATV Black was easy when following the instructions, and I was able to add extras onto my Apple TV. … Read the rest here

Snook Go to the source

Determining a unit of measurement to size our text can be a topic of heated debate, even in this day and age. Unfortunately, there are still various pros and cons that make the various techniques less desirable. It’s just a matter of which less-desirable is most desirable. There are two main techniques that are extolled: Size with px Size with em Let’s review these two approaches before I reveal the magical third. Sizing with px In the early days of the web, we used pixels to size our text. … Read the rest here

Cameron Moll Go to the source

Hiring: Lead Web Designer at Apartment Therapy : I have to admit I’m feeling a little special right about now seeing these guys post a listing on Authentic Jobs. I’ve been quietly following Apartment Therapy for several months, along with its sister site Unpluggd . What’s really exciting for me is that, while the content they post is fantastic, I’ve always felt the formatting and layout could use a little fine-tuning. Looks like that’ll be part of the job: The first job will be to join in our redesign process with our art director, Thomas Porostocky, and work through a complete redesign for launch in September. After that, you will be working on everything: site pages, email templates, cross browser compliance, media kits, and ad driven event campaigns… Read the rest here

Andy Budd Go to the source

The rise of smart devices like the iPhone and iPad has led to an application goldrush, with companies racing to stake their claims. In the early days we saw a few lucky pioneers strike gold with novelty apps. There were also a handful of independent developers and well-known brands that invested in user experience and captured the high end of the market. However, as with most goldrushes, the obvious targets were depleted very quickly. Digital prospectors are arriving to find a very different market, one rife with competition and few obvious deposits to mine. Furthermore, our appetite for apps seems to be dwindling as we fall back on a few must-have staples. … Read the rest here

Eric Meyer Go to the source

Over the weekend, Aaron Gustafson and I created a tool for anyone who wants to resolve a series of CSS transforms into a matrix() value representing the same end state. Behold: The Matrix Resolutions . (You knew that was coming, right?) It should work fine in various browsers, though due to the gratuitous use of keyframe animations on the html element’s multiple background images it looks best in WebKit browsers. The way it works is you input a series of transform functions, such as translateX(22px) rotate(33deg) scale(1.13) . The end-state and its matrix() equivalent should update whenever you hit the space bar or the return key, or else explicitly elect to take the red pill. … Read the rest here