Welcome to Scribd, the world's digital library. Read, publish, and share books and documents. See more
Buy Now $39.99
Standard view
Full view
of .
Look up keyword or section
Like this
19Activity

Table Of Contents

We know what you’re thinking
The technical review team
Your big chance with Red Lantern Design
Where do you start?
Draw up a blueprint FIRST
Determine your top level navigation
Put it all in context
Show Jane some basic design sketches
Sketches keep the focus on functionality
Don’t ruin a good design with bad copy
What makes text scannable?
Web design is all about communication, and your USERS
Think before you code
A clear visual metaphor helps reinforce your site’s theme
A theme represents your site’s content
Brainstorming: The path to a visual metaphor
Develop a theme and visual metaphor for Mark
Your page elements shape your visual metaphor
Build a quick XHTML mock-up for Mark
And the CSS
Use storyboards to develop ideas and save time without code
Don’t design for yourself!
Let's create a storyboard for Mark
Fit your content into your layout
organizing your site’s information
Organize your site’s information
Keep your site organized with information architecture (IA)
IA–The card sorting way
Card Sorts Exposed
Sort your cards into related stacks
Give your stacks names that are short and descriptive
Which card sort is right?
Arrange your cards into a site hierarchy
Design is about audience
Your newest gig: RPM Records
Pinpoint RPM’s audience with personas
Let the personas be your guide
Resolution impacts design and layout
Time to get your RPM groove on
Add some CSS to clean up the layout
Finish off the content and navigation markup
Add layout and typographic details with some more CSS
Help support your local music scene
9Rules: The blog network gold standard
Sometimes your choices are a bit... limited
Color has an emotional impact
Create a richer color palette with the tetradic color scheme
Let’s update the SampleRate CSS
School’s back in session
The first step to good navigation is good IA
What’s really in a name, anyway?
Approach #1: Horizontally-tabbed navigation
Approach #2: Vertical navigation
Let’s style the navigation with our CSS
Build a better online newspaper
Hipster Intelligencer Online: project specs
The problem is TEXT
Improve your content with the Inverted Pyramid
Compress your copy
Add lists to your XHTML
Mix fonts to emphasize headings and other text
The level, not the size, of a heading conveys importance
Audio-2-Go: inaccessible accessibility
Accessibility means making your site work for EVERYONE
How does your site READ?
A site’s message should be clear...to EVERYONE
Face it: computers are stupid!
A computer will read your image’s ALT text
Convert your long ALT text to a LONGDESC
Your improvements are making a difference for SOME Audio-2-Go customers
Accessibility is not just about screen readers
Tabbing through a page should be ORDERLY
Audio-2-Go is now a LOT more ACCESSIBLE
WCAG Priority 1
Color shouldn’t be your ONLY form of communication
Life through web-safe eyes
Life through color-blind eyes
Audio-2-Go, via color-blind eyes
Those stars are a real problem
Background images are your friend
There’s more to ordering than just tabindexes
Problems over at RPM
Let your audience speak to you through focus groups and surveys
Surveys and focus groups aren’t free
Surveys Exposed
Ask the right questions in your surveys
The final RPM Music user survey
The results are in!
Responses to the open-ended question:
Web Browser Usage
Fix RPM’s CSS bug by moving the hover property
The building blocks of budget usability testing
Use a moderator script to organize the test
Friends and family can be a problem
The results of the usability test–what the users are telling you
A simple problem
Site stats give your users (another) voice
Website analytics tools
Your portfolio so far
Keeping your site and content fresh keeps your users coming back
Web design is about evolution, not revolution
Use CSS to evolve your site’s design
Use JavaScript lightboxes to add interactivity to your site
Add Facebox to the Red Lantern home page
Edit your index file
Adding blog functionality with WordPress
Add a WordPress blog to the Red Lantern site
Change the look and feel of your blog with themes
The newest potential client: the Foo Bar
What Foo Bar wants in a bid:
Let’s build a quick mockup for the Foo Bar
Welcome to the world of DESIGN PIRACY
What kind of web worker are you?
Red Lantern’s got a new prospective client
What really goes into designing a website?
Figure out a total bid
Use a proposal letter to deliver a detailed quote to a client
The Trilobite podcast: a(nother) new challenge
Use Creative Commons to license your work
#1: Cross-cultural & international design
#2: The future of web markup
#3: The future of CSS
#4: Designing for mobile devices
#5: Developing web applications
#6: Rhythm in your layout
#7: Text contrast
#8: Match link names with their destination page
#9: Contrast is a fundamental layout device
P. 1
Head First Web Design

