Friday, January 6, 2012

The Blog Doctor: Making Your Blog Look Like A Million Bucks (Without Breaking The Bank)

The Blog Doctor is a (semi) regular column in which I attempt to answer your blogging questions based on my 3+ years of experience. I can only tell you what worked for me - I'm sure others have done it differently and maybe better.


Dear Sarah Von/Blog Doctor,
I would like to know how to make my blog look better! I have zero web design skills. I don't need anything too complicated, but I would like my blog to be cuter! Are there any tips you can share, or maybe web designers or templates that are good for someone on a budget? Thanks!

Now, I cannot claim to be an expert - I'm a writer, not a designer.  But 90% of everything you see on Yes and Yes (the layout, my calendar, my ecourse materials) has been my doing.  Soooo, if you don't find those things eye-searingly ugly, you can take the following pieces of advice. 

Note, I cannot promise that these tips will make your blog capitol B Beautiful.  But they will definitely make it way, way less 'homemade looking'

*Accompany each post with an image - preferably an awesome one
Nothing makes a blog post pop like an awesome photo.  Where do you find 'em?  I love weheartit and visualize.  I embed the link to the original source in my photo.  If that's not something you're 100% comfortable with, Kyla wrote this awesome post on photo sourcing ethics and shortcuts.

* Resize photos so they're the same width as your text column
Your awesome image doesn't look nearly as awesome when it's tiny and floating above a giant sea of text.  Make your image the same width as your text column, forpetessake!  You can do this by going into the html or by resizing them in Picnik.

* Full-justify your text column
I used to write for a newspaper so I am a diehard fan of full justification.  That doesn't mean supporting every stance you take (though you totally should).  That means that the edges of your text column is straight on both sides.  If your text column is 'left justified' it'll be 'ragged' on the right side. 

If you're using Blogger, the justification icon is the ninth in from the the right on your posting dashboard and looks like a bunch of lines.  You want to choose the one that looks like a square box made up of lines.

* Find an an awesome template/theme
There's no excuse for using ready-made templates when there are approximately a million resources for free, fancy looking templates.  Behold!  Blogger templates, Wordpress templates, Tumblr templates.

* Resize the buttons on your sidebar so they're all the same size
So you want to promote the blogs you love by adding their buttons to your sidebar.  Aren't you sweet?  But, if you've got ten different buttons of differing sizes, things can get a bit hodge-podgey.  Resize the buttons in Picnik and you're good to go!

* Use social media icons that match the rest of your themeIf you're rocking a mono-chromatic blog, an orange RSS button or a blue Twitter bird can look a bit out of place.  Never fear, there are 8 million different social media icons you can use!  Or if you prefer, you can spell out the social media platforms and create your own buttons.

* Resist the urge to over-design
Chevron squiggles and textures and shadowed fonts, oh my!  Once you discover the wonderful world of templates and photo editing it can be a slippery slope down to this.  Resist the urge, my friends!  You are stronger than the gif!  Some of the most gorgeous blogs on the internet are also the most simple.

