Posts Tagged css

Tools of a different trade

Adactio Go to the source

I was in Boston last week for An Event Apart , the second of five instances of the travelling web roadshow touching down in the US this year. As with Seattle, all the talks were of a ludicrously high standard. Tickets are still available for the Minneapolis leg ; grab ‘em while you can. What’s fascinating about seeing all the talks together is finding the unspoken connections between them. Without any prior co-ordination, myself and Aarron had moments of crossover with our talks, Emotional Interface Design and Paranormal Interactivity . Blenderbox have written a round-up of the themes from An Event Apart . … Read the rest here

The Design Cubicle

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

Responsive Web Design

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

IE8 Still Failing PNG Alpha

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

Filling in the Gaps

Snook Go to the source

HTML started as a very simple language. By many accounts, it’s still very simple. You create some text and you wrap some tags around it. The tags provide a small measure of meaning and allow user agents—aka browsers—to present the content in a meaningful way. In the early days of the web, browser developers quickly added features that helped web developers build more exciting sites and applications… Read the rest here

Handcrafted CSS Nashville: The Rebound Contest Winners!

SimpleBits Go to the source

The buzzer sounds. And the victorious have been chosen. Congratulations to the winners of last week’s rebound contest announced on Dribbble and Ethan’s blog . The entries were incredibly creative—thanks to all who entered. And we look forward to seeing you in Nashville next month… Read the rest here

HTML5 Readiness

SimpleBits Go to the source

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

A site for Science Hack Day

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

Handcrafted CSS Nashville: The Rebound Contest

SimpleBits Go to the source

With early bird pricing for Handcrafted CSS Nashville (a full-day workshop presented by myself and Mr. Ethan Marcotte ) winding down, we thought we’d run a little contest to giveaway two free tickets to the event on June 21st and other prizes. Ethan has all the details on how to enter : a Dribbble playoff of the beloved Baskerville italic ampersand. You don’t need to be a Dribbble member to enter! In fact, we’ll be giving away two Dribbble invitations as part of the contest. Hit us with your best shot, and hope to see you in Nashville next month ! … Read the rest here

Which Email Clients Support CSS3?

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

jQuery Masonry

Cameron Moll Go to the source

jQuery Masonry : I can’t explain it any better than its creator, David Desandro: Masonry is a layout plugin for jQuery. Think of it as the flip side of CSS floats. Whereas floating arranges elements horizontally then vertically, Masonry arranges elements vertically then horizontally according to a grid. The result minimizes vertical gaps between elements of varying height, just like a mason fitting stones in a wall. If TypeNeu were still up, you’d see a fantastic example of this kind of concept in play. … Read the rest here

New HTML5 Form Field Type: range

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

Organ Theme for Tumblr

Cameron Moll Go to the source

Organ Theme for Tumblr : From its creator, Simurai : Well, it’s more a CSS experiment that doesn’t use any JavaScript for the animation. Make sure you test it in Safari/Chrome. You can use this theme on your own tumblr blog, but keep its limitations in mind and at the moment it only supports picture posts. Design + interactivity = +1 … Read the rest here

iPad Orientation CSS

Cameron Moll Go to the source

iPad Orientation CSS : According to Jason Grigsby, WebKit on iPad honors CSS media query declarations based on orientation. As such, you can deliver different content based on portrait and landscape viewing by simply adding (orientation:portrait) or (orientation:landscape) to your link element. (See also Jason’s original post .) I … Read the rest here

Screw the Web

Cameron Moll Go to the source

Screw the Web : Faruk Ateş, adding fuel to the web vs. app debate: So screw the Web, for it is too limiting for us creators—be we designer or developer or content writer or otherwise—to build things that inspire and instill a sense of wonder in its audience. We should be thrilled by the iPad (and the new breed of similar devices soon to follow), because it offers us a chance to break free from our DOM-driven chains and CSS hackery and actually use a platform that’s designed from the ground up to deliver amazing user experiences. … Read the rest here

The Mobile Web vs. the Objective-C Web

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

iPad Ready Websites

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

Helvetireader 2

Hicksdesign Go to the source

Helvetireader², the minimal & anti-social theme for Google Reader, is now out . Sort of. It’s an unfinished and ongoing project, but it’s in a ‘ready as it’ll ever be’ state. Helvetireader is simply a hosted user stylesheet for Google Reader served via a user script. It aims to make the interface a clean, minimal experience where you’re not assaulted by an array of colours, lines, social features and buttons. As it removes these bits, and is designed for the expanded view only, you may not like it. … Read the rest here

HTML5/CSS3 Browser Compatibility Checklist

Cameron Moll Go to the source

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

Handcrafted CSS Nashville

SimpleBits Go to the source

I’m pleased to announce Ethan and I are bringing the Handcrafted CSS workshop to Nashville ! We’ll reprise of the one-day course we organized last September here in Salem, Massachusetts and again last November in London with Carsonified . As always, each attendee will get a copy of the book ( Handcrafted CSS: Video Edition including the DVD ) and we’ll spend the day walking through much of its content and more. This event was a great success in New England and Old England, and we’re thrilled to bring it south, to Tennessee. So join us on June 21st at the historic Hermitage Hotel right smack in downtown Nashville (steps away from the famed Ryman Auditorium and other sights). For more info on the event and to book a place (there’s a max of 100 spots), visit the Handcrafted CSS Workshop site . … Read the rest here