Paul Boag on how progressive enrichment improves accessibility, reduces costs and ensures every user gets the best experience possible within the limitation of their choice of browser.
For A Beautiful Web blog archives
Effective browser support
A client-focussed copy style guide
By
Let's be fair, few customers are professional writers and few hire one when making a web site. That is why I now include professional copywriting into every estimate as a non-removable item. When customers are adding their own copy to a site, I give them ten simple tips to follow.
Has Barack Obama exhausted Gotham?
By
The United States' soon to President Barack Obama's choice of Tobias Frere-Jones' Gotham typeface has been well documented.
CSS SuperScrub
Reduces the size and complexity of your CSS by programmatically stripping unneeded content, stripping redundant calls, and intelligently grouping the remaining element names
.
(How to be a) Contract Killer
By
24ways goes from strength to strength each year and I was so pleased when Drew McLellan asked me back to contribute again.
The 11 Coolest Mugs for a Hot Cup o’ Joe
Collection of fab mug designs. I picked up the Alcatraz inmate tin mug when I went to the island this summer.
Shiny Happy Buttons
John Allsopp on taking a plain old boring HTML button, and 2.0 it up the wazoo over at 24ways.
Progressive enhancement with CSS3
Nick Cowie on how to make funky Web 2.0 buttons from text just using CSS that does not break in older browsers.
Typography is poetry (More on Typesetting The Waste Land)
By
Judging from the response from the people who attended, our first Visual Web Design Masterclass in London this month was a huge success. As a large part of the day was spent learning about typography, both relating to type and to layouts devised from typographic principles, I chose to illustrate the lessons by typesetting The Waste Land, a poem by TS. Eliot. If you weren't able to attend, now is your chance to take a look at the results of my experiments.
Not quite what I had in mind.
George Oates on being affected by the layoffs
at Yahoo. How companies, how people deal with tough times says a lot about them. Yahoo told the world not to trust them.
gridr buildrrr
Too many 'rrr's in this handy dynamic grid builder, but useful nonetheless. I do worry though that this 960 width grid approach is too quickly making people lazy about grids.
Everything You Know About CSS Is Wrong (book review)
By
One of the questions that I get asked quite frequently is until CSS3 moves forward, is there anything new we can say, or write, about CSS?
. That's a good question. Not as good perhaps as Why does Gordon Brown do that funny thing with his mouth?
or Would Eddie Izzard make a good Doctor Who?
, but quite a good question none-the-less.
HTML-ipsum
Lipsum.com has been in my bookmarks bar for just about as long as I can remember, but this is far handier. Great job by the guys from CSS Tricks
Video interview with Andy Clarke
I was interviewed during the Fronteers Conference in Amsterdam earlier this year after my talk on CSS positioning, Waiting For The Great Leap Forwards
Equal Height Columns with jQuery
If you are not ready to fix equal heights by using display:table;, this jQuery plugin might be just what you're looking for.
Widon’t
Love ExpressionEngine and typography, but hate widows? Eliminate widows in entry titles with the Widon't plugin.
Syncotype Your Baselines
From 2007, Rob Goodlatte and a useful typographic tool for working with baseline grids.
Guerilla venue switching
By
What would you do if with only minutes until your guests arrive for your first workshop event, your venue suddenly becomes unavailable? Would you panic?
Your (physical) music needs you!
Some people think that he was born on horseback. Others that he has no understanding of the word fluffy. All we know is that Gregory Wood designs a damn good blog post.
The Proof Is In the Pudding
Kyle Weens on his results with presenting designs to clients with XHTML/CSS prototypes, rather than static proofs. Good man.
Typesetting The Waste Land
By
With only a week to go until our first Visual Web Design Master Class in London, I've been taking time away from client work to focus on writing all new content that I hope people attending will really love.
Twitaway: The Art & Science of CSS — Free download
Follow @sitepointdotcom on Twitter and get The Art & Science of CSS by Jina Bolton and others for free. That's a bargain if you ask me.
Only two weeks and a handful of places to go
By
As I check off the days on my calendar, there are only two full weeks until our Visual Web Design Master Class in London on December 1st and only a handful of places still available.
A tribute to Microformats (a reader question answered)
By
Enrique Ramírez wrote to me yesterday with a few questions about Microformats and markup. I've been asked these questions before, a few times. So rather than send Enrique my answers on a postcard, I'm replying in public, with Enrique's permission of course.
More on developing naming conventions, Microformats and HTML5
By
It seems like a lifetime ago that I first sat down with a cup of tea and a bourbon biscuit and thought about the conventions that we use for naming HTML/XHTML id and class attribute values.
Who will watch the Watchmen
By
I promise. In the run up to the opening of the Watchmen movie next year, I will resist the urge to write about or link to every piece of Watchmen trivia.
News Designer
I find newspaper design incredibly inspiring. So what could be better than a web site about newspaper design?
Yes We Can
Front pages from top US newspapers on the morning after Barack Obama's election.
Have a beer with Karl Marx
By
Well not exactly. Herr Marx has been dead for 125 years, and anyway, I hear that he was often too poor to buy a round. Still, we think that we're showing solidarity to hold our Visual Web Design Master Class evening social in the beardy geezer's local boozer.
Web Content Accessibility Guidelines (WCAG) 2.0
WCAG 2.0 has just entered proposed recommendation status. For balance, see also the WCAG Samurai who published corrections for, and extensions to the Web Content Accessibility Guidelines 1.0.
Sleeveface
According to the blurb, one or more persons obscuring or augmenting any part of their body or bodies with record sleeve(s) causing an illusion
. Hilarious.
E-mail error ends up on road sign
Bilingual signs are one of my fiercest pet hates. While they are almost always horrifically designed (and make me want to scratch my eyes out with a blunt compass), this story made me smile. (via)
Making Web Fonts Work
Jon Tan with an exhaustive, beautifully researched look into the state of font embedding.
The Mysterious ‘Save For Web’ Color Shift
Viget Labs make the Save For Web web world a safer place for colour.
Prototyping with XHTML
Anders Ramsay and Leah Buley on what it means to prototype with XHTML.
sIFR 3 r436, thoughts on font embedding, presentations
Mark Wubben curator of sIFR with his thoughts on font embedding and its alternatives.
ExpressionEngine Developer’s Toolbox
How could I not link to Smashing Magazine's err, smashing, list of Expression Engine resources?
Double Down or Batten Down?
While not quite design related, my friend Howard Mann has essential advice for any self-employed designer or business person.
Text-Shadow In IE With JQuery
Firefox 3.1 is coming and three of the four major browsers will then support text-shadow. Here is a jQuery plugin that simulates text-shadow in Internet Explorer.
CSS3 box-sizing attribute
Helen from Helephant.com writes a good introduction to the CSS3 box-sizing property.
The origins of Watchmen
The Guardian presents preliminary designs and early sketches which chart the development of the Watchmen alternate reality
Vintage and Retro Typography Showcase
Smashing Magazine go retro, finding beautiful examples of vintage typography and the modern work they’ve inspired.
Is CSS3 RGBa ready to rock? (screencast)
By
Who said that you can't teach an old rocker new tricks? At An Event Apart Chicago, it was Dan Cederholm's latest talk example, Color Transparency With RGBa that made me sit up and take notes.
Jeff Croft on Elegant web typography
Jeff Croft on elegant web typography from Web Directions South 2008 in Sydney. Check out the presentation slides and audio.
MSDN Conditional Comments
Not new, but a full set of Conditional Comment examples including some that I had not discovered before, including subexpressions and operators like [if (gt IE 5)&(lt IE 7)]
CSS Browser Selector
If you liked Conditional CSS, but would prefer a very lightweight (1k) Javascript solution. CSS Browser Selector is a very small javascript with just one line and less than 1kb which empower CSS selectors. It gives you the ability to write specific CSS code for each operating system and each browser.
Goodbye, old 500 page
Carsonified on the design of a page that hopefully no one will see. Lovely.
JavaScript Will Save Us All
Eric Meyer on how JavaScript will help us to push CSS standards support forward now I'm with Eric, I can’t wait for Sizzle to be finished and I’m absolutely going to use implement it into my own development framework.
A Some Clients Are Stupid story
By
In what I hope will not be a series about the stupid things that clients complain about.
Wilson Miner redesigns
I have always admired Wilson Miner's personal and commercial work and his new site is everything I would expect from him. It's a temple to perfectionism and thoroughly refreshing and inspiring.
Stephenfry.Com 2.0
The inimitable Stephen Fry's site has undergone a redesign. I love his work and this new site is a huge improvement.
Cameron Moll’s web accessibility checklist
From his talk at An Event Apart in Chicago, Cameron Moll's web accessibility checklist.
Watching the Watchmen
By
If you attended An Event Apart in either Chicago or New Orleans, or @media in London this year, you might have seen Underpants Over My Trousers, my talk about how comic book design conventions and principles can influence web page design.
Iced or Hot
Dan Cederholm's caffeine-tastic new demonstration site from An Event Apart in Chicago.
-moz CSS Transforms
In case you missed them (I did), the CSS transformations first proposed and implemented in Webkit have come to Gecko nightly builds.
Is There Anything You Wish CSS Could Do? 15 Designer/Developers Sound Off
Fifteen designers (including yours truly) on what they wish that CSS could do.
Are CSS tables ready for prime time?
By
I was lucky to be sent a preview copy of Rachel Andrew's soon-to-be-published book Everything You Know About CSS Is Wrong!, published by those nice chaps at SitePoint. I'll be writing a full review later this week, but as the book is largely (almost exclusively) devoted to CSS display : table; properties, I couldn't wait to try out some of the techniques she advocates.
devot-ee
devot-ee.com aims to be the definitive non-EllisLab run resource for all things relating to ExpressionEngine
. I'm looking forward to seeing how this ExpressionEngine resource shapes up.
Retro and Vintage In Modern Web Design
A showcase of 50 beautiful retro, vintage and renaissance designs
on Smashing Magazine. I'm so very tired of these list style posts, but this one features some nice site designs.
Pens Are My Friends (book review)
By
It's lovely to come home and find something nice waiting for you, isn't it? A nice cup of freshly brewed tea is lovely (nicer with biscuits, but not so common). So is a nice piece of ginger cake with lemon icing. A smiley lady is nice too. I got all three today (which was lovely), but what made it lovelier was a copy of Jon Burgerman's retrospective book of his illustrations, Pens Are My Friends.
iPhone supports full-screen web apps
Worth noting: If you add <meta name="apple-mobile-web-app-capable" content="yes" /> to your web app pages, if you use the Add to Home Screen feature, it will launch as its own standalone app, with no Safari browser.
WallSwaps
Simon Collison, Greg Wood and the team at Erskine Design present WallSwaps. If web sites were cakes, this one would be chocolate with Smarties on.
Win a copy of Inspired Design (DVD) and Transcending CSS
By
I am really, really pleased that places on our Visual Web Design Master Class are selling fast. Book your place before 10th October 2008 and you could win a copy of Inspired Design (DVD) and Transcending CSS (book), together worth £68.00*.
The Ol’ College Try (CSS/HTML Prototyping)
Kyle Weens follows up with real experience of not showing client static design visuals. "My prediciton is that by using this technique we'll end up saving hours on the final product". I'm looking forward to reading more about Kyle's experiences.
CSS Systems for writing maintainable CSS
Clearleft's Natalie Downe on CSS libraries at Barcamp 5 London. It's great to be reminded about my Web Standards Trifle from February 2005.
Vintage Motoring Maps
Jon Hicks, that gentleman of British web design, has Flickred his collection of vintage motoring maps.
Jeff Croft on the no static visuals conversation
Jeff Croft continues the no static visuals conversation. "Figuring out how to actually make [them] work within your business model is harder. If you can pull it off, awesome."
Web Design is 95% Typography
"95% of the information on the web is written language. It is only logical to say that a web designer should get good training in the main discipline of shaping written information, in other words: Typography."
Gustavo Pimenta’s Design Solutions screengrab Flickr set
Gustavo Pimenta screenshots web interfaces. "I've a confession to make: I'm addicted to screenshots, it is stronger than me, I can’t help it..." Priceless. (via)
Understanding Disabilities when Designing a Website
"This article will explain some simple techniques which, if incorporated into the design of a website, will enhance its accessibility and usability for people who have a vision, hearing, physical, cognitive, or learning disability." It's lovely to see new articles about accessibility still being written.
Five CSS design browser differences I can live with
By
Web designs need not look exactly the same in all browsers. I know that's a topic I have written about and spoken on a fair amount before, but somehow I'm always amazed by the reactions that I get when the subject comes up.
Using jQuery for Background Image Animations
After reading Dave Shea's article on CSS Sprites using jQuery to produce animation effects, Jonathan Snook takes things one step further. As Dave Shea himself says in the comments. Wow, this is simpler and more elegant than my article for sure.
Nice.
Time to stop showing clients static design visuals
By
Demonstrating our designs to clients as XHTML/CSS pages rather than as static Photoshop or Fireworks has streamlined our workflow and helped us to set and manage a client's expectations better than ever before.
What advertising can’t fix
Seth Godin on Microsoft and why buying ads pretending to be something you're not is a waste of money.
Vitor Lourenco
A new name to me, South American designer Vitor Lourenco is responsible for the look and feel of the new Twitter redesign. One to watch.
Tiling Backgrounds in Internet Explorer
Jonathon Snook tackles the problem that CSS background images specified in the <tr> gets displayed as if set for each <td>. Handy if you subscribe to the notion that web sites should look the same in all browsers.
Anchor Buttons
Dave Shea with a solution for anyone who is bored to tears of simple border and background colour styling for button formatting.
Typechart
Typechart lets you flip through, preview and compare web typography while retrieving the CSS. A very clever idea and beautifully executed.
How to create a set of Photoshop grunge brushes
Another one of Veerle Pieters' excellent Photoshop tutorials. Read the article, download the brushes, go grungy.
Minimal design css gallery
"Less is more. We believe in it. Doing more with less, that's our goal."
Arjan Eising on Fronteers 2008
It was a great pleasure for me to close the show at Fronteers 2008, the first web conference of its kind in Amsterdam.
Firefox is missing the point
The one, the only, Seth Godin on growing Firefox use: "Firefox needs to add functionality that makes the surfing experience better for all users when more users use Firefox."
Attack Of The (Lightbox) Clones
If JavaScript/CSS popups are your thing, then this comparison of thirty-plus scripts by Planet OZH should be your thing too.
On Nails, Lipstick, and Redesigns
Boston based Ethan Marcotte returns on top form with a top class redesign. If you thought that grid-based and liquid layouts don't mix, think again.
The best conference schwag?
By
Having spoken at almost twenty major conferences in the last few years, I've picked up a fair selection of schwag items and giveaways. Now that we are busy organizing our first For A Beautiful Web events, I'd love to know what the best shwag items you've received are.
Introducing For A Beautiful Web
By
It's been on my mind for a while. In the last few years I've been one of the luckiest web designers on this planet (and probably others) because I've been asked to travel all over the world to talk about web design, CSS and even comic books. I love every minute of it.
Designing For A Beautiful Web
By
When I set out to design the site to launch For A Beautiful Web I knew that I wanted to set a new tone and arrive at something a little unexpected. One of the ways that (I hope) I have achieved that level of unexpectedness was to turn to a classically trained artist, rather than a web designer for creative direction.
(Exclusive) Conditional-CSS for Safari Touch
By
Want an easier way to re-style and optimize your pages to work better in Safari Touch (or Mobile Safari if you prefer) on the iPhone or iPod Touch? I did and now with a custom version of Allan Jardine's Conditional-CSS I have it. And you do too.
Activate The Death Ray, Microformats workshop example site
By
Back in April, I was booked by Carsonified to present a half-day workshop on Microformats as part of their Future Of Web Design London spectacular. So what have Microformats got to do with death rays?
I Keep Faith, CSS workshop example site
By
Having been booked by Carsonified to host a full-day workshop on advanced CSS back in May, in the weeks leading up to the show I had a flash of inspiration. Why not combine one of my favourite topics with one of my favourite musicians?
CSS constants with SSI
An interesting solution for simple CSS variables using SSI (on Apache) for easier maintaining of CSS files.
Implementing Design: Bulletproof A-Z
Jeremy Keith live-blogs Hard Man Dan Cederholm's Implementing Design: Bulletproof A-Z from An Event Apart
Storytelling by Design
Jeremy Keith on Jason Santa Maria's Storytelling by Design presentation from An Event Apart. Jason will be repeating his talk alongside me at An Event Apart Chicago in October.
The Lessons of CSS Frameworks
Jeremy Keith rounds up Eric Meyer's round up of CSS frameworks from An Event Apart. Me? I use a modified version of Blueprint's typography baselines, but I steer clear of its nasty, presentational grids implementation.
From the people behind For A Beautiful Web and Stuff and Nonsense. You will find news about our events, links to sites and articles elsewhere that have inspired us, plus original articles and screencasts on the creative and technical sides of web site design and development by Andy Clarke and others.