If you want to learn lessons about how to run a great business, you should look no further than the most successful and respected businesses of our era—and few businesses have grown as big or have maintained their reputation as well as Google. When you boil down the factors for why Google has become such a dominant force in the tech world, you can cite a number of possibilities, from the way it treats its workers to its drive for constant reinvention—but when it comes down to its product popularity, it’s all about user experience. [Read more…]
This week on Friday Focus we’re featuring a specific type of texture being used in websites: denim. Is it the new wood pattern? Let’s find out.
Designs of the Week
I like that the texture used isn’t the typical blue fabric, which also means you aren’t limited by the color palette for the design. You see color swatches at the top, a fixed red ribbon background, and a huge call to action button once you get to the bottom of the page. Also, in the quest for integrating social icons into a design, we come across another technique: there’s a dark silhouette of the Twitter bird, which “lights up” into full color when you hover.
The jean texture looks interesting but seems to be fighting with the navigation text. I think it’s good that the figure text is actual text, and not merged with the rest of the pants diagram. The “Made In Europe” text looks a little out of place, and could have been styled more like a badge than a button. What I really like is the textured circular backgrounds in the four bottom links—not mind-blowingly stunning but a nice touch.
I love the stitched look especially on the logo. It’s a simple design, based on an existing theme in fact (as noted in the footer credits), but the idea of using two “layers” in the background, bounded by a vertical border on either side, is something I don’t see everyday.
This site ties many different elements together to create a lovely design: vintage typography, tickets that look like tickets, folded tabs, and even orange-dyed denim shaped as ribbons! However, the orange on dark gray, combined with the Harlow font, is a little taxing on the eyes.
Social Media Weekly
Typography – The 10 best fonts from the Google Webfonts Directory
With Google’s Webfonts list growing, it’s nice to know which are the highly recommended fonts on there.
CSS – Why Browsers Read Selectors Right to Left
Understanding how things work always helps people get better.
Business – The Dark Art of Pricing
Jessica Hische lists her experiences in the dirty job of pricing your work.
Designs of the Week
It’s probably a minor thing but the logo colors don’t seem to match the shades of blue and orange used in the background, although they do have translucency and overlapping shapes in common. The look is colorful, light, and very readable. I think the triangles are there to break the text-dominated pages a bit. I find it interesting that in the Platform page, the sidebar is used as the location for the diagram, instead of above or mixed in content, whereas the Blog is a one-column layout and has no sidebars.
Remember those centered seals? This reminds me of that, but with a triangle. Looks like a well-tailored site mixing light textures and transparency, but minus points for not putting in any content in the Portfolio and Project pages.
There’s one really nifty effect here: if your internet connection is fast enough, a “dressed up” sketch fades over an “undressed” one like a virtual paper doll. It’s not complicated or flashy (imagine how you can take things further), but it drives the fashion concept all the way home! There’s also a fabric swatch feel between the triangular shapes, bright colors, and subtle patterns.
Again with the pattern mixing plus translucent images, some of which should be better off as inline text replacements. The lightbox could have been customized further.
First of all, I’m stunned by how bright the green is, which is good, except for the area where it’s used as background for white text—not recommended! The circular slideshow is definitely catchy, especially with transparent images being used. There’s another projects list at the bottom right in addition to that. Lastly, I love the use of a triangle content area for the footer.
You know how people are using circles everywhere these days, including framing content, because of border-radius? This site is like that, but with triangles. It’s not even remotely half-assed though. In the Work section, images and captions are cropped in skewed boxes. Clicking on the G at the top right displays the underlying grid. The code is a little messy in some places but overall, an outstanding job.
Social Media Weekly
Mobile Web Design – Introduction to W3C Mobile Web and Application Best Practices
Learn how to work on the mobile web with an 8-week short course created by the W3C.
Business, HTML, CSS – Dear Clients, The Web Has Changed. It’s Time To Use CSS3 and HTML5 Now.
Help educate your clients with the latest concept in web design and development.
Design – The Auteur vs. the Committee
AKA design according to Apple vs. Google.
User Experience, Design – Visual Designers Are Just As Important As UX Designers
With UX being the second hottest buzzword in the industry today (HTML5 is the first), how do they fit in alongside visual designers?
It’s Friday once again and this week on ‘Focus we’re looking at very “domestic” looking sites, like they were put together with fabrics, thread, and craft supplies!
Designs of the Week
This site is a prime example of a successful collaboration from concept to branding to execution. “Stitching” together a feed is a great metaphor, and consequently a great brand name, and now a great site design. This site is cheerful, has the right amount of texture, and will leave a good impression on those who visit.
Beautiful typography, color combinations, and graphic details. The etched text effect here doesn’t look forced as it fits the look perfectly. Perhaps the only thing I’m not 100% keen about (just 99%) are the icons used. They’re a bit impersonal and out of place considering how homey and crafty looking this site is.
Now this is what you call coming up with an idea and running away with it! The use of real fabrics, embroidery, and other sewing materials are just a joy to look at.
Great use of whitespace in the header. The image carousel is great too—gives a nice, 3-dimensional feel to it, even if they’re just images. And the zigzag edge effect (like they were cut by pinking shears) found at the top and bottom keeps the look consistent.
I very rarely feature Flash sites here, but this one’s nice enough: it has permalinks, which makes inner pages more accessible and navigable. Aside from the background and broken line borders, the animated transitions for each section of the site look like you’re flipping through a collection of fabric swatches, completing the metaphor.
The subtlety of the site’s design—subtle hues, subtle gradients, subtle edges—is what makes the look so delightful. And it pays to have a mascot, especially ones that interacts with you. Hoot!
Social Media Weekly
Design – The evolution of web design
The kind of history lesson us web designers need.
CSS – Away With Widths / Use and Abuse
An in-depth discussion about the right way to declare widths in CSS.
CSS – CSS Deconstruction: Atebits
Take notes on all the little details used to built Atebits.com.
SEO – Optimize your crawling & indexing
Google gives advice on optimizing website URLs
About a month ago, Aaron Wall published a landmark blog post where he showed that Google was placing a lot more emphasis on brands in their search engine results pages (SERPs). In the post, he showed examples of well known brands that started ranking for popular keywords.
At this point, the algorithm change seems to only be affecting short keywords with a high search volume instead of long tail keywords. Still, this could be an important trend in the SERPs.
Consider Google CEO Eric Schmidt’s comments about brands back in October (also from Aaron’s post):
The internet is fast becoming a “cesspool” where false information thrives, Google CEO Eric Schmidt said yesterday. Speaking with an audience of magazine executives visiting the Google campus here as part of their annual industry conference, he said their brands were increasingly important signals that content can be trusted.
“Brands are the solution, not the problem,” Mr. Schmidt said. “Brands are how you sort out the cesspool.”
“Brand affinity is clearly hard wired,” he said. “It is so fundamental to human existence that it’s not going away. It must have a genetic component.”
With Google’s new emphasis on brands, it’s important to have brand building as one of the pillars to your SEO strategy. Here are 3 principles to keep in mind.
1. Have a long term mindset.
Famous brands like Nike and Coca-Cola were not built quickly. Brands take time to build.
It will take consistent quality effort for at least a couple months, if not years, to turn your site into a brand. However, the payoff will be huge when you hit the top rankings. Plus, your rankings will be hard to overtake since most people don’t do this hard work of brand building.
2. Create viral content.
A site becomes a brand when it receives enough mentions on the web that a huge number of people take notice.
The most efficient way to get mentions is to create content that people will naturally pass around. You as one person can only do so much marketing. Therefore, get your visitors involved by creating useful and/or entertaining content that they’ll want to share on the web.
Here’s one way to do this. Check what’s popular on social media sites like Digg, StumbleUpon, YouTube, and Twitter, and then create something similar for your own niche.
By the way, when I say content, I’m talking about apps, videos, podcasts, and even your product. Adding viral component into your product is a great idea.
3. Network with other webmasters online.
You can create an awesome piece of content but if no one knows about it, it won’t spread. You need to give it a little push. That’s where being friends with other webmasters comes in.
If you have these online friends, they can promote your content and get the ball rolling. Not only that, but having other webmasters promote your stuff builds up the credibility of your brand. It’s more credible if someone vouches for you than if you vouch for yourself.
So, how do you find and build these friendships?
That’s for another blog post but the main principle to realize is that profitable partnerships require “give and take”. For example, you can promote their stuff (links, tweets, social media votes, forum posts, etc.), let them know about it, and they’ll often reciprocate. Also, try taking interest in their work. They might check out what you’re doing.
Obviously, there’s a lot more to developing a brand than these three things.
What other principles do you have for turning a site into a brand?