11:11:11

So what about 11:11:11 meaning If you are reading this then you and we are still fine and the earth didn’t blow up or aliens got side tracked and will only arrive tomorrow for your prophesied abduction. At least google managed to display an advert next to this entry, so they are also still here. Phew, thank goodness for miscalculations and misconceptions. Ha, yes and I’m also getting this post in early so that at least it starts showing up in search engines before the actual date. Search engine optimisation very competitive on niche keywords nowadays. Bookmark It Hide Sites

Web Governance: Becoming an Agent of Change

Shipping is easy, making real change is hard. To do meaningful web work, we need to educate clients on how their websites influence their business and the legal, regulatory, brand, and financial risks they face without strong web governance. Learn why web governance is important to us as web professionals and how to influence your clients to think carefully about how to align their websites to their business strategy.

Designing Fun

How do you define fun on the web? Fun means different things to different people. Debra Levin Gelman says that to create fun, we need to allow users to create, play, and explore. Learn how to help your client define fun, rank its importance on their site, and user test it to create a delightful experience, regardless of whether you’re designing for suits and ties or the sandbox crowd.

The UX of Learning

Think of the last time you ordered a book, booked a flight, or bought a car. How did you choose which book to read, where to go for vacation, or which car was best for you? You may have searched online, read reviews, or asked others for advice to help you make an informed decision. In a word, you learned. Learning is a complex process with distinct stages, each with corresponding tasks and emotions. Understanding how users learn can help us design experiences that support the user throughout the entire process. To design better learning experiences online, start by learning a thing or two about learning itself. Bookmark It Hide Sites

CSS3 Bling in the Real World

It’s here, it’s queer, get used to it! CSS3 is fun and fabulous, and if we design with progressive enhancement in mind, we can add all kinds of CSS wizardry to our websites and applications without worrying about how things work (or don’t) in old browsers and outdated devices. But what happens if our audience includes folks who use non-Webkit-powered phones? And what if our clients still believe a web page is supposed to look and work the same in every device? Learn to make CSS3 yumminess as cross-browser as possible. Bookmark It Hide Sites

More Meaningful Typography

Designing with modular scales is one way to make more conscious, meaningful choices about measurement on the web. Modular scales work with—not against—responsive design and grids, provide a sensible alternative to basing our compositions on viewport limitations du jour, and help us achieve a visual harmony not found in compositions that use arbitrary, conventional, or easily divisible numbers. Tim Brown shows us how. Bookmark It Hide Sites

Conversation is the New Attention

Baby’s got backchannel! If everybody at the conference is staring at their Twitter stream instead of at the person who’s doing the speaking, maybe the speaker should meet them halfway. Migrating speaker presentations to the backchannel can empower the audience while enabling the speaker to listen carefully to their responses. The broadcast model of presentations is dead! Long live the conversation model. Bookmark It Hide Sites

Orbital Content

Bookmarklet apps like Instapaper and Readability point to a future where content is no longer stuck in websites, but floats in orbit around users. And we’re halfway there. Content shifting lets a user take content from one context (e.g. your website) to another (e.g. Instapaper). Before content can be shifted, it must be correctly identified, uprooted from its source, and tied to a user. But content shifting, as powerful as it is, is only the beginning. Discover what’s possible when content is liberated. Bookmark It Hide Sites

A Checklist for Content Work

There’s really only one central principle of good content: it should be appropriate for your business, for your users, and for its context. Appropriate in its method of delivery, in its style and structure, and above all in its substance. As Erin Kissane explains, content strategy is the practice of determining what each of those things means for your project—and how to get there from where you are now. We are delighted to present an excerpt from Erin’s new book, (and the third title from A Book Apart), The Elements of Content Strategy. Bookmark It Hide Sites

CSS Floats 101

The float property is a valuable and powerful asset to any web designer/developer working with HTML and CSS. Tragically, it can also cause frustration and confusion if you don’t fully understand how it works. Test or refresh your knowledge as Noah Stokes explores float theory and behavior, and guides us through common float-related coding pitfalls. Bookmark It Hide Sites

Web Cryptography: Salted Hash and Other Tasty Dishes

One of the most powerful security tools available to web developers is cryptography—essentially a process by which meaningful information is turned into random noise, unreadable except where specifically intended. A web developer working on an underpowered netbook in his basement now has access to cryptosystems that major governments could only have dreamed of a few decades ago. And ignorance of cryptography is not bliss. You may think your web app’s profile is too low to worry about hackers, but attacks are frequently automated, not targeted, and a compromise of the weakest system can often give access to better-protected systems when people re-use passwords across multiple sites. Learn the three broad categories of cryptosystems that commonly relate to web applications and begin strategizing how to make your site secure. Bookmark It Hide Sites

Designing Web Registration Processes for Kids

