Earlier this year, I had the opportunity to present this session at the Society for Technical Communication (STC) Summit at Sacramento, California. This is the accompanying paper that was published in the Proceedings of the conference.
For the slide deck and an audio recording of the session, see http://blogs.adobe.com/samartha/2011/12/localizing-images-cultural-aspects-and-visual-metaphors.html.
Basic Civil Engineering first year Notes- Chapter 4 Building.pptx
Localizing Images: Cultural Aspects and Visual Metaphors
1. S o c i e t y f o r Te c h n i c a l C o m m u n i c a t i o n
STC’s 58th Annual Conference
www.stc.org P R O C E E D I N G S
15 –18 May 2011
Sacramento Convention Center
Sacramento, CA
3. Localizing Images: Cultural Aspects and Visual Metaphors
Samartha Vashishtha
Modern corporations maintain a wide range of Web assets,
including websites, documentation portals, and knowledge-
bases. These Web assets use visual elements, such as
COLOR
colors, graphics, images, symbols, visual arrangements,
and user interactions, to convey information. While we Colors invoke different moods, emotions, and states of
expect these elements to convey only the information we minds. Besides their general significance, they assume
intend to convey, such visual elements also carry cultural special significance in particular socio-cultural contexts.
meanings that different users interpret differently in the While localizing visual elements, you could use the
light of their social background. tables in this section as references to choose a color that
would convey the intended meaning to users from a
Despite the importance of these visual elements, most Web specific cultural background.
asset localization projects limit their focus to only text and
screenshots. However, translating these visual elements,
keeping in mind the cultural ethos of the target audience, is Tables: Significance of Colors
crucial too—especially for marketing-oriented content,
documentation, and websites. From this URL (PDF), you can download a table
summarizing the general range of meaning that major
In this article, we will look at the cultural aspects that must colors convey.2
be considered while localizing these visual elements of This table (PDF) captures many useful instances of
“content”. culture-specific significance of colors.1,2, and 4
Although color can be used to supplement and reinforce
DEFINING CULTURE the effect of a Web element, it should not be used as the
sole means to convey meaning5—partly because that
Before we examine the aforementioned visual elements, information cannot be used by those who are color-blind.
let’s review a definition of culture given by Geert
Hofstede, Emeritus Professor—Maastricht University: Case Study—Hygiene-product
“Culture is the collective programming of the human Websites
mind that distinguishes the members of one human group
from those of another. Culture in this sense is a system of The websites of Axe® and Old Spice®, both leading
collectively held values.” brands of deodorants targeting male customers, display
predictable color patterns. While the Axe site is
Hofstede also propounded a set of five dimensions that predominantly set in black, a color of sexuality and
help objectify cultural differences: sophistication, Old Spice uses a combination of red and
black for similar reasons.
Collectivism vs Individualism
By contrast, SunSilk Gang Of Girls and Pond’s®, two
Power Distance websites targeting female customers, figure pink hues
prominently.
Femininity vs Masculinity
Similar trends are observable in Casio’s launch of a
Uncertainty Avoidance series of women watches (Baby G) parallel to its popular
G-Shock series for men6, which features a number of
Long Term Orientation
black watches. Many Baby G watches are pink or of
pastel colors, so that they appeal to the modern woman.
We will study these dimensions later in this article.
Samartha Vashishtha | Localizing Images: Cultural Aspects and Visual Metaphors
Copyright 2011 Society for Technical Communication 166
4. These examples elucidate the fact that the two genders currency in the 1870s and 1880s. In the 1890s, cream
have widely different color preferences. As a general shades got popular7.
observation, men tend to like cooler colors like blue and
black, while women have a bias towards warmer colors— In the twentieth century, these cycles of preference are
that is, shades of red and orange3. See Case Study— short and abstract. As far as content, Help systems, and
Femininity vs Masculinity later in this article for more Web design are concerned, shades of blues seem to be
information on the general preferences of the two the in thing globally. Some custom colors that Web and
genders. graphic designers prefer, as per a survey, are shown in
Figure 18.
Class Differences and Color
Perception
Research has shown that members of the general working
class prefer colors that they can easily name, while the
highly educated class prefers obscure colors like taupe,
azure and mauve3.
Figure 1: Some popular colors for Web and info design
This seems to be a primary reason why Wal-mart®
chooses simple colors for its logo. The current logo is a
distinct blue and yellow. Web-safe Colors
Back when computer displays were capable of displaying
only 256 colors, a palette of 216 colors—supposedly
immune to dithering on such displays—was developed.
Those colors did not have standardized names, but were
identifiable through a unique set of RGB values. It must
Age Differences and Color be noted that the Web-safe palette has gone obsolete
Perception now9, since almost all modern color displays are 16+ bit.
However, designers of anti-phishing10 systems still use
Jennifer Kyrnin opines that children like bright, solid that palette; since a large number of its colors can be
colors, while adults prefer subdued shades; implying that distinguished uniquely by the human eye.
mild pastels and gray shades are not the appropriate
colors for images on a children’s website.
SYMBOLS AND ICONS
Climatic Differences and Color
In most cultures, symbols are very closely interwoven
Perception with general etiquette and theistic beliefs. This calls for a
The climatic conditions of a target country may also have careful assessment of their suitability in different cultural
an effect on the color preferences of the people there. For contexts. In most cases, drawing elements from a set of
instance, Scandinavians are known to have a preference internationally accepted icons and symbols can be a safe
for light yellows, bright whites, and sky blues. This is in option.
stark contrast to the long, dark nights that they are used
Recognizing the need to standardize the use of visual
to as a people. The residents of San Francisco, being
elements on a global scale, JTC1, a technical group of
used to foggy days, don’t exhibit a liking for grays.
the ISO has come up with the ISO/IEC DIS 11851
However, these hues are preferred by the residents of
standard for icon symbols and functions in IT user
Miami7.
system interfaces. The standard deals with general,
object, pointer, control, tool, and action icons.
Color Trends
Like all other things, colors too periodically gain or lose
favor with the masses. Very bright colors ruled the roost
in the West in the mid-1800s, but subdued colors gained
Samartha Vashishtha | Localizing Images: Cultural Aspects and Visual Metaphors
Copyright 2011 Society for Technical Communication 167
5. Some Guidelines on Using In Greece, this
Symbols Internationally gesture, going
Although deciding on the right symbols for a localization Stop, halt
back to
Byzantine
project calls for ingenuity and caution, these guidelines times, is an
will come handy: abusive signal.
Graphical elements with text in a particular Similarly, using body parts as symbols could
language should be avoided, since they could be back-fire. Inanimate objects can be substituted
difficult to localize. Elements with a single letter for human figures, wherever possible.11 When
could particularly lose a lot of their meaning in using human figures is indispensable, line and
translation, since words with identical meaning generic sketches should be used.
in different languages can begin with different The use of animal symbols should also be
letters. avoided while designing for an international
Hand symbols should be avoided while audience. The dog normally thought of as a
designing interfaces that will be localized. symbol of loyalty in the West, is food to many
Generally speaking, almost all hand gestures are East Asians. The snake, which could be a
obscene someplace or the other in the world.11 negative symbol for the West (the Devil,
tempter), is the symbol of life and rebirth in
If hand symbols must be used, generic human some parts of the East.11 Many animals hold
hands engaged in some unambiguous activity religious significance in specific parts of the
should be shown. Visual elements representing world. The cow is sacred in India, while the pig
gender or racial distinctions should be is an unholy animal for Muslims everywhere.
omitted—for instance, the hands should be Mythological or religious symbols that hold
drawn in pure white or pure black. Some hand relevance for a particular culture may be
gestures that will not go down well with a global meaningless for others. For instance, the Red
audience are shown in the table below. Cross symbol is modified to the Red Crescent in
Arabic countries, since crosses and six-pointed
Intended stars can be deemed inappropriate there11.
Icon Problems Similarly, while the Swastika is reminiscent of
meaning
Nazism in the West, the related Swastik is a
In Sicily, this holy symbol for the Hindus.
hand gesture is
Yes, OK a reference to
an intimate
activity.
In France, this
gesture means
zero or Figure 2: Swastika and Swastik
worthless. In Using abstract symbols, made up of simple
Japan, it is a geometric shapes, can be a safe option. Here
Precisely, yes
reference to
money. In
too, care must be taken not to use symbols that
resemble religious symbols (like the Islamic
South America crescent) and flags of nations.11
and India, this
hand gesture Using natural images for designing symbols is
has anatomical also an option, since these remain fairly
connotations. consistent across the world. Other possible
inspirations for international symbols could be
modes of transportation, globally-marketed
consumer goods (like cameras, batteries, and
Samartha Vashishtha | Localizing Images: Cultural Aspects and Visual Metaphors
Copyright 2011 Society for Technical Communication 168
6. electric bulbs), office equipment, Hofstede has determined scores for each of these
communication media, scientific symbols, and attributes for many countries of the world.
professions practiced throughout the world
(painter, carpenter, writer, etc). Some traffic and
warning symbols are also fairly standardized Example: Comparison of Hofstede’s
and in use throughout the world11. dimensions for India and the USA
Flags on a Globalized Website
Yves Lang is of the view that on a globalized website,
flags should not be used as icons that users must click to
access language-localized versions. This is because the
same language may be the native tongue of many
countries, and the lingua franca of a still greater number
of communities. Using a flag to represent a language (for
example, using the British, American or the Australian
flag to represent the English language) could offend users
in other countries where that language is widely spoken.
CULTURAL ATTRIBUTES
While localizing the visual elements in an information
asset, an understanding of the attributes of target culture
comes very handy. In this section, we’ll look at some
theories that attempt to define such attributes beyond the
obvious.
Hofstede’s Dimensions of Culture
"Culture is more often a source of conflict than of Figure 3: Hofstede’s dimensions for India and the USA
synergy. Cultural differences are a nuisance at best and
often a disaster." - GEERT HOFSTEDE
Hofstede’s culture theory defines five dimensions of
culture that help objectify differences between cultures12:
Collectivism vs Individualism (IDV): The
degree to which the culture emphasizes
individual or collective relationships
Power Distance (PD): The degree of equality
among the people of a culture
Femininity vs Masculinity (MAS): The power
equation between genders in a culture
Uncertainty Avoidance (UA): The extent to
which the members of a culture feel threatened
by uncertain circumstances
Time Orientation (LTO): The extent to which
a culture stays devoted to traditional values on a
long-term basis
Samartha Vashishtha | Localizing Images: Cultural Aspects and Visual Metaphors
Copyright 2011 Society for Technical Communication 169
7. Case Study—Individualism vs
Collectivism
Adobe® Systems websites for the USA and India sport
different images.
Figure 5: Power distance
(websites accessed on April 2, 2011)
Some other applications of the Power Distance
dimension are as follows:
Navigation: People from High Power Distance cultures
have been observed to appreciate restricted, guided
routes and ways to access information, and greater use of
authentication mechanisms. On the other hand, users
from LPD cultures demonstrate a preference for multiple
information paths, and freedom in the way things can be
done.13
User Interaction: An analysis of the Coca-Cola websites
for countries with different power distances shows that
the error messages meant for users in LPD cultures tend
to be didactic, while for HPD cultures, these are more
supportive in nature.13
Models: While users in LPD cultures like to see
influential people and leaders featured on websites, users
in HPD cultures prefer to see normal people engaged in
day-to-day activities. This may also reflect in the fonts,
Figure 4: Individualism vs Collectivism
(websites accessed on April 15, 2011)
colors, sounds, logos and other multimedia elements on a
website.
While searching for corporate information, users from
individualist societies tend to be more interested in
personal achievers at a company. Members of collectivist Case Study—Femininity vs Masculinity
cultures focus more on group milestones. McDonald’s websites for Norway (low MAS) and Saudi
Arabia (high MAS) have different designs. The metaphor
Case Study—Power Distance on the front page of the Norwegian website underlines
family and shopping, while the Saudi Arabian design lays
The Siemens® website for The Netherlands (low power emphasis on the spirit of sports and competition. Thus,
distance) shows details of a single leaf as its predominant the content and design of a website targeting a woman-
image. The website for Malaysia features images of the dominated culture should emphasize social relationships.
Kuala Lumpur skyline. On the graphic design front, women tend to like softer
edges and shapes, while men seem to prefer clear, no fuss
illustrations13.
Samartha Vashishtha | Localizing Images: Cultural Aspects and Visual Metaphors
Copyright 2011 Society for Technical Communication 170
8. Figure 7: Uncertainty avoidance
(websites accessed on April 3, 2011)
Case Study: Long Term Orientation
Figure 8 shows snapshots of the websites of two
builders—one from Pakistan (LTO closer to zero) and
the other active in India (LTO closer to 60). The effect of
this Hofstede’s parameter on the visual imagery of these
websites is evident. The first website focuses on a single
project, while the second one depicts a city-level long-
term view.
Figure 6: Femininity vs Masculinity
(websites accessed on April 3, 2011)
Case Study: Uncertainty Avoidance
Trends are observable in the visual information that
Skoda presents to users in Britain (low UA) and Belgium
(high UA). While the British website shows a dynamic
image open to interpretation, the Belgian website features
relatively unambiguous images.
Figure 8: Long term orientation
(websites accessed on April 3, 2011)
An example application of the LTO dimension is in
designing the Contact Us page for a corporate website.
Even a single Web form could suffice as the Contact Us
Web page of a site targeting users from low LTO
cultures, since long-distance communication is often the
dominant mode of communication in such societies.
However, in high LTO countries, users expect to see the
personal contact information of some company
representative displayed prominently on contact pages.13
Samartha Vashishtha | Localizing Images: Cultural Aspects and Visual Metaphors
Copyright 2011 Society for Technical Communication 171
9. Hall’s time orientations POLITICAL CORRECTNESS
Edward T. Hall’s theory of time orientations
Sometimes, the quest to be politically correct leads to the
differentiates monochronic (single-tasking) and
conscious rejection of certain colors and symbols by a
polychronic (multi-tasking) cultures. The US is usually
people or community. Such trends are more observable
seen as a monochronic culture, while the Arab world is
when a nation comes of age—for instance, when it
considered polychronic.14
becomes a sovereign state after a period of dictatorship
Unlike Hofstede, Hall has not developed detailed time or colonial rule. Otherwise too, trends like replacing the
orientation scores for countries and cultures. However, word disabled with the wheelchair symbol, or the coinage
behavioral observation of a sample user-base could help differently-abled, reflect an attempt to avoid offending
determine if a culture is monochronic or polychronic.15 those in question.
Hall’s orientations likely have limited applications to the Another recent example is that of China blocking Web
localization of visual elements. However, they could help searches for the keyword Jasmine in the wake of the
optimize workflow and user interaction design for recent Tunisian ‘Jasmine’ revolution.
different cultures.
Marcus’ model of culture-
SUMMARY
sensitive Web UI design The localization of corporate Web assets is a complex
process involving many technical and cultural variables.
Aaron Marcus has identified five key design components The cultural aspects of this process can be addressed
for optimized global UI design16: adequately through a careful study of the target user-base
and application of cultural models, early in the
Metaphors are words, images, sounds, and development cycle.
tactile experiences that have the potential to
convey complex concepts. Besides linguistic heterogeneities, the perception of
colors, images, symbols, gestures, and signals by
different cultures varies under the influence of factors
like demographics, taboos, politics, history, moralities,
and theistic beliefs. Any successful attempt to localize
these assets, thus, must take cognizance of these factors.
Mental Models are assumptions that people While localizing visual elements in a culture-sensitive
have in mind. For example, when someone says manner increases the overall localization effort, the
they went to see a sports game, Indian listeners resulting global Web presence helps companies build,
would likely imagine a cricket match, while maintain, and expand a loyal customer-base. Web
American listeners would likely think about a analytics tools like Adobe Test&Target and user-
football/baseball game. feedback mechanisms, such as ratings and questionnaires,
could help quantify the impact of culture-sensitive
Navigation pertains to how user would traverse localization on user experience and customer loyalty.
a particular model.
Interaction pertains to the human-computer
interaction. Interaction involves elements, such
REFERENCES
as I/O, status displays, and other feedback.
1. Global 2005 Calendar, Human Factors
Appearance relates to the choice of fonts, International
colors, styles, sounds, or tactile perception for 2. Table at
localized Web UIs. http://www.users.bigpond.com/lionelhartley/reso
urces/colours.htm, accessed in August 2007
Besides UI design, Marcus’ components could find
applications in information design and content delivery 3. Jennifer Kyrnin, “Color Symbolism”,
mechanisms for documentation suites. http://webdesign.about.com, accessed in April
2011
Samartha Vashishtha | Localizing Images: Cultural Aspects and Visual Metaphors
Copyright 2011 Society for Technical Communication 172
10. 4. H John Johnsen, “The Cultural Significance of
Color”, http://www.americanchronicle.com,
[California, American Chronicle], accessed in
April 2011
5. http://www.umb.edu/wau/techniques/color.html,
accessed in April 2011
6. http://www.casio.com/products/Timepiece/Baby-
G and
http://www.casio.com/products/Timepiece/G-
Shock, accessed in April 2011
7. Jeanette Joy Fisher, “Color Help: Many Factors
Affect Color Preference”,
http://ezinearticles.com, accessed in August
2007
8. http://www.simplebits.com/notebook/2005/11/10
/colors.html, accessed in August 2007
9. http://www.webmonkey.com/webmonkey/00/37/i
ndex2a.html, accessed in August 2007
10. http://www.honeynet.org/papers/phishing,
accessed in April 2011
11. William Horton, “The Icon Book”, [New York,
John Wiley and Sons], 1994, page 245
12. http://geert-hofstede.com, accessed in April
2011
13. Aaron Marcus and Associates, “Culture vs.
Corporate Global Web UI Design”, accessed in
August 2007
14. Harley Hahn, “Time Sense: Polychronicity and
Monochronicity”, accessed in April 2011
15. http://www.tamas.com/samples/source-
docs/Hofstede_Hall.pdf, accessed in April 2011
16. Valentina-Johanna Baumgartner, “A Practical
Set of Cultural Dimensions for Global User-
Interface Analysis and Design”, accessed in
April 2011
Samartha Vashishtha
Senior Technical Writer
Adobe Systems
Email: samartha@adobe.com
Beyond work, Samartha Vashishtha is a bilingual poet and
intermittent technology journalist.
He blogs about all things Adobe at
http://blogs.adobe.com/samartha.You can follow him on
Twitter @samarthav.
Samartha Vashishtha | Localizing Images: Cultural Aspects and Visual Metaphors
Copyright 2011 Society for Technical Communication 173