Head First Web Design

Ratings:

3.75

(14)
|Views: 1,989 |Likes:

Want to know how to make your pages look beautiful, communicate your message effectively, guide visitors through your website with ease, and get everything approved by the accessibility and usability police at the same time? Head First Web Design is your ticket to mastering all of these complex topics, and understanding what's really going on in the world of web design.

Whether you're building a personal blog or a corporate website, there's a lot more to web design than div's and CSS selectors, but what do you really need to know? With this book, you'll learn the secrets of designing effective, user-friendly sites, from customer requirements to hand-drawn storyboards all the way to finished HTML and CSS creations that offer an unforgettable online presence.

The revised two-color edition of this book includes a free online version of the chapter on web color. You can easily access this chapter at Oreilly.com once you register your book.

Your time is way too valuable to waste struggling with new concepts. Using the latest research in cognitive science and learning theory to craft a multi-sensory learning experience, Head First Web Design uses a visually rich format specifically designed to take advantage of the way your brain really works.

Want to know how to make your pages look beautiful, communicate your message effectively, guide visitors through your website with ease, and get everything approved by the accessibility and usability police at the same time? Head First Web Design is your ticket to mastering all of these complex topics, and understanding what's really going on in the world of web design.

Whether you're building a personal blog or a corporate website, there's a lot more to web design than div's and CSS selectors, but what do you really need to know? With this book, you'll learn the secrets of designing effective, user-friendly sites, from customer requirements to hand-drawn storyboards all the way to finished HTML and CSS creations that offer an unforgettable online presence.

The revised two-color edition of this book includes a free online version of the chapter on web color. You can easily access this chapter at Oreilly.com once you register your book.

Your time is way too valuable to waste struggling with new concepts. Using the latest research in cognitive science and learning theory to craft a multi-sensory learning experience, Head First Web Design uses a visually rich format specifically designed to take advantage of the way your brain really works.

More info:

Publish date: Dec 15, 2008
Added to Scribd: May 16, 2009
Copyright:Traditional Copyright: All rights reservedISBN:9780596800871
List Price: $39.99 Buy Now

Availability:

Read on Scribd mobile: iPhone, iPad and Android.
This book can be read on up to 6 mobile devices.
Buy the full version from:Amazon
See more
See less

11/20/2014

497

9780596800871

$39.99

USD

You're Reading a Free Preview
Pages 20 to 127 are not shown in this preview.
You're Reading a Free Preview
Pages 147 to 161 are not shown in this preview.
You're Reading a Free Preview
Pages 181 to 197 are not shown in this preview.
You're Reading a Free Preview
Pages 217 to 243 are not shown in this preview.
You're Reading a Free Preview
Pages 263 to 497 are not shown in this preview.

Activity (19)

You've already reviewed this. Edit your review.
1 hundred reads
1 thousand reads
Islam Khalil added this note
This book is great, thanks for sharing it with us http://www.carngerrish.co.uk/
Edna Lima liked this
Narendra Rao liked this
Rajanand liked this
ameshlal liked this
guruveer.singh liked this

You're Reading a Free Preview

Download
scribd
/*********** DO NOT ALTER ANYTHING BELOW THIS LINE ! ************/ var s_code=s.t();if(s_code)document.write(s_code)//-->