Designing websites for kids is a fascinating, challenging, rewarding, and exasperating experience: You’re trying to create a digital experience for people who lack the cognitive capacity to understand abstraction; to establish brand loyalty with people who are influenced almost exclusively by their peers; and to communicate subjective value propositions to people who can only see things in black-and-white. Fortunately, it’s possible to create a successful registration process for these folks with an understanding of how their brains work. Debra Levin Gelman explores how to design effective registration forms for kids based on their context, technical skills, and cognitive capabilities. Bookmark It Hide Sites

Cross Platform Scalable Vector Graphics with svgweb

Pity Scalable Vector Graphics. It’s been an official standard since before IE6 was released yet has never found much of an audience on the web, certainly not the one it deserves. Just as SVG was starting to establish some browser support, along came the canvas tag, stealing the thunder of dynamically generated client-side images. Yet despite all the attention being paid to canvas, there’s still a place for SVG, particularly for developers looking to replace plug-ins like Flash for data visualization. Unlike canvas or other script-only approaches, SVG can be easily divided into design and code elements, with just a little code to add interactivity. It even works on devices like the iPad and iPhone. And now, thanks to svgweb and a clever use of Flash, it works on older platforms no one could have ever imagined supporting SVG. Jim Ray shows how. Bookmark It Hide Sites

The Miseducation of the Doodle

The teacher who chastised you for “mindless doodling” was wrong on both counts. Far from shutting down the mind, the act of doodling engages the brain in the kind of visual sense-making people have practiced for over 30,000 years. Doodling sharpens concentration, increases retention, and enhances access to the problem solving unconscious. It activates the portions of the visual cortex that allow us to see mental imagery and manipulate concepts, and unifies three major learning modalities—visual, auditory, and kinesthetic. Doodle Revolution leader Sunni Brown introduces strategic doodling and presents the ABCs of our shared visual alphabet. Bookmark It Hide Sites

Sketching: the Visual Thinking Power Tool

You don’t have to be a great singer to write a great song—just ask Bob Dylan. Likewise, you needn’t be a Leonardo to draw your way to more and better ideas. Sketching helps you generate concepts quickly, exploring alternatives rapidly and at no cost of resources. The looseness of a sketch removes inhibitions, granting clients and colleagues permission to consider and challenge the ideas it represents. Mike Rohde outlines the practice, surveys the tools, and shares ways to become confident with this method of brainstorming, regardless of your level of artistic ability. Bookmark It Hide Sites

A Simpler Page

Want to design a book? There are mountains of beautifully designed examples to inspire you. But what about digital books? How do you create elegantly typeset, gloriously balanced reading experiences when tablets render type differently and support different fonts, text can extend in every direction, and type can change size? Craig Mod (Flipboard, Art Space Tokyo) addresses these questions and presents the initial release of Bibliotype, an HTML baseline typography library for tablet reading. Bookmark It Hide Sites

Design Criticism and the Creative Process

In every design project, at some point we quit what we’re doing and share our unfinished work with colleagues or clients. This begs the question: Just what does the critique do for the design and the rest of the project? Do critiques really help and are they necessary? If so, how do we use their inconsistencies to improve our creative output? Cassie McDaniel explores how critiques can help us navigate complex processes and projects and collaborate effectively to create original and engaging work. Bookmark It Hide Sites

Testing Content

Whether the purpose of your site is to convince people to do something, to buy something, or simply to inform, testing only whether they can find information or complete transactions is a missed opportunity: Is the content appropriate for the audience? Can they read and understand what you’ve written? Angela Colter shows how to predict whether your content will work (without users) and test whether it does work (with users). While you can’t test every sentence on your site, you don’t need to. Focus on tasks that are critical to your users and your business. Learn how to test the content to find out if and where your site falls short. Bookmark It Hide Sites

Smartphone Browser Landscape

Users expect websites to work on their mobile phones. In two to three years, mobile support will become standard for any site. Web developers must add mobile web development to their skill set or risk losing clients. How do you make websites mobile compatible? The simple answer is to test on all mobile devices and fix any problems you encounter. But with at least ten operating systems and fifteen browsers out there, it is impossible to do that. Nor can we test only in iPhone and Android and expect to serve our market. PPK surveys the mobile web market, as well as phone platforms and their browsers, and shows how to set up a mobile test bed that works. Bookmark It Hide Sites

NO!SPEC Redesign: David Airey and Jeanette Wickham

Some of you might know that I also run the NO!SPEC Campaign. For those who aren’t aware, the early campaign days are documented in the categories to the right. The NO!SPEC Campaign was put together in a mammoth rush. Two overlapping teams were created to come up with design and copy, each team with an aim of working towards the final product. Doing it this way made it sort of a scattered experience at best, but it garnered results. From the very beginning we knew that the site would eventually need a quieter redesign. That the IN YOUR FACE [insert expletive here] layout wasn’t meant to last forever. Also needed was a logical nav structure, as sometimes finding things was… whoooh… But for years we were too shagged out busy with the campaign; less concerned with making pretty. Every so often I’d get emails from designers offering to redo the … Continue reading

