Creating a Banner
I would like to create a banner for my Blogger blog site. Does anyone have the proper pixel dimensions for doig this in PhotoShop? I am no expert, but can probably fiddle around with it.
posted by Tom Paine at 3:22 pm
13 Comments:
No matter what size banner you create you can adjust the size with the width and height commands when you include the image on the website.
But won't that distort it? There must be a standard size....
There's really no standard size. You can make it whatever you want. If you like the size on Artful Dodger's site, he uses 930x185. I find 185 to be too slim for my needs.
If you want any more help, Tom, let me know. I've made many banners and in fact LOVE to make them.
aag
Tom, you're right. If you try resizing any image for display by using the 'height' and 'width' variables in the page code, you will distort it. The optimum results will be obtained by creating or resizing the image in Photoshop to the specific dimensions.
As to standard sizes ... that's surely going to be determined by the width that your blog is set up to display at. If you have a fluid-type set-up (e.g. the blog is set to take up 75% of the available screen width) then it's going to be far more difficult to define. If your blog is set to display at a fixed width (e.g. 750 pixels) then it's a much simpler issue.
~EA
As others have said above, there really is no such thing as a standard size. Having said that however, there are some guidelines you may want to follow.
First however, if you just want to add a banner to your existing site, without a re-design, the first thing is to determine the current width of your template. This will allow you to add the banner with the least amount of problems.
For example, SBC is currently 660pixels wide. I found that by looking at the code for SBC in about five seconds. View-View Source, a window will pop up that shows the code for this site. Scroll down under HEADER and you'll see the Header width is 660 pixels.
Height is the one factor that can be anything you want, tall or thin, it is up to you. Traditionally web design says your banner should be no more than 25% of the height of your site displayed on common monitors. But people like AAG don't listen to that. :)
Now if you want to re-code your site a little, then you can honestly make it as wide as you want. Keep in mind that anything more than 750-800 pixels wide will not fit on most monitors with side scrolling. Although I just checked the stats for my blog and only 4% of visitors are using a 800x600 resolution monitor, 62% are using a 1024x768 resolution monitor. Which is why I went with a wider banner than most people.
Hope that helps Tom.
I'm learning a lot!
...people like AAG don't listen...
Ha!
Goof.
I am an artist. I cannot be constrained by mere pixels.
:)
HA! I knew that would get your goat. Even though you don't have a goat... which just goes to show you, how you could have a goat, if it wasn't so easy to get it!
That makes no sense.
I prefer a banner being less than 200px, and using text,not graphics. Faster loading and search engines can digest it. Also the banner and a post should fit on one screen so people don't have to scroll.
If my blogs were a monument to myself, my ego trip, then I would have large graphic banners, flashing stuff and multi colors.
I like to keep it plain and easy to read, short and sweet.
Thanks everyone for the advice. AAG, are you really up for making a banner????
I created a banner, does anyone know how i can put it on my page? help please.
miss wolfe,
scroll down in the html of your template until you see this:
body
div id='outer-wrapper'
(this comment page won't let me show HTML; there should be "greater-than" and "less-than" signs around those elements...)
put in the code for your banner (IMG SRC="yourbanner.jpg", linked to your start page if you want) immediately after that and it should work.
drop me a line if you need clarification.
I've done banners for several blogs (Dirty Couple in VA, Maude & Tim, both linked from us) and I'm happy to help anyone else out, too. Just drop me a line.
This is so useful - I've been salivating over people's banners, and pining for one of my own... and searching desperately for information on how to make one, not to mention gazing desperately at my code and sobbing quietly as I wonder where the hell I'm even supposed to put a banner...
Post a Comment
<< Home