FeedStitch

Some Random Dude's Latest Updates From "appreciation"

Feb 17^th

Business Start-up: It’s All in the Planning

As Dwight D. Eisenhower said, “Plans are nothing; planning is everything.” Continuing the business start-up series that began last week, this week I’m covering various elements of business planning. If you missed the first post of the series, check out: To Be or Not to Be…A Business Owner.

There is a lot to consider when you start a new business. If you don’t take time to plan different aspects of your business, you could quickly hit a stopping point that hurts your success. Here are some of the most important areas to think about as you begin to launch your business.

Developing a Business Plan

Many times, you’ll want to start with a comprehensive business plan; this can be a tremendously helpful tool for getting clarity on what your goals are. But, investing a lot of time into this plan isn’t always necessary. At a minimum, you should think through some of the most basic elements of a business plan, and create what I call a Slimmed Down Business Planning Toolkit.

Resources:

Free Sample Business Plans, Bplans.com
How to Write a Business Plan, Microsoft Small Business Center
Write a Business Plan, Small Business Administration

Outlining Your Marketing Activities

One of the biggest mistakes new businesses make is skipping over the development of a documented marketing plan because they underestimate the importance of it. The best way to start planning your marketing activities is by creating a marketing strategy (a high-level overview of your marketing goals), then drilling down into the specifics of a marketing plan (a detailed look at the actions you will take to execute your marketing strategy).

Depending on the type of business plan you create, you may have already identified many of these elements in your business plan, but here are the most important marketing-related areas to make sure you are covering somewhere:

Your USP
Your marketing budget
Information about your target audience
An outline of the benefits of your products and services
Information on how you will position your products and services in the market
An outline of the marketing methods you intend to use

Resources:

How to Create a Marketing Plan, Entrepreneur.com
Simplified Marketing Plans for the Real World, Small Biz Survival
The Key to Marketing: The Marketing Plan, About.com Small Business Canada

Creating a Business Budget

It should go without saying that you need to have and maintain a budget for your business and have a in-depth understanding of your finances before launching. This is a big one, so I will cover business start-up finances as a separate post later in the series.

Planning for the What-If’s

When you take the step and become self-employed, you take on a whole new set of unknowns. While you can’t plan for every potential challenge or change in your business, giving some thought to the what-if’s can help prepare you and reduce the transition stresses.

One major area to consider is business continuity planning. What will you do to maintain your income if something happens and you’re unable to work for a period of time? You may not be able to create a complete plan now, but giving this some thought and taking the initial steps to have appropriate systems in place can be invaluable.

Next, what if your business takes off faster than you ever dreamed? It’s possible, so you need to think about how you will manage the growth of your business, even just in terms managing the long-term impact of a growing small business. Will you hire employees, outsource to subcontractors, or only grow to the capacity you can handle yourself?

Lastly, take time to consider your long-term goals. Do you intend to reach a level of success and then maintain it until you are ready to retire? Do you want to grow your business until it is saleable? What are your ultimate goals, in five years, 10 years, 20?

Resources:

60-Second Guide to Managing Growth Over the Long Haul, SCORE
Grow without Growing Pains, Entrepreneur.com
How Do I…Make a Succession Plan, The Washington Post
Planning Your Exit Strategy, My Business Magazine

What part of business planning has been your biggest challenge?

Image credit: iprole

Will You Ever Be Able to Retire? How to Start Planning Now Many freelancers and small business owners assume they will never...
Announcing a New Series on Business Start-up Basics Alyssa starts a new series on the basics of starting...
Four Steps to Developing a Business Budget A budget can be an effective tool to help you...

SVG-Edit Online Vector Graphics Editor

SVG-edit is a free web-based scalable vector graphics (SVG) editor. The editor is available in a stable version 2.4 called Arbelos, with a newer version 2.5 called Bicorn waiting in the wings. For the purposes of this post though, I was using version 2.4.

SVG is an open, industry-standard XML-based format for vector graphics developed by the W3C. Its acceptance is growing fast. Most vector editors these days can import and export SVG, and modern browsers (such as Firefox and Opera) can display it directly without requiring any plugins. If you’re a die-hard Internet Explorer user, note that SVG-edit only works if you have installed the Google Chrome Frame plugin.

When it comes to the drawing tools, this editor obviously won’t match up to Illustrator (nor is it trying to) but it still provides useful tools and many of the features that you would expect from a vector graphics editor including free-hand drawing, shapes, color and gradient picker. Drawing is easy, as is moving and transforming objects. You can change fill and stroke color and opacity and stroke thickness.

The menu and toolbar icons are a little clunky to look at but they do what they’re supposed to do.

Likewise the Layers “palette” is a simple box which you pull out from the side of the screen. It looks a little lonely when you’re used to other programs which fill half your screen with palettes, but again it does what it says on the tin and you can easily add, delete, rename and change the stacking order of layers.

When it comes to typography, the tools available will seem pretty basic if you’re used to using a more advanced editor. Font face choices are limited to categories, namely Serif, Sans-Serif, Cursive, Fantasy and Monospace and styles are limited to Bold and Italic. You can set whatever size you like.

While drawing shapes are easy, I found changing the anchor points on objects a little bit tricky and not particularly intuitive. I think this is the area that needs most work to make it more user-friendly.

Here’s the full list of features in the current version:

Free-hand drawing
Lines, Polylines
Rects/Squares
Ellipses/Circles
Polygons/Curved Paths
Stylable Text
Raster Images
Select/move/resize/rotate
Undo/Redo
Color/Gradient picker
Group/ungroup
Align
Zoom
Layers
Convert Shapes to Path
Wireframe Mode
Save drawing to SVG
Linear Gradient Picking
View and Edit SVG Source
UI Localization
Resizable Canvas
Change Background
Draggable Dialogs
Resizable UI (SVG icons)

Version 2.5 which is coming soon, will have the following additional features.

Main Menu
Open Local Files (Firefox 3.6 only)
Arrows
Plugin Architecture
Smoother freehand paths
Increased support for SVG elements

Files can be saved as SVG which can be viewed in several browsers and opened in graphics editors which support the format.

At this stage, I don’t think Adobe will be quaking in it’s boots, but there appears to be a dedicated team working to improve and bring this editor forward. It does need a bit of tweaking but it would be nice to see it improve with each version. You can read more about it here and download a Firefox plugin here.

Have you used SVG Edit? What did you think of it? Have you used any other good free vector editors?

Sumo Paint: A Very Fine, Free Online Image Editor Jennifer takes a look at Sumo Paint, a superb web-based...
How To Draw A Vector iPhone In Illustrator Jennifer shows you how to draw an iPhone in Illustrator...
How to Pick the Perfect Programming Editor Craig provides a list of essential features every web developer...

Sat Nav – the Killer Application for Offline Web Technology?

In yesterday’s post, I discussed the problem of developing offline web functionality and the disappointing number of applications which use it. I summarized that offline functionality seems like a technology waiting for an application.

However, there is one killer app which will almost certainly change the market within the next few years: web-based satellite navigations systems. Sat navs have been around for a while, but they can be expensive, require dedicated devices, and are not always easy to update. There is also software for mobile phones, such as those from Google and Nokia, but the facilities can be limited.

However, a pure web-based sat nav is becoming increasingly feasible and offers several benefits.

Better location search
If you don’t know your destination’s street name or zip code, a sat nav can be practically useless. A web-based solution lets you locate a destination by company name, area, type of business, or any other criteria using natural language.

Instant updates
Details of new routes, road works, accidents, heavy traffic etc. can be updated in real time and relayed to a web application. Some sat navs offer this facility but many require subscription fees and the quality of the information is variable.

Data mashups
A web-based sat nav can access information from anywhere on the net. Once your route is calculated, the sat nav could offer live videos of road-side cameras, restaurant or hotel offers, sites of interest, etc.

Collaborative routing
Details of every user’s journey can be collated and analyzed. The driver would have access to a huge database of recommended routes, average times, interesting journeys, etc. Rather than selecting the shortest or quickest route, the driver would be able to select the quietest, most popular, best scenery, etc.

Alternative transport
A web-based system can access information from a variety of transport systems — not just the road. For example, the data might indicate that a route will be especially busy because of holiday traffic, recommend a train service and instantly book a ticket.

Supports existing hardware
Many smart phones already offer good web browsers and GPS facilities. There’s no reason why you couldn’t use a netbook, tablet or similar hardware rather than a dedicated device.

Multiple input methods
Dedicated sat navs have restricted hardware and software, but a smart phone or PC can support other input and output devices. For example, the web cam or microphone could be utilized to offer gestures or voice control.

Free data
Systems such as Google Maps, Street View and Earth already provide free mapping data which could be used by a web-based sat nav. The systems could also be commercialized by companies paying to play audio or text-based adverts when you approach their premises (think Minority Report!)

However, the current problem is internet connectivity. Wi-fi is not universally available and mobile internet connections could be slow or fail when entering a tunnel or built-up area. The obvious solution is offline web technology. Once you’re on the road, the application could cache the full journey details or download essential information within, say, a 10-mile radius.

Both Nokia and Google already offer beta versions of free turn-by-turn navigation systems for mobile operating systems. The news has caused TomTom’s share price to slump in recent weeks, although there’s no reason why TomTom couldn’t capitalize on the technologies.

Do you think a free browser-based sat nav using offline technology will emerge? Will it happen soon?

5 Reasons Why There are no Killer Offline Web Applications Technologies that implement offline web functionality have been around for...
How To Create an Offline Web Application Craig provides a quick and simple tutorial which explains how...
The Top 10 Technology Terms that Confuse Clients Are you sure your clients understand you? Craig provides the...

Group Interview: Expert Advice For Students and Young Web Designers

Our readers have requested that Smashing Magazine conduct an interview with industry leaders on issues that are relevant to students and those just starting off in their design career. With the help of our panel of 16 designers, we’ll dispense advice that should help new designers get their career off to a promising start. We’ve asked a few different questions to each of the designers; you’ll see all of their responses below. First, here is a list of the designers who participated.

Henry Jones (Web Design Ledger)
Wolfgang Bartelme (Bartelme.at)
Chris Coyier (CSS-Tricks)
Chris Spooner (SpoonGraphics, Line25)
Soh Tanaka
Jon Philips (Spyre Studios)
Paul Boag (Boagworld, Headscape)
David Leggett (Tutorial9, UX Booth)
Jacob Gube (Six Revisions)
Elliot Jay Stocks
Brian Hoff (The Design Cubicle)
Darren Hoyt
Walter Apai (Webdesigner Depot)
Jacob Cass (Just Creative Design)
Zach Dunn (One Mighty Roar and Build Internet)
Paul Andrew (Speckyboy Design Magazine)

You may be interested in the following related posts:

35 Designers x 5 Questions
Professional suggestions, tips and ideas from some of the best web-developers all around the world.

[Offtopic: by the way, do you know the Smashing Network has its own Smashing Network RSS Feed? Only excerpts are displayed in the feed.]

1. For students who aspire to work in design, what would you recommend they study?

David Leggett

Finding a good university-level design program that interests you will greatly increase your chance of finding awesome opportunities down the road, but it’s very beneficial to get experience before and outside of the education system. Find projects to help with, start your own, read up and apply as much as you can as you’re learning on the side. The extra experience will never hurt, and at the very least you’ll get to see if design is something you really enjoy.

Just to clarify, I have never taken any higher education courses in design, but I know the knowledge you get in that environment is valuable, as I’m sure others will suggest.

Wolfgang Bartelme

Well, I guess the most important thing is “practice, practice, practice.” To improve the quality of your work, you have to keep pushing yourself further and further. By the way, many great artists are self-taught. But I’m also convinced that a profound education will sharpen your skills and help you be able to judge why and how certain designs work. Personally, I studied “Information Design” at the University of Applied Science in Graz, focusing on all different aspects of design: print and advertising, exhibitions, Web design, usability, photography and film — thus giving students a wide range of knowledge, and making them more generalists than specialists.

2. How does a student determine whether design is for them or they should pursue another career?

Jacob Gube

This is a question you have to ask yourself. There aren’t any set rules or algorithms to determine whether you should be a designer. The important thing is to have passion for the work. Even mediocre designers will be able to sustain themselves, but they’ll have to work extra hard to compete with more talented and experienced designers. So, it all boils down to how much you want to be a designer and how much you’re willing to work at it and push forward. I won’t sugar-coat the current situation: the truth is that the industry is saturated, and there are a lot more designers than jobs, so you have to be sure that this is the profession you want to invest your time in.

Henry Jones

I think it’s all about passion. If you find yourself up late at night working on design projects just for the fun of it, then that’s a good sign that design is right for you. I think one of the worst situations in life is hating what you do. Loving what you do means you’ll probably be doing it and thinking about it even outside of class or when you’re not being paid to do it. You’ll constantly be honing your skills and staying on top of the latest technologies, which is very important for designers.

David Leggett

Everyone has a unique situation, and I don’t mean to suggest the following is always true: if you’re already a student at a university and have no outside experience, it may be difficult to really pursue a career in design. I say this only because personal friends of mine have struggled to find jobs in this current economic climate. Experience and something to show for your knowledge goes a long way.

Otherwise, be sure you truly enjoy whatever you decide to pursue. Many designers and artists I’ve met thoroughly enjoy their lifestyles, even when they’re struggling to find work. This is not to say that you should undervalue your work, but if you can enjoy your career when you’re not making money, then it’s probably a good match for you.

Wolfgang Bartelme

First and foremost, designing stuff has to be fun: you have to love what you do. If that’s not the case, look for something else. Secondly, you should, of course, have a decent measure of talent and imagination. Even though you will learn many skill in the course of your studies, without talent and imagination your work will be at best mediocre.

Chris Spooner

As with any career, if you’re passionate about the subject, you’re set to succeed. Careers in the design industry can seem exciting; after all, all you do is sit and color things in all day, right? I think this draws in a lot of people who maybe haven’t been particularly creative in the past and see the career as easy. This type of person might then find it difficult to be motivated to learn the required skills and to continue developing those skills throughout their career. That’s not to say that if you’ve weren’t a creative child, you can’t pursue a career in design. We all stumble across different interests throughout our lives, so as long as you feel you have a passion for design, go for it!

