Posts Tagged html

UX Developer is a misleading and potentially damaging job title

Andy Budd Go to the source

I was really disappointed to see a recent post from somebody I admire and respect defend the validity of the new UX Developer job title that has been cropping up of late. As well as being misleading, the title, UX Developer has implications that are damaging to the field of User Experience and will hasten the current devaluation of the term. Despite what many newcomers to the industry may think, User Experience Design is a well-defined specialism as distinct from visual or interface design. The practice of user experience design is a specific field of study with its own books, conferences, membership organisations and college courses. User experience designers therefore have a distinct set of skills and practices that form the core of their profession. That being said, user experience designers don’t own these practices any more than developers own the ability to code up wireframes. … Read the rest here

Naming Convention in CSS

Snook Go to the source

My mind is on CSS quite a bit these days. At Shopify , I’m jumping into projects that already well under way. As a result, it’s been a great way to look at what I wrote in SMACSS and see how applicable it is to yet another project. (As if Yahoo! wasn’t already enough of a testing ground.) With Yahoo!, I (and a team of people) were writing the CSS from scratch and creating our mental map of the project as we went along. Jumping into the middle of a project as I am at Shopify, I have to try and figure out why things are done the way they are. Here’s an example of something that I ran into in the CSS: #loading-header .loading { background: url(spinner.gif) no-repeat 0 0; } [...separated by a few pages of code...] #content { [...separated by more code...] #loading-header { display:none; } .row { display:block; } &.loading { #loading-header { display:block; } .row { display:none; } } } The loading class has a spinner… Read the rest here

Bulletproof Web Design, Third Edition

SimpleBits Go to the source

Yesterday, a copy of my latest book arrived in the mail, the Third Edition of Bulletproof Web Design . The first edition came out back in 2005, and I’ve been revising it every few years. This latest edit was a bit larger than the 2nd because so much has changed. HTML5, CSS3, Responsive Web Design—all of these things dovetail nicely into the core bulletproof concepts from the original book. If you have the 2nd edition, the new version is likely not a necessary upgrade (New Riders probably loves me for saying that). Meaning, the guidelines for building flexible websites are still there, but a lot of the code and some of the examples have been brought up to speed. … Read the rest here

Displaying Icons with Fonts and Data- Attributes

Hicksdesign Go to the source

Todays 24ways article is Displaying Icons with Fonts and Data- Attributes , taken partly from Chapter 6 of the upcoming Icon Handbook , but rewritten to fit to the 24ways format. Instead of using the traditional route of PNG s, web fonts offer a scalable and resolution independent solution. Combined with HTML5 data attributes, you can create one CSS rule to style them all in one go. This article covers both the advantages and disadvantages of the technique. Thanks must go to Drew Wilson who helped me understand how to use data attributes. He created Pictos the excellent icon font used in the article, and his experience in making Pictos was a valuable source of research… Read the rest here

Kafkaesque

Jason Santa Maria Go to the source

These upcoming Kafka covers by Peter Mendelsund are really lovely. These beautiful stark shapes and colors make them unexpected, but also totally on the mark. Also, they make use of FF Mister K , a typeface based on Kafka’s handwriting. That’s one of the few appropriate uses for a handwriting font, and it really works here. via Jacket Mechanical … Read the rest here

Pattern primer

Adactio Go to the source

I’m on a workshopping roll. Fresh from running my Responsive Enhancement workshop in Belfast , I’m now heading to Düsseldorf for Beyond Tellerand where I’ll be running the workshop on Sunday (and if you can’t make it, don’t forget that you can book the workshop for your own workplace too). As part of the process of building a responsive site from the content out rather than the canvas in, I talk about beginning with the individual components divorced from any layout context. Or, as Mark puts it, “start with the bits.” That’s the way I’ve been starting most of my projects lately: beginning with the atomic units of content and styling them first before even thinking about layout. This ensures that those styles are extremely robust—because they don’t depend on any particular context, they can be safely dropped into an part of a part. I’ve been calling this initial collection of markup snippets a pattern primer… Read the rest here

The Survey, 2011

Eric Meyer Go to the source

Back on Tuesday, A List Apart opened the 2011 edition of The Survey for People Who Make Web Sites , the fifth annual effort to learn more about the people who work in the web industry. If you haven’t taken it yet, please do so! It should take about ten minutes I’m proud to have been a part of this effort since its inaugural launch back in 2007. It’s a major undertaking, mostly in analyzing the data and turning that into a detailed report, but it’s more than worth the time and effort. Before the Survey, we really didn’t know very much about who we were as a field of practice, and without it we wouldn’t have as clear a picture of who we are today. There have been growing pains, of course, chief among them UCCASS , the survey software we’ve been using since the outset. Its limitations and lack of updates finally pushed us to find another platform, and we chose to move over to Polldaddy . … Read the rest here