* Remove any of the following
(These are my personal design pet-peeves, so feel free to disregard if you feel I'm a Snotty So-and-so)

* Auto-playing music
* Gifs
* Pop-ups
* White font on a black background
* Anything that scrolls across the screen
* Blog posts with centered text

* Use some of these awesome tools/platforms/websites
Picnik - edit photos, add text and stickers, all without signing up for anything or downloading anything
Scrapblog - themes, stickers and backgrounds for free or very cheap
Pugly Pixels - tons of free and cheap downloads
Gimp - like, Photoshop.  But free. And not as good.
FotoMix - for collages and photo editing
Big Huge Labs - make mosaics, add 'Polaroid' or 'stamp' edges
Color Lovers - color trends and palettes

Now you!  Share your favorite design shortcuts and tools! 

32 comments

  1. This is such a good post! I feel like I am always fiddling with formatting. I really should just settle down, leave things alone!

    Thanks dude!

    ReplyDelete
  2. Awesome and simple. You just answered a lot of what I didn't know how to do. Now I'm looking forward to update my blog soon.

    I also hate all the pet-peeves you've got, too. I go so far as to not even read a bit of a blog if it's got music on it. Bleh.

    Sarah M

    ReplyDelete
  3. Just began a new blogging adventure and haven't made all pictures for ads and links same size - and it shows as awkward.

    As for the justification... wordpress has me stumped - I don't seem to find a button for that at.all :(

    Thanks for the great tips - especially the no white font on black background - can't stand that - causes such awful eye fatigue to try and read.

    ReplyDelete
  4. This is such great info. I've been googling this stuff for a week and haven't found anything this useful. Thanks, Sara!

    ReplyDelete
  5. Such great advice! I just full-justified my latest post, and it makes a world of difference!

    ReplyDelete
  6. I have to agree with others, full-justified looks great. I just did that to a few posts and it was such an easy improvement! Thanks.

    ReplyDelete
  7. YES! YES! YES! I loove all these points, specially the one about getting rid of auto playing music, ugh, I hate that stuff.

    ReplyDelete
  8. Love the tips! I've already used two of them. :)

    ReplyDelete
  9. Sarah, I didn't realize how much of a difference full justification would make. BLOG DOCTOR FOR THE WIN!

    Fun fact: my captcha to submit this comment is catights. Cat tights? Really?

    ReplyDelete
  10. Thanks so much for the advice! I particularly found the full justification tip very helpful. I'm responsible for a nonprofit's new blog (http://starlightmidatlanticblog.wordpress.com/) and changed the alignment and it looks a million times better! Thank you!

    ReplyDelete
  11. Another good online image editor I have been using is http://pixlr.com - also like Photoshop though not as good, but pretty good. And free!

    ReplyDelete
  12. Thanks for sharing! I'm trying to revamp my blog so I'll have to check out some of those sites :)

    ReplyDelete
  13. Thanks to your great tips, I decided to spice up my blog layout a bit and I think I'll try justifying my blog text. I think it might make things look a bit nicer.

    ReplyDelete
  14. oh no! I <3 my centered text.

    ReplyDelete
  15. This comment has been removed by a blog administrator.

    ReplyDelete
  16. This comment has been removed by a blog administrator.

    ReplyDelete
  17. This comment has been removed by a blog administrator.

    ReplyDelete
  18. This comment has been removed by a blog administrator.

    ReplyDelete
  19. These are good basic guidelines to making your blog more attractive. The more important things though, besides all the fireworks, are quality content and audience interaction.

    ReplyDelete
  20. This comment has been removed by a blog administrator.

    ReplyDelete
  21. This comment has been removed by a blog administrator.

    ReplyDelete
  22. This comment has been removed by a blog administrator.

    ReplyDelete
  23. great post, with simple but very useful info - thanks!

    ReplyDelete
  24. All clinches in one move! I was so happy coming here and appreciate your efforts! Magazine Wordpress Templates

    ReplyDelete
  25. This comment has been removed by a blog administrator.

    ReplyDelete
  26. :D :) thank you !

    check out my blog : http://beyondpoet.blogspot.com/
    I AM A NEWBIE :)

    ReplyDelete
  27. This comment has been removed by a blog administrator.

    ReplyDelete
  28. Just amazing stuff, interesting post!

    ReplyDelete
  29. Thanks for the tips they really helped me with my new blogging venture.

    ReplyDelete
  30. I retain listening to distinct news speak about getting free online grant applications so I have been looking around for genuine greatest AUTO

    sorif,
    Clipping Path

    ReplyDelete
  31. I have read your post and feel better with your tips. I mostly like (Nothing makes a blog post pop like an awesome photo) Its 100% true or Yes & Yes.
    Thanks.

    ReplyDelete