3. How do you balance education and work?

Zach Dunn

By my last estimate, I spend about 3 to 4 hours on client work for every 1 hour of academic work. I generally learn specialized skills more from client work than from academics. It’s easy to get caught up in client work and blogging. The hard part is making sure you don’t lose touch with the world around you. Interacting with clients and blog community members is certainly social, but you need to take a break and interact with “regular college students” from time to time. I consider it like mental detox.

I’m convinced you must put in extra time on personal projects to truly become competent in the Web design industry. Going through the motions during class and homework hours only leaves you behind. The Internet moves faster than any standard academic schedule. Keeping current and practiced is up to you.

Jacob Cass

Finding the right balance between family, friends, work and all of life’s other misdemeanors will always be a challenge, no matter what your career. You must set priorities and goals relative to what you want to achieve and get out of life. Although I have now finished studying (officially), I could say that my biggest challenge then was finding enough time to give high-quality attention to all projects, whether they were educational, personal or for paying customers. At times, I found this nearly impossible, and to be honest a lot of my university and personal work suffered from my commitments to paying customers. In saying this, I guess a lot of it comes down to having priorities, goals and good time management.

4. How did work outside your studies prepare you for your career?

Zach Dunn

Almost all of our “career” success so far has been a direct result of work done outside of studies. College is a great incubator for a number of things other than academics. I value school for reasons that are different than those of the average person. College has helped me socially. Sam recently wrote an article that does a great job of explaining more about our college philosophy in relation to Web design, titled The Role of College for Web Designers.

Certain career paths cannot start before graduation date. Lawyers, for example, can’t have hobby clients while putting themselves through school: it’s all or nothing. Web design isn’t limited by credentials for entry. Web design is largely portfolio-based. When’s the last time a client was more interested in your GPA than in your previous client work? In this industry, we have the luxury of starting early. I like to take advantage of that.

I don’t know what the future holds for Sam and me, but I’m confident that at least some of the projects we start today will have some role in it.

Jacob Cass

To be honest, I learned more in six months of blogging and following other people’s blogs, than studying for three full years at university. Doing extra work outside of the education system is vital.

5. What should students and new designers focus on outside of their course work to advance in their careers?

Brian Hoff

Students should definitely consider taking many business classes, especially if they want to go freelance or start their own studio one day. I’ve always been passionate enough about design to teach myself, but I wish I took more business and marketing classes. Also, I would recommend collecting designs. Having resources of inspiration and also an idea of good design is essential. I take photos of many types, colors, designs, etc. as I pass them by, and I use LittleSnapper to organize online media. Being a graphic designer is non-stop learning. Here’s an article I wrote that covers more: 16 Tips to Improve as a Graphic Designer.

Chris Coyier

No individual program is going to cover every single angle of design, especially the most modern technological stuff. Because you are already reading Smashing Magazine, you probably already have a good grasp of what’s going on in modern design. Reading and following tutorials and doing your own experimental projects on the side will definitely help you excel. That being said, your whole life doesn’t have to revolve around career enhancement. A well-rounded life will serve you well. Perhaps some of your other hobbies could benefit from your design talent. I have a friend who used to build coffee tables and decorate the surfaces with patterns of partially burnt matches. If he were looking for a design job, I would absolutely tell him to put that stuff onto an online portfolio.

Elliot Jay Stocks

Build your portfolio. Do free websites for your mates’ bands or your Mum’s friend’s wool shop. It might not be glamorous work, but doing as much as you can builds up your portfolio, and you’ll learn loads on every project. When I left university and got my first job, my portfolio was made up almost entirely of stuff I’d done on an extracurricular basis, not really the course work itself. But also don’t forget that it’s about quality, not quantity, and a good portfolio strikes a balance between variety (showing that you’re versatile) and continuity (showing that you have your own identity as a designer).

Walter Apai

It’s important to expand your knowledge to any areas that are related to design. Most design courses concentrate on the basics or on how to use the various pieces of software that are available. These are just basic tools for new designers, but they won’t make you a great designer.

Learn about art, layout and composition, and try to read at least one new book on design every month, or even one per week. Subscribe to design blogs such as Smashing Magazine and Webdesigner Depot, and never stop learning. Keep updating your knowledge whenever possible by attending conferences, reading books and magazines and becoming involved in the local artistic community. Try to become a well-rounded designer, not just an operator of Photoshop or another design software tool.

George Lois, the real-life inspiration for Don Draper in Mad Men, said it best:

“The computer has played a role in destroying creativity with Photoshop. Everybody thinks they’re a designer.”

While he may be generalizing a bit, I believe what is meant is that you can’t be a proper designer without understanding the fundamentals of art and design.

Jacob Gube

When I was a college student, what truly helped me in my career was proactively attempting to get real-world experience by doing freelance work, part time. The purpose was two-fold: to see what it was like to work with the kind of people who would become your employers once you were out of school, and to apply what you learned in class, which reinforces your education and helps you understand it hands on. You might even end up with a few portfolio pieces to show employers once you’re on the job hunt — and some money to buy those expensive classroom textbooks.

6. What one thing do you wish you knew before starting your career?

Darren Hoyt

Being in touch with my limitations and skills.

The first few years of designing for the Web (1998 to 2001), I knew being cross-trained was important, so I built my skills in design and front-end code (HTML, CSS) equally. But then I made the mistake of thinking that, if I was to become a more complete designer and developer, I should learn Perl, Flash and Unix commands, too. I sucked at all of those things and kept sucking until they asked me to stop.

Deep down, I knew I wasn’t wired for any of that stuff. And more importantly, I wasn’t actually interested in it, not compared to design anyway. Employers do value someone who is cross-trained, but not if the results are mediocre.

David Leggett

Pleasing everyone is nearly impossible. Be friendly to those who enjoy your work and friendlier to those who attack it.

Jacob Gube

I wished I had realized that quality is more important than quantity. When I started out, I focused on low-cost, high-quantity jobs, which resulted in late hours, not enough pay and nothing really that I could be proud to put in my portfolio. I wanted to work with as many people and on as many projects as I could to jumpstart my experience and resume. But the Project Triangle principle applies here: I did it fast and cheap, and so the outcomes weren’t good. If I had slowed down and focused on getting gigs that were interesting and better quality, I would have progressed more fruitfully.

Paul Boag

That constraints are good. As a Web design student, I was given endless freedom to design how I wanted and what I wanted. However, the real world is not like that. When I joined IBM out of university, my first job was to design 8-bit icons. Very restrictive indeed. When I started on the Web, it allowed only gray backgrounds and text that was justified left, right or centred. The first time I worked on a multimedia CD, it was capable of running video at only 160 x 120 pixels.

At the time, this frustrated me massively. However, in hindsight it was enormously beneficial. It pushed me creatively, and it has also given me a lot more patience with the peculiarities of browsers such as IE6.

7. What job search advice do you have for recent graduates?

Soh Tanaka

First and foremost, get your portfolio up, and make sure it represents your best work. If you lack work samples, start creating projects for yourself (websites for your hobbies, your family or for friends). As a new grad, you need to prove that you are serious and willing; the best way to get that message across is through a robust portfolio.

Secondly, hit the job boards, and send your resumes and cover letters to companies you would like to work for. Doing research and tailoring each cover letter and resume to the company is important. Stick to the job requirements, and follow directions carefully. These employers receive many applications daily, and nothing is worse than seeing a bland and generic introduction to who you are and what you offer. Stand out from the rest.

Thirdly, keep your networks open, and make yourself known! Networking is key.

Darren Hoyt

Obviously, scour the online job boards (Authentic Jobs, 37 Signals, Coroflot), but also follow the blogs and Twitter feeds of Web designers who you respect. Studying their methods will give you a clearer picture of the sort of designer you want to be. If you need advice, trying dropping them an email. But remember that not everyone has the free time to answer.

Truthfully, most designers I know didn’t get their job by applying cold to an agency they knew nothing about. Instead, they slowly made relationships with like-minded people until they began to see opportunities and get offers.

But I would stress, don’t “network” compulsively. It can look obvious and obnoxious and make you look needy. Instead, make connections with people you actually think you share interests with, people you could imagine being colleagues and friends, rather than business contacts. The rewards are much greater.

Chris Coyier

Nobody will hire you because you say you have skills. You’ll have to demonstrate your skills, so either work on your current personal website or start building one. Use the website as a portfolio and resume to send to companies. Send it both to companies that say they are hiring and to ones that don’t. Just because a Web company doesn’t hang a “Now hiring” sign on it door doesn’t mean it couldn’t use someone. Pitch them. A little advice for that portfolio: three awesome designs are better than three awesome and six mediocre designs packed in the same space. Showcase only your finest work, what you’re capable of. Quality over quantity.

8. What should new designers consider when deciding between working for an agency and freelancing?

Elliot Jay Stocks

Jumping straight into freelancing once you’ve completed your education is really tempting. I very nearly did that myself. But I’m glad I didn’t. You learn valuable lessons working for someone else first, and it’s actually much easier because you don’t have to worry about getting clients for yourself. So, I would recommend working for someone else before going it alone. It’s a great opportunity to build up your portfolio without dealing with any of the boring stuff that goes with freelancing or running your own business. I wrote a post about this a while ago: Build Your Profile to Get More Freelance Work.

Soh Tanaka

As a new designer, being at an agency or on a team is great for learning and feeling out the industry. Though you may not be able to set your own hours or work from home, a steady pay check and health insurance are both welcome during a tough economy.

When choosing the freelance route, have some experience under your belt, and be ready to be on your own. The key factor is knowing what your skills are and having discipline. Freelancing has its ups and downs, and you must be self-motivated and determined to overcome the challenges. Working from home and setting your own hours is ideal for most, but young designers should consider the requirements and reality before diving in head first. It may be wise to freelance part time until you build enough confidence and experience and know enough about your strengths and weaknesses to be able to make the right decisions when you strike out on your own.

Chris Spooner

It’s always worth learning the pros and cons of working for an agency and freelancing, because each has its perks! Here are a few that spring to mind.

Agency pros:

Working for an agency after your studies can be great for gaining experience in how the industry works and how projects are managed from start to finish.
At an agency, you work with like-minded colleagues, who you can learn from and develop with.
Large agencies often attract big corporations and established brands.
A full-time job guarantees you a monthly wage and set working hours.

Agency cons:

You might get stuck working on projects that you don’t find interesting or might have to work on something you don’t agree with.
Agencies sometimes have strict policies, rules and guidelines. For instance, browsing the Web, checking Facebook or tweeting might get you a slap on the wrist.
Agencies work during the usual 9:00 to 5:00 business hours, so you will have to as well.

Freelance pros:

As a freelancer, you have complete control of the projects you take on and the type of work you do.
You’re not tied to any particular working hours, so taking a day off is no problem.
If you can generate a consistent flow of projects, it can be much easier to earn a decent wage than you would by working at an agency.
You can work in your pyjamas!

Freelance cons:

You are personally responsible for your own income, a circumstance that can put you at risk.
Freelancers need to be able to manage their time in order to avoid distractions.

I would recommend that new designers first seek out employment, which will give you professional experience with and knowledge of design. Then you’ll be able to decide whether you fit better at an agency or working for yourself.

One of the main things to consider before starting out as a freelancer is whether you’ve generated enough industry experience to be able not only to create designs but to source work, manage multiple projects and communicate with clients. These other factors definitely come into play when freelancing, so having at least some knowledge of these processes before diving in is important.

9. How can students and young designers make themselves more valuable to potential employers?

Darren Hoyt

Start building a Web presence as early as possible, even before seeking a junior position. Buy a personal domain and set up a simple portfolio, with an “About” page that gives a snapshot of your personality and talents. If haven’t done client work, do pro bono projects for friends until you have work samples to show. Displaying them publicly shows that you have pride in your work.

Be concise. Employers and human resource people are like anyone else: they are busy and have short attention spans. Don’t make them dig to find out who you are. Give your portfolio website just enough text, images and examples to paint an accurate picture. If you can’t give your own content a crisp and concise design, why should employers trust you to do that for clients?

Also, don’t exaggerate the facts when presenting yourself. Our lives are way too public these days to bother. More important than bragging or dazzling anyone with half-truths is finding a team whose needs and interests align with your own. If you get hired under false pretences, you will have wasted everyone’s time. Even experienced designers with great portfolios aren’t the right fit, disposition-wise, for every agency they apply to.

Wolfgang Bartelme

As I mentioned before, I’m a huge fan of the interdisciplinary approach. At most companies, you are unlikely to work exclusively in a single field. In fact, when you do Web design, being able to do some decent-looking icons or cut a simple screencast or promo video is good. This becomes even more important when you are self-employed. Moreover, this variety makes and keeps work interesting… at least that’s the case for me.

Chris Coyier

Just being a nice person and easy to work with is pretty huge. I think employers look for that during the interview process, at least as best they can in that short time. Someone incredibly stiff or stand-offish is unlikely to win the job over someone who is happy and casual. Design studios, in my experience, are pretty friendly and casual. Other random advice: become really good at one thing. You’ll be a lot more valuable as the guy or girl who knows that one thing really well than as a jack of all trades. Being well-rounded is awesome, but having a spike of talent in one particular area will serve you well.

Walter Apai

Social skills are necessary when dealing with potential clients. Designers should know what their clients do and provide them with the best possible service.

I’d encourage all designers to make themselves a one-stop shop for all of their clients’ design needs. That would include Web design, copywriting, printing, etc. If you’re not an expert in these fields, team up with a few peers so that you can help each other as needed.

Designers should focus on making the entire process easy for clients, but involve clients in some design decisions as well, so that they feel that they are part of the project.

I suggest asking the clients a lot of questions and truly aiming to get to the core of their business and what would work for them. The more we understand our clients and their projects, the more successful the projects will be and the better our chances of getting them as repeat clients.