CSS Positioning 101

If you’re a front end developer or a designer who likes to code, CSS-based layouts are at the very core of your work. Designer slash developer Noah Stokes scrutinizes the CSS position property to show how you can use it to create standards-compliant, table-free CSS layouts. Test or refresh your knowledge of static, relative, absolute, fixed, and inherited positioning, and how they work together to create any web layout the mind can conceive. Bookmark It Hide Sites

Understanding CSS3 Transitions

From advanced selectors to generated content to the triumphant return of web fonts, and from gradients, shadows, and rounded corners to full-blown animations, CSS3 is a universe of creative possibilities. No one can better guide you through these galaxies than world-renowned designer, author, and CSS superstar Dan Cederholm of SimpleBits and Dribbble fame. We are delighted to present an excerpt from his new book (and the second publication from A Book Apart), CSS3 For Web Designers. Bookmark It Hide Sites

Art Direction and Design

Sure, your design’s composition is perfectly balanced, the typographical hierarchy works, and the contrast is bang on. But, when you step back and take a look, how does it make you feel? Does your design evoke the right emotion? Dan Mall explains the difference between art direction and design on the web and challenges us to do it again, this time with feeling. Bookmark It Hide Sites

Get Started with Git

Version control: It isn’t just for coders anymore. If you’re a writer, editor, or a designer who works iteratively on the web and you want to reshuffle or combine pieces of your work quickly and efficiently, version control is for you, too. Al Shaw shows us how easy it is to install, set up, and work with Git—open-source, version control software that offers you much, much, more than just “undo.” Bookmark It Hide Sites

Dezign Matterz

Dezign Matterz Hilarious. This rainy Saturday while waiting to wake up, I stopped by FB to see what was happening. Two of my friends favourited (liked?) severals photos in Mia Pallas’ album, and the one that struck me as wickedly funny was titled: Just when you thought your Life Sucked… To see if your life is suckie lately too, check it out. Anyway… While I was at Mia’s FB page, I checked out her bits. Not too shabby. And there was enough going on to get me off my butt to write a rare post on DWB. Web: Dezign Matterz Tumblr: Miazoe Youtube: VEGAGIRL5 Facebook: Mia.pallas Welcome to DezignMatterz, where Design Matters a great deal. The overall focus of this site is to feature & bring you all things pertaining to Web & Design. You are invited to tune in for the latest Inspiration & Design news and articles on … Continue reading

Four Ways Mind Maps Make You More Creative

Mind maps are a powerful tool to get yourself unstuck, focused and organized to do your best creative work. Tony Buzan is the person best known for coining the term mind map and helping to educate the world at large about the concept. Mind maps are a form of visual mapping, where you use a combination of words, lines, symbols and images to describe something tangible (like a product, a location or something that you can see and experience) or intangible (services, concepts, ideas and plans). How does a piece of paper (or a computer screen) crammed with words, pictures and odd looking symbols help you think and work better?Let’s be honest: some mind maps are so busy and detailed that they tend to frighten most people instead of inspiring them. That’s a fair question. To address this concern, let’s look at four major benefits of using mind maps to … Continue reading

Findings from the Web Design Survey, 2009

The findings are in from the survey for people who make websites. Once again, we have crunched the data this way and that, figured out what the numbers were telling us, and assembled the sliced and diced data-bytes into nifty charts and graphs for your edification and pleasure. As in years past, what emerges is the first true picture of the profession of web design as it is practiced by men and women of all ages, across all continents, in corporations, agencies, non-profits, and freelance configurations. Bookmark It Hide Sites

Forward Thinking Form Validation

When users complete a form to buy your product or sign up for your service, you want to reduce mistakes and guide them to success. Now, with HTML5 form input types and attributes, you can set validation constraints to check user input. With CSS3’s new UI pseudo-classes, you can style validation states to make form completion quick and effortless. Bookmark It Hide Sites

Testing Accordion Forms

Web forms let people complete important tasks on your site; web form design details can have a big impact on how successful, efficient, and happy with the process they are—especially details like form length. Enter accordion forms, which dynamically hide and reveal sections of related questions as people complete the form, allowing them to focus on what matters and finish quickly. How do your smallest design decisions affect completion speed? Which design choices make these innovative forms feel familiar and easy? Which choices make them feel foreign and complex, leading people to make errors? Bookmark It Hide Sites

The Look That Says Book

Hyphenation and justification: It’s not just for print any more. Armed with good taste, a special unicode font character called the soft hyphen, and a bit o’ JavaScript jiggery, you can justify and hyphenate web pages with the best of them. Master the zero width space. Use the Hyphenator.js library to bottle fame, brew glory, and put a stopper in death. Create web pages that hyphenate and justify on the fly, even when the layout reflows in response to changes in viewport size. Bookmark It Hide Sites