Chapter 2 PowerPoint - Web Design & Interactive Media

advertisement
2
Web Publishing
Fundamentals
Web Design,
5th Edition
Chapter Objectives
 Describe the advantages of web publishing
 Discuss basic web design principles
 Define the requirements for writing for the web
 Explain the use of color as a web design tool
 Identify web publishing issues
Chapter 2: Web Publishing Fundamentals
2
Advantages of Web Publishing
Web publishing offers distinct advantages over
print
– Currency
– Connectivity
– Interactivity
– Cost
– Delivery
Chapter 2: Web Publishing Fundamentals
3
The Currency Advantage
Websites can be updated continuously, while
print publications are only as current as their
date of publication
To keep visitors on your site, always supply
timely, changing material
USATODAY.com
Chapter 2: Web Publishing Fundamentals
4
The Currency Advantage
Chapter 2: Web Publishing Fundamentals
5
The Connectivity Advantage
 The web’s connectivity
advantage, or ability to
instantaneously
distribute and share
content
 Streamlines the writing
process
Chapter 2: Web Publishing Fundamentals
6
The Interactivity Advantage
Internet and web technologies promote data
and resource sharing
Main ways to interact:
– Page of contact information
– Blogs
– Web-based forms
– Member pages
Chapter 2: Web Publishing Fundamentals
7
The Interactivity Advantage
Chapter 2: Web Publishing Fundamentals
8
The Cost Advantage
Web publishing is more cost effective than
print publishing
Colorful designs, photographs, and text can be
included in a webpage for considerably less
cost
Don’t forget to consider file size, space
limitations, and load time
Chapter 2: Web Publishing Fundamentals
9
The Delivery Advantage
Distributing information via the web can be fast
and inexpensive
With the same immediacy and cost, the web
can reach both global and local audiences
Consider the web when the need exists for
economical and rapid distribution of
information
Chapter 2: Web Publishing Fundamentals
10
Basic Web Design Principles
Three things to consider when designing a
successful web publication that will leave a
distinct impression:
– Balance and proximity
– Contrast and focus
– Unity and visual identity
Chapter 2: Web Publishing Fundamentals
11
Balance and Proximity
Arrange web elements symmetrically
(centered and balanced) to suggest a
conservative, safe, peaceful atmosphere
– Avoid too much symmetry
Arrange web elements asymmetrically (off
balance) to create an energetic mood
– Asymmetrical designs typically do not adapt well to
mobile devices
Chapter 2: Web Publishing Fundamentals
12
Balance and Proximity
Chapter 2: Web Publishing Fundamentals
13
Balance and Proximity
Proximity (closeness) is closely associated
with balance
Elements that have a relationship should be
placed close to each other
White space can help define proximity and
organize webpage elements
Chapter 2: Web Publishing Fundamentals
14
Balance and Proximity
Chapter 2: Web Publishing Fundamentals
15
Contrast and Focus
Contrast is a mix of elements to stimulate
attention
– Use different text styles, colors, and size
Chapter 2: Web Publishing Fundamentals
16
Contrast and Focus
Focus is the center of interest or activity
A webpage needs a focal point
– This is where you want your visitors to focus their
attention
Create webpages with contrast to elicit
awareness and establish a focal point, the
center of interest or activity
Chapter 2: Web Publishing Fundamentals
17
Unity and Visual Identity
All pages at a website must have unity, a
sense of oneness or belonging, to create the
visual identity
Create unity with consistency and repetition
throughout a website
Chapter 2: Web Publishing Fundamentals
18
Unity and Visual Identity
Chapter 2: Web Publishing Fundamentals
19
Unity and Visual Identity
Alignment is the arrangement of objects in
fixed or predetermined positions
Choose one method of alignment and use it
regularly
Chapter 2: Web Publishing Fundamentals
20
Unity and Visual Identity
Chapter 2: Web Publishing Fundamentals
21
Writing for the Web
Visitors typically look for information with:
– Accuracy and currency
– Scannability
– Organization
Chapter 2: Web Publishing Fundamentals
22
Writing for the Web
Accuracy and Currency
– Confirm the accuracy of your material with a
reliable source
– Be sure to avoid spelling and grammar errors
– Indicate the date and time of the last update to
your website
Chapter 2: Web Publishing Fundamentals
23
Writing for the Web
 Scannability
