Have every post delivered to your inbox and get access to hundreds of useful design freebies.
It’s pretty evident that big headlines are a popular web design trend right now, and have been for some time. However, just because something is trending doesn’t mean that it doesn’t have downsides, or that it should even be used at all!
Today I’ll look at some of the pros and cons of using big headlines for your website, and if they’re really necessary at all.
As I’ve already mentioned, big headlines are bang on trend right now. Whilst this might be quite a superficial reason to use them, at least people should appreciate your efforts. Furthermore you’re pretty likely to feature on some of the more popular CSS galleries if you use a nicely designed large headline.
Always bear in mind that you want to be setting the trend though, not simply following the crowd. It’s fine to use large headlines, but try to do something different with your headline, even if it’s a small detail. This will help to set you apart from the thousands of websites also following the trend.
The example above shows that you don’t even really need any proper content above the fold, your site can consist entirely of a large, attractive headline. Because it’s so on trend right now, this simplistic website has been featured on plenty of web galleries. That isn’t to say it’s badly designed, the typography is clean and elegant, I’m just saying that by adhering to a popular trend this site can boost it’s popularity.
It’s undeniable that large website headlines are very eye-catching. This is perfect if you’re trying to make a statement with your website and really draw people into it.
To make your big headlines even more eye catching try to use bold typography, and have plenty of contrast between your background and type.
Digiguru uses a huge headline to really grab the attention of visitors. The headline is made all the more eye-catching by the stark contrast between the black background and white typography.
Asides from padding, kerning etc… it can be difficult to do a lot with regular sized typography. The great thing about large website headlines is that often they can be created as a work of art, rather than plain text. Often large headlines feature as a piece of stand-alone graphic design, and can be entwined with images, patterns, textures and other visual elements.
Christian Annyas uses some really attractive typography for his large headline. This is an example of text that couldn’t really be used with regular web text. The text is subtly textured, and sits over a detailed, beautiful background design.
Headlines can act as one of the best calls-to-action right behind buttons. This really goes hand in hand with my point about them being eye-catching. If you’re catching your user’s eye, you may as well prompt them to do something!
The Nola Japan Quake fund uses a large headline to act as a call-to-action for people to donate and help the disaster. This is a great example of a large headline working towards a good cause. On a personal note I encourage everyone to donate if you can.
Generally good web design ensures that vital content is above the fold, so that users don’t need to scroll to view it. However, large website headlines really hinder this, as they often take up so much space that crucial content disappears below the fold.
Circle push their key navigation below the fold. On my browser the top of the menu icons jut out a little, but you can’t actually read the menu items. This seems fairly unnecessary, as the headline could still be very sizable and still let the menu items display correctly. This is an example of the large headline trend being somewhat overused.
Often if a headline is particularly huge it can detract from the rest of the site. There may be genuinely effective visual hierarchy used throughout the rest of the site (clear headings etc…), but these will not be as noticeable or effective when positioned near a much larger block of text.
Thrive Solo uses such a large, bold headline that the surrounding text pales. The welcome message doesn’t really have much impact at all compared to the main headline. In fact, the main headline is so large that whenever I try to look elsewhere on the page, my eye is drawn back to this huge headline like a magnet. In short, it’s too distracting, and undermines the surrounding content.
Often large headlines are used just for aesthetic value. This is fine up to a point, as we all want to enhance the visuals of our websites. However, if the headline serves no purpose, and literally just looks nice, then maybe you should reconsider what should be filling that space.
Design by Ashfall uses a complex typographic headline that captures attention by combining a variety of text colors, styles and vertical/horizontal positioning. The effect is impressive, but is actually quite hard to read. Is this a case of style over substance?
As a general rule, design principles/foundations are more enduring that trends, which are relatively fleeting. This means that if your web design is simply following the latest trend, then it may not degrade that well once the trend is over, and you’ll most likely need to redesign.
Some trends endure better than others, usually if they’re somewhat subtle. However, hugely over blown headlines are not a subtle statement, and if they suddenly go out of fashion, then they will be very difficult to pull off.
Webz Guru uses a large, attractive headline. I’m actually a fan of this design, but imagine if it suddenly starts trending to have smaller headers and really move a lot more content above the fold. This design simply couldn’t endure a major trend shift like that.
It’s important that big headlines will only work for certain types of website. Portfolio sites are particularly known for using large headlines, but the same can’t be said of high-content sites such as news website. Imagine Yahoo.com pushing most of it’s content below the fold in place of a huge stylish headline? I think not…
Be sure that you’re not using a large headline just for the sake of it, or just to follow a trend. Only use a large website headline if it’s appropriate.
If you want to use a large headline but don’t want to grab too much attention or detract from the rest of your site, then it is possible to achieve this. Take a look at the final example below. By using understated contrast with the main background the headline is elegant and subtle. You still get a lot of the pros of using a large headline, but don’t overdo things.
This whole point of these Thursday Theory posts is to encourage discussion and let you have your say on pressing design issues.
Please leave a comment below and join the discussion:
Tom is the founder of PSDFAN. He loves writing tutorials, learning more about design and interacting with the community. On a more interesting note he can also play guitar hero drunk with his teeth.
Do you know the basic tools in Photoshop but feel that your work is still looking average? Join our creative community at FanExtra and get the direction you need to take your work to the next level.