Download as pdf or txt
Download as pdf or txt
You are on page 1of 43

Chapter – 2 Web Banner Advertising and Its Development

Chapter - 2

Web Banner Advertising and


Its Development

Introduction:

Today‘s markets are extremely competitive. Customers are smart, more


demanding and less patient with unresponsive vendors. It is agreeable that to
tackle these new drivers of business information is to play key role as well for
prospering the business in future too. In this back drop Internet is emerging
as the biggest trends in Information Technology.

Due to globalization, nations are coming closer to each other also different
sector undergoes into significant changes. And marketing sector is also
affected by this and experiencing so many changes continuously. To sell the
product through internet or digital media is known as E- marketing. Types and
size of business organization affects marketing traditionally but in present
scenario, digital technology is a precious addition. E- Marketing is also known
as web marketing, online marketing and e-commerce. E- Commerce helps to
find out the correct audience whom business organizations can target for their
goods and services. It consists of all processes and activities with the
purposes of attracting, finding, winning and retaining customers. Creative
utilization of internet technology is prepared by using various multimedia,
graphics, text etc. with different languages to create catchy advertisements,
forms, e-shop where product can be promoted, viewed and sold. The scope of
E-commerce is deemed to be broad in scope it does not only use to promote
marketing over the internet but also helps in marketing as well through e-mail

85
Chapter – 2 Web Banner Advertising and Its Development

and wireless media. E-commerce also joins technical and creative aspects of
the Internet, including development, design, advertisement and sales. Use of
websites are made by e-commerce in combination with online promotional
techniques such as social medial marketing, search engine marketing (SEM),
interactive online ads, e-mail marketing, online directories, viral marketing,
affiliate marketing and so on. It also creates positive interaction with
customers that can serve as the foundation for long term relationships and
encourage repeat purchases. Due to this web banners ads are highlighted in
online market and also it is the most omnipresent form of online advertising.
Therefore, in this chapter brief outline has been given about the web banner
ads history and the technical development of banner ads which include sizes,
duration, and position, occurrences, measurement, and software tools for
designing the banner ads. Further, this chapter included how to design
appropriately banner ads that people get influenced and want to click and also
the difference between Difference between the design of web banner
advertising and print advertising.

2.1 Definition of banner in advertising

In traditional advertising banner advertising is taken as one of the most


effective outdoor advertising media which often appears on the road sides
and corner tied by ropes and wires made on cloths and written by hand.
This was the old form of banner ads later it began to be printed by silk screen
printing. Generally the size of traditional banner was taken 2 meter broad and
3 meter in height also it could be modified according to the requirement.
These types of banner are specially made for the local ads which are very
impactful in local areas or market. In traditional banner ads main content was
composed in headlines and other information of the product, trademarks or
logo and address of the local dealers or sellers are written in attractive letters.

86
Chapter – 2 Web Banner Advertising and Its Development

It is the mini form of hoarding which were traditionally written by hands but at
present time it is printed by plotter on flex or vinyl sheets (Yadav, 2011:163).
But since time has changed digital technology has take over the market and
business, due to this internet came forward to play a vital role in advertising.
Conventional Banner ads also shifted to digital mode and now known as web
banner advertising or banner advertising

2. 2. Web Banner Advertising

A web banner or banner ad is a short, graphic device that acts as a gateway


to another page or website. This can be static or can include motion that
makes it more impressive and dynamic (Bergh & katz, 1999: 451). Philip
Kotler defines ―Banner ads are small, rectangular boxes containing text and
perhaps a picture‖ (2005:568). In other words banner ads are a form of
advertising on the World Wide Web. This form of online advertising entails
embedding an advertisement into a web page. It intends to attract traffic to a
website by linking them to the web site of the advertiser. ―A banner ad is
simply a special sort of hypertext link‖ (Harris, 2000: https://computer.
howstuffworks.com/banner-ad.htm). It is similar to a traditional ad which would
see in a printed publication such as a newspaper or magazine, but it has the
added ability to bring a potential customer directly to the advertiser's Web site.
Its vibrant capability makes it different than print ads. It is situated in one place
on a page, like a magazine ad, but it can present multiple images, include
animation and change appearance in a number of other ways by using
animation or scripting. The Banner advertisement is used an image (GIF,
JPEG, and PNG), Java Script program or multimedia object employing
technologies such as Java, Shockwave or Flash, often employing animation
or sound to maximize presence and Images are usually in a high-aspect ratio
shape (i.e. either wide and short, or tall and narrow) . The purpose of a

87
Chapter – 2 Web Banner Advertising and Its Development

banner is to attract attention and get the internet user to click on it to go to


another page or location for additional information.

2.3 History of web banner advertising

In the article the evolution of banner advertisement Kaufeld and John