A designer is a human being, too. Become a well-versed designer, understand your medium, get educated and become a well-rounded person who always aims high.

Set high standards for yourself and your work. The right clients will gravitate to someone who holds themselves to high standards.

10. What should new freelancers do during the first few months of their business to succeed?

Paul Andrew

You have to have a personal business plan. I really wish I had a plan when I started out; I really do. I jumped right in, feet first, and landed on my head! And it hurt. Partly, I think it was those first few months of hardship that even now propel me forward. That period not only affected my finances and confidence, it damaged my reputation. That is very hard to regain. I think over the years I have regained it, but it was hard work, and it all could have been avoided with a bit more planning and simply by writing a personal business strategy.

It’s not enough to have a strategy planned out in your head; it has to be on paper. You need to be able to read it and see it to live by it. Every so often you should read it again, just to realign yourself. And then read it again, and only tweak it if you really have to.

Your personal business plan could do the following:

Describe your business objectives, business direction and where you hope to be in x number of months.
List all potential pitfalls and how to avoid them.
Set honest and realistic targets, and allow for a little flexibility.
As your business grows, track its efforts and compare them to your business objectives.
Set up a financial framework to measure how much your business is making or not making.
Describe how you are going to attract new business to meet your financial targets.

Everyone and every business is different. Write down what is correct and achievable for you, and be very honest: it is your business after all.

Stick to the plan!

Brian Hoff

Personally, I worked for nearly three years while preparing to go freelance. I would work my 9:00 to 5:00 job, come home, eat dinner and then market myself (blog), search for new business, advertize and work from around 7:00 pm until 12:00 am. Having a good feel for running your own business is important before you go in head first.

Saving money is also important. Every business, no matter what it is, goes through periods of drought. Having money to back you up for a little while is a must. Freelancing is not for everyone. Part-time freelancing while maintaining a steady-paying job will help you get a feel for things.

Chris Spooner

I think the most important time in freelancing isn’t particularly the first few months, but more so the time leading up to going freelance. As a freelancer, you’ll need a good flow of clients to generate income; you’ll have to get busy promoting and building a name for yourself, so that when you’re ready to leave your job, you’ll be all set to simply flick the switch from employment to self-employment.

During this build-up time, you’ll want to design all of your personal branding, especially your website, to showcase what you can do. Become an active member of the design community by blogging, guest writing and networking via Twitter (or you might want to network offline or locally); and begin taking on projects that you can work on during the nights. It can be hard work managing both your full-time job and one or two freelance projects simultaneously, but when the number of inquiries reaches an optimal level, you can quickly switch from your job to taking on more freelance work — rather than making the decision one day, falling flat on your face and then having to eat beans on toast until you’ve built a profile.

Jon Phillips

I believe the first few months are crucial, especially because it usually means quitting the day job and taking the plunge into the freelancing world. It can be scary at first. Many things need to be done in the first few months, but of course nothing is irreparable. Should you make a bad decision, you can always fix things as you go along. I highly recommend getting a portfolio website up; even if you don’t have a lot to show, you need a place to showcase what you have. Then get a good invoicing system such as Freshbooks or Billings 3, network with other freelancers as much as possible via Twitter, Facebook, design forums and blogs and maybe start a blog of your own.

Elliot Jay Stocks

Work for someone else! For the first few months to be a success, you need to have work lined up, so having that in place before you make the jump is important. I’d also recommend getting a good accountant as soon as you can and some sort of system for keeping track of your money, such as Xero. Also, make sure you have a website set up long before you decide to go solo.

11. Aside from design and technical skills, what aspects of running a business should new freelancers focus on?

Paul Andrew

The advice I have been given over the years about freelancing as a business has varied. Some have told me that putting business ahead of design guarantees profit and keeps your head above water. On the other hand, I have also been told not to treat design as a business, to work on what your passion is, and the business side will take care of itself.

These are both great philosophies, but they don’t really work in the real world. The answer is to have a healthy balance between the two. Both need to be kept apart while at the same time working off each other. Think of it as the positive and negative charge of a battery. The battery only works when both charges are connected. (You can decide which is the positive and negative side in relation to business and design).

When meeting potential clients, first impressions really do count, and you really need to present yourself with professionalism. It does not matter how strong your portfolio is or who you are — it is about how professional and business-like you appear to them. You are negotiating a business transaction after all.

Yes, this means breaking away from the designer stereotype of wearing t-shirts and jeans and instead being clean shaven, putting on a business suit and remembering the manners your mother taught you. Carry business cards with you, maybe even a briefcase; do what you have to do to convince the client you mean business.

Some monkeys you should not carry on your back by yourself, and they are the finance side of your business. Let’s be honest: who understands tax and monetary law. I certainly don’t and don’t care to either. Find yourself an accountant. They don’t cost that much — maybe a week’s wage out of the year, and when you weigh the cost of doing your taxes incorrectly and the penalties that might follow, an accountant is a worthwhile investment.

It would be nice if everyone you worked with was honest. Protecting the integrity of your work, yourself and your business should be next on your to-do list. The reality is that at some point, someone will try to shortchange you or, worse, wiggle out of a payment. That is why you need a watertight contract. Every country has its own laws regarding design; make sure you know and understand yours.

Hiring a lawyer to write a standard contract for your small business would be expensive. A way around this would be to write your own, as I did. I asked a few designers for advice and researched the law online and came up with an outline for my own. I then took it to a lawyer and asked them to sanity-check it. Not as expensive as asking them to write it — still, it wasn’t cheap, but it was worth it.

So, to sum up, if you’re dressed smart, your business finances are in safe hands and you are legally protected, you are now free to do what you were trained to do and give your creativity free reign, letting your passion fuel your design. It is a long road to take, but it is necessary.

Brian Hoff

Marketing without a doubt. I receive many emails asking how I get so much freelance business or how do I find clients. My response: You have to work hard for it. Clients won’t come to you. Tell everyone what you do, start a blog, attend networking events and conferences, contact clients directly. Running your own business is hard work. There is no such thing as a 40-hour work week when you run your own business. I work seven days a week. I’ve even gone so far as to strike up new work by chatting with someone at the bar (not recommended). You have to have personality and drive to freelance successfully.

Jon Phillips

Being a freelancer means having to wear many different hats (a ton of different hats!). Spending some time on government websites and meeting with an accountant to learn more about tax laws goes a very long way. Of course, many designers, being creative types, tend to forget that it’s a business (I often forget). You need to spend time on accounting but also on networking and marketing your business. In the first few months results will be small, but your efforts will pay off in the long run. You need to be as good with numbers as you are with Photoshop.

12. What are some of the best ways for new designers to find clients?

Henry Jones

I can only speak from experience here. Shortly before I went full-time freelancing, my portfolio was listed on several popular CSS galleries. From that point on, clients found me. I was very surprised to see how many people used the galleries to find designers. Once I had a few clients and projects under my belt, I started to get a lot of referrals. So, work hard on creating a great portfolio, and use the design galleries. This is probably the best and easiest way to get the most exposure. Plenty of design-specific job boards are available, such as AuthenticJobs, where you can search for projects that are a good fit for you.

Jon Phillips

I think websites such as Twitter are a great place to get started! In fact, I found a lot of my own clients via Twitter. Design forums are also a great place to network, make friends and find work. New freelancers may also be tempted to try design contests and crowd-sourcing, but I personally think they devalue the industry, so I wouldn’t advise doing that. Even if you don’t have much to show in your portfolio, there are others ways to get gigs. There are always job boards, such as the one on Smashing Magazine and the one on FreelanceSwitch, which are great for finding clients. You might even consider buying banner ads on design-related websites. But your marketing budget may not allow this at first, so networking websites, job boards and forums would be the places to hang out.

Jacob Cass

Get your name out there. Start blogging. Showcase your work. Look on job boards. Ask friends, family, local charities. Read books and blog posts: the information is out there. Your job is to find it!

Walter Apai

Networking is one of the best ways but often one of the most overlooked ones. I suggest that new designers speak to everyone they know and use every chance they have to talk about their work and what they do for a living.

I found myself just mentioning Web design to someone the other day (not even looking for more work), and immediately they thought of someone they knew who was looking for a website redesign. Opportunities are everywhere; just seize them.

I should also mention that one should not rely on networking alone or any other single “system.” I’d encourage new designers to take a multi-faceted approach to their new career.

There are unlimited ways to get new clients. Posting on bulletin boards, both online and offline, and placing small ads in the newspaper or local magazines are just a few of the media you can use. I also think that starting local is best, and getting experience working on projects with people who you can meet in person in your own city. This is a good starting point to gain more “field” experience.

Paul Boag

It has to start with friends and family. This will help build your initial portfolio. From there, consider doing some discounted work for a local charity to gain experience in working for real clients. After that, the contacts you have made through networking will start to pay off, and hopefully you will get some work through them. Finally and most importantly, make it known that you want work. It is surprising how many freelance websites I visit that don’t state whether they currently accept work or not.

That said, I would suggest that if you are straight out of university, you should probably work for a small agency before jumping into the freelance world. Being a freelancer requires a lot of business skills that they don’t teach you in university.

13. What networking tips do you have for young designers?

Henry Jones

One option is to attend design conferences, but for young designers this can be expensive. So, I would recommend getting involved in the design community. Start reading and leaving comments on popular design blogs. Create a Twitter account, and post useful stuff. Depending on how much time you have, you could even start your own design-related blog. Blogging has been huge for me, and I believe it’s the best way to get your name out there and meet other designers. No matter what route you take, just remember to be helpful and genuine, and you will build lasting relationships.

Paul Andrew

You are young — you cannot change that fact — and you want to be successful. In any business, especially ours, you need friends, you need contacts and most importantly you need to build professional relationships. Bear in mind, though, that networking is not something you can rush; it takes time and patience.

The best time to start networking is right now. Even if you are still in high school or haven’t yet graduated college, reach out now. It is never too early to get your name out there. Your name is your most powerful and memorable asset. Work will follow, I promise.

The most important relationships for any designer are the ones they have built with fellow students. No matter what happens, they are your primary network. You can help each other by sharing knowledge and design contacts and by learning from each other.

The best way to network beyond your inner circle is to get in touch with seasoned designers. For the most part, designers are pretty selfless and love to share and help when they can. With that in mind, put together a list of designers on whom you want to model yourself and someone with a strong body of work. Send them emails, accompanied by your portfolio, stating that you are a young designer starting out and seeking a little advice. Ask them how they got started, and ask for any tips they might be willing to share? Seasoned designers need to build their networks, too, and will welcome your introduction and questions.

When I started out as a designer, I sent a letter (with my portfolio and business card) to a local design agency — certainly not the biggest one or the most prestigious — and introduced myself as a young designer who was eager to learn. I asked if I could come in for a day or two to learn a bit about the design business and gain some work experience. Thankfully, they consented, and I spent three days asking questions, picking up business cards and meeting clients. That was over ten years ago, and I still rely on those contacts now. And to this day, that has been my most productive and successful period of networking.

Not every design agency will be as open as that one was, but I would try. There is no harm in asking.

One thing to remember about networking is that success is determined not by your number of contacts but by the quality of those contacts. Even if the best designer in the world sent you a courtesy email reply, it does not mean that you are in their network or that they are in yours. A quality network contact is someone who gives you a personal reply and genuinely tries to help you. These are the contacts you must maintain. This is your network.

Finally, please don’t think of youth as an impediment. Think of it as a license to ask questions, to learn and expand your personal network.

Paul Boag

Step away from the computer. Meeting people online is great, but nothing beats meeting them face to face. Attend conferences and meet-ups and get to know people. Then follow up on those relationships via Twitter and Facebook.

Also, don’t have an agenda. Or, if you have one, be honest and open about it. Too many people network solely to win work or become a “Web celebrity.” Instead, network because you want to meet like-minded people who will inspire and excite you about your work.

Soh Tanaka

Attend industry events, seminars and any kind of social gatherings. Don’t be shy; get to know the people around you. Be interested and willing to learn from them, and at the right time let them know who you are and what you do. Carry business cards with you at all times, and have your elevator speech ready. You never know when you will run into a potential client or employer. Networking is all about expanding your opportunities, and as a designer this skill is critical.

You may be interested in the following related post:

35 Designers x 5 Questions
Professional suggestions, tips and ideas from some of the best web-developers all around the world.

(al)

Feb 16^th

Adjusting Saturation With The Sponge Tool In Photoshop

There are several ways to adjust color and saturation in Photoshop. You can completely desaturate an entire image (i.e. take all the color out) by choosing Image > Adjustments > Desaturate. This strips all of the color out of the image but gives you a fairly wishy-washy grey image. This is NOT a good method for converting a photograph to black and white.

You can also choose to work on very specific areas of the image by using the Sponge tool (O). With the Sponge tool you can desaturate or saturate specific areas of an image by choosing a brush tip and then painting onto the image. Here’s how to use the tool.

1. Open a colorful image.

When you change the saturation of a color, you adjust its strength or purity.

2. Select the Sponge tool (), hidden under the Dodge tool ().

3. On the tool options bar, do the following:

Select a medium, soft-edge brush, about 65 pixels, from the Brush pop-up palette.
Choose Mode > Desaturate.
For Flow (which sets the intensity of the saturation effect), enter 50% so that it’s not desaturated too quickly.

4. As I drag the sponge back and forth over the center of the flower to decrease the saturation. The more you drag over an area, the more desaturated the color becomes until it eventually turns gray.

5. As already mentioned, you can also saturate an image using the Sponge tool. This can work well if you want to brighten or make a specific part of a colored image look more vibrant.

Back on the tool options bar, do the following:

Again select a medium, feathered brush, about 65 pixels, from the Brush pop-up palette.
Choose Mode > Saturate.
For Flow (which sets the intensity of the saturation effect), enter 50% so that it’s not Saturated too quickly.

Drag the sponge back and forth over the area you want to add more color to. For the purposes of demonstration, I’m going to over-saturate some of the petals and the stem on the flower.