Pursuing semantic value

Adactio Go to the source

Divya Manian , one of the super-smart web warriors behind HTML5 Boilerplate , has published an article on Smashing Magazine called Our Pointless Pursuit Of Semantic Value . I’m afraid I have to agree with Patrick’s comment when he says that the abrasive title, the confrontational tone and strawman arguments at the start of the article make it hard to get to the real message. But if you can get past the blustery tone and get to the kernel of the article, it’s a fairly straightforward message: don’t get too hung up on semantics to the detriment of other important facets of web development. Divya clarifies this in a comment : Amen, this is the message the article gets to. Not semantics are useless but its not worth worrying over minute detail on. The specific example of div s and sectioning content is troublesome though… Read the rest here

My New Ride

SimpleBits Go to the source

A month ago I made one of the best purchases I’ve made in a long time. I bought a kick scooter . Not one of those aluminum things with rollerblade wheels where the handle is so short you have to hunch over—but a scooter built for adults. Check out this video that shows how the KickPed operates—particularly how it folds up. … Read the rest here

Gavin Rothery

Jason Santa Maria Go to the source

Gavin Rothery’s site is my new favorite blog. He’s the visual effects supervisor from the excellent 2009 film Moon , and he posts behind-the-scenes tales from his favorite sci-fi films and rundowns of other special effects designers, and all his posts include cast photos and conceptual artwork. So much to love here. Here are some recent favorites on Star Wars , Alien ( x2 ), and Blade Runner , but there is a wealth of good stuff in the archives. … Read the rest here

CSS Modules Throughout History

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

Illusory Typography

Jason Santa Maria Go to the source

Stephen Doyle, that super smart guy that everyone loves, created some lovely tape illustration/lettering/installations for a New York Times Magazine story this weekend. Lots of people do these type illusions, but few do it this well. Check out the tape on the skeleton’s ribs! I want to be Stephen Doyle when I grow up. Also, don’t miss the behind the scenes video. … Read the rest here

Un-fixing Fixed Elements with CSS Transforms

Eric Meyer Go to the source

In the course of experimenting with some new artistic scripts to follow up “ Spinning the Web “, I ran across an interesting interaction between positioning and transforms. Put simply: as per the Introduction of the latest CSS 2D Transforms draft , a transformed element creates a containing block for all its positioned descendants. This occurs in the absence of any explicit positioning of the transformed element. Let’s walk through that. … Read the rest here

Designers vs Coding

Cameron Moll Go to the source

Designers vs Coding : Frank Chimero, a relatively recent convert to HTML/CSS: Good design and good markup provide structure to content. Good markup is a fundamental part of good design: beautiful on the inside, beautiful on the outside. … Read the rest here

Drummers are Natural Intellectuals

Cameron Moll Go to the source

Drummers are Natural Intellectuals : Of course they are, silly. /via @ scottboms … Read the rest here

New Oliver Sacks book covers

Jason Santa Maria Go to the source

Lovely new Vintage series covers for Oliver Sacks designed in-house by Cardon Webb. via John Gall … Read the rest here

Hiring: Front-End Designer/Developer at Roland

Cameron Moll Go to the source

Hiring: Front-End Designer/Developer at Roland : I’ve played a number of Roland keyboards over the years (I play only a little piano, and mostly by ear). The touch-sensitivity nearly rivals that of a real piano. And I swoon over their V-Drum kits every time I’m in a music shop, equally matching the sensitivity and touch of a “real” kit. This is a contract position in Los Angeles and involves work on the company’s web properties, including mobile. jQuery/HTML/CSS know-how a must. … Read the rest here

“In a Word: PERSIST.”

Cameron Moll Go to the source

This morning I tweeted about a lack of inspiration and having to trudge through it. In response, @brainhofj tweeted about the following: This handwritten letter is by Austin Madison, Pixar animator of Rex, the green dinosaur in the Toy Story series (among other characters he’s designed). Madison’s letter is a submission to the Animators Letters Project , and it so eloquently described what I was attempting to say in 140 characters. Here’s page one: I, like many of you artists out there, constantly shift between two states. … Read the rest here

How to Get the New Gmail ‘Preview’ Theme

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

Win a Fontdeck Gift Box

Cameron Moll Go to the source

Win a Fontdeck Gift Box : I was lucky enough to receive a Fontdeck gift box (pictured above). They have just three remaining, and each includes a $50 voucher, t-shirt, surprisingly delicious chocolate letters, and more. Enter by creating an HTML typographical piece using two Fontdeck fonts, such as these sample cards (of which printed versions are included in the gift box). /via Mark Wyner … Read the rest here