What makes a web-designer a great web-designer? Guts and information – and bit of talent.
All designers have to defeat the same monsters.
- Inspiration blocks;
- Lack of material, like and unvectorized logo;
- Poor quality images or their non-existence;
- Low or no budget;
- Unhelpful clients;
May I continue?
Well the good news is that you just need courage to persist and the light of information to scare those monsters away.
You got the courage. I got the Info.
Here I’ll give the info that could take you ages to find by yourself or another designer to tell (maybe because of lack of time or selfishness). I tried to cover most of the aspects that will help you in your journey, in a total of 15 aspects. Let’s start with some healthy tips for images.
Images
It is 3 AM; you are pretty tired, your stomach can’t bear another dose of caffeine and you still need that Pretty Business type picture to use in your project, but you don’t have the budget to afford a stock image from gettyimage. Been there? Well, don’t panic. You can get it in HI-RES for free from some great sites – plenty of royalty photos to share, that you can use on your personal and commercial projects, depending on the type of license.
Now you will spend until 4AM trying to decide which photo to use.
This is my site of choice, I’ve been using it using for years, god pretty usable navigation; lots of great quality photos, many ways to sort them.
More great sites :
The biggest photo community site where you can also find perfect pictures for your work. You just have to check if the license is suitable to your project.
Wikimedia imagesearch in 64 categories. Also under the Creative Commons license.
Metasearch (search through several free stock photo sites): pretty useful, but you will needs registering.
- picfindr.com
At first look this site doesn’t seem that attractive, but once you try your first
search you’ll find a neatly done flash interface with photo previews, sorted by
origin.
The interface is better looking than picfindr’s, but lacks the convenience of a flash interface.
HUGE index of free vector files from the best designers in the world.
From the same guys of vecteezy. Index with daily updates of photoshop brushes.
Pixel patterns
Pixel patterns are in fashion (yes, again), but wait! Not as in annoying animated gif that clutter your page background. They have come back in the form of pixel rich textures varying from clean to Victorian flowers.
- kollermedia.at
- squidfingers.com
- k10k.net
Logotypes
You’re working on project and suddenly your client tells you that you have to add several partner logos and all that you’ve got is a Business card to take the logo from.
Frustrating uh?
Well, at least until this 2 little babies came into my life. These 2 sites host vector based company logos from all around the world. So no more unexpected and unpayed hours of logo vectorization. All you need is a bit luck and the logo you need will be in their database.
I can’t say how many times this site has saved my neck with its vector logos. God save this site.
Fonts
Now you weren’t that lucky to find that logo on www.brandsoftheworld.com and you still need it in vectors, but you can’t recognize which font it is using. (Or you are simply wondering what fonts certain corporation or ad campaign has…)
If the logo is not using avantgarde or arial, you’ve got 2 options. Use your skills as Fontographer guru or use the whathefont tool from myfonts.com: it works great! You input the URL from the desired logo or upload the scanned image. Using OCR (optical character recognition), it gives you the font the logo is using or, if not, you’ve got several similar options. This’ going to save you hours of search or the worse, having to vectorize the font… (it gives me the creeps!)
Wanting to do a web2.0 style logo, but not sure where to start? Not even sure what makes a logo look like web 2.0? Let this article guide you through some of the current style in logos, the fonts they use and the way they sort the logos by appearance.
More about what fonts famous sites logos.
- modernlifeisrubbish.co.uk
Compare fonts on screen.
Now you are going to need some fonts for that logo. You can find a wide range of hi-quality free fonts on these sites. You can even find clones of commercial logos for free!
- dafont.com
- typenow.net
- smashingmagazine.com
Icons
Icons are the way to spice things up on a design. Fortunately there are lots of very talented designers that are willing to share with us their tiny masterpieces.
My personal favourite repository of free icons.
- iconfinder.net
Finally someone got the idea. It was hard to look up icon by icon to see which set had the icon I needed.
- famfamfam.com
These little icons (especially the silk one) are almost the standard for many blogs and websites; you will amazed at how many mini icons the set has. For almost every web software.
- ndesign-studio.com
Another valuable set of mini icons.
More icon resources:
- sweetie.sublink.ca
- converticon.com
- iconfactory.com
- tango.freedesktop.org
- maxpower.ca
- websiteicons.net
Color
One of the big secrets that makes a design look great is its color scheme. You could do a great layout but if it lacks contracts and balance, it’s condemned to oblivion.
- iosart.com
I’ll present this little marvel first. Colozilla is a Firefox extension that allows you to pick colors from your browser. Saving you the hassle of taking screenshots and pick the color in photoshop.
Several premade color schemes. And superb color wheel tool. You won’t believe how inspirational and useful this could be. And how this will be a excellent opportunity to try your newly added colorzilla tool
Canonical (Huge) List of Online Color Resources for Designers
- wellstyled.com
- gmazzocato.altervista.org
- colorblender.com
Educational Material
All you need is a little discipline and patience, and you can surely achieve great results in no time. There are loads of stuff for you to learn, I am just presenting the tip of the iceberg.
More than a tutorial, this’ a DIY (Do It Yourself) Guide to WEB 2.0 Style. It’s constantly updated. I personally love this site. The guide tells you step by step what makes a design looks web 2.0 and how to achieve it.
This is a must for any web-designer developer. Tons, I mean, TONS of free on-line courses offered in an intuitive way.
More Education Resources.
- developer.yahoo.com
- good-tutorials.com
- totaltutorial.com
- kirupa.com
- cameronolthuis.com
- tutorialized.com
- dailyblogtips.com
- stud.cmd.hro.nl
- webpagesthatsuck.com
Inspiration
Don’t Panic! Inspiration is not only for Davinich’s or Michelangelo’s. You just need the muses to visit you. And here are some pretty gorgeous ones. Remember, you don’t need to reinvent the wheel every time you start a design. Just the right source of inspiration study of what makes it look, good implementation and viola: a lovely design.
- fuzzyfuture.com
50+5 source for inspiration smashed into one post.
Identity inspiration.
- smashingmagazine.com
These are going to make your life easier indeed. They save you a lot work by smashing humongous amounts of info. In this case, inspiration material.
More inspiration:
- flickr.com
- cssbeauty.com
- cssinsert.com
- webcreme.com
- webdesigngalleries.wordpress.com
- dynamicdrive.com
- styleboost.com
Tools
This Firefox extension is a must. It shows you how the webpage is created block by block. It shows the source code of the element from page.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Have you ever seen this dummy text? Sure you have. It comes in handy when you have to “simulate” text because it give you a more natural feeling than the “text text text text”or “Link 1 Link 2 Link 3”.
A Basecamp clone, but opensourse. Project management tools to deal with your client, files, milestones, etc.
CSS and HTML validators, SEO tools, Social services, Web proxies, Network tools, Text tools, Image tools in one site.
Online background image generator.
Tweak your CSS. Backgrounds,Borders, Lists Fonts to make it shine.
- miniajax.com
More than 50 ajax and dhmtl downloadable scripts.
Don’t suffer bad surprises again. Like, “dude that layout is totally scrambled in IE 6!”. Been there? With this online tool you will get a screenshoot of several browsers in less than 30 minutes.
Blogs and forums
Design Blogs and forums are fantastic (as this one intends to become)! They give inspiration, freebies, how to’s, tutorials and, the best of all, the opportunity to meet other designers and be part of the community.
To know it is to love it. In my opinion, the best and the biggest design community out there.
Valuable design forum with many helpful people willing to share their knowledge.
One of my favorite design blogs. Constantly updated, useful articles, many design freebies and what’s more important the site that inspired my to finally launch this site. Thank you.
More Sites:
CSS
Don’t feel guilty if you still use tabled designs. CSS are here to stay and it’s no more an option. I know it’s pretty scary when you’ve been all your life using tables to jump to CSS – it’s a whole parallel universe. And all those compatibility problems and WYSWG. But fear no more, there are step by step’s and resources. You will be doing your CSS designs quicker that setting a row span.
- smashingmagazine.com/category/css
This is the category from the CSS Smashing Magazine (yes, listed again on this post); probably the biggest selection on CSS material on the web.
No time to design yourself? Give it a try this site more 2000 Free CSS design.
Would you prefer CSS sand boxes better? Those sites offer ready made Blank CSS layouts for you to download and fill with your designs.
- blog.html.it/layoutgala
- blankcss.com
- layouts.ironmyers.com
- highdots.com/css-tab-designer
This is a free software to create more than 60 Tab navegation menus in CSS.
More CSS Resorses
- quazen.com/Computers/Programming/How-To-Create-a-Tableless-Layout-with-Dropdown-Menus.24213/1
- developer.yahoo.com/yui/grids/
- cssfly.net
Money
Business going slow? Or maybe you think you deserve more for your work. Well, Freelancing is a great option. You just need to go to the right places to offer you job.
Before you start, some tips and tricks for pricing a project.
- sitepoint.com/article/web-work-should-charge
- webdesign.about.com/cs/salaries/a/aa022403a
- blueflavor.com/blog/tips_tricks/pricing_a_project
- getcashboard.com
Now you can offer your work.
This is my personal favorite. It’s got many well-paid design contests in different categories from logos to complete website. And places to sell your website templates. Everything in clean and excellent design interface that really facilitates the process.
My close second favorite. It lacks some interface functionalities Sitepoint has, but it’s also an excellent choice to offer your designs.
- book.airgid.com
Web Designer’s Success Guide Free Ebook is the definitive guide to starting your own freelance.
More sites to offer your work:
- NamePros.com
- Talkfreelance.com
- V7N .com
- elance.com
- guru.com
Productivity
Even if you consider meals as an interruption, considering to buy Shower Shock Caffeinated Soap you need to eat, take a shower, s l e e p!, make love with your girlfriend (or boyfriend) and stretch to be productive.
- webdesignfromscratch.com/ten-productivity-tips.cfm
- health24.com/dietnfood/DietDocs_articles/15-1871,27044.asp
- baptistonline.org/health/healthieryou/health/ergonomics.asp
nice resources, thanks a lot for sharing..
Wow. That’s an amazing list. Thanks.
thanks for your kind comments guys!
I actually work as a freelance designer 🙂 that huge post was just more than 10 years work condensed. In fact it was a bigger post i had to trim it a little.
Some additions:
Go Media’s Arsenal has some of the best stock vectors around:
http://www.gomedia.us/arsenal
High quality design tutorials:
http://www.gomediazine.com
http://www.pixel2life.com
Blue Vertigo:
http://www.bluevertigo.com.ar/
Clean CSS optimizer:
http://www.cleancss.com
You Work For Them:
http://www.youworkforthem.com
thank you very much indeed.
I’ll be keeping this page handy 🙂
Fantastic website!
Nice list!
I got another cool addition:
http://www.inserit.com – they currently have a free blog module that lets web designers set up a blog with their own designs (without programming a thing)
Great! Amazing resources here!
always a good source for inspiration
http://www.digital-artist.de.vu
i’am really impressed!!
Thanks for the additions!
impressive new ones like http://www.digital-artist.de.vu
I cant believe i forgot bluevertigo.com.ar.
Another cool inspiration resource is http://www.depthcore.com
Great stuff. Well and truly bookmarked!
Great post ..!!
It seems you rating plugin is not working. Yesterday I rated it as 5/5 and now its still showing No ratings as yet.
So I rated it again .. 😀
Hi ,
Thanks for sharing such nice info , i m already in DigitalPoint /SitePoint , Both are great to learn n Earn
Tulip
Thank you, Thank you, Thank you!
This is a wonderful list!
Lowell
this is a big WOOOOOOOT!
AMAZING LINKS!
bastantes sitios, voy a echarle un vistazo.
WOW Your list is really very helpful.Thanks a lot
Nice list you’ve got there. Thanks
Thanks, lots of great stuff here.
Thanks for sharing, great resources!
…
Great link ”collection”!
Thanks.
…
Thanks a lot, this is a great content to share!
thank you so much for your generosity!
muito obrigada por tamanha generosidade!
De nada eleonora 🙂 legal que você tenha gostado.
You sir, are my hero 🙂
Thanks! Here is another good one:
http://www.designeducation.ca
I am more than glad that you have like this article. Please keep posting your additions to the list. I will be releasing a revised and extended version of this one considering your suggestions.
thanks 🙂
Insane… It-s great,, i just come from a similar list http://www.dezinerfolio.com/2007/04/22/the-web-designers-tool-kit/
But yours is better 😀 Thanks a lot!!!
These are great and really killer tips! thanks for sharing! A must read for all Graphic and Web Designers!
Thanks. A great collection of resources. Here is a useful site with many professional open-source resources for web developers as well.
http://www.webappers.com
Wow, this is a lot of good information. I especially like the “whats that font?” program. I’ll definitely try it out.
This web page might be a good resource too. It contains over 130 web design buttons.
http://www.dragnet.se/webbdesign/button_collection.html
Couple of additions:
http://www.photogen.com
http://www.freeres.info
Thank you for the list. Here’s another helpful site:
http://www.freewebsitebuttons.com
this is one of the best collections ever. I dug & bookmarked you. thanks for this great resource!
Nice Article. Thanks.
This is truly fabulous. I found it via digg AND stumble upon. Great information, very well put together. Inspiring!
Great list! Very suitable for my webdesign-bookmark-list! 🙂
Thanks for the tips, especially the icons! Those are more useful than most people could image. Even Windows software can be improved by some good icons.
Can I suggest #86? An FTP client that tells you which files need to be uploaded … it’s enough to keep track of all your design elements, let the computer track files.
http://forrestcroce.com/Software/WebMaestro.html
Good Job ! bro . CONGRATULATIONS ! very well
WOW !!
Very well compiled list …
I will bookmark this page.
nice refference man, your link is in my bookmark, thanks , i found what im lookin for here . u make the shortcut 😉
Great site!
Great post. Thanks for the info.
great help! especially for us that dont even know where to start! i found evrything very usefull and know i’m having fun with my new paintbrushes!
thanks man, I was looking for this …. just clicked on your ads… nice artice…
Sweet post. Thanks;
This has been the most info for resources I have gotten ever!!! Every link I click on has tons of other links… the inspiration is endless! Thank you!!!
Great stuff..thanks man. The only thing I have a complaint about, well not really a complaint, just a comment, the thing under productivity where it says make love to your girlfriend…so it seems to imply that designers are all guys..May not have been your intent, but just pointing that out
2 thumbs up very informative thank you
Design Float is missing… 😉
Great stuff, really! May I also suggest http://www.iconiza.com for custom icon desings, and some free icon sets too.
Thanks!
@Angela, you are totally right Angela! could be a lovely fem designer and I do know some pretty rocking! I will update!
This is definetly great site – my flavour.
TNX
Reeeeeeeeealy great. TNX
You may be also inetrested in
http://www.ratemydrawings.com – simple online painter may be refreshing.
PS: admin may I use a link to your site on mine????
Really Great…..Superb..
Thanks for sharing your experience. Its not so easy to find like this one. Great….
Thank you so much for these extremly insipring tips. Helped me a whole lot with my creative block.
Thank you so much, this is amazing!
Nice post – good info.
You can get thousands of high-res free stock photos for commercial use at Freerange Stock – http://www.freerangestock.com.
Thank alot for ur reference,this very usefull to me…
hey great set i came here second time i gues can really finish reading whole post 😛
Nice list – some of those sites might be very useful, but sometimes if you don’t have “webdesigners’ spirit” within – nothing will help you. Cheers
@Robert. Thnaks Robert you are so right about the “designer spirit” you might have all the books, sites, programs, but that doesn’t make you a Designer.
Great site you have luv the “story about your site.
A definite bookmark…great list. You forgot my favorite though…
http://www.allgraphicdesign.com – its a directory of resources for designers…and I’m a regular on their design forum.
Good list. I would have added my site, http://www.allgraphicdesign.com/ – it is a huge directory of graphic design resources, a popular forum, and articles. But I am partial to my own site because it is my baby. 🙂 Good list.
Thanks.
Rachel
Great collection for wm. thanx 😉
Thanks for the list… it’s really helpful for us designers (and non-designers as well)
And you forgot the all important “decision maker” for when you just can’t decide which way to go!
http://www.ifate.com/fateball.html
Dont you think you should add talkfreelance to the list 😉
Uao. Thank’s so much.
Damn man, I looked exactly 5 hours and 26 minutes for your website. I read your article some time ago and I missed bookmarking your page. I stumbled and stumbled and googled and finally I got here. Thanks for sharing this amazing stuff with us. Thanks again and good luck!
@Daniel Glad you find me again :D, you should subscribe this time to the blog 😉
Thanks a lot for this extensive list – I put it on ma.gnolia. Concerning icon resources I made up a list of 33+ websites on my Blog which offer icons for both: commercial and personal use. You’re invited to visit 🙂
great post. thanks! you’re more than welcome to come over for a coffee in my town.
Hello, I was aware of this post from long days, But not have enough time to bookmark all this.
Today I did bookmark. Thanks for these Really
As for logo inspiration, I can add:
http://www.logosauce.com/
http://www.lo8os.com/
But Logopon is definitely the best of breed.
Awesome! Thanks so much! Great great!!!
———-
My small portal: http://www.3303.ru
Great and huge list of resources thanks. I’d also like to add dead-links.com, very useful to find errr dead links on the site.
activeCollab (project management) isn’t open source anymore. Give a try to ProjectPier http://www.projectpier.org , forked from last aC open source version.
Hi,
blessed pepeople like you, willing to share their trsures with others. Thanks.
You have a great pleace, and with many valuable tresures.
I just begun to build my site, and graphic desighn, I hope I’ll make something nice, a lot with your site help.
Ella from Israel.
I can’t thank you enough for this. So helpful.
Wow! This helped a lot!
Amazing! Congratulations for this post! Thanks a lot!
Excellent collection. Thanks a million.
It’s amazing how long ago this post is and how very relevant all these bookmarks still are.
Thanks for the list.
The link for site point isn’t quite right. At least when I clicked it- it came up as ttp.sitepoint.com/ (note: “ttp” instead of “http”) Someone may have commented this out already- sorry if it’s a dupe.
Anyway, I really appreciate the insights and the links. Thanks
Try http://www.freegraphicscentre.com
There are thousands of cost free graphics available for immediate download including photos, illustrations, fractal, backgrounds and texture etc
Good Job! Very useful article! Thanks for sharing!
Wowww!
Nice one. I´ve been keeping a list of sites I manage to find. Thanks to you I have a lot more places to search these precious resources.
Of the few sites I had on my list the only one that wasn’ t on yours is
http://www.ideem.it/ , wich is an italian site with packaging templates, it´s handy sometimes.
Thank you very much for this.
Thanks you for the expansive list, looking forward to diving in.
Wow. That’s an amazing list. Thanks.
I’m still coming back to this link dump after 12mths, it has always fired me up when I’m in dire need of inspiration- thanks for the post!
Wow, great work!
Good resources, will need time to digest all the good stuff, starting to get the “information overload” feeling.
Thanks for sharing
Thanks for the list… it’s really helpful for us designers (and non-designers as well)
Thanks you for the expansive list, looking forward to diving in.
I saw the work. It is really informative.Thanks for the list.
Regards,
Graphics@sbl
image clipping
This is ULTIMATE!
thanx for all
thanks 🙂
thanx.
Thk you very much, pretty good work !!
Tthanks for making this list.
Порно за СМС!
Порно за СМС | http://www.rbc.ru/cgi-bin/redirect.cgi?http://php4you.biz/su/in.cgi?13¶meter=goo
the list of links u have given r really outstannding
thanks alotttttttttttttttttt!
Magnificent collection of prayers – and I haven’t begun to explore the rest of the website!
Excellent resources. Thanks
Cumps
Thank you snap 2 =)
Thanks!,
Hi , i have some questions about you desing
maybe you can give designer contacts?
Well .. I guess i have those kind of problems. Inspiration is hard to get sometime. Thanks for sharing this brilliant article
these r nice resources, thanks for sharing with us
Really cool list. Thanks
Great list! just good resources thanks!
Good resources. But it would be nice if the forward slash for sitepoint.com is removed. Thanks a lot for the great list!
Nice list! Thanks!
nice list thnkss..
Free stock music for flashy websites might be a nice addition. http://mugeek.jontom.net contains several free music loops for designers and developers (around 500+)
Great collection of useful links, tools and resources. Thanks for the late nights and interest in assisting others.
Great Collection, thanks a lot!
Bookmarked. Thanks. Hope you can add more listings after these two years 🙂
@Gaus You are so right, well I have added some other round ups in the same field, but not update this one 🙂
nice tut, thanks. bookmarked
Wow, what amazing list of links! Thanks for taking the time to compile and share it. I thought I might also mention oDesk as an additional resource to your list of sites where you can offer your work. Just another tool for your users. Thanks!
Wow, that’s a big list but I think I’ll stick to only a few of them and will give a glance to others. Thank you for the list.
Awesome list, by far the best i’ve seen, great work and thanks.
This is perfect. So much you can do with these resources. Now we don’t have to shell out thousands of dollars for premium graphics fonts and logos.
@Julia Thanks julia! thats the idea.
wow there are actually lots of useful stuff out there.
thx for sharing.
Cool file storage/sharing site created for designers. Can handle psd, ai, and CMYK file types. Nice visual replacement to ftp. http://contentcube.com
Hi! I was surfing and found your blog post… nice! I love your blog. 🙂 Cheers! Sandra. R.
@sandrar Thanks 🙂 hope you keep coming!
Thanks, really great list.
Thanks for the nice compliled list .
cedar park regional medical center [url=http://rxdrugs24x7.com/product/inderal.html]Order Inderal[/url] carolines colon health [url=http://rxdrugs24x7.com/category/headache.html]elite medical nc[/url] minimum deductible health plan
http://rxdrugs24x7.com/product/nortriptyline.html
Добрый день!
Продаю раскрученный сайт на ucoz-е, для игры Counter-Strike Source.
Сайт делал и раскручивал для себя. Сейчас нет времени заниматься кланом и сайтом, поэтому продаю сайт.
Стоимость 2000 руб. с передачей аправ администратора и прав лидера клана.
Для связи пишите в ICQ 305-675-131
These are a great deal of help. Thanks a lot for posting.
Very useful list of links ill work my way through some of those.
Amazing! Thanks for sharing these 🙂
excellent roundup! Many of these are resources we use at Blueprint Design Studio here in Chicago. Great to see them getting the exposure other designers can benefit from!
A lot of great information here. Thanks for sharing.
Great website I’ve found and very inspiring! Great job!!
Have a great day.
Thanks and regards,
Cool design.. Thanks for inspiration
Thank you, tips and tricks that I need and it is very important
Great collection. Would love to try all of them. Looking forward to more great posts like these from you. Thanks
Great post. Very informative. Site has been added to my RSS feed for later browsing.
I appreciate the post. 🙂
Great list. Thanks alot, exteremly useful links here. Thanks!
wow!!!! Grand experience man. Thank you for sharing this.Thank you again.
this list of resource is great! have bookmarked this page. thanks for sharing
This is a great collection. I’m really glad I came across your post.
Oh this is a good list to work out.
great this really informative.
Muy bueno el diseño
I like the logopond.com design. Simple but beautiful, which is often something hard to imagine and create.
I have mainly used istock photo when i have needed images. some great alternatives here.
don’t forget to check out pixmac (www.pixmac.com) for budget stock photography – 40,000 free images and 11 million budget images with a fantastic user interface. what’s the point of free images if it takes me an hour to find what i am looking for? a little gem of a stock site 😉
I have been designing websites for three years and I have to admit I didn’t know about most of those resources. I really appreciate that you have aggregated all of them in this list
@Mikel Glad you found them useful It took quite some time to compile them 🙂
Here’s one I found lately.
http://www.FineArtRef.com
Great website and good articles !!!
Fantastic post. Keep up the great work.
Great list. Hope to beon that list some day.
We spent around 6 years building and maintaining websites and never made much more than a $1000 a month, give or take.
Thanks for this list.
Great list you’ve put together. I already knew a lot of these, but there were some really good finds here. Unfortunately some have disappeared too, like IconBase 🙁
Wow, thank you so much for the list. many great resources on it , big thanks
Thanks for the resources.. Although there are a few dead links I found a few valuable tools.
@Dean glad you find them useful Dean 🙂
hey thank for the post very nice collection