Webdesigninformer.com

Mezzoblue Go to the source

I’m probably way behind the curve on this one, but I recently realized the following: All browsers that support the CSS text-shadow and box-shadow properties also support the new CSS3 RGBa syntax. Which means you can safely combine them today. That’s handy, because it means no worrying about matching a precise hex colour shadow to a specific hex colour background. Instead just let the browser blend. An example: p { text-shadow: rgba(0, 0, 0, 0.2) 0 1px 0; } That will produce a paragraph with a 20% opacity black drop shadow that will blend into any background colour below it. … Read the rest here

Cameron Moll Go to the source

CSS3D: Stereoscopic 3D Effect with CSS3 : 3D red-cyan glasses required. … Read the rest here

Cameron Moll Go to the source

The Declaration of Independence, Rendered with CSS3 and @font-face : The markup is fairly clean, but still somewhat presentational. On the whole, however, this is nicely executed. … Read the rest here

SimpleBits Go to the source

Louis Harboe has recreated 11  iOS icons using nothing but CSS . Incredibly impressive. … Read the rest here

Eric Meyer Go to the source

All of a sudden, people have been asking me to yak about myself and stuff that I know (or at least think I know). These things tend to come in waves, and right now I’m surfing like a search engine’s crawlerbot. I don’t think that metaphor made any sense at all. Anyway, here’s what I’ve had to say so far: The Geek Talk: Eric Meyer — a brief e-mail interview I did a week or so back. Want to know my favorite color… Read the rest here

SimpleBits Go to the source

CSS3 flash light : Another impressive demo from simurai (Safari only right now). … Read the rest here

Cameron Moll Go to the source

Firefox 4 to Add CSS3 calc() : Paul Rouget, Mozilla: This feature hasn’t landed yet in any Firefox tree but work to implement it is underway. Firefox will support the CSS calc() value, which lets you compute a length value using an arithmetic expression. This means you can use it to define the sizes of divs, the values of margins, the widths of borders, and so forth. Ace. … Read the rest here

Cameron Moll Go to the source

The Design Cubicle : A fantastic redesign by Brian Hoff; a suitable example of the reasoning behind the design: Even if living on the bold side of things isn’t for you, try at least one thing different in your next work and build around that idea. Without push[ing] boundaries the world around us remains stagnant and lifeless. Also check Trent Walton’s write-up on creating the logo entirely with CSS and @font-face . … Read the rest here

SimpleBits Go to the source

Responsive Web Design : Ethan Marcotte raises the bar regarding flexible web design with CSS3 media queries and other magic. … Read the rest here

Mezzoblue Go to the source

You thought our long nightmare of PNG alpha transparency support was finally over as of IE7, didn’t you? Yeah, me too. Over the past few months I’ve been collaborating with Chris Glass on the newly-launched Joyent site. (When someone comes to you and says, hey, we have Chris Glass helping us out with this project and we’d like the two of you to work together, you jump at that chance.) I was tossing around ideas for building an interactive infographic Chris had designed, and thought of at least four different ways of pulling it off. We’re reaching this interesting point with front end web technology where we now have actual choices besides Flash for jobs like this… Read the rest here

SimpleBits Go to the source

HTML5 Readiness : Handy chart detailing comment HTML5 and CSS3 support in major browser engines. … Read the rest here

Adactio Go to the source

I spent the weekend immersing myself in HTML5 and CSS3. I gave Principia Gastronomica a bit of a fine-tuning under the hood. I decided to ditch all the background images I was using to get rounded corners and drop shadows, and just use border-radius and box-shadow instead. Internet Explorer gets the same content with more pointy corners and without the illusion of depth. I also launched a brand new site: ScienceHackDay.com … Read the rest here

Cameron Moll Go to the source

Which Email Clients Support CSS3? : With the current minimal support for CSS3 in most email clients, the easy counter-argument here is typically, “Why bother?” But I share the same views as Ros Hodgekiss, who authored the article: Finally, just as many of the properties we have tested are considered to be experimental, we encourage you to be experimental, too. As more email clients join the fray, CSS3’s applications in email will certainly become wider-reaching than pretty shadows and rounded corners. So, take a look at the properties available to you, test it out and share your own experiences. There’s never been less of an excuse for creating a dull email! If you and I aren’t willing to explore graceful degradation and encourage email clients to adopt new features sooner than later, who will? … Read the rest here

Cameron Moll Go to the source

New HTML5 Form Field Type: range : Amidst all the HTML5 buzz over the past year, somehow I missed this: HTML5 offers a new input field type, type=”range” , which renders a UI slider for entering data anywhere between the min and max values you specify. This feature could become as useful as CSS multiple backgrounds, in that a) it’s long overdue and b) we’re already faking it all over the web. The HTML5 presentation from which this slide was taken, by the way, is wonderful. It’s an interactive teaching tool on the subject of HTML5, CSS3, and JavaScript APIs. Slide 41 is really wild—press 3, then arrow left or right. Update: I failed to mention these slides are best viewed with a browser that already supports these features, i.e… Read the rest here

Cameron Moll Go to the source

The central theme of Mobile Web Design was carefully and thoughtfully built on the assumption that the browser will always provide the most consistent, reliable medium for users of web content, and the most open and sustainable platform for developers of the same—all thanks to HTML, CSS, and web standards. Additionally, I argued that “smart clients” (lightweight apps installed on a device whose content is primarily fed by and stored in the cloud) would and should remain secondary to providing the same experience in the browser, again for the reasons mentioned above. Since the release of iPhone and now with the release of iPad, I’ve gradually found myself questioning more and more the assumption I made. Apple has consistently proven that holistically controlling the entire user experience—inclusive of hardware to software and everything in between—has the potential to yield a more pleasant experience overall. Think of Mac OS + Mac, iPhone OS + iPhone, and now iPhone OS + iPad… Read the rest here

Cameron Moll Go to the source

iPad Ready Websites : Apple: iPad features Safari, a mobile web browser that supports the latest web standards—including HTML5, CSS3, and JavaScript. Here are just a few of the sites that take advantage of these web standards to deliver content that looks and functions beautifully on iPad. They’re speaking our language. I’m listening. /via Daring Fireball … Read the rest here

Cameron Moll Go to the source

HTML5/CSS3 Browser Compatibility Checklist : Handy resource. … Read the rest here

SimpleBits Go to the source

Another nifty CSS3 experiment by David DeSandro. Be sure to read the explanation which has some good best practice info…. Read the rest here

Cameron Moll Go to the source

IE9 Preview Available for Download : Or, in Microsoft speak, the “Internet Explorer Platform Preview” is available for download. Microsoft has been touting HTML5, CSS3 (partial), and SVG support with the upcoming overhaul of its browser. But not without controversial feedback from the developer community, including this observation from Jeffrey Zeldman: By torturing the IE rendering engine every couple of years instead of putting it out of its misery [by switching to Webkit], Microsoft contributes to the withering away of its own monopoly. That might not be good for the shareholders, but it is great for everyone else. … Read the rest here

SimpleBits Go to the source

Handy cross-browser, CSS3 rule generator tool…. Read the rest here