considered that the first clickable web ad which is also known as banner ad
was sold by Global Network Navigator (GNN) in 1993 to a law firm, GNN was
the first commercially supported web publication and one of the very first web
sites ever (1996: https://www.cmi.ac.in/~tmharish/thesis/html/node10.html).
The first web site to sell banner ads was Hotwired also he coined the term
"banner ad" and was the first company to provide click through rate reports to
its customers (Battelle,2006: https://www.cmi.ac.in/~tmharish/thesis/html/
node10.html). The first web banner sold by Hotwired was paid for by AT&T
(American Telephone and Telegraph Company) and was put online on
October 25, 1994. In May 1994, an early Internet commercialization pioneer,
who mentored Boyce in his transition from traditional to online advertising,
first, introduced the concept of clickable / trackable ads. He stated that he
believed only a direct response model in which the return on investment of
individual ads was measured would prove sustainable over the long run for
online advertising (Tim O'Reilly, 2001: https://en.wikipedia.org/wiki/Web_
banner). Banner ads were valued and sold based on the basis of impressions
they generated. This approach to banner ad sales proved successful and
provided the economic foundation for the web industry from the period of
1994 to 2000, until the market for banner ads "crashed" and there was a
radical revaluation of their value. The new online advertising model that
emerged in the early years of the 21st century; introduced by GoTo (later
Overture, then Yahoo and mass marketed by Google's Ad Words program),

88
Chapter – 2 Web Banner Advertising and Its Development

closely resembled the pioneer's 1994 projection (Battelle, 2006: http://www.


cmi.ac.in/tmharish/thesis/html/nodes65.html).

Web banner advertising is a new approach of marketing and advertising in


which marketers would increase sales and build brand awareness through the
Internet. Unlike cinema, T.V & other visual ads channel. Web banner is a
graphic media containing information in the form of text, pictures & hyperlinks.
It provides a rare combination of web design, web software and web
marketing. Web banner advertising has the ability to display message to
thousands of Internet users who visit web sites. Or if one could wish to target
a specific set of Internet users, one could display the message on select web
sites which cater to one‘s target audience.

2.4 Development of Web Banner Ad:

The following developments about the Web banner ad are considered in this
study

a. Types of Banner ads and its benefits

b. Size of web banner ads

c. Duration of web banner ads

d. Position of web banner ads

e. Occurrence of web banner ads on websites

f. Measurement of banner ads

g. Software tools used for designing the web ads

89
Chapter – 2 Web Banner Advertising and Its Development

a. Types of Banner ads:

Andrea defines three different types of banner ads, along with their benefits
which are as follows: (2015: <https://www.20dollarbanners.com/resources/
the-three-types-of-banner-ads-you-should-know-about).

i. Static banner

This type of banner ads contains very simple graphic and texts. Due to its
simplicity a lot of websites and blogs prefer static banner. It takes a good
designer to come up with an effective static banner. The image and text
chosen should not just be attractive but also meaningful. The goal is for the
banner to be simple and not distract the website.

Benefits of Choosing Static Banners

 It is cost effective

 It is simple, therefore it doesn‘t scream

 It is consider the most traditional type of banner

 CTR rate is higher compared to other types of banners

ii. Flash Banners

This type of banner is animated and uses flash technology. It employs


animation to make it more realistic and interactive. Due to the use of.SWF into
the web pages, the use of sounds and special effects is possible.

Benefits of Choosing Flash Banners

 It receives high CTR

 It is attractive because of the use of special effects

90
Chapter – 2 Web Banner Advertising and Its Development

 It is easy to explain anything with flash

 The use of sound gets attention quickly

 It urges viewers to engage

iii Animated Gif Banners

Created in a GIF file format, this type of banner is one of the most powerful
graphic design units. This type of banner can also be as interactive as a flash
banner. It is mobile and smart device friendly.

GIF banners can be made by almost anyone. This means that it is relatively
cheap to make. There is no need to pay for designers or programmers.

Benefits of Choosing Animated Gif Banners

 One can use multiple frames

 It is supported by all kinds of devices

 It can have the ability to increase CTR

 It doesn‘t need a plug-in to view

 Helpful when it comes to describing complicated services or products

iv. Type of Banner Ads in Facebook

 Carousal Ad: Carousal ads are an ad format by which several product


images are displayed and rotate within the banner. The consumer can
interact with each product through ads. Andrei Florea defines ―carousal ad
is a type of ad which will enable business to showcase three products
within a single ad unit, on desktop or mobile. Each product highlighted will

91
Chapter – 2 Web Banner Advertising and Its Development

have its image, description and click target‖ (Florea, 2016: https://www.
bannersnack.com/blog/ facebook-carousel-ads-examples/).

Image 2.4.a (i) Carousal Banner ads

Carousal ads and e-commerce go together, anyone can promote up to five

products through carousal ads and user can explore some of the product

items inside the ads. Size of carousal banner ads is 1080 by 1080 pixel and

one important thing is in the time of design carousal banner is always

maintain the uniformity. While working in a project at M&C Saatchi February

advertising agency. I have learnt that uniformity in carousal ads is very vital

because it creates the moods as well as shows the same theme of the ads so

that audience can not be confused by seeing the ads. For example in the

image no. 2.4.a the carousal ads are shown in which it can be seen that in the

92
Chapter – 2 Web Banner Advertising and Its Development

background the elements of design are taken is the same family that is all clip

art and same color. All the banner ads have a uniform background only

products are different. This shows that the company promotes the different

products of their brand but the theme of the campaign is same.

 Facebook Canvas ads: Advertising on Facebook, marketer can direct

people from ads to an immersive and engaging experience on Facebook

called canvas. Canvas offers a full screen real estate, customized with

video, image and text, in a fast-loading and mobile-optimized experience.

Through canvas ads anyone can easily build storytelling using a

combination of videos, still image and call-to-action button. In canvas ad

people can swipe through a carousal of images, tilt to view panoramic

images and zoom in to view images in detail. Canvas ads are only

available on mobile. When the user clicks through to the canvas ad brand

content will take over the entire mobile screen. This type of ads scrolls

from top to bottom. Canvas offers different components to tell the story of

the brand. These components can be combined in different configurations

like – Full Canvas, Header, Photo, text block, Button, Carousal, Video, and

Product Set. Below there is an example of Canvas ads which I have made

while my project work in M&C Saatchi February. The Brand I have chosen

is BIBA which is an ethnic apparel brand. Here I have made banner ads

for BIBA for Facebook canvas which are as follows:

 Header With Logo

93
Chapter – 2 Web Banner Advertising and Its Development

 Full Screen Image

Image 2.4.a (ii)

 Text Block Add Massage

 Button for offsite Links Shop Now

94
Chapter – 2 Web Banner Advertising and Its Development

 Image Carousal

Image 2.4.a(iii) Image 2.4. a(iv) Image 2.4.a(v)

 Auto Play Video

In this total video, length cannot exceed two minutes. Designer can have
more than one video in the canvas, but the total time of all videos can‘t be
larger than two minutes. Always use MP4 or MOV format. Video can be
added if required and in text block there are two options of font‘s serif and
sans-serif fonts. Maximum 10 banners can be added in carousal image and
the size of carousal would be Maximum width is 1,080 pixels and maximum
height is 1,920 pixels. Use PNG or JPEG file type.

b. Web banner Ad Size:

The effect of size on effectiveness of advertising has been seen in traditional


media, especially in print media, size usually improves memorization. In large

95
Chapter – 2 Web Banner Advertising and Its Development

Web banner ad occupy more screen space, they run better chances of
grabbing attention and being seen and remembered. Choturou and Chandon
(2000) showed that size moderates the effect of other format variables.
Picture presence is negative for small banners whereas it tends to be positive
for larger banners; Motion seems to have a positive effect for the larger
banners as well. Banner ads come in a variety of shapes and sizes (Chavan,
2011:85-86). The Internet Advertising Bureau (IAB) specifies eight different
banner sizes, according to pixel dimensions.

The IAB's standard banner sizes are:

468 x 60 Pixels (Full Banner)

234 X 60 pixels (Half Banner)

120 x 240 pixels (Vertical Banner)

125 x 125 pixels (Square Button)

120 x 90 pixels (Button - 1)

120 x 60 pixels (Button- 2)

The full banner (468 x 60) is by far the most popular, but you will see all these
variations all over the Web. These are not the only banner ad shapes and
sizes, either, but they are a good representation of the range of common
banner ads. There is no universal file-size constraint for banner ads, but most
Web sites impose their own limits on memory size, usually something like 12K
to 16K. This is because banner ads add to the total file size of the page they
appear on; therefore, increasing the time it takes for a browser to load that
page. In the image no. 2 shows the all above listed banner ad sizes.

96
Chapter – 2 Web Banner Advertising and Its Development

Image 2.4.b Banner ad sizes

In past few years it has been observed that Mobile has surpassed desktop as
the main device used for browsing, delivering 63% of all internet traffic and
also mobile ads have seen a major upswing. Mobile ads can be displayed
both when people browsing the web but also directly in apps. So for the
mobile advertising there are four most popular sizes which are dominating the
digital advertising world and 89% of all ad impressions are made up of these
sizes which are as following

97
Chapter – 2 Web Banner Advertising and Its Development

i. Medium Rectangle Ad (300×250): It has been considered that display


ad campaign is incomplete without the medium rectangle. This standard
banner has 40% of global inventory and is by far the most important
inventory in advertising arsenal. It works well on both mobile and
desktop. This banner is often used in content like text articles. It‘s usually
perceived as less intrusive than bigger formats. The Medium Rectangle
performs well both as a text version or an image ads. On mobile devices
this format perform as a page-break for long pieces of content and if it‘s
well designed it creates a natural addition to websites that users don‘t
see as intrusive (Rask,2019: https://www.match2one.com/blog/standard-
banner-sizes/).

ii. Leaderboard Banner (728×90)

This is the 2nd most common ad size among global list, with 25% of global
impressions also known as a Horizontal Banner. This banner combined with
the Medium Rectangle and covers most of the display advertising needs. This
banner is usually displayed at the very top of websites but also sometimes
shows up at the bottom: (Rask, 2019: https://www.match2one.com/blog/
standard-banner-sizes/).

iii. Wide Skyscraper (160×600)

This is also called a Standing banner; this is the more common of the two
Skyscraper banners with 12% of global inventory. There is a another thinner
version of this ad, simply called Skyscraper, with the size 120×600 that is
intended at websites that cannot accommodate the Wide Skyscraper, but
when choosing between the two, the Wide Skyscraper is the safest choice.
More sites use this banner size than the thinner Skyscraper and it‘s placed
along the sidebar of a website. About 12% of global ad inventory is made up

98
Chapter – 2 Web Banner Advertising and Its Development

of the Wide Skyscraper whereas only 0.2% consists of the thinner Skyscraper
(Rask, 2019: https://www.match2one.com/blog/standard-banner-sizes/). The
Wide Skyscraper is usually used along sidebars on websites and converts
well both as text ads and image ads.

c. Duration of Web Banner Ad:

Duration of web ad is one of the aspects which are considered for Web
banner ad designing as well as for cost estimation. Duration is more indicates
ad is displayed for more time period which includes more number of frames or
images or information about the product. This leads increase in designing and
increase in cost of ads. But to make the impact it is necessary to decide exact
duration of ad depending on the product. The duration of Web ad generally
used are-

 5 seconds

 5-10 seconds and

 More than 10 seconds

d. Position of Web banner ad:

To catch the attention of the viewer, position of banner ads plays an important
role. For Web banner ad generally used positions are as follows –

 Top of the page

 Bottom of the page

 Right side of the page

 Left side of the page

99
Chapter – 2 Web Banner Advertising and Its Development

e. Occurrence of Web banner ad on Website:

―Number of times the Web banner ad can display on a different Websites. If a


particular web banner ad is displayed more number of times on a Website it
can get noticed by the viewer and which leads to increase the click though
rate‖ (Chavan, 2011:90)

f. Frequency of changing Web banner ad design

Smita R. Chavan consider the article ―Tips from Yahoo‖ in which the article
suggested that banner burn out after 2 weeks so to attract the user and
increase the click through rate of banner ads it should be necessary to
changing the Web banner ad design after specific interval(ibid).

g. Measurement of banner ads

There is several ways advertisers‘ measure banner ad success such as:

 Click-through rate (CTR): In web analytics and advertising, click-


through is the procedure of a visitor clicking on a Web advertisement
and going to the advertiser's web site also called as ad clicks or
requests. The click-through rate (CTR) measures the amount of times
an ad is clicked by users versus the amount of times it's been viewed
but not clicked which is also called impression (Vangie Beal: https://
www.webopedia.com/TERM/C/click_through.html).

 Page views: When user visits a Web page, it is called a page view.
Page views, are tracked by website monitoring applications to record a
website's traffic. The more page views a website has the more traffic it
is receiving. However, since a page view is recorded each time a Web
page is loaded, a single user can rack up many page views on one
website. Therefore, unique page views are commonly tracked to log

100
Chapter – 2 Web Banner Advertising and Its Development

the number of different visitors a website receives in a given time


period. Page views are more similar to impressions, which are
commonly tracked by online advertisers (https://techterms.com/
definition/pageview).

 Cost per sale: It is an online advertisement pricing system where the


publisher or website owner is paid on the basis of the number of sales
that are directly generated by an advertisement. It is a variant of the
CPA (cost per action) model, where the advertiser pays the publisher
and/or website owner in proportion to the number of actions committed
by the readers or visitors to the website (Jim Taylor, et al. :
https://en.wikipedia.org/wiki/Pay_per_sale).

h. Software tools used for designing the Web ad:

i. Adobe Illustrator

ii. Adobe Photoshop

iii. Flash

iv. Dreamweaver

i. Adobe Illustrator is a program used by both artists and graphic designers


to create vector images. These images will then be used for company
logos, promotional uses or even personal work, both in print and digital
form. It is typically used to create illustrations, charts, graphs, logos,
diagrams, cartoons of real photographs, and more. Also it is used to create
print to web graphics (Kiri Rowan, 2014: https://blog.udemy.com/what-is-
adobe-illustrator-Used-for/).

101
Chapter – 2 Web Banner Advertising and Its Development

ii. Photoshop is image processing software. It has some fabulous tools for
optimizing an image for web. Optimization always based on two goals –
image quality and download speed. Slicing images is a great tool used by
Photoshop for improving the download speed for your web pages. Instead
of loading up your page with the huge pictures that download slowly, you
can slice up your images into byte sized pieces optimized for speed,
appearance and special functions such as links. Photoshop creates the
HTML needed to reconstruct your image on your page. Files in
Photoshop‘s native format, .PSD, can be exported to and from Adobe
Image Ready, Adobe Illustrator, Adobe Premiere Pro, After Effects, and
Adobe Encore DVD to make professional standard DVDs and provide non-
linear editing and special effects services, such as backgrounds, textures,
and so on, for television, film, and the Web.

Photoshop can use the color models RGB (Red Green Blue), lab, CMYK
(Cyan Magenta Yellow Black), grayscale, binary bitmap, and duotone.
Photoshop has the ability to read and write raster and vector image
formats like, .EPS (Encapsulated Post Script), .PNG (Portable Network
Graphic), .GIF (Graphic Interchange Format), .JPEG (Joint Photographic
Experts Group), Fireworks, etc. It also has several native file formats such
as .PSD (Photoshop Document) format stores an image with support for
most imaging options available in Photoshop. These types of files include
layers with masks, color spaces, ICC profiles, transparency, text, alpha
channels and spot colors, Clipping paths, and duotone settings. This is in
contrast to many other file formats (e.g. .EPS or .GIF) that restrict content
to provide streamlined, predictable functionality. Photoshop's popularity
means that the .PSD format is widely used, and it is supported to some
extent by most competing software (Chavan, 2008:93).

102
Chapter – 2 Web Banner Advertising and Its Development

iii. Flash, also known as Shockwave Flash and popularly called flash. Flash
is an animation program that can produce high quality multimedia files.
Adobe Flash Professional is used to create web applications, games and
movies, and content for mobile phones and other embedded devices. It
features support vector and raster graphics, a scripting language called
Action Script and bidirectional streaming of audio and video. There are
also versions of the Flash Player for mobile phones and other non-PC
(Personal Computer) devices.

Flash is commonly used to create animation, advertisements, various web


page components, to integrate video into web pages, and more recently,
to develop rich Internet applications. The Flash files, have a .SWfx
(Shockwave Flash) file extension and may be an object of a web page,
strictly "played" in a standalone Flash Player, or incorporated into a
Projector, a self-executing Flash movie with the .exe extension in
Windows. Flash Video files have an .flv (Flash Video) file extension and
are utilized from within.SWfx files (Chavan, 2008:97).

iv. Dreamweaver can hide the details of pages' HTML code from the user,
making it possible for non-coders to create web pages and sites. It is
available for both Mac and Windows operating systems. Dreamweaver
allows users to preview websites in many browsers, provided that they are
installed on their computer. It also has some site management tools, such
as the ability to find and replace lines of text or code by whatever
parameters specified across the entire site, and a templatization feature
for creating multiple pages with similar structures. The behaviors panel
also enables use of basic JavaScript without any coding Dreamweaver
can use "Extensions" - small programs, which any web developer can
write (usually in HTML and JavaScript). Extensions provide added

103
Chapter – 2 Web Banner Advertising and Its Development

functionality to the software for whoever wants to download and install


them. Dreamweaver is supported by a large community of extension
developers who make extensions available (both commercial and free) for
most web development tasks from simple rollover effects to full-featured
shopping carts. Like other HTML editors, Dreamweaver edits files locally,
and then uploads all edited files to the remote web server using FTP (File
Transfer Protocol) or SFTP or WebDAV (Chavan,2011:100).

2.5 Principles of designing web banner ads

Emilie Futterman writes in her article that banner ads are the most
omnipresent form of marketing on the Internet (Futterman, 2014: https://
thenextweb.com/dd/2014/01/07/design-banner-ads-people-actually-want-
click/#.tnw_3e06Ttzi ). Because of their large quantity, banner ads are, often
but not always, ignored, there is a possibilities that most of the time banner
ads are ignored by the viewers because due to lack of relevance to the
viewer, fear of spam, a virus, popup, or some other unexpected reaction, and
general lack of engaging content. In survey, 43% of respondents said online
banner ads do not look interesting or engaging and 31% of respondents said
they only wanted to click ads when they were in the mood or interested in
looking at them (2011: http://www.marketwired.com/press-release/top-reason-
users-dont-click-banner-ads-they-dont-want-be-diverted-from-their-current-
1504178.htm). For the successful response of banner advertising certain
principles are followed in the time of designing banner ads which are as
follows:

a. Maintain the Standard Sizes of banner

Banner ads are come in variant sizes depends on type of the project,
designers have to create within the specification of the site where they plan to

104
Chapter – 2 Web Banner Advertising and Its Development

advertise, and most sites use a set of common sizes. According to Google
AdWords who is one of the biggest servers of banner ads on the web keep up
with the most popular sizes suggested that wider ad sizes tend to perform
their taller counterparts. Much of this may have to do with placement above
the scroll and because it is more comfortable to read from left to right, rather
than lots of stacked text. So here are the sizes designer should consider first.

 728 pixels by 90 pixels leader board (often at the tops or bottoms of pages)

 300 by 250 medium rectangles. (frequently floats on the right side or is


embedded in text elements)

 300 by 600 half page

 320 by 100 mobile banner (Cousins, 2015: https://designshack.net/articles/


graphics/design-banner-ads-that-dont-suck-15-design-tips/).

b. Create Hierarchy

Dave potter defines hierarchy is a simple as any system of persons or things


ranked one above another. It is a system that helps us define order and
organization (2010: https://www.woodst.com/web-design-development/
hierarchy-web-site-design ). In advertising visual hierarchy plays an important
role. Steven Bradley states in his article ―Design Principles: Dominance, Focal
Points and Hierarchy‖ that as anyone design distinct levels of dominance; it
created visual hierarchy in the designs It makes visitors to scan information
and helps them to communicate a message quickly and effectively (Bradley,
2015: web.smashingmagazine.com.design-principles-dominance-focal-points-
hierarchy). Georges (2002) describes visual hierarchy is a significant concept
in the field of advertising, a field that is dominated by visual reorganization
and motion. Designers of advertisements try to organize the visual hierarchy

105
Chapter – 2 Web Banner Advertising and Its Development

to aid the eye to recognize information in the desired order in an attempt to


achieve a specific goal (Doaa Farouk Badawy Eldesouky,2013: 148).
Supporting this fact Caleb explains, ―In advertising efficient communication
requires and for this a visual hierarchy is needed. Hierarchical structure
shows which elements of design are most important? It will ensure the final
designs does not confuse the audience by relentlessly featuring a barrage of
oversized text, image and logos and failing to include any white or negative
space. The hierarchal structure will actually encourage a combined treatment
of components, as well as the careful alignment of elements that respect one
another‘s placement within the grid structure. Proper hierarchy guides the
viewer through the piece, allows them to easily follow a step-by-step path, and
allows them to fully comprehend the exact message being conveyed. In
advertising design hierarchy would dictates how a certain piece should be
viewed by manipulating an infinite number of visual cues. Whether a designer
is handling text, images, or logos, the main goal should be to organize the
components in a manner that will call attention to the most important items
first‖ (Caleb Gabel,2016: web.mudd.com/blog/importance-visual-hierarchy-
advertising). Similarly Banner ad also needs hierarchy because banner ads
are designed to increase brand awareness and drive traffic to websites so for
this banner ads need three elements: Branding, message and encouragement
to click. For this reason designer needs to create simple hierarchy of elements
and to create simple designs. Always keeping it in mind that message should
in appropriate point as 2 to 10 points, based on the consumers need apply
offers and then include a logo mark or trademark which has to be readable
and with accurate size. Then at the last step finish the ad framework by
adding up with a coupon code, sale and e-mail sign up so audience will get to
click the banner ads.

106
Chapter – 2 Web Banner Advertising and Its Development

c. Keep One Message & Copy

Advertising copy or message is the advertising sales message is the term


usually refers to the sales message that appear in print, the written portion of
message, excluding the illustrations. The aim of advertising message or copy
is to sell or help sell products, services or ideas. It would create immediate
sales. The function of a message or copy in an advertisement is to secure
attention, arouse interest and obtain readership, stimulate desire, establish
conviction and finally to evoke action (Rege, 1972: 135, 136). In Banner ads
messages are not a never-ending process, in the banner ads it is the most
important thing on the screen, so advertisers have to putt message in banner
tactfully and start with a concept by keeping message simple with using the
limit space wisely to promote the one message so that they can hold on to the
consumers. After this process they should add another features or function
such as animated gifs etc. (web.designsnack.net). As it is known that copy is
key part of the advertising design, so there are some points as suggested by
Futurman that while writing the massage or copy, it should be simple and
uncluttered, avoid flashing or flickering designs and always prefer limited and
strong copy because audiences do not have much time to read the banner ad
(Futurman: web. the next web.com/design-banner-ads-people-actually-want-
click/).

d. Include a Button or Strong Call to Action

Button is a smaller version of banner that often looks like an icon and usually
serves to provide a link to the advertiser‘s home page, and it is known as call-
to-action. Software technologies such as Java, Acrobat, Enliven and
shockwave have greatly enhanced the effectiveness of banners and ad
buttons with full motion and animation (Kazmi and Batra, 2005: 327). Cliff

107
Chapter – 2 Web Banner Advertising and Its Development

Allen et.al says about buttons that they are abbreviated version of web
banners. A button is usually rectangular or square and measures about one-
half or one-quarter the size of a banner. Button can be static or animated and
are usually 120X90 pixels or smaller, with the 88X31 pixels button being a
popular button size (Kazmi and Batra, 2005: 133). Connor Turnbull suggested
in his article ―Best Practices for Designing Effective Banner Ads‖ that strong
call to action is the most important element in banner ad which convincing
users to interact with it. The call to action is the initial stage in banner ads.
This comes in various forms like a QR code or even a traditional button that
reveals a website or video when scanned. Therefore, in the time of creating
button in banner ads keep a simple buttons like ―shop now‖ or ―find out more‖
and don‘t include fancy buttons (2013: web. webdesign.tutsplus.com/
designing-effective-banner-ads—web design). Shape of button could also
play an essential role when attempting to design the CTA (call to action)
buttons. Generally, in banner ads rectangular shape buttons could be seen
which is the traditional shape introduced into the digital world a long time ago
and it is popular also but instead of using rectangular shape buttons rounded
corner buttons are also very effective in banner ad because rounded corner
point inward and draw the attention to the inside (content) of the button. A
square edge on the opposite points outward and draws the attention away
from its objects also use the right color for the CTA buttons is important
because colors stimulate a different feeling or mood. It is a very influential
source of information when people are making a purchasing decision.
Physiologists suggest that uses of red colors are good to trigger more
attention (Andrei Florea, 2015: https://blog.bannersnack.com/importance-call-
to-action-buttons-banner/). Call to action button can give a verity of function in
banner. Its main function is to get audience or consumer to the site to do
some activities like adding a product to their shopping cart, downloading

108
Chapter – 2 Web Banner Advertising and Its Development

something, requesting information etc. so for the designers have to design call
to action button catchy which is hierarchically important to the visual design of
banner ads.

e. Focus on Typestyle

Bruce G. et al. suggested that the selection of typestyle for the design in
advertisement is important because type can add or distract from the look,
feel and readability of an ad (1999: 474). Most of the time designers working
with small space in banner ads and are against a lot of competition for eyes
therefore, in this situation one should use strong typefaces that are easy to
read. In banner ads for strong communication two typefaces should be
enough and the headline may go big also bold and colorful fonts to grab
attention of the viewers. Designers may use simple sans serif fonts for
everything and also they could use two sizes in bold type: one for main text
and another for buttons or call to action.

f. Use Simple Motion and Animation

It has known that animation can motivate interaction and draw attention of
users and help to increase advertising reorganization and brand recall.
Detenber, Simons and Bennett suggested that motion also figures
prominently in the world of media, for it is a defining characteristics of film,
video and new media technologies such as multimedia. In addition Reeves et
al. and Keeper stressed that motion could influence human cognitive process
and increase human arousal and attention in television advertising. Motion in
advertising has been positively associated with higher physiological arousal.
Detenber et al. reported that image motion had a positive effect on emotional
arousal a indexed by self-reports. Also, animated motion used in advertising
may influence human cognitive process and increase viewer attention to ads.

109
Chapter – 2 Web Banner Advertising and Its Development

Therefore, utilizing animation and motion into web banner ads can increase
the engagement of the audiences but also it have to be mind that too much
animation can easily distract the user‘s attention( Chang Hyun& Jun, 2007:
Consumer Responses to Creative Platform of the Internet Advertising.htm).
Implementing subtle animation and motion effects is usually a great way of
grabbing attention and increasing interaction though while using the motion in
banner ads. Designer should limit the length of animation which up to 15-30
sec, depending on the size of the unit. According to Connor Turnbull ―simple
animation can be just that little devote that makes someone take notice‖
(Turnbull,2013:webdesign.tutsplus.com/best-practices-for-designing-effective-
banner-ads-web design).

g. Maintain Brand Consistency

The American marketing association defines ―brand as a name, term, sign,


symbol or design or a combination of them intended to identify the goods or
services of one seller or group of sellers and to differentiates them from those
of competitors‖(Philip Kotler: 256). In the other words the name or symbol
used to identify a product or service and distinguish it from the competition is
known as brand (Bruce G. et al, 1999: 152). The value of the brand of the
company that owns it is known as its brand equity, which is the net total of all
assets and liabilities linked to the brand by consumers. A brand includes
emotional or functional elements meant to establish a relationship with
consumers. To increase brand equity it is important to work on brand
consistency because brand consistency ensures that people would come to
know a brand by one name or face and are thus more likely to remember it
when it comes time to buy products in the brands category. When companies
fail to be consistent with branding they thus also run the risk of not only
confusing customers, but also sending them a message that doesn‘t sell their

110
Chapter – 2 Web Banner Advertising and Its Development

products. It is known that banner ads are an extension form of every other
marketing campaign and is a very important tool for establishing brand identity
online. As per Mako Lehel Mor, the banner should be designed according to
the message so in order to deliver the right message through the visual
elements one has to invest in consistency: the visual look of the brand should
be created using every tool like the logo, the colors, and the images, in a
consistent style. (Mako Lehel Mor, 2015: https://blog.bannersnack.com/
branding-in-banner-ads/).‖ Thus based on this statement it is important to
maintain the brand consistency in banner ads by using the same colors,
typefaces and imagery across all marketing materials.

h. Use of Strong Imagery

Imagery means it use of figurative languages to represent objects, actions


and ideas such a way that is appeals to our physical senses. It makes use of
particular words that create visual representation of ideas in peoples mind.
The word imagery is associated with mental pictures (Schueller, 2018:
https://www.widen.com/blog/what-is-brand-consistency-and-why-do-i-give-a-
dam-v1). Lesliee Gill defines imagery is part of imagination. Further he
mentioned that imagination is vitally important matter in all artistic work, it
adds a quality and luster to the written word, the picture or the general design.
Imaginative treatment makes advertisement attractive and readable. Similarly
the application of imagery to advertising, whether in the form of words,
illustration or color, can give scope for creative ability of a high order. The
advertisement design and written is continually probing the reader‘s
imagination (Lesliee Gill, 2013: 91,92). Therefore, while designing web banner
one should bear in mind that the placement of the images in banner should be
small and designers should use appropriate or compact images and detail
shots to make the most of the space more communicative. For example if

111
Chapter – 2 Web Banner Advertising and Its Development

banner ads are designed for clothing retailer, it must show a product item
only. Stick to simple placements as well, with images next to text, rather than
as a part of it because users will only have a few seconds to see what the ads
are trying to show. ―A strong image next to a strong message is designers
best bet‖ (Cousins, 2015: https://designshack.net/ articles/graphics/design-
banner-ads-that-dont-suck-15-design-tips/).

i. The importance of colors in banner ads

Color is another physical element of advertising layout and can be used with
impact only if its dimensions are understood. Basic principle of advertising
layout design is the same for both color and black and white. The decision to
use color and how much of it can be influence the development of copy and
art and the production of finished print advertisement. The use of color directly
influence the cost of the advertisement but also offer significant advantages
like, it adds attentions- capturing value to the advertisement, it can help in
importing emphasis to important elements in an ads. It can add sense of
realism or atmosphere, it can help easy identification of brand name, package
and trademark and it imparts a feeling of quality and prestige to the
advertisement (Kazmi and Batra, 2004: 386). Similarly in banner ads colors
make a big impact and designer can improve their banner design by using the
right color in the right way. Gregory Ciotti discussed in her article about
psychology of colors in marketing and branding that different colors in banner
ads will influence audience to evoke different emotions. Further reference of
supporting the importance of colors Sofia Andre ascribes ―It is important to
choose colors that represent the brand but also make people feel things that
associated with what the product service is‖ (Sofia Andre: web. 5-ways-
improve-banner-ad-design.com). Kazim and Batra, consider the suggestion of
Michael Glaspire, the author of how to sell anything to anyone, anytime that

112
Chapter – 2 Web Banner Advertising and Its Development

use of colors like yellow, orange, blue and green in banner ads will help to
grab attention instead of red and black( Kazim and Batra, 2004:326).

j. Link Appropriately

This is an effective tool for helping audience to measure conversions. In this


tool if audience click a banner and saw a product which they want to buy, so
without any trouble the link should go to that product. Landing pages that
directly relate to ad campaigns are a good option for banner ad design. So for
better communication match ads to images on the related page so that
audiences do not feel tricked or lost after the click.

k. To Save Properly

This step is an essential part of the design since the audience is not liable to
serve or interested in the banner ads if the files are too large or if they are not
formatted properly therefore, designer should optimize the content for the
smallest file size. The file size of the project should be preferably somewhere
around 150 kilobyte, depending on the size of the ads. After this it must be
saved in a format that works across the web. Common file types for banner
ads include PNG (Portable Network Graphics) and JPEG (Joint Photographic
Experts Group) for static displays and GIF (Graphics Interchange Format) for
animated displays. As the popularity of SVG (Scalable Vector Graphics)
increases, this format is becoming more widely accepted as well.

l. To Keep it Simple

In the last part the most important thing is to keep everything simple. One
should determine the main purpose, the branding, and the call to action. The
more content in the box, the more likely audiences are to confuse and there is
a high chance to loss the viewer attention. Therefore, when it comes about

113
Chapter – 2 Web Banner Advertising and Its Development

banner ads, one of everything is enough i.e. one image, one message, one
call to action and one brand mark.

Apart from the above discussion there are some more points to discuss about
design banner ads, designing banner ads on the basis of particle work while
working in a project at M&C Saatchi February advertising agency under the
guidance of art director Mr. Kaushik Ganguly and Creative Head in digital
advertising Mr. Somyajeet Chakladhar, I have came to know the following
rules and principle that makes banner ads attractive and persuasive, those
are as following:

1. Size of Banner

There is a master size of banner ads which are come in many sizes but the
banner which I have designed have its master size which is 728X90 pixels.
Once the design or art work has done it would be adopted in different size of
banner according to the clients need or space of the websites. This process is
called adaptation. The sizes of the adaptation of banner ads are:

• 300x250 Pixels

• 160X800 Pixels

• 300X60 Pixels

• 800X600 Pixels

Below is the banner ads 2.5.l (i) and 2.5.l (ii) which I have design during the
project is the master size banner ads.

114
Chapter – 2 Web Banner Advertising and Its Development

Image 2.5.l(i) Banner ad Image 2.5.l(ii) Banner ad

2. Minimalist Design

Minimalism design aims for simplicity and objectivity. It has also been called
ABC art, Reductivism and Rejective art and its theories have been applicable
in lifestyle (Bradley, 2011: vanseodesign.com). Minimalist design tends
toward more white space, better typography, grid layouts and less color.
Steven Bradley mentioned Mies Vander Roe quote ―Less is more‖ to describe
his aesthetic sense of having every element serve multiple purposes both
visually and functionally. Buckminster Fuller said ―design more with less‖ and
dieter Rams changed it to ―less but better‖. All three are mentioning the same
thing that‘s mean minimalism is to design smarter. In the time of design
banner ads minimalistic design works a lot because in this overcrowded
internet everybody wants to get noticed so designers need to use important
elements in banner ads to make users click (Katai,2016: https://blog.
bannersnack.com/banner-ad-design-ideas/). According to Simonle Le
Bouthillier ―When surfing the web, our retention capacity is reduced to that of
a young child. In such a context and with only second to stand-out the
minimalist principle ‗less is more‘ will make a lasting impression‖ (www.

115
Chapter – 2 Web Banner Advertising and Its Development

bannersnack.com/banner-ad-design -idea). Therefore while designing banner


ads with minimalistic design designers may use high quality images, and also
choose only the most important elements. Minimalism design doesn‘t mean
using a much white space but using limited important elements like one color
or two color, brand logo, do not use gradient in banner just keep it simple as
much as can.

3. Rule of Thirds

It has been known that composition is an essential element in advertising


whether it is print ads or web banner ads. The rule of thirds came out of
photography where it is used for creating nice and catchy composition but
today it has also applied to the web design and banner ads composition. This
rule has been based on the longtime known theory of Golden Ratio also
called divine proportion (Helen Stark: https://www.motocms.com/blog/en/rule-
of-thirds-use-website-design/). This theory speaks about perfect proportion of
the rectangular shape where the ratio of the longer or bigger part to the
shorter or smaller part is equal to approximately 1.618. This theory creates
balance and harmony into the composition which makes the composition
naturally beautiful and esthetically pleasing. Similarly the rule of thirds plays
essential role in photography composition as well as in web design and
banner ads design. The main principle or method of this rule of thirds is to
divide the layout into nine equal section with two horizontal and two vertical
lines. See the example below in the image no 2.5.l. (3).

116
Chapter – 2 Web Banner Advertising and Its Development

Image no 2.5.l. (3). Rule of Thirds

Each of these sections will take about 33.33% of the horizontal space and the
same percentage of the vertical space. That‘s why this is known as ―Thirds‖.
On the above fig no. 6 the rule of thirds could be shown where four lines are
drawn two horizontal and two vertical lines. Four intersection points are forms
which are called focal points where the main elements of the composition
should be arranged and also nine equal sections are drawn.

Benefits of the use of rule of thirds in web banner ads are that it may helps
creating stunning layouts that raise conversions and attract visitors to stay
with the ads. It has been considered that applying the rule of thirds based grid
to the layout may help to designer to find out where the accent should be
arranged and what elements are better to place onto that grid.

2.6. Difference between the design of web banner advertising and print
advertising

Print and banner ads are two sides of the same coin. They have a lot in
common but, Janie Kliever in her article ―Graphic Design for Print vs. The

117
Chapter – 2 Web Banner Advertising and Its Development

Web: 15 Vital Differences You Need To Know About‖ described differences


between the two disciplines which are as follows (Kliever: https://www.canva.
com/learn/print-vs-web/):

a. Viewing Method:

Viewing method explains how an audience approaches the design of print ad


and web banner ads. According to Mary Gualtieri the biggest difference
between a print design and a web design is how the user views them. Print
and web design share a visual quality in which a printed design piece is not
going to look the same as a web banner design piece. In print design it needs
to have a tangible experience. For example a print design needs to think how
texture, shape, or printing effects like letterpress, embossing, or screen
printing. On the other hand, web banner design can add elements such as
audio or video elements to enhance the user experience and make it more
dynamic (Gualtieri, 2016: http://www.rittersprinting.com/7-guidelines-to-
designing-for-print-and-web/).

b. Static vs. Interactive:

The design lifecycle & users connectivity with advertising design. In this the
Janie Kliever wants to explain that in static advertising once a design finalize
and goes for printing, it is not going to change unless a decision is taken to
redesign and reprint. This decision may cost time and money, which is not an
ideal choice most of the times. On the other hand the web banner design
however, can be tweaked, changed or completely redesigned at any time;
also even after publishing on websites with a low cost and less time (Kliever:
https://www.canva.com/learn/print-vs-web/).

118
Chapter – 2 Web Banner Advertising and Its Development

c. Compatibility: Platform independent web banner design

For web banner designer‘s compatibility forms a major element of creating a


great user experience. Any web banner design need to display and operate
properly in different web browsers with different operating systems and
platforms. For example, iOS, Apple‘s mobile operating system would not
deliver any flash based designs and Internet Explorer with versions 8 or below
cannot display SVG contents (scalable vector graphics) properly. Web
designers have to keep these limitations in mind and to make their designs
viewer friendly and platform independent.

d. Layout: designing of ad suited to different medium

Both print and web design have many common design fundamentals like
typography, images/graphics, shapes, lines, color, etc. Each of these
elements is applied in both the mediums. Also each approach has its own
unique layout necessities. For print, all design elements must be presented
within the constraints of the printing surface, while for the web designers have
almost limitless flexibility to systematize, assemble and filter design elements.
Printed artwork must rally certain standards using parameters like margins
and bleeds, while web banner should seek more responsive in nature to
provide a better experience between different viewing methods, such as
computer screen and mobile devices. Because various browsers may change
a web designs actual layout, to achieve top functionality it requires testing with
different browsers and operating systems.

e. Size: Good Use of the Design Space

Size and layout of both print and web ads goes hand in hand. In print design,
the size of the printing surface is one of the most important determinants of

119
Chapter – 2 Web Banner Advertising and Its Development

how the designer would use the available space, what type of design
elements would applied, the amount and size of the text to be used, etc.
However, there are standard sizes for many print ads like letters, business
cards, posters, photos, etc. The possibilities are almost unlimited because
paper and other printing surfaces can be cut into many size and shape. But
for web banner ads even though the size is not a constrain however,
designers are challenged with the diversity of the display devices limited to a
certain number ranging from desktop computer, laptops, tablet and smart
phone. The designs are ideally scaled to fit any devices. This adaptability,
known as responsive design, which has become a norm in web browsing as
people are accessing internet from multiple devices simultaneously.

f. Resolution: An overview of DPI & PPI

Resolution determines the quality of images, graphics and photos in design


and hence it is very important to know the basic of resolution for both print
design and web banner design. Resolution refers to use of two terms i.e. DPI
(Dot per square Inch) and PPI (Pixels per square Inch). DPI is used in the
printing process which refers to the density of the dots of ink printed on an
inch of printing surface. Higher DPI will produce better quality of images
however; it has no relationship with the size of the print. DPI a concept is not
applicable for web design because it is specifically involves how ink is printed
on a physical surface.

On the other hand PPI used for on screen display which involves the number
of pixels. For better quality images in web banner design higher number of
pixels per inch should be preferred. Blurriness, distortion, loss of quality etc,
which is known as pixilation, occurs when the PPI is not adequate for
printing or when a digital image is displayed online at a size larger than its

120
Chapter – 2 Web Banner Advertising and Its Development

original pixel dimension. For web banners the standard image quality is 72
PPI, which may be change as more devices are being introduced with high-
resolution displays. Sebastien Gabriel, a designer for Google Chrome,
clarifies that ―Windows computers have a default PPI of 96. Mac uses 72,
although this value hasn‘t been accurate since the 80‘s. Regular, non-retina
desktops (Mac included) will have a PPI of 72 minimum up to around 120
maximum. Designing with a PPI between 72 and 120 ensures your work is
going to be roughly the same size ratio everywhere‖ (Gabriel: https://
www.sebastien-gabriel.com/designers-guide-to-dpi/#). Preparing a digital
image (measured in pixels) for printing (measured in inches, centimeters or
other units) is where the uncertainty often sets in (ibid). An official of U.S.
government resource advising museums on how to best conserve
photographs and other resources suggests that ―PPI and print size have an
inverse relationship i.e. higher PPI value condenses or reduces the physical
size of a print, but increases its quality. This means that, depending on the
characteristics of a specific project, designers need to set a file‘s PPI to
produce the right combination of size and quality that is the acceptable
amount of PPI needed for a quality print is dependent on the size of the print.
Larger prints are generally seen from farther away than smaller prints, so a
lower number of PPI will generally look acceptable visually. Without
magnification, the human eye can‘t differentiate detail in a print greater than
300 PPI. Depending on the printer, the general standard today requires 300
PPI for a quality print.‖ Designers often express the need for a file saved at
300 DPI: they really mean 300 PPI (2008:2, https://www.nps.gov/museum/
publications/conserveogram/22-03.pdf).

121
Chapter – 2 Web Banner Advertising and Its Development

g. File Types: selection of a right format for print and banner designs

Every file format falls into two basic categories: Raster or Vector. Raster
images are made of pixels in digital photos and their quality varies depending
on their resolution. Distortion can happen easily if a raster image is enlarged
beyond its actual resolution is; which is measured in pixels per inch. On the
other hand, Vector images, are not restricted by pixels. Vector refers to
graphics that are based on mathematical equations, allowing them to be
scaled to any size without loss of quality. Below some common file types are
mentioned, their characteristics and types of projects designers use:

1. Both Print & Web:

 JPG (or JPEG): This is the default file format on many digital

cameras. It must be saved with a suitable resolution and in the


correct color space for example CMYK for print and RGB for web.

 PDF: It conserves the original content and appearance of a file

regardless of where or how it is viewed.

 EPS: It is the most common for saving vector graphics to save their

scalability. It is not always readable on multiples devices.

 PNG: This type of file has high image quality and also supports

transparency and opacity.

2. Print Only:

 TIFF: it has high image quality and large file size with compressed

image but does not reduce quality, unlike JPEGs. It is compatible


with both MACs and PCs commonly used for final handover to
printer.

122
Chapter – 2 Web Banner Advertising and Its Development

3. Web Only:

 GIF: It supports graphics featuring animation and also transparency


effects. It is not appropriate for photos because its color capabilities
are not as good as JPEGs. It is perfect for simple graphics on the
web, because low file size doesn‘t negatively impact page loading
speeds.

 SVG: It is a vector format file type that can be scaled up or down to


any size without loss of quality.

4. Software-specific:

 PSD is an editable, raster-based file type produced in Adobe

Photoshop.

 AI is a vector-based file created in Adobe Illustrator.

 Cdr is vector based file type created in Coral Draw.

o Color: color scheme for use in print ads and web banner designs

Color is seen very differently printed on a piece of paper versus viewed on


screen, because it involves different color spaces: CMYK for print and RGB
for web.

CMYK, contain four ink colors used by all printers these are cyan, magenta,
yellow, and black. Designers recognize individual colors they want to use in
print design with codes that give the percentage of each type of ink essential
to form a certain color. For example, if one wants to print the same shade of
blue as Twitter uses for its logo; according to the company‘s style guide the
CMYK color code for ―Twitter Blue‖ is 70/10/0/0 which shows 70% cyan ink,
10% magenta ink, and no yellow or black ink. Put the code into the design

123
Chapter – 2 Web Banner Advertising and Its Development

software and the same exact shade of blue that Twitter uses shall get printed.
It‘s important to keep in mind that the colors on the screen may not
accurately showed how the colors will look when printed while working on a
design using CMYK color space. So it is suggested to go through a calibration
process which is necessary to ensure the color translates correctly from
screen to paper. On the other hand RGB refers to the colors when it is
depicted on a digital screen or monitor. Combination of light in red dots, green
dots, and blue dots create visible colors on the digital screen. RGB colors are
represented by three sets of numbers which are ranging between a minimum
and a maximum, generally 0 to 255 that refers to the amount of red, green
and blue light it mixed together to depict a certain color. For example, in the
logo of Twitter the RGB value for ―Twitter Blue‖ is 85/172/238 with 238 being
the value for blue light. Hexadecimal values, generally called hex codes, are
another way to label RGB colors which contain six-digit codes and used
specially to identify and create color while constructing a design with HTML
and CSS.

h. Typography: Selection and Use of Right Fonts for the print design
and web banner design

It has been noticed that while purchasing a font or downloading a free font
online for a print design or web banner design; they come in two categories
i.e. desktop fonts and web fonts. The purchased fonts comes with licensing,
legal and copyright issues with relation to where, how and number of times
the font can be used. Generally, desktop fonts are licensed to a single user to
install on their computer and use in various ways, especially for print designs.
On the other hand Web fonts, have been optimized and created especially for
use on websites using CSS. Choices for designer to select web fonts are
pretty limited but with the help of resources like Google Fonts (free) and Type

124
Chapter – 2 Web Banner Advertising and Its Development

Kit, designers get the web fonts free or otherwise through paid subscription.
Designers have complete control over how the typography looks for print
according to the design while on the other hand for the web banner design
fonts, features like clear look and easy to read are prioritized. Designers
have less control over how the font reflects across different devices and for
enhancing readability designers use content with short paragraphs of text and
also keep space between lines.

i. Control: Design Limitations and Duration of the process

Typography isn‘t the only thing web designers have limited control over. Web
design is an interesting platform in which the designers determines a project‘s
initial appearance, although a user can override these choices by changing
browser window size, zooming in or out or adjusting browser settings like font
choice and text size. Whereas, in print designers have more or less complete
control over their projects, customizing, changing, or tweaking up until the
moment of printing rather than users making choices about how the end
product looks, print designers make exact decisions about a design‘s
appearance on the final products. Web designers, on the other hand, have
more ongoing control. If a designer wants to fix a mistake, change certain
elements on already published design or even revamp the whole design; that
option remains open.

j. Construction: Designing methods and measuring them

Every designer has their own process, their preferred methods and workflow
for putting down a design together. In case of web designs the process may
have more impact on the final product compare to print design. Print
designers recognize that there‘s more than one way to get designs done until
unless the design looks good at the end. Instead for a web designs it is a little

125
Chapter – 2 Web Banner Advertising and Its Development

more complicated on how a site is put together, what‘s there under the hood,
and how it influences the final product including usability (whether visitors
are able to find things on the site, page loading speeds) and visibility in search
engines.

Conclusion:

In this chapter it has been seen that due to rapid growth in online advertising
revenues indicates the viability of web banner advertising as an alternative to
that traditional media. Different technical development of web banner ads has
been discussed in this study where it comes to know that accurate size of
banner run better chances of grabbing attention and being seen and
remembered and also for better visibility position of banner ads plays an
important role. In this chapter it has been discussed that for a an effective
response of banner advertising certain principles are entail in time of
designing banner ads where it conclude that while designing banner ads
design should keep simple where only one message, one image, one call to
action and one brand mark is sufficient to increase the audience click or CTR
(Click Through Rate). At the end by comparing the differences between the
design of web banner advertising and print advertising, the most important
statement that can be made from this study that the web banner design is
very different from the print advertising. The comparison between the two
mediums of advertising design proves that the computer monitor is a
completely different medium from paper. Whereas text printed on paper is a
solid object, text on the hand computer screen is based on light waves. While
screen designing may be regarded as a matter of taste. While comparing
elements of design (form and size, color, image, and text) between the two
media, one of the significant distinctions is reliant on the working areas of the
two media; screen and print. Where the issues of image and text are

126
Chapter – 2 Web Banner Advertising and Its Development

concerned, typescript and images displayed on the screen are greatly inferior
in quality to printed typescript and images. Furthermore, color creation differs
on the web banner and in the print advertising. Certainly all these distinctions
between the print and web banner media do not mean that none of the
principles of design apply to web advertising. On the contrary, successful web
advertising should be based on the same basic graphic design principles as a
design prepared for printed advertising. Besides all these differences, web
banner advertising design has to make use of some new elements because
web ads provide live, timely, viewable and often storable information and
entertainment when the consumer wants it. Increasingly, advertisers are
coming to realize that web banner advertising offers a higher awareness of
their product, easy methods of information distribution including speech and
video presentation, improved ability to craft brand image, and an immediate
direct line between customers and the product. Certainly all these
opportunities are provided by some unique design elements of web
advertising such as interactivity, navigation, and organization of information.

127

You might also like