There is some controversy, however what size and type of image should be properly used as a header image. For one thing, they improve the “branding” of your business, but, unless used properly, they can negatively impact your search engine rankings. Optimizing the header image is key, so it is recommended that you use alt and description tags that are similar or exactly the same as your site title and description.
Wide headers sometimes create negative results with search engines as necessary keywords are not included and cannot be picked up, as they are shown below the fold – the area below the screen’s visible area. Use header images in conjunction with your site’s title, and appropriate page links (preferably displayed above the header, if it is large).
Visitors see the headers first, so it is also necessary to make sure that it is optimized – and kept under 50-70 KB. Images that are larger than this will take several seconds to load, especially on slower connections, resulting in visitors that remember your site only for the content, if they decided to stay, or the long wait time.
Below is a listing of some resources available for header images, or ideas to kick start your header creation, if you have decided to create your own based on another image or site’s logo/header.
Note: Images are displayed not for use, instead they have been placed there to sample the quality and types of images available and have been resized to minimize size. And, please abide to all copyright/Creative Commons Licenses that these sites have placed on images. They are there for a reason – they took the time to create them and do not want others to take credit for their efforts.
Designed for Specific Themes
These images were sized according to certain themes.
- Theme Headers – Free Custom Blog Images
- 1000 Free Headers
- BittBox – Free Vector Glass Header Designs
- Dotcoy Designs – Header Images
Details: A website dedicated to providing free blog themes. Each post contains a series of headers relating to a certain subject – animals, for example. Sizes are approximately 800px x 140px with several hundred headers available. They will create a header according to your theme and post it on the blog, if you like.
License: No specific terms are listed, but they recommend spreading the word about the service.
Samples:
Details: Images are 625px x 125px and larger, listed by thumbnails on 31 pages. Most of the images are generic.
License: No specific terms are listed.
Samples:
Details: The header images are approximately 430-460px in size, depending on how you cut them out. The 4.7 MB (uncompressed) file contains 10 free fance vector glass header designs with files in AI, EPS, SVG, and PNG format. So, you’ll need Adobe Illustrator or InkScape to edit them.
License: You may not redistribute the files (no rehosting on your own site, offering the files as a download, like they were created by yourself) and you can use them however you see fit.
Samples:
Details: A header designer’s blog with several free images, as well as ideas for possible header images for your own site.
License: No specific terms were given.
Samples:
Tutorials to Create Blog Headers
These tutorials (mostly for Photoshop), were designed to help users create images that are somewhat professional looking.
- Pegaweb – Tutorial centered around creating “curved” headers with your site’s name on them.
- Associated Content – Lolaness goes through the steps to create a functional and design-oriented header in Photoshop and offers a graphic to go along with the guide.
- Paul Stamatiou – How To: Make Blog Header Graphic – Another guide on how to make header graphics, in this case a how-to guide which answers his readers’ question of how to make one that he used previously on his blog. The guide is using Photoshop CS2.
- Beta Blogger for Dummies – A tutorial for creating a blog header in Blogger.
- WordPress – Designing Headers – A resource guide featuring on customizing the default WordPress theme header images.
Tools and Generators for Creating Header Images
Tools that help create header images, specifically for blogs, however many deal with simply resizing larger images, where a desktop photo program could achieve better results.- Big Huge Labs – Blog header generator – This tool helps create a custom blog header for your WordPress 1.5+ blog with your own photos, with the Kubrick/default theme. The tool works by uploading a photo and then resizing it to the correct dimensions.
- Web 2.0 Logo Creator – The ever-popular “reflection”/”web 2.0″ logo creator for use with a blog header.
Blog Header/Graphic/Logo Designers
These sites have been included as a logo is typically incorporated into your blog’s header, or other images, for that matter, and makes a huge impact on the branding of your blog.
- Banners Mall – Animated high-end banner ad designer with banner ads starting at $24.95.
- Logoworks by HP – Logos starting at $99.
- Logo Design Guru – Logo and webpage designs starting at $99 – princes increase with number of revisions, logos, web designs.
- David Airey – Graphic and Logo Designer
More inspiration: (Updated March 11, 2008)
70+ Visually Impressing Header Graphics from Noupe web developer’s online resource
45+ Blog Headers for Free Download from Smashing Magazine contributors
Your feedback is important. Is this collection complete and of high quality resources? Let us know to help improve and add your logo links in the comments area.
0 comments:
Post a Comment