February 10, 2015

Operation Free Blog Design: Header

I got A LOT of comments on my last blog post~ 9 blog design tips.
Mostly everyone said they agreed with most of my tips. I'd love to know which ones you DON'T agree with and why. :)

Anyway, since there seems to be a lot of people out there who care about blog design, I though it'd be fun to do a little series. 
I designed my blog completely for FREE, so basically that's what this series will be about.  

World, I hope you're ready.
how to design a blog header


Operation free blog design is just that. How to do a blog design. for free. And the word operation just makes it sound cool. So today, our first topic is HEADERS. 

In blogger, I'm not sure if there IS a way to center your blog's name. With my previous blog, this was a MAJOR source of frustration. 

So basically, you can't center your title in blogger. 

However. There is hope. (hooray!!)
You simply have to design an image for your blog title and upload it through blogger. 
Confusing, right?
NOPE.

{UPDATE: Vanshi from Upwardss informed me that you can center your title through CSS using the following code:  #header-inner {text-align: center} However, if CSS freaks you out, or you don't know how to use it, please carry on. Also, using the following technique, you can play around with fonts and images.}

1. Download a font that you would love for your blog title. If you google (or pinterest search) "free downloadable fonts" you'll get about a million options.
how to design a blog header


2. Make your image. I did mine in the free "paint" program on my computer, but I'm sure photoshop would work as well. I LOVE canva, so that would be worth a shot, too. My header is 900x141 pixels, if that helps. 
{More in depth articles on designing your blog title-
How to create a blog header like I did (Name of the article, not actually how I made mine)

how to design a blog header
A few tips:
~The title is usually the first thing a reader will notice. Make it count!!
~As you can see, I used a cursive(y) font. Which I told you I hated in my last post. Well, the title is an exception. Use a font that corresponds with your other fonts, but doesn't necessarily match.
~Keep it simple! However, if you're artistic, you can add color or whatever.

From here on out- it's all about Blogger. Wordpress people, you're on your own!!

3. Go to your "layout" tab in blogger. Click on the "edit" in the header box. You'll get a pop up window. 

how to design a blog header


4.  Hit "choose from computer and upload your image. Hit "instead of title and description" and DON'T HIT "shrink to fit". Hit save and you're done!! 
how to design a blog header

I hope this helps!
Let me know if you've done anything different that works. :)
Do you have any favorite fonts that you've found?
What other parts of blog design would you like me to cover?
Sophia

18 comments :

  1. Thank you for sharing these tips. I hand lettered my blog design, so I don't use fonts, because I wanted to portray the main theme of the blog. I'm not sure if it's good, because fonts will definitely make the header legible, but I suppose I like what it appears to be now. Not too sure about what the readers think about though. :) Thank you for sharing those links about more tips for the header as well. They are certainly very helpful. :)

    Dian
    The Happy Candle

    ReplyDelete
    Replies
    1. You hand lettered your blog design?!?! It's awesome!!
      Thanks for reading. :)
      Sophia

      Delete
  2. Thank you for this! It's helpful. I've just found out about Canva, thanks to you, and it's pretty neat. :)

    There is a way to center your blog title through CSS. Here's the code: #header-inner {text-align: center;}

    Hope this helps! :)

    PS: I love this design SO much <3

    ReplyDelete
    Replies
    1. Thanks for sharing! I'll add your thoughts to my post. :)
      Sophia

      Delete
  3. Your theme is awesome! I love it!
    Savannah // www.zolablog.com

    ReplyDelete
  4. oh, these are great tips! I use Picmonkey a lot to edit my photos but Paint is also pretty great. I mainly use that to get basic color pictures. Just happened upon your blog and keep up the amazing work :)

    - autumn
    http://autumnreadsandwritesallday.blogspot.com/

    ReplyDelete
    Replies
    1. I've never used picmonkey, but I'll have to try it out. Thanks for visiting!!
      Sophia

      Delete
  5. Nice tips! I haven't heard of Canva, but I'll go and try it right now! :D

    xoxo Morning

    ReplyDelete
    Replies
    1. Cool! I absolutely love canva. Thanks for visiting. :)
      Sophia

      Delete
  6. Thank you so much for this post. Someone kindly re-designed my blog for free but I love your advice I can not wait for more posts similar!!!
    If you have any time please go and checkout my blog I would love any advice and maybe even a follow if you like it xx
    Another Teen On The Web

    ReplyDelete
    Replies
    1. Aw, thanks!
      your blog is awesome. :)
      Sophia

      Delete
  7. oh this is helpful! your blog is beautifully designed and thank you for these tips! I've been meaning to redo my whole blog and stuff but I need to get a good idea first. thank you! I shall refer to this when I finally get around to designing!
    thank you!

    princessfaithm.blogspot.com

    ReplyDelete
    Replies
    1. cool! I'm glad you found it helpful.
      Sophia

      Delete
  8. What a great post... I love it i've needed a post like this for ages and your is fantastic!
    Great Blog
    Amber
    www.amberoseblogs.co.uk/

    ReplyDelete
  9. This is really helpful, thank you for sharing!

    http://shecouldbeajoanofarc.blogspot.fr/

    ReplyDelete