The AIDA Marketing Model in Web Design
- Posted in DESIGN
- 42 Comments »
By Louis Lazaris
If you’ve been formally educated in marketing, more than likely you’ve learned about a marketing model called AIDA. AIDA is an acronym that represents the different steps involved in selling a product or service. Very often, the principles of AIDA are applied naturally when a useful product or service is being marketed. Being web designers and app developers, however, our personal involvement on a technical level in our own or client projects may deter our efforts to produce a design that correctly implements AIDA.
I’ve only recently come to learn about the AIDA model myself, and I thought it would be an interesting topic to apply directly to the decisions we make in web design. In this article I’ll provide examples with some explanations showing how web and app developers can effectively implement this model for full benefit.
A = Attention
The first step in successfully marketing a product or service is getting attention, that is, getting potential consumers to notice your product. There are a couple of obvious ways this can be done.
Attention Through Strong Imagery
Web development trends have over the years improved to imitate print methods more closely — and for good reason. Principles in print design have been studied and tested for so many years, and have proven to be successful in so many industries. The use of strong imagery to market a product has always been a powerful way to get a potential customer’s attention.
Apple’s marketing department understands the importance of imagery in getting someone’s attention, and they do this quite effectively on the Apple website, shown below.
The extra-large iPad images give the customer a clear picture of the relative size of this new device. Many readers who have browsed the Apple site before will have seen images of the iPhone or other smaller devices, so when they see the size of the iPad image, they’ll immediately understand that this is a larger device.
Of course, not every product or service requires this type of differentiation in image size, but this is a good example of how images can be powerful tools for grabbing attention.
Another excellent example of strong imagery is shown in the image below from Trendex Home, a company that sells tablecloths, placemats, and related items.
The image of the wine glass and the tablecloths can’t be missed, so it successfully gets the reader’s attention.
Of course, both examples shown above do more than just grab attention, which will be discussed later.
Attention Through Strong Typography
Another well-known method of grabbing attention is the use of large headings, utilizing color and whitespace to maximize their effect.
The Lairdesign home page, shown above, makes effective use of strong typography, using a very curious-sounding phrase to grab the user’s attention. The sentence “…where even the colour of the tea is considered!” expresses something important about the company’s view of design, doing so distinctly and beautifully.
Likewise, the Glenilen Farm site places part of their home page’s focus on the phrase “Why not try our delicious handmade cheesecakes”, which, along with the strong imagery, helps grab the hungry shopper’s attention.
I = Interest
The next step in the AIDA model is keeping the interest of the customer. In the previous section, we saw how aesthetic enhancements can be used to get the customer’s attention. But along with that, the customer needs to know how your product or service will help them. In this case, giving a list of features is not enough; you need to express to your users how those features will benefit them.
Let’s consider again the iPad and Trendex Home websites to show how the imagery conveys important benefits that help to keep the customer’s interest.
Interest Through Practical Benefits
Whatever product you’re advertising will likely be something that helps the consumer in some way. Maybe it helps them save time, cut corners, save money, or provides a service that assists them to overcome menial, repetitive tasks. Whatever the benefit is, it needs to be communicated to the customer so they can see exactly how their life or workflow will be helped.
Despite all the negative reviews and comments that have been made about Apple’s new iPad, the Apple marketing department has successfully marketed their new product to its target audience, which is not a tech-savvy audience, as some have incorrectly assumed.
The iPad image on the right displays the New York Times website as the example, which is perfect for the audience that the iPad is geared towards. Nontech-savvy users who want to use a portable device for daily tasks while commuting will immediately see the benefit of the device, not only because of the landscape/portrait potential but for the size and apparent relative ease of carrying the device.
Trendex Home likewise uses their imagery to demonstrate the practical benefits of one of their products. The spilled wine beads neatly on the tablecloth garment, indicating the high quality material used to manufacture their products. Thus, instead of saying “our products are made with high-quality materials”, they’re saying “here’s how our high-quality products help you”, which equates to features plus benefits, as opposed to features alone.
D = Desire
The next step in the AIDA model is desire, which is a natural extension of interest. After you’ve grabbed a consumer’s attention, and obtained their interest, you need to keep that interest going by promoting your product in such a way that they will begin to grow in their desire for it. This is probably the most difficult of any of the steps in the AIDA model, and can encompass a number of different techniques, but I’ll mention a few here that are geared specifically towards web designers.
Desire Through Content Sliders
JavaScript-driven content switchers and image sliders are extremely popular on home pages nowadays, and for good reason. They’re beautiful, accessible, they degrade gracefully, and they help market your products in a non-obtrusive and tasteful manner.
Aesthetics and accessibility, however, should not be the only reasons for including such a feature. This method of displaying content should also be for the purpose of helping to build desire for your products or services. Again, I’ll refer to the Apple website and their marketing of the iPad. The large images we discussed earlier are part of an image switcher that slowly shows the different ways that the iPad is a benefit to its target audience.
After displaying two iPads with content-heavy websites loaded, the next two images show the ease with which the iPad users can access and read email, along with the ability to view and save family photos.
If the user has stuck around this long, they will be visually informed of the email- and photo-related features, helping to build their desire for the product.
Desire Through Organization of Content
Anyone involved in web development in recent years will likely be familiar with SitePoint and their top-quality articles and books on design and development. Each individual SitePoint book page is an excellent example of content that’s organized with the goal of building desire for the product.
Highlighted above are headings that introduce easy-to-read lists of features, customer testimonials, and SitePoint’s competitive pricing (although I personally find that the pricing is better through Amazon, so in this case their claims for the low price are not necessarily accurate).
Similar to SitePoint’s book page, the WordPress hosting page on WPWebHost presents a clean list of features designed to build desire in the consumer.
A = Action
The final step in the AIDA marketing model is getting the user to take action. This is a step that, due to its importance, has been discussed numerous times here on Smashing Magazine and other design blogs, so I won’t go into great detail.
After getting the user’s attention, arousing their interest, and stimulating their desire for your product, they need to have a clear way to take action. Whether it’s to sign up for your service, purchase your product, or download a trial of your app, the visual enticement to take action should be elegant, beautiful, and convenient.
Any quality CSS Gallery today contains numerous examples of websites with home pages and product pages that utilize effectively-placed call-to-action buttons, so be sure to examine some of the patterns and trends used by top design firms when mapping the action processes that users take.
Action Through CTAs
Bonus: S = Satisfaction
Many people have favored adding a fifth letter to the AIDA acronym: “S” for “Satisfaction”. After a product has been correctly marketed through attention, interest, desire, and action, it is up to the product or service provider to maintain and support their products to keep the customers happy and satisfied long after purchase.
Conclusion
The techniques mentioned above, when isolated, are really nothing new in modern web design. Many experienced designers have implemented many, if not all, of these methods. This discussion has attempted to give purpose to some of the decisions we make in design, demonstrating that design should follow a close examination of content and marketing goals.
Using the AIDA marketing model, you can give purpose and direction to all the design and architectural decisions made in your web design projects.
Haha WOW. Ironic that I was explaining the Principle in a interview a few minutes ago.
Thanks for the Article, you summed it up well.
Cheers
J
Nice. Very neatly applies to web design :)
Very true are those concepts in creating effective websites.
Suprising that one of the simplest and basic marketing models are so overlooked when designing websites.
All websites should be designed with AIDA in mind. If you fail at either one your site will fail. Period.
(note to self: ‘Action’ CAN be that people read the content of a website = success measure: Time spent on site)
I think that this also shows the importance of using simplicity in web design.
Interesting.. Excellent and detailed write-up.
Thanks for sharing.
Great info. I’m adding this to my web design process. Thanks.
A very simplistic, but well written piece. Serves as a good reminder to veterans of the industry, but a layperson reading will benefit greatly from reading.
Great stuff.
I just want to say words is not enough to describe this amazing topic .
thank you so much i really learned a lot of it
Excellent article. So many sites would benefit from another look through AIDA glasses. I think there are many more options than mentioned here, but it’s a good start. It inspires me to think about those other options. Thanks.
Great post..
This AIDA is explained clearly in the “Smashing Book”
Oh… I forgot to say..
The chapter is available free to download as pdf.
Give a try..
Chapter 7: Design To Sell — Increasing Conversion Rates
http://media.smashingmagazine.com/cdn_smash/pdfs/sm-book-chapter7.pdf
;-)
Interesting — I didn’t know AIDA was discussed in the Smashing Book. I’ve been meaning to get a copy of the book, but I have way too many things to read as it stands, so I haven’t gotten around to it.
helping stuff for web designers.
This is a thoughtful and informative article and you substantiate it with some great examples. Thank you!
Great article, and also relevant.
Wow this is a great bit of marketing info that I need. I am starting my business soon and I am definitely going to use this marketing model in my marketing strategy.
Alex
This is lame.
Another Idiot Do Anal?
Great article, and thanks for adding us in the article. I’m still working on that as well, to find good click through rates and continue to expand on this model.
Thanks for this great article. I will def use them in my design process.
I like how Alec Baldwin explains the AIDA method as well (3:00):
http://www.youtube.com/watch?v=TROhlThs9qY
The truth is that press release can fetch you lightning fast result in traffic,signup,revenue, pretty much anything, but only if executed proper way-and that isn’t to tough to do, KISS method works perfectly with press releases. Thanks for the value!
I have a good wine pick everyday for ya: <a href=”http://www.goodwinepick.com”>Daily Good Wine Picks</a>
WOW! These are some sexy pictures! Thank you for sharing.. I’ll be back soon!
I hate the Lairdesign copy. You can cut out the “… where the” Make it “We even consider the color of the tea!”
Great site I use a company called Ncube Digital for all of my Web Design and I would recommend them to anyone looking for a excellent web design company. I can honestly say that I have never dealt with a company in the industry so ready to answer a phone or an email and give great advice.
Good topics, it open my eye , thanks
Awesome post! Look forward to reading your upcoming post. Keep them coming! Internet Marketing Consultant
Considerably, the article is actually the freshest on this worthw hile topic. I harmonise with your conclusions and definitely will thirstily look forward to your coming updates. Saying thanks definitely will not simply be sufficient, for the extraordinary lucidity in your writing. I will certainly directly grab your rss feed to stay privy of any kind of updates. Gratifying work and also much success in your business dealings!
Nice article, Like the visuals. Very practical guidelines for marketing.
- The Social Tech Guy
I always enjoy reading intelligent articles by an author who is definately knowledgeable on their chosen subject. I’ll be following this thread with much interest. Keep up the great work, see you next time
cool design
I totally agree with Barbara’s comment. Thanks for discussing such an informative article with all of us. I’ve bookmarked your blog will come back for a re-read again. Keep up the great work.
wonderful article, Thank you so much for introducing AIDA to us. We have implemented this in a few of our client sites and they are very happy with the outcome. We are very satisfied with the work done as well.
Hrmm that was weird, my comment got eaten. Anyway I wanted to say that it’s nice to know that someone else also mentioned this as I had trouble finding the same info elsewhere. This was the first place that told me the answer. Thanks.
This is very informative mapping of web design and AIDA
I can’t believe it. I just looked at designzillas website, and they seemed to have copied your article completely, with the only difference being to change a couple of words and some examples to one of their portfolio-sites, they also use the ipads website as illustration and have the same headings as you do in this article! And they call themselves professional. Wtf? Some people are really taking the piss.
like your site will visit again
useful infomation here!
AWESOME article.. and very nice site design.. are you using a theme?
I’ve never personally hard of AIDA method.. is this your own methodology?
Hi, Great infos for my researching lesson. How can I improve myself in this subject? What is your preference? Thanks.
Never heard of the AIDA model before. You can be sure I’ll be adopting it now!