It’s very easy to oversaturate an image, so that’s why the tool options such as Flow are helpful for controlling how much of an effect there is.

How To Manipulate Images With The Photoshop Clone Stamp Tool Jennifer demonstrates how to use one of the most fun...
How To Use The Background Eraser Tool In Photoshop The Photoshop Background Eraser tool doesn’t make a selection, but...
How To Quickly & Easily Remove A Background In Photoshop Jennifer takes a look and the often ignored, but very...

Display Post Thumbnail Also In Edit Post and Page Overview

WordPress version 2.9 introduced the function of Post Thumbnail. We wrote about this feature in this post and here and also in many other blogs. I find it an advantage, if the overview of articles and pages also provides the associated thumbnail. Therefore, I would like to introduce a small code snippet that makes just that.

The above screenshot should illustrate what the little extension does. The following code must be put in a Plugin or be copied into the functions.php of the theme.

if ( !function_exists('fb_AddThumbColumn') && function_exists('add_theme_support') ) {
 
	// for post and page
	add_theme_support('post-thumbnails', array( 'post', 'page' ) );
 
	function fb_AddThumbColumn($cols) {
 
		$cols['thumbnail'] = __('Thumbnail');
 
		return $cols;
	}
 
	function fb_AddThumbValue($column_name, $post_id) {
 
			$width = (int) 35;
			$height = (int) 35;
 
			if ( 'thumbnail' == $column_name ) {
				// thumbnail of WP 2.9
				$thumbnail_id = get_post_meta( $post_id, '_thumbnail_id', true );
				// image from gallery
				$attachments = get_children( array('post_parent' => $post_id, 'post_type' => 'attachment', 'post_mime_type' => 'image') );
				if ($thumbnail_id)
					$thumb = wp_get_attachment_image( $thumbnail_id, array($width, $height), true );
				elseif ($attachments) {
					foreach ( $attachments as $attachment_id => $attachment ) {
						$thumb = wp_get_attachment_image( $attachment_id, array($width, $height), true );
					}
				}
					if ( isset($thumb) && $thumb ) {
						echo $thumb;
					} else {
						echo __('None');
					}
			}
	}
 
	// for posts
	add_filter( 'manage_posts_columns', 'fb_AddThumbColumn' );
	add_action( 'manage_posts_custom_column', 'fb_AddThumbValue', 10, 2 );
 
	// for pages
	add_filter( 'manage_pages_columns', 'fb_AddThumbColumn' );
	add_action( 'manage_pages_custom_column', 'fb_AddThumbValue', 10, 2 );
}

Thanks for subscribing our feed! Sponsor the WP Engineer Blog and get your brand in front of several hundred users per day!
© WP Engineer Team, All rights reserved (Digital Fingerprint: WPEngineer-be0254ce2b4972feb4b9cb72034a092d)

Smashing Network Update: Add Widget To Your Site and New Members

In the last few months, you may have noticed some major changes happening on Smashing Magazine’s front page. Since November 2009, when we launched the Smashing Network, which features manually selected articles from the best design blogs, we’ve been working hard to improve the usability of our website and make the navigation easier to use and the content easier to read.

Indeed, we have been continually looking for a nice clean design that would allow Smashing Magazine’s brand to dominate the website, while boosting the visibility and exposure of our network members. We have considered various solutions, and one seemed to be just perfect. The result (we hope) is a cleaner separation of the magazine’s posts and network’s posts, by way of tabbed navigation at the top of the page.

[Offtopic: By the way, did you know that Smashing Magazine has a mobile version? Try it out if you have an iPhone, Blackberry or another capable device.]

Magazine And Network Tabs

So, what exactly does this mean? It’s very simple. At the top of the page, you’ll notice two tabs, one for Smashing Magazine’s posts and one for the Smashing Network’s posts. You can now easily switch between the magazine and network’s content without using the scroll bar. You can also visit the network’s content page, which wasn’t possible before, and use Smashing Magazine’s good old front page, which now features only Smashing Magazine’s posts. Also, the tabbed solution is the first step towards something huge that we have planned for 2010.

Smashing tabs in use. You can now easily switch between the magazine and network’s content on every single page of Smashing Magazine.

This change obviously means that our network members would get much less traffic from our website to theirs. So, to compensate, we have decided to add the tabbed navigation not only to our front page (as was done earlier) but to all pages on Smashing Magazine. This is why you see the tabbed navigation at the top of this page now. Aside from that, we have come up with a couple of new exciting features that will roll out this year, one of which is the Smashing Network widget.

The Smashing Network Widget

We are pleased to release a simple and customizable widget that displays the latest posts from the Smashing Network. It’s up to you to decide how to style our updates on your website. You can use your own CSS to customize the look of the widget as you wish. The widget is available right now!

To embed the widget on your website, simply include a JavaScript code. You will find the details, including implementation examples, on our page “How to Add the Smashing Network Widget to Your Site“.

We hope many designers and developers will integrate the widget on their websites. The main goal of the widget is to promote high-quality design-related content on the Web. We are confident that the design community will benefit significantly from the mutual support of the network websites, particularly in terms of traffic, so it would be great if you integrated it on your website, too.

Welcome New Members!

We are also very happy to announce that we have accepted new members into the Smashing Network. All applicants were carefully considered and tested for the relevance and quality of their content. In this second round, we have accepted the following websites.

CSS-Tricks

CSS-Tricks is a Web design community curated by CSS ninja Chris Coyier. The website offers a variety of articles, tips, tutorials and screencasts on front-end development, mostly CSS and jQuery. The website also features useful snippets and freebies and has a growing community forum.

Design Informer

Design Informer is a fresh new blog that brings the latest in Web and graphic design. It has Photoshop tutorials, freebies, resources, inspiration and much more. It is one of the fastest-growing design blogs, and it strives to always deliver high-quality content to readers.

Cats Who Code

Created by Jean-Baptiste Jung in June 2008, Cats Who Code provides practical Web development tutorials and resources for both beginners and advanced developers. With a focus on such topics as WordPress, jQuery and CSS, Cats Who Code helps you build better websites. Meow!

UsabilityPost

UsabilityPost is a blog about design. Design isn’t about what something looks like but about how it works. Making something usable means understanding what people expect from your product and thinking of ways to make their use of it simple and enjoyable. The aim of UsabilityPost is to provide relevant resources, tips and insights related to good design to help you make great products. UsabilityPost was founded by Dmitry Fadeyev in 2008.

UsabilityPost website

Web Designer Notebook

This blog’s purpose is to shed light on CSS and front-end development for those who are starting out, while also going deeper into more complex areas such as CSS3. Created by CSS master Inayaili de León.

Web Designer Notebook website

Line25

Line25 is the drawing board of creative Web design, a place where ideas and inspiration are drafted into articles, tutorials and round-ups of cutting-edge Web design. Created and updated by Chris Spooner.

UX Magazine

UX Magazine was created to provide a central place to discuss the critical disciplines that enhance user experience. An extraordinary user experience should be the goal of every interaction you deliver to users at any level. All too often, businesses (large and small) get it horribly wrong. It’s painful to watch and even worse when it happens to you.

Impressive Webs

Impressive Webs is an article and tutorial website dedicated to providing practical information on and solutions to common front-end Web development problems and issues. Created and updated by Louis Lazaris.

We are very pleased and excited to welcome these new members to the Smashing Network! We will do our best to continue promoting the best stories from the Smashing Network and to spread the word in social media.

Bonus: The Smashing WordPress Book

Aside from the network updates, we have even more exciting news for our friends and fans. In cooperation with Wiley & Sons, we have just released Smashing WordPress: Beyond the Blog, a new book in the Smashing Magazine book series.

The book shows you how to use the power of the WordPress platform, and it offers a creative spark to help you build WordPress–powered websites that go beyond the obvious. You will learn the core concepts needed to build just about anything in WordPress, resulting in faster deployment and greater design flexibility. The book was written by WordPress expert Thord Daniel Hedengren and costs $44.99 / €27.90.

What Do You Think?

Your opinion has always been very important to us. Please let us know what you think of the changes and the widget, and let us know how you see Smashing Magazine and the Smashing Network evolving. We look forward to your constructive criticism and are open to your ideas and suggestions!

Also, we will be adding more exciting features and revealing more exciting projects in the months to come, so please stay tuned for updates. Thank you.

(al)

How to Find Awesome Clients

Thousands of service buyers complain of poor quality work from freelancers and design agencies every year; often to the point that reputations are ruined and the design industry as a whole suffers. From disappearing service providers to fly-by-night scam artists, the online world is packed with opportunities for things to go wrong, and it’s really not surprising that so many online and offline entrepreneurs have a bad impression of freelancers and one-off designers.

Of course, there’s another side to that coin.

While cheapskate designers and fraudulent artists ruin business for one side, ultra-demanding clients and power-tripping businesspeople can certainly do the same for the other. From bizarre requests to ridiculous revision ideas, some clients can be an absolute nightmare to work with.

Unfortunately, it’s part of being a designer—especially a newbie designer—and a lot of people simply suck it up and get back to work.

The problem with that approach is that it’s not a long-term strategy. You can only work with poor clients for so long—they certainly pay the bills, at least most of the time —but they quickly become a major roadblock to your business flourishing, costing you in terms of opportunity. Time gets wasted catering to ludicrous requests. Rates are slashed to keep them onboard. And an all-round negative aura immerses your business.

The good news is that, with enough planning and marketing direction, you don’t have to work for clients that are frustrating and difficult.

Here are some strategies that will help you refine your freelancing business and personal marketing to the point where you’re choosing clients; not them choosing you.

Get your planning book out, file a new page for marketing, and incorporate these tactics into your new client acquisition strategy.

Search by Yourself

Searching for great clients can take time, but the satisfaction that comes from a low-maintenance client base is fantastic. Image source.

It’s one thing to put up an advertisement on a popular website, and another altogether to respond to someone else’s. While it’s typically unwise to respond to advertisements for service work – primarily since you’re often forced to work on the clients terms for payment and scheduling – it’s occasionally a great strategy for picking out clients and saving yourself the hassle of having to say "no".

Most webmaster forums will feature a website that’s packed with design-related jobs, and although wages are typically pretty low, they’re often a good place to start building up your portfolio and acquiring clients on your terms. If you’re catering to a higher-end market, a number of local directories and design-related websites typically offer job leads or other design contracts.

Create a Great Web Presence so They Can Find You

Without directions and instructions, how are your clients going to find you? Image source.

You’ve built a website, done some basic SEO work, and now you’re stuck waiting for clients to come to you. The only problem: they aren’t coming.

A basic website is just that – a basic website, and it’s unlikely to attract any valuable clients to your business. While people may stumble across is from a bizarre and unrelated search result, it’s very unlikely that you’ll gain any valuable clients without your own client-driven and well-marketed website.

Before you create your long-term business website, look at the people who are getting all of the jobs you’d like. Even if you’re not at their level currently, look at their websites and observe what it is that’s pulling in new clients week after week. For example, if it’s conversion-driven sales copy, hire a professional to write your page in an appealing and buyer-friendly style.

You can only imitate for so long, but as a starting strategy, it’s a good way to gain exposure and influence. When you’re dead set on getting clients to come to you, look at the people who are inundated with clients and see what they’re doing right. Reverse engineering can help as a beginner, and could end up being the difference between 10 great long-term clients and 10 frustrating one-time clients.

Ask Your Current Clients for Referrals

Sometimes a single phone call from a client is enough to land a major contract. Image source.

After a few months of freelancing as a designer, you’ll quickly build up a group of designers that come back to you for orders often. From weekly logos to frequent entire website designs, some designers are inundated with orders from one or two of their best clients, and completely free of work from anyone else.

This is the type of situation where you have to look at the advantages you have, not the potential disadvantages that only having a small stack of clients causes. Contact your best clients with an honest and important email, asking them if they know of anyone else that would be interested in working with you.

This situation can be taken to extremes, sometimes with very profitable effects. Want to really encourage your clients to get their friends working with you? Create an affiliate or referral program for your design agency, and convince past clients to bring in new ones for a small commission, discount on their next order, or special bonus. Incentives go a long way online, and sometimes something as minor as a free blog theme could bring in a new major client.

Advertise Yourself Strategically

When it comes to advertising, it’s all about strategy and placement.

PPC (pay-per-click) advertising can be worthwhile for service businesses, especially large service businesses that can afford to cater to a pool of clients at once. However, most PPC advertising platforms are used in a non-strategic manner, causing lost ROI and wasted time. From banner ad mistakes to on-page advertising that simply isn’t effective, even minor advertising mistakes can end up costing some serious money.

The best way to advertise is to go where your clients are. A great design blog or community might expose you to thousands of new designers, but it’s not the type of place that’s likely to be brimming with potential clients. Advertise strategically to target the most clients, and the most valuable clients, with every pick.

For example, a simple text advertisement on a small business forum could be worth much more than a large full-page post on a design marketplace. Why? Because an advertisement specifically tailored to small businesses will bring in hundreds of entrepreneurs and local business owners that are interested in working with you, whereas a marketplace posting will only ever bring in the occasional client, as the level of choice is hugely increased.

Don’t just advertise; advertise strategically for optimum clients.

Master the Cold Email Approach

Local clients will often like to meet in person, so get your suit and tie ready. Image source.

It’s surprising how effective an email marketing campaign can be for service business owners.

Relax, there’s no need to spam anyone, but targeting individual businesses and community companies with the offer of design services can be quite worthwhile. Many businesses want to be online, but simply don’t know how to move their business there. As a designer, you can approach them with a deal in mind, limiting their barrier to entry and maximizing your local business profits.

This works best with local clients, and for some designers it can seem like quite a mission. Most of us internet-based providers aren’t used to working with offline businesspeople, so get ready for a few changes.

Email as casually as you’d like, but expect in-person meetings, discussions over lunch, and more than a few questions for a large contract. For some, this might be too much work, while for others it presents a lucrative opportunity.

Partner With Other Designers and Design Firms

Sometimes even the unlikeliest of partnerships can work in your favor.

