I'm taking a break from confessing to bring you some tips on how I dressed up my blog (for free).
When I started this blog, I knew very little about how to do the designs I saw on other blogs. I wanted that cool header, the grab button, and overall feel that made me want to sit and read every dang blog post that certain blog had to offer. However, being as cheap as I am, I needed to do it for free, and in a timely manner, as patience is for saints.
After hours moments of furious googling, I found some ideas. First off, I found this post:
How to Create a Custom Blog Header For Free
Also, I found this to make Blogger-friendly blog buttons- the only site that made them work for me:
Code It Pretty: Make an HTML Grab Button For Your Blog
I found some new favorite pattern-making sites (to use for the header or the blog background):
Pattern Cooler (has customizable bold graphic designs)
BgPatterns (has softer, also customizable designs built around an icon [fleur de lis, etc.])
Colour Lovers (has a mind-boggling amount of designs and colors, but you must sign up [for free] to use it)
It's also good to think about your blog's color scheme when making the patterns- don't make a bunch of red patterns if the grand color scheme of your blog is pastels and whites.
I actually was having a terrible time finding all my patterns I'd saved onto my computer. (They end up in your "Downloads" folder, in case you're wondering, and technologically stunted like me.) I then set out to make the perfect header for my blog.
...and didn't end up using those patterns I downloaded, at all (for the header). If your blog is a lifestyle blog, and the theme is whatever you like, the patterns will do perfectly. But if you have a book blog (and have chosen to omit the "books" for your blog's title), you need some totally rad book images of your physical bookshelf. (Or, if you haven't many physical books, go to a library or friendly bookstore and take some pictures of their bookshelves.) Take lots of pictures, but here are some ideas to make plain books look even more interesting:
Using PicMonkey's black and white effect, I painted back in the original color of the books (click the paintbrush and then click the original tab in the pop up- they also have some handy undo buttons for mishaps up top).
Situate the books in a spiral pattern by placing each slightly skewed on top of one another. (This is an idea that came from looking in bookstores.) Then, take a photo from whichever side looks best.
For a Blog Header, Post Picture, or to Make Any Picture on Your Blog Look Cool:
When you have plenty of pictures (or patterns), head over to PicMonkey and hit the Collage button. Make sure you have the dimensions you want your header (or picture) to be on hand, as shown in this post from Thinking Outside the Sandbox. For my blog, I used the Ducks in a Row option available in the Layout area (the button with a bunch of squares). For my most recent header, I used the layout under Cards with a modified Ducks in a Row that has an extra skinny picture under the main ones. You can also adjust the background color, spacing between pictures, and how much you want the corners to be rounded.
For this phase, you end up with something like this:
It looks so much different in black and white:
When you're satisfied with the size of the pictures and everything else, click Edit.
On PicMonkey, you can go bananas with everything- there are plenty of free fonts, overlays, and final exposures and textures to apply. For the sake of my sanity, I'm sticking with some of my favorites, but you'll have plenty of options to make your header look uniquely you and ridiculously good-looking.
A basic header (adding only text) for the black and white:
A basic header for the color version:
It's more difficult to work with color pictures for your header, because unless you use drastically different colors or shades, it'll blend right in. Sometimes if you try different Blend modes in the font popup, the text will become more readable.
If you want to get more elaborate, you can add some Overlays. You may notice some in my blog header: the bird on the gateway, the rose below the books, the butterfly on Critiques. To get the butterfly as I have it, you have to erase half of it using the overlay editor. You can also solve the unreadable text problems by putting an overlay behind it, as I did with my black and white header.
Black and White, with arrow overlays behind to make it pop:
Note: I combined multiple pieces of the arrow overlays to put behind the title and text.
Color, with uber-girly overlays:
The next step I use is to add Effects (the button with the wand). But first, up top click the "combine all elements" button. This will ensure all of your text and overlays get the same effect as the header behind them.
My favorite effect is called HDR: it makes everything really pop, adding a halo effect to colors and adding more contrast. There are other cool effects, like Warhol (makes your picture two colors instead of black and white) and Black and White (which I demonstrated earlier), but HDR makes all my easy work look good. I recommend dialing it down a lot: on the preset, the Intensity is 200%- I make it about 60%. I also use the Fade to dial it down- usually I put it right around 50%, but for the more graphic black and white header, I set it at 29%.
Graphic Black and White:
Uber-cutesy Color:
As you can see, the lower text quote for the Color header is getting faint- if this were for an actual blog, I'd start over. The black and white header's font is much more readable.
You can add more than one effect, but for this exercise I'll just use HDR because it's tried and true.
Next, you can add Textures or Frames. I never use Frames for headers. The ones that are free aren't my style, so I'll skip that step.
For Textures, I use almost exclusively the ones involving light: Space, Burst, Light Trails, or Water.
For the Graphic Black and White, I used the first option for Burst, dialed the Saturation down to 0%, then used Move to make the effect bigger and less noticeable.
For the Uber-Cutesy Color, I used the fourth option for Light Trails, left a little blue-ish Saturation, and again, used Move to make the effect bigger.
While the Color header does look cool, you can barely read the text beneath, which would make it redo-worthy. If people can't read it, it doesn't matter how cool your blog header looks because it isn't fulfilling its purpose: to greet people coming to your blog with a brief description and give them an idea of what to expect of you.
For Backgrounds:
Blogger has a nice array of backgrounds, but if you want something more customizable, go back up to the top and check out the pattern-making sites. The current one for my blog is from Colour Lovers, but in the course of my relatively new blog I've used both of the other pattern sites. I've also used some of the pre-made backgrounds available on The Cutest Blog on the Block and Hot Bliggity Blog, but the corner link perturbed me, as well as the fact when you have a tablet or phone and have it held vertically, they don't look that great. I'm very picky about some things, and I want my blog to look good if I visit it on my Kindle Fire.
For Social Media Follow Buttons (Those Things Under "Shadow My Critiques"):
I accidentally stumbled on this site in my pursuit of better blog button tutorials (Code It Pretty's is the best), but didn't know a newbie blogger like me could do these Social Media Icons, and for free.
Carrie Loves: Free Social Media Icons
But remember, in the words of famous male model Derek Zoolander:
There's more to life than having the coolest, most eye-catching blog on the block. For example, even if your blog is the most ridiculously good-looking blog ever, it won't make up for the lackluster blog posts you typed out after giving your blog a makeover night after night for the past month. And even if having that beautiful blog brings you followers, it certainly doesn't guarantee those followers will listen to what you have to say.
"Now, if you'll excuse me, I have an after-funeral party to attend,"
A Zoolander-Inspired Post |
From GifWave |
How to Create a Custom Blog Header For Free
Also, I found this to make Blogger-friendly blog buttons- the only site that made them work for me:
Code It Pretty: Make an HTML Grab Button For Your Blog
I found some new favorite pattern-making sites (to use for the header or the blog background):
Pattern Cooler (has customizable bold graphic designs)
BgPatterns (has softer, also customizable designs built around an icon [fleur de lis, etc.])
Colour Lovers (has a mind-boggling amount of designs and colors, but you must sign up [for free] to use it)
It's also good to think about your blog's color scheme when making the patterns- don't make a bunch of red patterns if the grand color scheme of your blog is pastels and whites.
I actually was having a terrible time finding all my patterns I'd saved onto my computer. (They end up in your "Downloads" folder, in case you're wondering, and technologically stunted like me.) I then set out to make the perfect header for my blog.
...and didn't end up using those patterns I downloaded, at all (for the header). If your blog is a lifestyle blog, and the theme is whatever you like, the patterns will do perfectly. But if you have a book blog (and have chosen to omit the "books" for your blog's title), you need some totally rad book images of your physical bookshelf. (Or, if you haven't many physical books, go to a library or friendly bookstore and take some pictures of their bookshelves.) Take lots of pictures, but here are some ideas to make plain books look even more interesting:
Set the books (or whatever your blog is about) someplace interesting (chairs, side tables, old storage trunks):
Make a statement:
Using PicMonkey's black and white effect, I painted back in the original color of the books (click the paintbrush and then click the original tab in the pop up- they also have some handy undo buttons for mishaps up top).
Make a book spiral:
Situate the books in a spiral pattern by placing each slightly skewed on top of one another. (This is an idea that came from looking in bookstores.) Then, take a photo from whichever side looks best.
For a Blog Header, Post Picture, or to Make Any Picture on Your Blog Look Cool:
When you have plenty of pictures (or patterns), head over to PicMonkey and hit the Collage button. Make sure you have the dimensions you want your header (or picture) to be on hand, as shown in this post from Thinking Outside the Sandbox. For my blog, I used the Ducks in a Row option available in the Layout area (the button with a bunch of squares). For my most recent header, I used the layout under Cards with a modified Ducks in a Row that has an extra skinny picture under the main ones. You can also adjust the background color, spacing between pictures, and how much you want the corners to be rounded.
For this phase, you end up with something like this:
It looks so much different in black and white:
When you're satisfied with the size of the pictures and everything else, click Edit.
On PicMonkey, you can go bananas with everything- there are plenty of free fonts, overlays, and final exposures and textures to apply. For the sake of my sanity, I'm sticking with some of my favorites, but you'll have plenty of options to make your header look uniquely you and ridiculously good-looking.
A basic header (adding only text) for the black and white:
A basic header for the color version:
It's more difficult to work with color pictures for your header, because unless you use drastically different colors or shades, it'll blend right in. Sometimes if you try different Blend modes in the font popup, the text will become more readable.
If you want to get more elaborate, you can add some Overlays. You may notice some in my blog header: the bird on the gateway, the rose below the books, the butterfly on Critiques. To get the butterfly as I have it, you have to erase half of it using the overlay editor. You can also solve the unreadable text problems by putting an overlay behind it, as I did with my black and white header.
Black and White, with arrow overlays behind to make it pop:
Note: I combined multiple pieces of the arrow overlays to put behind the title and text.
Color, with uber-girly overlays:
The next step I use is to add Effects (the button with the wand). But first, up top click the "combine all elements" button. This will ensure all of your text and overlays get the same effect as the header behind them.
My favorite effect is called HDR: it makes everything really pop, adding a halo effect to colors and adding more contrast. There are other cool effects, like Warhol (makes your picture two colors instead of black and white) and Black and White (which I demonstrated earlier), but HDR makes all my easy work look good. I recommend dialing it down a lot: on the preset, the Intensity is 200%- I make it about 60%. I also use the Fade to dial it down- usually I put it right around 50%, but for the more graphic black and white header, I set it at 29%.
Graphic Black and White:
Uber-cutesy Color:
As you can see, the lower text quote for the Color header is getting faint- if this were for an actual blog, I'd start over. The black and white header's font is much more readable.
You can add more than one effect, but for this exercise I'll just use HDR because it's tried and true.
Next, you can add Textures or Frames. I never use Frames for headers. The ones that are free aren't my style, so I'll skip that step.
For Textures, I use almost exclusively the ones involving light: Space, Burst, Light Trails, or Water.
For the Graphic Black and White, I used the first option for Burst, dialed the Saturation down to 0%, then used Move to make the effect bigger and less noticeable.
For the Uber-Cutesy Color, I used the fourth option for Light Trails, left a little blue-ish Saturation, and again, used Move to make the effect bigger.
While the Color header does look cool, you can barely read the text beneath, which would make it redo-worthy. If people can't read it, it doesn't matter how cool your blog header looks because it isn't fulfilling its purpose: to greet people coming to your blog with a brief description and give them an idea of what to expect of you.
For Backgrounds:
Blogger has a nice array of backgrounds, but if you want something more customizable, go back up to the top and check out the pattern-making sites. The current one for my blog is from Colour Lovers, but in the course of my relatively new blog I've used both of the other pattern sites. I've also used some of the pre-made backgrounds available on The Cutest Blog on the Block and Hot Bliggity Blog, but the corner link perturbed me, as well as the fact when you have a tablet or phone and have it held vertically, they don't look that great. I'm very picky about some things, and I want my blog to look good if I visit it on my Kindle Fire.
For Social Media Follow Buttons (Those Things Under "Shadow My Critiques"):
I accidentally stumbled on this site in my pursuit of better blog button tutorials (Code It Pretty's is the best), but didn't know a newbie blogger like me could do these Social Media Icons, and for free.
Carrie Loves: Free Social Media Icons
But remember, in the words of famous male model Derek Zoolander:
"I'm pretty sure there's a lot more to life than being really, really, ridiculously good-looking. And I plan to find out what that is."
From Giphy |
No comments:
Post a Comment
Feel Free to Express Yourself:
Agree? Disagree? Have something to add?