Archive for Blog Header Design Spotlight
Custom Blog Header Design for January’s Winner
Posted by: | CommentsJanuary's Blog Header Winner
I was beginning to think Dave didn't want his blog header that he won in last month's free blog header drawing. He seemed excited to win, but then I didn't hear back from him. Turns out he was working on something and wanted to have all his ducks in a row.
Problem for me was that he had something in his head, but I just couldn't do it. He sent me a clip from the Stephen Colbert show, with his new flying eagle intro, and said he wanted something like that.
Even though I come across as an artist, I'm just not that good. I just have alot of stock artwork in my files.
So, I pulled out some pictures I took of bald eagles at the zoo last year and tried to put an american flag overlay on them. Thing is, none of them looked that great and I was getting discouraged. And since it was free I couldn't even refund his money.
He told me to forget the Colbert eagle and see what I came up with. I shot this one over to him.
He didn't care for the eagle, but he liked the phone graphic. I asked him if he had tagline he'd like to put under the copy. He returned my email with a graphic of an eagle soaring in the mountains and a tagline.
I put them on this header.
He didn't like the mountains or sky. He was afraid he was being a PITA and to be honest, I was starting to get frazzled. I didn't really like the header either, it felt forced, which often happens with too much input from a client. Not always.
So, I didn't hear from him for awhile after almost constant communication and in the quiet of my office, I started fidgeting around with removing the background on the eagle. It was a small image, so I went to my favorite online image resizer, ReShade.com and blew up his picture.
After awhile, I sent him this revision.
He sent me this reply…
Roy! That's F***ing beautiful! Thanx for seeing my vision and making it real.
Your welcome Dave.
And not too bad for a free header. 
Roy
Sometimes Stock Photos Just Don’t Work…Then What?
Posted by: | CommentsI'm a subscriber to several stock photo sharing sites like iStockphoto, Shutterstock, Dreamstime, BigStockPhoto and Crestock. And every so often, I just can't find a good photo for a particular blog header.
This was one of those times. A client was developing a site for the owners of obese dogs. I searched the web for photos of fat dogs and there were some amazing images out there, just not royalty free ones.
Look at this poor dog, I couldn't find out the original source for this image as it is shared on several blogs without attribution, but this is one fat dog.
This poor guy doesn't look like he moves around too well and while he was grossly overweight, I just couldn't figure out how to use it in her blog header.
I was sent this image of an overweight pug but I couldn't figure out how to use it.
I tried several options, but I just couldn't find a typeface to carry the theme. I needed something else.
While looking through more weight loss images, I got the idea of a fat dog on a scale.
I literally spent several hours looking for just the right picture, which was clearly proving to be a very unprofitable use of my time and the only pictures I found with dogs on scales weren't fat dogs at all.
I was at my wits end and even considered refunding the client. I clearly needed to think outside the box.
Anyway, a few years ago, my family and I ventured into breeding German Shepherds. They are by far my favorite breed and I was the proud owner of a beautiful male we called Moses.
One of his offspring was a beautiful giant my daughter couldn't part with she called Wilhelm. Willie has grown to be about three inches taller than his father and probably 20lbs heavier.
He's a really big dog and a good subject being well over 100lbs, in fact, I think he weighs more than my photographer daughters boyfriend, but that's another story.
I asked my daughter, the photographer, to see if she could get Willie to cooperate and get me some pictures of his chest looking down at his feet. That proved to be quite a task, because he's not called Wilhelm von Schtupithound for nothing.
We tried to get him standing on a scale, but that was impossible. His father would have obeyed, but this guy had too much of his mothers psycho genes flowing through his veins.
Anyway, I managed to get a shot that I could crop and put on a scale, like so.
I know its not perfect, but I thought it was great. And so I put it on a header.
The client was happy and I was totally glad to be finished with this one.
So when you can't find a stock photo, just take your own.
Roy
.jpg)
Custom Blog Header Design With a Matching Ebook Cover…Too Fun.
Posted by: | CommentsThis morning I received a request to quote on a custom blog header with a matching ebook cover. I love these kind of projects. The only spec's I had were "multicolored party graphic background should work just fine."
Okay, wide open empty canvas, let's see what pops out of these little grey cells.
Custom Blog Header
I started out with with a multi-color curtain gradient for my background.
I messed around with the liquify filter until I came up with this.
That was kinda cool, but it's too distracting to put copy on, I needed to soften it up a little, but also needed something else. I went through my artwork collection and found just the thing, an abstract background that I could crop out a small section of.
I took the abstract image and applied as an overlay and got this effect.
That was looking pretty cool, but at this point it didn't say party as much as acid trip. So I needed something like that old ipod commercial with the sillouettes. I went through my graphics collection and found just the thing which I applied with a soft light filter.
Now what should I do for copy?
When you have all the photoshop filter tricks at your fingertips, you have to know when to hold back and this is one of those times.
There is so much going on in the background that you want the copy to be bold enough on its own to stand out.
I went with one of my Letterheadsfonts.com typefaces and chose LHF Esoteric Old Condensed. Bold with serifs with a burgundy stroke outline.
It needed something else, like a tag line, so I contacted the client and asked for something to put on the ebook that I can rework to put on this header.
Here is the final blog header design. He really liked it and so did I.
Custom Ebook Cover Design
I had a little trouble coming up with an ebook cover design I liked. Designing in horizontal format and then trying to make it verticl takes a little bit of doing.
I went through my Photoshop Action Scripts and settled on my 3d Action Script Ebook #2.
This is going to sound weird, but I decided today that I have too many action scripts. It took forever to find this.
Anyway, the action script only takes two steps and takes a flat image like this.
And with one click of the mouse it produces this.
You can check them out here 3D Action Scripts You can orduce professional looking graphics with these quality scripts.
So, there it is. A header and ebook cover and a happy client.
Roy
Blog Header Design Spotlight on JoniLiebel.com
Posted by: | CommentsThis past week, I had the pleasure of working with my newest cyberfriend, Joni Liebel, on some blog header designs for her two sites and I thought they might make a good spotlight topic.
The first one, JoniLiebel.com, is her coaching site.
It's sometimes hard for me, when I come across a site like this, to know what kind of input I should offer. There are a couple of things I just didn't like, so rather than just come right out and say so, I usually send some feelers out to see how committed they are to the design and how open they are to suggestions.
I first learned this lesson when I was just getting started as a sign maker, I made the mistake of disparaging the design of the owners daughter. While it may have been amateurish from a sign guy perspective it was nevertheless a work of art to the owner, who abrubtly left my shop red-faced and never returned.
Note to self: Keep mouth shut.
I sent Joni an email with my initial suggestions and quickly found that she was the kind of person I love to work with. She listened carefully and was open to my suggestions and seemed to trust my ability to design something she'd like.
I set up a test site for her to look at the design ideas I came up with for her blog. I uploaded a fresh copy of the Celestial Aura theme because I had never used it before and immediately liked the 880px default width because the existing 1000px fixed width really bothered me.
I suggested a photo would be a good idea, putting a face to the name and she agreed. In fact, she had just had some photographs taken (something more than 100 of them) and she was in the process of editing a few. She mentioned that she liked a classic typeface, so I put together this mockup for her using one of the pictures I picked out.
I used a gaussian blur of one of my photographs of fall foliage for the background. She liked it. Now to make it work with her theme.
I liked the new blue navbar and thought the background should probably stay blue to match. I had a seamless background I got from istockphoto that was feminine looking and even though it was green, I could do an overlay on the existing blue background and voila, a seamless blue background.
Now to figure out how to make it work with the theme. The header background actually matched the green better, but I decided to change the background color instead. I zoomed in on the image more and texturized the stripe.
Here is the completed blog.
Aarrrggghh. This is a problem. Sometimes a background doesn't realize that it's supposed to be in the background…time for a quick change.
Joni actually wanted me to go with a white background, but I like my backgrounds to have a bit of movement, so I washed out the color to show a hint of blue.
What do you think?
Roy
How to Customize Your Wordpress Header- A Blog Header Guy Tutorial.
Posted by: | CommentsSince starting BlogHeaderGuy.com, I answer this question several times a week, How Do I Customize My Wordpress Header? So, I figure it's about time I just post a quick tutorial here.
I have a fictitious website called IMMaverick.com, a website that shares internet marketing tips for the make money at home niche.
I bought the domain name and installed wordpress to the domain. The default wordpress theme is very boring and since I want my blog to stand out from the crowd, changing the default header is place to begin. So, let's get started…
Step 1.
The first thing we need to do is get to the dashboard which is found at http://YOURDOMAIN.COM/wp-admin/ you'll need to log in with the username and password you setup when you installed wordpress.
Step 2.
In the left sidebar, you'll find the control panel and everything you will ever have to do with your theme takes place here. Scroll down until you reach the APPEARANCE tab.
Step 3.
There is a tab called CUSTOM HEADER, but this only works with the default header, giving you the ability to change the header color and the text color. I guess that technically does make it custom, but I have something else in mind.
Step 4.
Okay, so under the APPEARANCE tab there is an EDITOR tab. Clicking on that will open the Stylesheet, (also known as style.css). You are going to have to put aside your fear of coding for a few minutes.
The stylesheet is where design aspects of your theme header are specified. This holds true for most of the other themes available.
Scroll down the stylesheet until you get to the #header tag where you will see the header image spec'd, in this case in the images folder there is a file called kubrickheader.jpg. Looking in the root folder, the kubrickheader image is 760×200px. But if you look at the #headerimg tag, it clearly says the header is only 192×740px. That's because the header actually has the border and some of the background around it.
Step 5.
I went ahead a designed a custom blog header that used the larger dimension, but think it will look fine, we'll see.
In order to use this new header design, I need to put my design in the images folder, so I need to use an FTP client. I use Filezilla and go to the wp-content/themes/default/images folder and upload my header.
Step 6.
This is the place where most folks freak out if they haven't set aside their fear of design code. But its really simple. Just change out the name of the kubrickheader.jpg with the new header file name.
Okay, so that can't be right? Notice that the blog title is covering up the new header image. You can also see where the header is 10px wider on each side of the page content area.
First things first. If we just delete the blog title info from the General Settings tab. Our blog won't have a title and that's a big SEO, no-no. Using the All-in-One SEO or the Platinum SEO plugin is one way to handle this, but I've been using this technique with most of my blogs lately.
Scrolling down to the h1 spec's I add this line of code,
text-indent: -9999px
This puts the title tag way off the page, but it's still there.
Step 7.
I didn't like the grey background so I changed it to match the header leaving the grey border around the page content area.
Well, there you have it. It gets less scary after you've done it a few times. In the meantime, I'm happy to help you if you get stuck, just shoot me an email from my contact page and I'll se what I can do to help.
Roy
Blog Header Design in the Propaganda Poster Style
Posted by: | Comments
It's been a little while since my last blog post, so i thought I'd quickly talk about a recent blog header design project.
I was contacted by Doug Stewart to produce a blog header design in the old propaganda poster style like this.
It's one of my all-time favorite design styles, in fact, early in my sign career I used this as my logo and showed it to Doug.
He wrote back and said that I was right on track.
As you can see, I was going to have a little problem with this theme because it has a very short header and finding a graphic that would still have impact value wasn't going to be easy.
I sent him my first draft to gauge his reaction and get some additional input. I thought it captured the feeling of the early propaganda posters, but still needed some refining.
Doug replied that he thought the outline made the copy hard to read and he wanted me to tweak the flag.
The thing is, by the time I heard back from Doug, I had already abandoned the original design and had come up with three alternate header designs I wanted him to look at.
On the last one, I really felt like I was close to the final. I just didn't like the fist. Doug had mentioned a hammer and so I searched my library for something I could use.
I found a drawing in an old book and just took the hammer and fist off the artwork and tweaked the colors to match mine. After which, I decided to change the blog title color to a burgundy.
I sent all six to Doug and let him choose. He loved them all but went with my final. I also suggested he change the background color to a dark blue for a more attractive look.
What do you think? I'd like to hear your thoughts.
Roy
Blog Header Design Spotlight- Threadless Media
Posted by: | CommentsI’ve said it before that blog header design is a lot like designing signs, without the fabrication issues, which is why I like it so much. The common drawback of both is creating the image from perception.
You see, when a client says they like such and such, I, as a designer, can’t really know what they actually like about it, without some trial and error. I usually get a good feel for that after all those years of making signs, but not all the time.
This weeks blog header design drawing winner, Bob Potter of Threadless Media had the privilege of being on the receiving end of my not getting what he was looking for. And to be honest, he provided me with more information than anyone I’ve done work for in the past, so much so that I think I got overwhelmed with information.
Anyway, back to the narrative, here is his current site.
A pretty simple design, but he wanted to change the feel of this site to be more fun and he cited my design I did for Yumville.com as the feeling he wanted to convey. He was also wanting to use blue instead of green.
You have to admit, that’s quite a switch right?
I was utterly without ideas and started messing around with typefaces and trying to come up with an illustration of Bob that I could use. I decided to use a photograph he sent me playing with posterizing.
At first, I really liked the posterized version of him, but Bob asked me if I could do anything about the dark lines. And after that, I couldn’t see anything but the dark lines. Especially the one under his nose.
My first sketch, trying to capture the feeling of Yumville, was a little bit overwhelming to Bob. He used the word "Gusto."
It definitely is a shock to the system when you compare it to the original. I didn’t know what Rock the Web meant, but I figured I’d add it to fill space.
I used some grunge stripes I found on DeviantArt.com from WebtreatsEtc http://bit.ly/wgNJH You’re gonna want to make room on your hard drive for some of the stuff you can find for free. Patterns, textures, brushes, layered PSD’s, icons. Check it out.
I decided to tone it down some and try out another pattern. After talking it over with Bob, I decided to use his real image. And we settled on this as the final design.
I’m not sure how much I like this header, but I was able to overcome my initial block and come up with something Bob likes.
What do you think of this for a free header? Be sure and sign up for the weekly drawing.
Roy