There are going to be times in your life when scheduling gets completely out of control. Clients will stack up, website design requirements will tally well off the page, and work will become a major headache for you. Then again, there will also be times when clients simply aren’t contacting you, leaving you completely free of work, and unfortunately, free of income.

Realize that every service business experiences these changes from time to time, and while many don’t adapt, many others do.

If you want a more constant flow of long-term clients, why not team up with another designer or design firm? You’ll be free to take care of their overflow when things get rough, and they’ll be available to take care of yours. While not a perfect solution for long-term clients, this approach can minimize downtime and keep your schedule smooth even through low-client patches.

What Are Your Strategies for Finding Awesome Clients?

How do you find your clients? What are some great resources online to find clients? Share it with us in the comments!

About the Author

Mathew Carpenter is a 17-year-old business owner and entrepreneur from Sydney, Australia. Mathew is currently working on AddtoDesign, a website which provides jizz-worthy design buzz. Follow Mathew on Twitter: @matcarpenter. Follow the development of @AddtoDesign.

Boagworld Podcast Celebrates 200 Episodes

One of the biggest sources of inspiration behind the SitePoint Podcast has been the long-running Boagworld Podcast, which marked its 200th episode this past week by broadcasting a 12-hour live marathon.

Regular Boagworld hosts Paul Boag and Marcus Lillington were joined by a cavalcade of guest stars, including SitePoint authors Rachel Andrew and Elliot Jay Stocks, SitePoint Podcast co-host Patrick O’Keefe, and other “Britpack” notables such as Andy Clarke, Drew McLellan, and Dan Rubin.

The live marathon was a remarkable success, with some participants saying the show felt like a free web conference. An edited version will be published on the Boagworld site (and podcast feed) this Friday, February 19th, with the interviews recorded to follow in the weeks and months ahead.

And speaking of podcast milestones, be sure to catch SitePoint Podcast #50 next Friday, February 26th.

Congratulations, Boagworld. Here’s to 200 more.

CodeBurner Updates for Firefox 3.6

I’m pleased to announce the hotly awaited update to CodeBurner, our popular developer tool for Firefox and Firebug, bringing it up to date with Firefox 3.6.

This version was delayed after the release of Firefox 3.6, for which I apologize, because of new and stringent restrictions on add-ons scripting in the public directory at addons.mozilla.org. This made it necessary to implement a whole new HTML templating system for the search results and code examples.

The change was needed because the domplate library I was using contains several instances of the eval statement, and this is no longer permitted. I therefore had no choice but to scrap domplate, and write something new to take its place. You shouldn’t actually notice any difference, but the behind-the-scenes changes are quite significant.

Other new features in Version 1.5.2 include:

a new “minimize browser names” user option in Firefox 3.5 or later, which eliminates clutter from the search results tables so that browser names are only shown once per table, instead of every row
improved focus behaviors in the tab boxes
more easily identifiable style sheet URLs in the CSS view
other minor bug fixes

Follow these links to install the latest versions of CodeBurner:

And keep watching this space, as there are updates to the Air, Opera, and Dashboard versions coming very soon, as well as further updates to the Firefox and Firebug versions.

We just never stop!

!important is Actually Useful (in Print Style Sheets)

The poor old !important statement receives a lot of flak in the CSS community, and with good reason. It’s unnecessary, creates a maintenance nightmare, and makes a hollow mockery of the cascade. I haven’t thought about using !important in years, until I discovered one very good use for it: print style sheets.

Let’s pretend that we want to create an image gallery. Doing our best at honoring the ideals of progressive enhancement, we first make sure that the images are contained within an HTML list. Eventually we want to use JavaScript to create a fade-in/fade-out slideshow effect, but our base is a single column of images. If a visitor has JavaScript disabled that’s what they’ll see.

Okay, so far so good. When we come to make a print style sheet, however, we’ll discover a flaw in our plan: when you use JavaScript to animate HTML elements, you inevitably end up modifying the elements’ style attribute. In our slide show, JavaScript has altered the position and opacity of the images, so only one is revealed at a time. When we go to print the gallery page, although we want a single column of images, what we end up printing is only a single image. That’s because you’re unable to specify a target media type for CSS declared in an element’s style attribute; you cannot say that all styles declared in the style attribute are for screen only.

So what you need is a way of specifying print styles that can override the inline styles. There’s only one way to do that: !important. In your print style sheet, reset the image elements’ position and opacity, and add !important:

img.gallery {
  position: static !important;
  opacity: 1 !important;
}

That’s it really; I found a legitimate use for !important and wanted to share it.

Three Simple Steps to Maintaining a Razor-Sharp Skill Set

One of the challenges that we as web professionals face is that of keeping our skills updated in a constantly changing world. Our expertise can and will quickly become outdated if we don’t work purposely to continue our education, which makes continuing education one of the most important things you can do.

But when you’re putting in full days to take care of clients and working hard on developing your business, we look at that continued education and often end up telling ourselves, "That can wait," and before we know it our skills have fallen behind and then our work suffers because of it.

The good news: with a little bit of determination, you can stay on top of those skills and even have fun with the learning. Today, we’re going to look at how you can overcome your obstacles and make it happen.

And by the way, the best part is that this continuing education has both long-term and short-term results, so it’s not one of those things where you have to wait forever to start seeing the fruit. You can put your new skills to use right away, in addition to reaping long-term success from your maintained competence. I don’t know about you, but I think that’s pretty exciting! Let’s look at the how-to.

Step 1: Make a Plan

Your educational efforts will be much more productive if you make a plan ahead of time. Ask yourself, "What do I want to learn? What skills have I seen in others that I would like to have?" These could be things specifically related to your work, like if you decided that you wanted to master Photoshop Actions. Or they could be from a different but similar skill set, like if a developer decided he wanted to learn a new programming language. Or your desired skills could be business/people related, like if you decided you wanted to become better at making good first impressions with potential clients.

It’s all up to you, and you have the freedom to set your sights on anything! It’s important to break out of the box and make sure you don’t have any of those "I always wanted to learn how to ______, but I never did" regrets in regards to your job.

In case you wondered, there are two reasons why it’s important to plan what you want to learn about.

First, this brainstorming might make you think of some ideas you would have missed out on otherwise.

And second, on the other end of the spectrum, is that it keeps your education efforts focused on the things you really wanted them to be focused on. I know some of us (me included) have a tendency to get distracted reading blogs and such and then excusing it as "continuing education". I know from experience it’s an easy trap to fall into, and we don’t want to end up there, so making a plan ahead of time and help us avoid that!

Step 2: Schedule It

If you’re like me and most other people, you know that if it doesn’t get put in the schedule, it probably won’t happen. That’s why it’s essential to set aside a time each week and just make yourself stick to it. Before long, you’ll find yourself looking forward to your weekly learning session.

Pick a time that is generally free from interruptions, and then be consistent in setting apart that time. Of course, you don’t have to pick a weekly timeframe. Once a week has worked well for me, but if you find that some other scheduling works better for you, by all means go with that.

The key is regularity, and other than that it’s up to you.

Step 3: Find out How

You’ve got the plan, you’ve got a time scheduled, now what? The next step is to find the resources you’re going to use for this extra learning – a way to expand your knowledge in an easy, fun and cost-effective way. Of course, for different people this will take different forms. For example, I’m a book person. I’d rather learn from a good, thorough book than pretty much anything else. You’ve got plenty of other options, though – seminars, videos, and heck, you could get a full education just from all the excellent blogs out there. Each of these has its own pros and cons, so I would repeat that it’s vital to establish your own criterion based on your own needs and preferences and then go from there.

Here are some of the excellent, varied options you have for continuing your education.

Conferences

While these aren’t so cost-effective or schedule friendly, the seminars and other opportunities cannot be overlooked, and the contact-building capabilities of conferences are another benefit. If you’re the conference-going type, check out these lists of web conferences and writing conferences.

Social Media

the great part about using social media for education is the personal interaction that goes with it. If you’re interested in expanding your social media experience to include education, try reading and Social Media Basics for Freelancers and Continuing Your Education 140 Characters at a Time

Blogs

I don’t have to explain this one! A good collection of feeds is an indispensable resource – and very possibly the only education you’ll ever need. You probably already have a collection of favorites, but if you’re looking for more ideas, there’s a whole host of great opportunities:

Books

Books can add up quickly, but they are certainly fabulous learning tools. And don’t forget to check your public library – they won’t have everything (and not the very newest stuff), but it’s a great way to be able to read some good books without putting a whole lot of cash on the line. Then, if the book was a once-through kind of book, you didn’t spend any money, and if it’s the kind you’ll want to refer back to, you can always go get your own. Wondering how to find what’s worth reading? Try these:

There’s a whole world of opportunities out there – the important thing is that you pick something that fits you well and gives you the inspiration to stick with it.

Where Will You Go?

The world moves fast, and it’s up to you how you’ll stay on top of it, but I hope you’ve been able to see that you can definitely maintain your professional skills without draining your wallet or adding another chore to your schedule. Learning is really an enjoyable adventure – and the destination is all up to you!

About the Author

Nick Parsons is a web enthusiast, designer and developer from Houston, Texas, as well as the owner of Webitect, an awesome resource blog for webmasters. Feel free to contact him via email or Twitter.

Feb 15^th

How a Career Coach Can Help You Bust Through a Roadblock

When I graduated from college, I had a difficult time finding a job that kept me challenged and engaged. I had several different positions related to web design, in a few different industries, and each one started out with a lot of promise but quickly fell short in my eyes. Several months into each new position, it became harder and harder to get excited about going to work, even though I was doing exactly what I thought I always wanted to do – design.

There was nothing wrong with the positions themselves, the companies where I worked, or the people I worked with. In fact, these were exactly the kinds of jobs I envisioned having when I was still in school. So why did I feel so dissatisfied?

I knew I had a passion for business and part of me always knew that entrepreneurship was in my blood. So I decided to build a business on the side; create my own career satisfaction by being proactive. So I did and had a decent little client base, but guess what? I was still miserable. What was wrong with me? Why couldn’t I be happy? Was I destined to a life of professional discontent?

Enter my first coaching experience. I don’t remember how I came to coaching or why I thought it would be helpful for me, but my first coaching experience completely changed my life. Through the process, my coach helped me learn a lot about myself, my goals and what it would take to find happiness in my career. It was through working with her that I discovered virtual assistance and started the journey of building my current business (and one of my biggest passions), avertua.

Coaching can be a very different experience for each person, but many of the benefits are universal. Here are some of the ways a career coach helped me and may be able to help you get your footing and build a life that invigorates you.

Strategy Development

One of my struggles was lack of focus. I knew I wanted to do something big, but had no clue what it was or where I needed to start. I was all over the place; there were a million different things running through my mind and I couldn’t focus on any one of them. I was running in circles.

My coach helped me get rid of the noise, identify my goals and figure out the best way to accomplish them. She helped me see the big picture when I was having trouble getting past step one. Together we created a plan, including a timeline that kept me moving in the right direction.

Accountability

Planning is great, but the real value comes from the follow through. There were certainly some parts of my plan that I enjoyed less than others, and some I really dreaded. This type of growth and stretching is vital with any kind of goal-setting. But it’s so tempting to skip over these less desirable activities and focus only on the good stuff. My coach held me accountable for doing the things I said I was going to do and helped me figure out why I was avoiding some actions.

Clarity and Confidence

I had moments of falling back into the I’m-running-but-not-getting-anywhere struggle. These were the times when my coach helped me take a step back and see what I was having trouble recognizing for myself. It would have been very difficult for me to keep pushing forward without the stark lucidity that my coach helped me find.

This clarity not only helped me stay on the path to realizing my goals, but it gave me confidence. I knew what I was doing, even when I was nervous about it. My coach consistently reminded me that I created a strategy that focused on my strengths, and I had the power to follow through.

Motivation

A good coach is a mentor, sounding board, and cheerleader rolled into one. The cheerleader part is so important, especially when you’re doing something new. Every good challenge is a test of your dedication and endurance, and I experienced this while creating avertua. Like most people, I hit snags when things didn’t seem to be progressing how I envisioned them. And like most people, I considered throwing in the towel.

My coach helped me stay motivated by reminding me of the benefits I identified in the beginning of the process and encouraging me along the way when I couldn’t do it myself. She helped me celebrate wins and recognize when I reached a milestone. Her support helped me acknowledge what I was accomplishing, even when it seemed like baby steps.

Coaching can be a powerful experience if you’re open to growth and self-inquiry. I probably would have found my way even if I didn’t work with a coach, but I am certain it would have taken me much longer, and been a much more stressful process. For me, coaching worked.

Have you worked with a coach? What did you get out of the process?

Image credit: BrianForbes37

50 jQuery Tools for Awesome Websites

By now, everyone has heard of jQuery. It’s a framework that makes JavaScript development much easier, and has become massively popular for adding JavaScript functionality to websites.

In this post, we’ve picked out 50 of the best scripts we know of and talked about why they rock. They can help in just about any aspect of a website, so enjoy!

Editors

These first tools don’t use jQuery themselves, instead, they’re editors to help you write and edit your own jQuery scripts.

1. Aptana Studio

Aptana Studio is a tool built for making great websites and webapps. It supports a wide range of JavaScript frameworks, including jQuery.

2. Komodo Edit

Komodo Edit is an open source editor that provides features such as auto complete, call tips (CSS, HTML, JavaScript, Perl, PHP, Python, Ruby, Tcl, XML and XSLT), multi-language file support, syntax coloring, syntax checking, Vi emulation, Emacs key bindings and more. One of the most useful features is the ability to extend Komodo Edit. You can find lots of useful add-ons for JavaScript developers like DOM Inspector , Komodo Extension Developer ,Venkman JavaScript Debugger and Hack It

3. Spket IDE

Spket IDE provides features like code completion, syntax highlighting etc. to help developers create efficient JavaScript code productively. Spket IDE is free for non-commercial use.

Navigation

4. Coda-Slider 2.0