– Make information easy to
scan
– Use headings, subheads,
and bulleted lists
• Chunked text
Chapter 2: Web Publishing Fundamentals
24
Writing for the Web
Organization
– Write your copy in the inverted pyramid style
Chapter 2: Web Publishing Fundamentals
25
Color as the Web Design Tool
Color can be a powerful design tool
The color wheel can help you choose
effective and appealing color combinations
– Primary colors
– Secondary colors
– Cool colors
– Warm colors
– Complementary colors
Chapter 2: Web Publishing Fundamentals
26
The Color Wheel
Chapter 2: Web Publishing Fundamentals
27
The RGB Color System
Monitors project color using the RGB color
system
– Combines red, green, and blue light
– Levels of intensity are measured from
0 to 255
– A monitor’s color depth is the actual number of
colors that a monitor displays
– The hexadecimal system uses 16 symbols to
signify values
Chapter 2: Web Publishing Fundamentals
28
Target Audience Expectations
Certain colors have come to symbolize
particular qualities
Keep in mind the qualities generally associated
with different colors when selecting colors for
your website
Review several commercial and
noncommercial website color schemes
Chapter 2: Web Publishing Fundamentals
29
Web Publishing Issues
Successful web publishing includes
recognizing the following issues:
– Technical
– Legal and ethical
– Accessibility
– Usability
– Design techniques
Chapter 2: Web Publishing Fundamentals
30
Technical Issues
Bandwidth is the quantity of data that can be
transmitted in a specific time frame
– Keep file sizes to a minimum
– Corel Paint Shop Pro X6® or Adobe Photoshop
CS6 can decrease image file size
Browser differences
– Graphical vs. non-graphical display
• Alternative text
Chapter 2: Web Publishing Fundamentals
31
Technical Issues
Screen Resolution
– The measure of sharpness and clarity
– A pixel is a single point in an electronic image
– Page elements display differently at different
resolutions
– When designing websites for mobile devices, you
must account for a smaller screen size and the
auto-rotate feature included in many smartphones
and tablets
Chapter 2: Web Publishing Fundamentals
32
Technical Issues
Chapter 2: Web Publishing Fundamentals
33
Mobile Versions
 Creating a mobile phone version of your website is another
way to ensure you reach visitors of your site
 Web design experts discourage the creation of mobile website
versions, and recommend responsive web design techniques
to create device-independent websites
Chapter 2: Web Publishing Fundamentals
34
Legal and Privacy Issues
Legal Issues
– Easy to acquire images from the web
– Make sure the material on your website is free of
copyright infringement
• Ownership of intellectual property
– Obtain permission from the owner to use any
copyrighted material
– Protect your work by copyrighting your material
• Copyright notice
Chapter 2: Web Publishing Fundamentals
35
Legal and Privacy Issues
Privacy Issues
– Cautiously give out personally identifiable
information (PII)
– Encryption
– Decryption
– Secure Sockets Layer (SSL)
– Cookies
– Privacy policy statement
Chapter 2: Web Publishing Fundamentals
36
Legal and Privacy Issues
Chapter 2: Web Publishing Fundamentals
37
Accessibility and Usability
Issues
Web accessibility deals with ensuring
access to web-based information
Web usability involves designing a website
and its pages so that all visitors to the website
can easily and quickly satisfy their goals
Web designers incorporate user experience
(UX) practices into webpage design
Chapter 2: Web Publishing Fundamentals
38
Chapter Summary
 Describe the advantages of web publishing
 Discuss basic web design principles
 Define the requirements for writing for the web
 Explain the use of color as a web design tool
 Identify web publishing issues
Chapter 2: Web Publishing Fundamentals
39
2
Web Publishing
Fundamentals
Web Design,
5th Edition
Download