Coda-slider JQuery plugin, which was published first in September 2007. Their goal was to mimic the regulatory impact on the promo page for Panic Software Coda. Coda-Slider 2.0 was built from scratch and should be much more flexible and lighter than its predecessor.

5. jQuery Treeview Plugin

jQuery Treeview Plugin is Lightweight and flexible transformation of an unordered list into an expandable and collapsible tree, ideal for unobtrusive navigation enhancements. It can even set a cookie to remember how a user last left the menu.

6. Accordion Menu

This plugin creates an accordion menu. It works with nested lists, definition lists, or even just nested divs. It has options to specify the structure in which the active element (to adjust to the first display) and animations.

7. jquery mb.menu

jquery mb.menu is another very powerful component for easy creation of jQuery multilevel tree menu or context menu (right mouse button).

Forms

8. jQuery Nice Form

jQuery Nice Form is simple way to create a form, but can also make more complicated forms if you desire.

9. jQuery form validation

jQuery Validation is a jQuery plugin that checks a user’s input as they fill out a form.

10 . Ajax Fancy Captcha

Ajax Fancy Captcha is a jQuery plugin will helps you protect your web pages from bots and spammers.

11. Masked Input Plugin

Masked Input Plugin lets you easily set a format that a form input must be in, e.g. a phone number field could onto contain numbers, dashes and dots.

Tables

12. DataTables

DataTables is plugin for Jquery. This is a very flexible tool, that adds advanced interactive controls to any HTML table

13. TableSorter

Tablesorter is a JQuery plugin for turning a standard HTML table with THEAD and TBODY tags into a sorted table without reloading the page. Tablesorter successfully analyzes and classifies the different types of data in the cells.

14. FlexiGrid

Flexigrid adds a lot of formatting options to tables, including pagination, column sizing and navigation/search controls.

15. Colorize

Colorize highlights the columns/rows that a user has currently moused over or selected. You can set the exact color changes you’d like in the options.

16. uiTableFilter

uiTableFilter allows you to instantly search a table and only display rows with your results in them, e.g. check out the demo page.

Upload Files

17. Uploadify

Uploadify is a JQuery plugin that allows easy integration of multiple (or single) file upload boxes on your website. This plugin requires Flash as well.

18. Multiple File Upload Plugin

Multiple File Upload Plugin (jQuery.MultiFile) is another plugin for allowing multiple file uploads, but this time without Flash being needed.

Image SlideShows and Galleries

19. Ad Gallery – Custom Photo jQuery Plugin

Ad Gallery takes a simple unordered list of images and then converts them into a, much more presentable, gallery.

20. slideViewerPro

SlideViewerPro is another highly recommended script for easily making interactive galleries from your photos.

21. Pikachoose

Pikachoose offers a number of options for displaying your pictures, including slideshows.

22. Galleriffic

Galleriffic has a slightly different layout for its gallery by default, but it looks great!

23. Galleria

Galleria is great because it loads progressively, i.e. as each image is loaded, its thumbnail will appear. It won’t make you wait for the entire gallery to come down.

24. Simple Controls Gallery

Simple Controls Gallery is an easy way of making an automatic slideshow of photos for your users, and offers controls for them to pause/skip forward.

25. JQuery (MB)gallery

jQuery (mb)Gallery is a little more complex than some of the other options here, but it supports showing different albums in one gallery so it may be worth the extra effort.

26. Galleryview

GalleryView is extremely well documented/demonstrated on its page so if you’re unsure about how to set up some of the other plugins, give this one a go!

27. Supersized

SUPERSIZED, as you might expect, supports displaying images the full size of the browser window. The cool thing about this is that it will resize the image, keeping their ratios, to fill the screen for you without any part of the picture being cut off.

28. Easyslider1.5

Easy Slider 1.5 is jQuery plugin that offers many features such as auto slide, continuous sliding, “go to first” and “go to last” button, hiding controls, vertical sliding, multiple sliders on one page, and many more.

Content Editor

29.jWYSIWYG

jWYSIWYG is a lean script that converts text fields into visual content editors.

30. MarkitUp!

MarkItUp! is a JavaScript plugin built on the jQuery library. MarkItUp allows you to turn any textarea into a markup editor. HTML, Wiki Syntax, BBCode are all supported, but even better, you can define your own markup language!

31. HTMLBox

HTMLBox can convert any textarea into a visual editor. It is very feature complete and packs in just about any formatting option you could ever need!

32. Lightweight RTE

As the name implies, Lightweight RTE focuses entirely on creating a text editor while adding as little weight as possible to the page. At only 7kb when compressed, I’d say they succeeded!

33. WYMEditor

WYMeditor is a WYSIWYM (What You See Is What You Mean) XHTML editor. It focuses on editing the structure of the content to what the user would like, but leaves the presentation controls to you.

Twitter

34. Realtime Related Tweets

Realtime Related Tweets displays a set of Tweets in real-time that are related to your post.

Calendars and Datepickers

35. Transcendent

Transcendent makes it easy to set dates via calendars, and even select whole date ranges between two days.

36. Clockpick

ClockPick is intended to make setting a time easier. Check out the demo page (click one of the white input fields) to see what you think.

37. Weekly Calendar

Weekly Calendar sets up a great looking calendar very similar in functionality to Google Calendar.

38. UI Datepicker

UI Datepicker makes date entry on forms so much easier for your users.

Charts

39. Visualize

Visualize is jQuery plugin that turns regular HTML tables of data into charts.

40. JS Charts

JS Charts allows you easily to create a variety of charts, including pie charts, line, and bar graphs.

41. Google Charts GUI

Google Charts GUI uses the Google Charts API to create its charts, so as you can imagine, they look great.

42. JqPlot

jqPlot’s specialty is for line graphs, as you can see from the screenshot.

Tooltips

43. jQuery Tooltip – Tooltips done right

Tooltips Done Right can set up tooltips with any HTML you like, including images and tables.

44. Jtip

Jtip is another tooltip script that gives you a lot of control over the output.

45. jQuery (mb)Tooltip 1.6

(mb)Tooltip 1.6 will take your regular link “title”s and design a nicer looking tooltip from them.

Tabs

46. TabContainer

TabContainer lets you easily set up tabbed sections, and fade between them.

47. jQuery UI Tabs

jQuery UI Tabs is a simple tool for setting up tabbed content areas on your blog.

Rounded Corners

48. Curvy Corners

Curvy Corners helps add rounded corners to your divs, at least until CSS3 support for border-radius is more common amongst your users.

LightBox

49. Thickbox

Thickbox is ideal for displaying images. It loads on top of the rest of your page (Not a traditional pop-up though!) and gives the user controls to browse to the next image, space for content and easy exit controls.

50. SimpleModal

SimpleModal creates a similar effect to Thickbox, but its specialty is in displaying any sort of content you like. No need for it to be an image.

That’s Them All!

Those are 50 of our favorite jQuery tools. We’ve covered a wide range of functionality in this list alone, but there is much more out there!

What jQuery scripts have you used on your sites? Anything we should know about?

5 Reasons Why There are no Killer Offline Web Applications

Technology that allows web applications to work without an internet connection sounds like a great idea. In general, it allows developers to:

run processes on the PC to improve latency and response, and
create applications that work offline and store data locally.

The technologies blur the boundaries of the web and the desktop. It’s a concept that excited everyone in the industry a couple of years ago and has now been adopted in HTML5. See my previous post: How To Create an Offline Web Application.

So why are there just a handful of mediocre web applications which use offline functionality?

Google has added it to GMail, and I suspect Chrome OS was a major reason for doing so. But it’s hardly a groundbreaking concept — offline email has been available for decades. Other offerings tend to be a random collection of password managers and speed boost widgets for systems such as WordPress.

Here are 5 reasons why offline applications have not gone mainstream:

1. Poor browser implementation

Although HTML5 is gradually appearing, offline functionality is immature and implementations differ. Until the technology is commonly available, developers must rely on browser plugins. Google Gears is the most well-known, but it’s not available on all platforms and development has ceased.

2. Additional development effort and complexity

Creating a web application which works online and offline is not easy. In some cases, an application could require two separate versions to handle the differences. That effort may not be worthwhile if the majority of users stay connected.

3. Ajax

The processing overhead is distributed if the server can offload work to the client. It’s also possible to send data in more efficient batches rather that full page loads. However, many good web applications are already doing that with Ajax. Response times can be fast without using offline-enabled code.

4. Security

Storing data locally should prevent many security issues and this is why it’s been used by several password managers. However, if you’re really concerned about security, why not use a desktop application which never connects to the web?

5. Few user benefits

I can understand the appeal of offline storage, but how many users do a significant amount of web-based work at a location with poor net connectivity? If they do, then it’s a simple matter of using an email client or a word processor rather than an online application.

The big advantage of web applications is that data is stored in the cloud. Offline storage may provide a safety net, but how often will that be necessary? If there’s one thing that we can be certain about — internet connectivity will improve.

Perhaps it’s too early but, for me, offline functionality feels like a technology waiting for an application. However, I have thought of one killer idea … come back tomorrow to find out more.

Email Newsletter Design: Guidelines And Examples

The email newsletter is a powerful marketing and communication tool that has various useful functions. It reminds your users about you; it informs users about your products; it tells them what you have been up to; and it helps you build a unique relationship with them. Users like email newsletters if the newsletters bring them value.

The fundamental rule for creating an email newsletter is to give it interesting, relevant and up-to-date information that is enjoyable to read. Users sign up for newsletters hoping be informed about things that they would not otherwise be able to find out about. In this article, we’ll discuss some guidelines for designing and distributing email newsletters. Each point will be accompanied by both good and bad examples.

Please notice: in this post we features both good and bad examples of newsletter design, so you can get a better understanding of the problems to avoid and good design decisions to make.

You may be interested in the following related posts:

Design and Build Email Newsletters Without Losing Your Mind (and Soul)

[Offtopic: by the way, did you already get your copy of the brand new Smashing Book?]

Signing Up For A Newsletter

This is an important step in convincing users that your newsletters are interesting and that they would benefit from signing up.

Tell Users What They Will Get

Before asking users for their details, tell them what they will receive, and identify the benefits of signing up. If you mention that the newsletters will include exclusive offers and deals, make sure to keep the promise. In addition, let users know how often they will receive the newsletter: weekly or monthly.

On the Mulberry sign-up page, the company promises to send users exclusive updates and offers. The Marie Claire UK subscription page clearly states that its newsletters include news, beauty buys, competitions and offers.

Marie Claire UK subscription page

Reward Users for Signing Up

You may want to consider giving some reward to users for signing up; for example, a free gift, voucher or discount. To encourage users to sign up for his newsletter, Jamie Oliver offers a free £25 wine voucher that can be claimed after subscribing (on the condition that users spend £64.99 or more on the wine).

Jamie Oliver sign-up page

Jamie Oliver reward page

If you will give rewards, let users know as soon as possible in the process. James Perse gives users who subscribe to its newsletter a $15 online gift card. However, the reward is not mentioned on the subscription page, and the promotion code is sent via a confirmation email only after the subscription has been received. You would not have known that until you subscribed. The company is clearly missing a great opportunity to get people to sign up for its newsletters.

James Perse subscription confirmation email

Preview Your Newsletter

One way to let users know what they will get is to give them a preview of your newsletter. Hershey’s Kitchens has two different newsletters, and it offers examples of both types. The company even gives each newsletter a name and clearly indicates how often it will be sent out.

Hershey’s Kitchen sign-up page

Keep Questions Short and Simple

Users avoid filling out forms and submitting their details if possible. For a newsletter sign-ups, all you need is their email address.

Hersey’s Kitchens has 10 mandatory fields. MarieClaire.com has 8 fields, but only the email field is required. We have found from our studies, though, that people often miss the asterisk or do not know what it means. Users who are reluctant to fill in many details may well refuse to sign up in this case.

Hershey’s Kitchen sign-up page

Content Of Newsletter

Based on our user testing, we found that people look at three things when they receive a newsletter:

The sender, to see if it is from someone they know.
The subject line, to see if it is of interest to them.
The date, to see if the communication is up to date.

Write an Attractive Subject Line

One way to encourage users to open your newsletter is to write a subject line that grabs their attention.

If you are offering some sort of deal in your newsletter, try to avoid generic appeals in your subject line (for instance, Game July newsletter subject line: “Sizzling Summer Deals”). Instead, mention specific offers, such as Dorothy Perkins November Issue: “25% Off Just for You”. Also, be realistic about your offers, and avoid making them sound too good to be true. Users are skeptical about subject lines like “Get 1000 Extra Points” because they know they will often have to spend a lot to get those points.

Provide Useful and Well-Written Content

A newsletter should contain information that users would not normally research on their own. Users take seconds to scan for topics of interest to them before deciding whether to spend more time reading the newsletter. If your newsletter, like Forrester’s, shows only one or two topics, users would less likely to find something of interest to them.

Forrester newsletter

Furthermore, including links to your website in the newsletter is crucial.

Make Content Relevant to Your Readers

Make your newsletter’s content as relevant to your readers as possible, whether through offers, products or images. Superfluous content will add no value and simply be ignored. You could also provide customized content. Personalization can be done in one of two ways:

Asking users for more (optional) information when they sign up.
Implicitly recording what they buy and view on your website.

For example, Amazon sends newsletter with recommendations based on what its users have purchased. Recommendation-based newsletters can be highly useful, provided that your analytics are accurate.

Amazon’s customized newsletter

Offer Exclusive Deals

You could always offer subscribers special deals or freebies. There are a few ways to go about this. H&M and Photobox ask users to present their newsletters at the point of purchase in stores to receive discounts. Clinique and Airparks include a promotion code in their newsletters that users can redeem when checking out online.

H&M newsletter

Photobox newsletter

Airparks newsletter

Avoid putting these benefits so deep in the newsletter that users miss them. For instance, Clinique (above) puts its code at the bottom of the page, whereas Airparks puts its at the very top of the page.

In addition, make sure the rewards are relevant to your product and target audience. Take Inkclub, which gives out a free blusher to customers who shop via its newsletter. Not only does this item have little relevance to Inkclub’s product line, but it may not be very attractive to the company’s target users.

Inkclub newsletter

Newsletter Design

Design your newsletter to suit its chief purpose. If the main objective is to announce a new product or promote a particular service, you may want to focus the newsletter entirely on this product or service. Good examples are Apple in promoting its new iPhone 3GS.

Apple newsletter promoting its new iPhone 3GS.

To promote its latest exclusive offers, Ted Baker takes an easy and rather lazy approach: the whole newsletter consists merely of one big banner showing offers of 50% off, in the hope that users will click to the website to find out more. By contrast, Dabs.com showcases a number of its latest deals in its newsletter, giving users a rough idea of its product line and sale prices.

Ted Baker newsletter

Dabs newsletter

You could also adopt a catalogue style, like IKEA, or create a summary of your e-commerce website, like Audible, which teases users to visit its website with prices and a clear call-to-action button.

IKEA newsletter

Audible newsletter

Keep it Simple and Straightforward

As reported by the Nielsen Norman Group in its Email Newsletter Usability Report, the average reader skims a newsletter for 51 seconds. People never read: they scan for content that is of interest to them. So, don’t overwhelm them by squeezing too much information on the page. Make sure your content gets straight to the point, and write short paragraphs and bullet points.

The main purpose of Flybe’s newsletter is to present an exclusive offer on family trips to Disneyland. The value of this deal is lost among the long paragraphs. The message could be conveyed more effectively in bullet points for quick scanning.

Flybe newsletter

Make Good Use of Images, Numbers and Colors

Users are drawn first to elements that are visually simulating, such as graphics. Use images to guide users to the most important content and messages.

Numbers also grab attention. Users tend to associate them with prices and savings. Use percentages and dollar values to show concrete offers. For example, Pixmania newsletter has a big “49% off,” showing how much savings are available: clear and appealing.

Pixmania newsletter

Color adds interest, too. But be careful, because inappropriate use makes for a messy, confusing newsletter. Take Rimmel London’s newsletter.

Rimmel London newsletter

Tailor the Layout to the Content

A newsletter can be designed in a one-column or multi-column layout or a mixture of both. A one-column grid is easier to skim but might take up more space and increase the length of the newsletter. While people do skim email newsletters, that’s no reason to make them overly lengthy. However, some exceptions are the Design Hotels newsletter, which is long but well organized. Hotels are shown based on location, with attractive photos and deals.

Design Hotels newsletter

A two-column layout is common for newsletters. Narrower columns is usually used for the table of contents and upcoming events, while the main content is given a wider column. Etsy uses a two-column design for its newsletter, but both columns contain photos and links, and the sections have no prominent divisions. The design makes the page look messy and it lacks focus, making it hard to figure out where to look on the page. By contrast, iStockphoto’s clear division between sections and grid design help guide the user’s attention to the left or right column.

Etsy newsletter

iStockphoto newsletter

Be Creative

Creativity in a newsletter is always welcome. Both First Great Western and Southern present their content using fictional characters, Bob and Loco respectively, who users can easily relate to.

First Great Western newsletter

Southern newsletter

Giving each edition of your newsletter a different layout or design is okay as long users can easily recognize your brand. Despite STA Travel using various styles for its weekly newsletter, certain elements follow their branding guidelines, allowing users to quickly identify it.

STA newsletter, issue #254

STA newsletter, issue #255

Unlike the rather uninspiring Tripadvisor newsletter, Top Gear gets creative with its hand-sketched design, which makes the newsletter fun to read and explore.

Tripadvisor newsletter

Top Gear newsletter

Be Wary of Table of Contents

Some newsletters include a table of contents at the top of the page, which can help users quickly scan for items of interest. A table of contents can be especially helpful in lengthy newsletters that have a lot of content, such as the one from MoneySavingExpert.

MoneySavingExpert newsletter

Previous experience tells us, though, that some users do not understand that the links in the table of contents navigate within the newsletter. Assuming that the links take them to a website, they avoid clicking them altogether. One solution is to avoid placing the links in the left or right columns, as Foodepedia does, which is where external links and ads are often found.

Foodepedia newsletter

Be Wary of Ads

If you have to include ads in your newsletter, make sure they blend in with the content. A good example of this is Lastminute.com, and a bad example is PCMag.com which merely copies Google AdSense code directly into its newsletter, making the page look messy and the content unconvincing.

Lastminute.com newsletter

PCMag.com newsletter

Tools And Features

Make it easy for users to unsubscribe, but don’t remind them how to all the time. Also, tell users how they can change their email address, view the newsletter in a Web browser and quickly share the newsletter with their friends. Other useful features include: “Follow us on Twitter,” “Be Our Fan on Facebook” and “Watch Us on YouTube.”

After Sending Out The Newsletter

After sending out your newsletter, use an email marketing tool and list manager to track, monitor and measure the performance of your campaigns. Many email service providers are out there, such as MailChimp, iContact, Mailvivo, Mailing Manager and Atomic Email Tracker. The majority of them also provide templates to help you create your newsletter if you don’t want to get your hands dirty.

Showcase

MacHeist’s Directorate newsletter grabs its readers’ attention with the price of its iPhone apps (£0.99). Then, it tells them what MacHeist does in a short paragraph and presents its features in a clear and appealing way via icons. Simple, interesting and effective.

Headscape’s newsletter with large headlines and nice illustrations.

Muji’s newsletter has a tidy layout that allows for quick scanning. Each section is accompanied by nice product images and prices.

Howies might have a bit too much text in its newsletter. However, it organizes the content into different sections with big clear headings.

Apple’s Christmas newsletter has a photo-related theme promoting its digital photo organizer software, iPhoto, and its photo books and calendar printing service.

HQhair.com gives its users an exclusive offer with a code. It not only emphasizes the word “FREE” but makes good use of the model to draw attention to the offer.

Bluefly cleverly divides its newsletter into two sections: “Offers” (the main section) and the right navigation section, using beautiful imagery in the process. Also, notice how it emphasizes the 80% offer and word “OFF” (in large font).

Ambiance San Francisco takes a creative drawing-based approach to encourage users to shop with it.

Disney Adventures‘ newsletter is another good example. Its beautiful picture gives users that holiday feeling.

Good Life Garden’s newsletter effectively uses the word “Free” to grab the user’s attention. The design is simple yet visually pleasing. Unfortunately, the content is repeated in the same newsletter.

Bite Card’s newsletter has festive background imagery to evoke the winter season. It is simple, with a big banner at the top showing the product price, followed by cocktail choices and ingredients.

The Squawk’s newsletter attracts users with the beautiful book cover on promotion for that month.

Cauldron’s newsletter also has a tidy layout and clearly defines the purpose of each section. It tells users the subject of its next issue in the “Coming Next Month” section at the bottom, a nice tease.

Mango’s newsletter makes good use of bright, attractive colors.

iStockphoto’s uses a gallery to present its top eight photos of the month: neat and easy to scan.

Threadless‘ newsletter offers “$10 per tee” in big clear type at the top of the page.

Further Resources

You may also be interested in these additional resources:

About the Author

Chui Chui Tan is a User Experience Consultant at cxpartners, UK. She loves being creative. Chui Chui has spent over seven years conducting user evaluations and designing usable and accessible user interfaces. She previously worked as a Mechanical Designer and received her doctorate in Human Computer Interaction. You can follow Chui Chui on Twitter.

(al)

Free Medical Icons Set (60 Icons)

Today we are glad to release a Free Medical Icons Set, a set with 60 original medical icons in .png 32 bit in resolutions 32×32px and 128×128px. This set was designed by the user interface design agency Centigrade and released exclusively for Smashing Magazine and its readers. The icons can serve as great in-app icons for desktop or RIAs in the medical domain. With perspective and reflective effects these can be a real stunner on landing pages or in touch screen application menus.

Download the icon set for free!

You can use the set for all of your projects for free and without any restrictions. You can freely use it for both your private and commercial projects, including software, online services, templates and themes. The set may not be resold, sublicensed, rented, transferred or otherwise made available for use. Please link to this article if you would like to spread the word.

Behind the design

As always, here are some insights from the designers:

There are a lot of free icon libraries out there, however, only few of them focus mainly on medical icons and we wanted this gap to be closed. Centigrade conducted quite a lot of icon projects in the healthcare sector just recently, for which reason we already had some nice vector shapes on the pile. We distilled the most frequently requested metaphors and wrapped them into a fresh new style. Being modern and concise rather than fancy and playful, they are in line with what we experienced works well in the medical domain.

Thank you very much, guys! We really appreciate your efforts.

50 Beautiful Clean and Simple Web Designs

When it comes to web design, my experience demonstrates to me that it’s easier to add to a design rather than to take away from it. The challenge with minimalist layouts lies in the conundrum of making something beautiful with basic design elements —and with as few of them as possible.

Lately, I’ve been attracted to simple and clean designs. Design Instruct is a testament to my affinity towards creating designs that present the idea of "less is more."

In this collection are masterfully created minimalist designs for your inspiration in your current and future work. This is a follow up of a collection called 40 Beautiful Examples of Minimalism in Web Design published last year. (You should check that out as well, if you haven’t already.)

SOFA

Simon Collison

kilian muster

Mark Boulton Design

Christopher Brand

Haik Avanian

Tim Bjørn

Ribbons of Red

biancaelmer.de

Top Site Tally

Chevychase Design Studio

ONLY NY

Trent Walton

Tom Watson

Academy

Digital Podge 2009

TPUTH

SimpleBits

Your Neighbours

Frank Chimero

iA

Snook.ca

Urban Influence Brand Studio

Hyperakt

LegiStyles

Hudsons

Marcelo Henrique

Jessica Hische

Analog

Jaredigital

Future of Web Design London

The Book Cover Archive

Neiman Group

A Way Back

Mercy

Happy Cog’aoke 2

Ed Nacional

Q Brand Agency

160over90

52 Weeks of UX

Pretty Production

Arnaud Beelen

Svärta

Fubiz

Pew Center for Arts & Heritage

Websiteburo

Nicholas Felton

MUJI Global

Needs/Wants Magazine

Vitra

About the Author

Jacob Gube is the Founder and Chief Editor of Six Revisions. He’s also a web developer/designer who specializes in distance-learning education, front-end development, and web accessibility. If you’d like to connect with him, head on over to the contact page and follow him on Twitter: @sixrevisions.

Feb 13^th

The Skinny on CSS Attribute Selectors

CSS has the ability to target HTML elements based on any one of their attributes. You probably already know about classes and IDs. Check out this bit of HTML:

<h2 id="first-title" class="magical" rel="friend">David Walsh</h2>

This single element has three attributes: ID, class, and rel. To select the element in CSS, you could use and ID selector (#first-title) or a class selector (.magical). But did you know you can select it based on that rel attribute as well? That is what is known as an attribute selector:

h2[rel=friend] {
   /* woohoo! */
}

There is a lot more to attribute selectors though, so let’s look closer at all the different options and try to cover some “real world” scenarios on when they might be useful.

Attribute Exactly Equals Certain Value

In the example we used above, the attribute of the h2 element was “friend”. The CSS selector we wrote targeted that h2 element because it’s rel attribute was exactly “friend”. In other words, that equals sign means just just what you think it does… an exact match. See another basic example:

<h1 rel="external">Attribute Equals</h1>

h1[rel=external] { color: red; }

A great real world example of this is styling a blogroll. Let’s say you had a list of links to friends sites like this:

<a href="http://perishablepress.com">Jeff Starr</a>
<a href="http://davidwalsh.name">David Walsh</a>
<a href="http://accidentalninja.net/">Richard Felix</a>

Then you wanted to style each link slightly differently. The traditional way would probably be to give each link a class name in which to target, but that requires additional markup which is always a nice thing to avoid (semantics and all). Another way might be to use :nth-child, but that requires their order to never change. This is the perfect use for attribute selectors… the links already have a unique attribute in which to target!

a[href=http://perishablepress.com] { color: red; }

I believe the most common use of regular attribute selectors is on inputs. There are text, button, checkbox, file, hidden, image, password, radio, reset, and submit (did I miss any?). All of them are <input>’s, and all of them are very different. So doing something like input { padding: 10px; } is a bad idea most of the time. It’s very common to see things like:

input[type=text] { padding: 3px; }
input[type=radio] { float: left; }

It’s really the only way to get your hands on certain types of inputs without screwing up the others and without adding extra markup.

Attribute Contains Certain Value Somewhere

This is where it starts getting more interesting. The equals sign in attribute selectors may be prefaced by other characters which alter the meaning a bit. For example, “*=” means “match the following value anywhere in the attribute value.” Look at this example:

<h1 rel="xxxexternalxxx">Attribute Contains</h1>

h1[rel*=external] { color: red; }

Remember that classes and ID’s are attributes too, and can be used used with attribute selectors. So let’s say you were writing CSS for a site where you couldn’t control the markup and a sloppy developer had three DIVs you need to target:

<div id="post_1"></div>
<div id="post_two"</div>
<div id="third_post"></div>

You could select them all with:

div[id*=post]  { color: red; }

Attribute Begins with Certain Value

<h1 rel="external-link yep">Attribute Begins</h1>

h1[rel^=external] { color: red; }

A real world example of using this would be, say, that you wanted to style every single link to your friends site different than other links. Doesn’t matter if you are linking to their homepage or any subpage, any links to them you want to style up.

a[href^=http://perishablepress.com] { color: red; }

That will match a link to their homepage, but also any other subpages as well.

Attribute Ends with Certain Value

We can select based on how attribute values begin, why not end?

<h1 rel="friend external">Attribute Ends</h1>

h1[rel$=external] { color: red; }

Honestly I struggle a bit to find the perfect real world example of using this, but I do like that it exists. Perhaps you could use it to look for links that end in characters that will likely have no significant effect:

a[href$=#], a[href$=?] { color: red; }

Attribute is within Space Separated List

You probably already knew that you could apply multiple classes to elements right? Well if you do that, you can still use .class-name in CSS to target any one of them. Attribute selectors aren’t that easy. If your rel attribute has multiple values (e.g. values in a space separated list) you’ll need to use “~=”:

<h1 rel="friend external sandwich">Attribute Space Separated</h1>

h1[rel~=external] { color: red; }

You might be thinking, why would I use this when *= would also match this and be more versatile? Indeed it is more versatile, but it can be too versatile. This selector requires the spaces around the value where as *= would not. So if you had two elements one with rel=home friend-link and one with rel=home friend link you are going to need the space-separated selector to target the second one properly.

Attribute is within Dash Separated List

The dash separated list is very similar to the space separated list above, both in it’s use and how it’s nice to have for stricter enforcement beyond what *= can do.

<h1 rel="friend-external-sandwich">Attribute Dash Separated</h1>

h1[rel|=external] { color: red; }

Multiple Attribute Matches

Vital to note is that you can use multiple attribute selectors in the same selector, which requires all of them to match for the selector itself to match.

<h1 rel="handsome" title="Important note">Multiple Attributes</h1>

h1[rel=handsome][title^=Important] { color: red; }

Browser Support

Every single example above works in all modern browsers: Safari, Chrome, Firefox, Opera, and IE. Internet Explorer has perfect support for all of these down to version 7, but zero support in 6. To test in your browser, see the test page. If the line/selector style is in red, it works.

50 Fresh Design Blogs You Should Be Reading

The last year or two has seen a dramatic increase in the amount of new design and development related blogs breaking out in to the community. In this article, you will see a list of fresh and new design blogs worth subscribing to and reading. Our goal here is to help you discover a few sites that you might not have heard of before.

Of course, we’ve left out the staples and the big boys such as Smashing Magazine, Abduzeedo, et al. because you’re likely already familiar with them.

1. Design Informer

Design Informer is an excellent weblog by Jad Limcaco, a web designer from Long Beach, California. Design Informer shares articles, tutorials, and freebies for designers.

Subscribe to Content Feed

2. DesignOra

DesignOra is a website for creatives that covers a wide range of topics. They also offer step-by-step tutorials for designing awesome stuff. The site is regularly updated so you’ll get a constant stream of great content.

Subscribe to Content Feed

3. Onextrapixel

Onextrapixel (more commonly known as OXP) was opened to the public on the 14th of April, 2009. It was started by two enthusiastic Singapore-based designers/developers. On OXP, you’ll find inspiration sources, tutorials, freebies, tools and various other articles.

Subscribe to Content Feed

4. Three Styles

Three Styles is aimed at web developers and designers, bringing them the latest trends and tutorials. Topics range from excellent designs for inspiration, high quality tutorials (from Photoshop to jQuery and everything between) and free resources.

Subscribe to Content Feed

5. ideasonideas

ideasonideas is a design blog by Eric Karjaluoto, who discusses design, brands and experience.

Subscribe to Content Feed

6. Inspired Magazine

Inspired Magazine (more known as InspiredM) was opened on the 2nd of March, 2009. It offers all kinds of design goodies, such as articles, freebies and inspiration.

Subscribe to Content Feed

7. Inspect Element

Inspect Element offers high quality articles, tutorials and also features a ‘best of the week’ series which includes links of the week and wallpapers of the week.

Subscribe to Content Feed

8. Blog of Francesco Mugnai

Francesco Mugnai is a freelance graphic designer who runs a design blog on the side. You’ll find articles about advertising, Apple, business cards, graphic design, design inspiration, WordPress and tutorials.

9. Design Boom

DesignBoom is huge design blog, posting about everything design from graphic design to illustration, from art to architecture. They also run regular competitions and own a shop.

Subscribe to Content Feed

10. Position Absolute

Position Absolute is run by a dedicated team to bring us the best content about everything that concerns web development. The blog was opened to the public on the 23rd of January, 2009.

11. Circlebox Blog

Circlebox Blog is my home. I blog about all things design with a pinch of photography and business-related articles. I opened the blog live to the public on June the 25th, 2009.

Subscribe to Content Feed

12. The Web Blend

The Web Blend is a community for designers, developers and tech junkies that keeps you current with a summary of the latest in web related news and trends. Users can vote for their favorite articles to see them displayed on the front page.

Subscribe to Content Feed

13. Folio Focus

Folio Focus is a design blog dedicated to showcasing beautiful web-based portfolio designs. It is updated on a regular basis (usually daily) and is sometimes updated several times per day. A great source for portfolio inspiration.

14. Blog Design Heroes

Blog Design Heroes is a blog dedicated to showcasing fresh and modern blog theme designs. It’s a great source of inspiration when designing or redesigning a blog and is updated almost daily.

15. Type Inspire

Type Inspire is a design blog dedicated to showcasing beautiful typography and text effects used in both print and web design. It’s (again) updated almost daily.

16. Siiimple

Siiimple is yet another design blog dedicated to showcasing a particular style of work. This time, showcasing simplistic web design. The site is regularly updated making it a superb place to visit for inspiration.

Subscribe to Content Feed

17. Bevel and Emboss

Bevel and Emboss is a blog powered site offering free web templates and icon sets that are simple to use, free to use (and modify) and require no linkback.

Subscribe to Content Feed

18. Web Designer Help

Web Designer Help is a blog dedicated to web designers, offering free resources, interviews, tutorials, inspirational showcases and competitions.

Subscribe to Content Feed

19. Script & Style

Script & Style is an archive for web developers and designers. Users can submit their own links, and browse others to help you grow as a designer and developer.

Subscribe to Content Feed

20. D-Lists

D-Lists is a blog dedicated to compiling lists of the very best in design, from advertising to web design. It’s administered by Michael Wilson and was opened on the 4th May, 2009.

Subscribe to Content Feed

21. Cats Who Code

Cats Who Code is a weblog dedicated to web development, with a focus on programming languages, blogging tips, web design and WordPress. Jean-Baptiste Jung, a Belgium based web designer and developer, runs this awesome site.

Subscribe to Content Feed

22. Design Blurb

Design Blurb provides web and graphic design tutorials, resources, tips and links on a regular basis to the design community.

Subscribe to Content Feed

23. Tutorial Board

Tutorial Board offers high quality tutorials for graphic design, motion graphics and visual effects. The site aims at offering the highest quality tutorials on the net with real world production issues and working solutions.

Subscribe to Content Feed

24. Marco Folio

Marcofolio is a blog by Marco Kuiper. The blog offers many categories including art and design, programming, fun stuff and tutorials.

Subscribe to Content Feed

25. [f5]

[f5] was opened in July 2009 and is regularly updated with daily creative inspiration. If you’re suffering from the dreaded design block, this is a great place to visit.

Subscribe to Content Feed

26. Little Box of Ideas

Little Box of Ideas was opened in February 2009 and is owned by Sneh Roy. The blog offers contests and giveaways, freebies such as brushes and icons, inspiration, interviews, resources, reviews and tutorials.

Subscribe to Content Feed

27. Nouveller

Nouveller is a design-related blog by Benjamin Reid, a web developer from UK. Being a side project, the blog isn’t updated as regularly as it could be, but when it is, you’re bound to learn something new. Categories include competitions, downloads, inspiration, jQuery, photography and tutorials.

Subscribe to Content Feed

28. Designussion

Designussion is a blog dedicated to design discussions, inspiration, brand identity, freebies, showcases and tutorials. It is updated on a regular basis with 2-3 posts per week.

29. Creativity Den

Creativity Den is owned by Liam McCabe and was started because of his love for design. The blog offers various articles, tutorials, resources, round-ups, interviews and freebies.

30. Web Developer Plus

Web Developer Plus is a web development and design blog providing tips, tutorials and advice on how to design and develop great web applications. Topics range from PHP/MySQL to AJAX, Javascript and jQuery, and HTML/CSS to WordPress tweaks.

31. Creative Opera

Creative Opera is a blog aimed at new designers and individuals that love good design. It is full of useful information, creative inspiration and lively discussion.

32. Minimal Exhibit

Minimal Exhibit is a blog dedicated to showcasing minimalistic and simplistic web designs. It is usually updated on a daily basis and is a great source of inspiration for all kinds of designers and artists.

33. From The Couch

From The Couch is an online video show, presenting interviews, site reviews, theme reviews, news about Obox Design, tutorials, the reality of running a small web company and much more.

Subscribe to Content Feed

34. Cart Frenzy

Cart Frenzy is a blog dedicated to showcasing the latest and freshest trends in online shopping cart and eCommerce design.

35. Design Snips

Design Snips is a blog dedicated to showcasing snippets (thumbnails) of design to produce a wall of inspirational work, allowing the user to click and view the full design.

Subscribe to Content Feed

36. XHTML-CSS-CODE

XHTML-CSS-CODE.com is a blog devoted to design, development, html, xhtml, css and creativity. It was made live to the public on the 21st of June, 2009.

Subscribe to Content Feed

37. DesignNewz

DesignNewz is an archive site that features articles, resources ans tutorials written by designers and developers from all over the design community.

Subscribe to Content Feed

38. Line25

Line25 was a new project of Chris Spooner’s this year (owner of Spoon Graphics). The blog is a drawing board of creative web design, a place where ideas and inspiration are drafted out into articles, tutorials and roundups of cutting edge web design.

39. Bit Rebels

Bit Rebels is a blog focused around fun, on the edge and relevant subjects and categories such as design, events, gaming, geek, lifestyle and movies.

40. Freelance Shack

Freelance Shack is a blog that covers every aspect of a freelancers life, from marketing to inspiration and pricing to clients. The blog was opened in September 2009.

Subscribe to Content Feed

41. Paper Leaf Design & Photography Blog

Paper Leaf is a creative husband-and-wife duo who regularly blog to build a rich resource of tips, articles, inspiration and important information for designers, photographers and clients.

42. Scarlet Bits

Scarlet Bits is a brand new project created by Marco and Iris. They headed out to bring the web design and development community new and exclusive freebies, tips, tutorials and important news from the niche.

43. Blue Blots

Blue Bots is a design blog showcasing trendy inspiration, freebies, tutorials and resources from all over the web.

Subscribe to Content Feed

44. Red Bilby Blog

Opened to the public in October 2009, the Red Bilby Design blog is one of the newest on this list. It offers inspiration, interviews, tutorials and various other design-related articles.

Subscribe to Content Feed

45. Smashing Share

Smashing Share is by Waheed Akhtar, a web designer from Dubai. The blog was founded in August 2009 and was started to share free web resources with designers and developers.

46. Echo Enduring Blog

Matt Ward opened the Echo Enduring Blog as part of his company in June 2009.

Subscribe to Content Feed

47. PSDeluxe

PSDeluxe is is an ultimate delight for all Photoshop enthusiasts. It’s armed with a huge pool of information regarding the tools and tactics of Photoshop.

Subscribe to Content Feed

48. Webitect

A web design and development blog targeted at freelancers, Internet entrepreneurs, bloggers, designers, developers and webmasters of all sorts. They are focused on making you a better webmaster.

49. Slodive

Slodive cover topics such as design inspiration, web development and unique Photoshop tutorials.

Subscribe to Content Feed

50. letscounthedays – Notebook

letscountthedays is the portfolio of Shay Howe, a Chicago native and a freelance web/user interface designer. His portfolio site has a blog section (which he refers to as his notebook) that publishes content that you should definely read.

Subcribe to RSS feed

Missed your favorite fresh design blog?

The comments is always a great way to discover even more great sites. So if you know of a fresh, off-the-beaten-path website that we didn’t mention, please share it in the comments.

About the Author

Callum Chapman is a freelance Graphic Designer and Illustrator Cambridge, UK. He is the creative mind behind Circlebox Creative and Circlebox Blog. He’s written for publications such as Smashing Magazine and other well-known design blogs. You can reach him via Twitter or Facebook.

This group is pulling updates from:

rss json

« Previous 1 2 3 4 5 6 7 8 9 10 11 … 28 29 Next »

Some Random Dude's Latest Updates From "appreciation"

Developing a Business Plan

Outlining Your Marketing Activities

Creating a Business Budget

Planning for the What-If’s

1. For students who aspire to work in design, what would you recommend they study?

David Leggett

Wolfgang Bartelme

2. How does a student determine whether design is for them or they should pursue another career?

Jacob Gube

Henry Jones

David Leggett

Wolfgang Bartelme

Chris Spooner

3. How do you balance education and work?

Zach Dunn

Jacob Cass

4. How did work outside your studies prepare you for your career?

Zach Dunn

Jacob Cass

5. What should students and new designers focus on outside of their course work to advance in their careers?

Brian Hoff

Chris Coyier

Elliot Jay Stocks

Walter Apai

Jacob Gube

6. What one thing do you wish you knew before starting your career?

Darren Hoyt

David Leggett

Jacob Gube

Paul Boag

7. What job search advice do you have for recent graduates?

Soh Tanaka

Darren Hoyt

Chris Coyier

8. What should new designers consider when deciding between working for an agency and freelancing?

Elliot Jay Stocks

Soh Tanaka

Chris Spooner

9. How can students and young designers make themselves more valuable to potential employers?

Darren Hoyt

Wolfgang Bartelme

Chris Coyier

Walter Apai

10. What should new freelancers do during the first few months of their business to succeed?

Paul Andrew

Brian Hoff

Chris Spooner

Jon Phillips

Elliot Jay Stocks

11. Aside from design and technical skills, what aspects of running a business should new freelancers focus on?

Paul Andrew

Brian Hoff

Jon Phillips

12. What are some of the best ways for new designers to find clients?

Henry Jones

Jon Phillips

Jacob Cass

Walter Apai

Paul Boag

13. What networking tips do you have for young designers?

Henry Jones

Paul Andrew

Paul Boag

Soh Tanaka

Related posts

Related posts:

Magazine And Network Tabs

The Smashing Network Widget

Welcome New Members!

CSS-Tricks

Design Informer

Cats Who Code

UsabilityPost

Web Designer Notebook

Line25

UX Magazine

Impressive Webs

Bonus: The Smashing WordPress Book

What Do You Think?