Design Tutorials for Web Developers
-
Back to the User: Creating User - Focused Web Sites -
By teaching those that create Web sites how to think like the
people who use them, Back to the User enables Web
marketers and developers to create sites that people want to, and
can successfully, use. This first installment covers the
homepage, credentials, and using space wisely.
- Back to the User: Creating User - Focused Web Sites - Part 2
- This final installment shows you how to make sure your design is in service to your concept and includes a bit of admonishment to tell the truth up-front. By teaching those that create Web sites how to think like the people who use them, Back to the User enables Web marketers and developers to create sites that people want to, and can successfully, use.
-
Using Color on the Internet
- When used properly, color can be a thing of beauty. When used improperly, it can be reasonably repulsive. Learn the importance of good color combinations.
-
Ten Top Sites Compared
- As Web design become more of a science and less driven by inspired guesswork, the Web's top sites are converging. Already they share many design features. Through analysing this convergence we can come up with a set of 'best practice' guidelines.
-
Hot Text: Web Writing that Works: Chapter 1-Part 1 - This book will show you how to craft prose that grabs your guests' attention, changes their attitudes, and convinces them to act. You'll learn how to make your style fast, tight, and scannable. This first installment looks at how to discover who you are really talking to.
-
Hot Text: Web Writing that Works: Chapter 1-Part 2 - In this installment we look at how to customize and personalize content, develop an attitude, and talk on the user's level.
-
Hot Text: Web Writing that Works: Chapter 5-Part 1 - This next installment discusses methods of keeping the text short for online articles. Sections included in this excerpt include "Save The Meaning, Cut Away The Rest" and "Delete Marketing Fluff".
-
Hot Text: Web Writing that Works: Chapter 5-Part 2 - This last installment discusses vital but tangential or supplemental material, moving repeating categories of information into tables, charts, or graphs, and includes a few sites for your critique.
- Fresh Styles for Web Designers: Eye Candy from the Underground
- This book introduces the reader to new ways of styling Web sites. Specific examples provides a wealth of techniques for the designer who wishes to apply these approaches in their own work. This excerpt is Chapter 4, "Lo-Fi Grunge Style".
-
Designing Web Sites to be Disability Friendly
- Over 15% of the population have a learning disability (LD). In addition, a sizable percentage of the population is physically challenged or has related problems. Making your page accessible means bearing in mind that not all of the visitors to your web site will be viewing it on a monitor and navigating with a mouse. A clear, well-formatted site, with easy words, can make it easier on everyone.
-
Page Content: The Long and the Short of It
- Writing for the Web is different than writing for printed media. But how different? This article discusses many of those differences, including page layout and length, content presentation, and how the page is viewed by the reader.
-
Web Sites: Learn to Build Smart and Buy Smart
- Building and buying Web sites should be a rewarding experience for both builder and buyer. For that to happen, though, the builder needs to make sure the buyer is getting honest value by using professional tools and professional methods. Further, buyers should insist on getting their money's worth.
-
Design and Architecture of a Content-Rich Web Site
- Information architecture is the practice of designing the infrastructure of a Web site, a combination of organizing a site's content into categories and creating a navigation interface to support those categories.
- Design and Architecture of a Content-Rich Web Site: Part 2
-
Information architecture is the practice of designing the
infrastructure of a Web site. In the conclusion of this article,
Alan covers accessibility and usability, the home page as site
map, and compromising between too little and too much.
Beyond Borders: Web Globalization Strategies
The two terms most critical to the success of web
globalization—internationalization and localization—are also the two most
frequently misunderstood. This chapter will help you not only
differentiate between the two, but also understand how to successfully use
them together.
Beyond Borders: Web Globalization Strategies - Part 2
This weeks installment concludes our look at "Internationalization and
Localization" with a look at three questions you should ask yourself: "Do
users understand your site?", "Can they find what they're looking for?"
and "Can they purchase what they find?"
Integrated Web Design: Building the New Breed of Designer & Developer
Integrated Web Design steps the designer through the process of integrating
technical and design practices in order to deepen their understanding of
the how and whys of technology both inside and outside the realm of web
design. With this deeper understanding, web site builders will be able to
apply more integrated design practices to their everyday work.
Train of Thoughts - Designing the Effective Web Experience
In Train of Thoughts—Designing the Effective Web Experience, Web
strategy and design consultant John Lenker provides insight for
how. This book is non-technical and is written not only for Web
designers and developers, but also for any stakeholder in a Web
enterprise that has a vested interest in ensuring that their
online resources become more meaningful and valuable.
Usability: the Site Speaks For Itself
37.8% of all Usability Pundits are wrong. That's about as accurate as any
other sweeping generalization made by any other web usability guru.
"Usability: the Site Speaks For Itself" features case-studies in usability
and information architecture from the makers of eBay, the BBC news on-line
site, The Economist web site, SynFonts (a flash-driven font foundry e-
commerce site), evolt (fully cross-browser compatible) and metafilter.
Usability: the Site Speaks For Itself - Part 2
This chapter is all about the various iterations and versions of The
SynFonts site and downloadable type catalogs the author has created over
the years. The aim is to show you how you can learn from your mistakes, if
you're willing to constantly question yourself and your work, and make sure
each iteration of a project is more and more usable. This weeks
installment covers the 1996 website and the 1997 Web Site and Interactive
Catalog.
Usability: the Site Speaks For Itself - Part 3
This chapter is all about the various iterations and versions of The
SynFonts site and downloadable type catalogs the author has created over
the years. The aim is to show you how you can learn from your mistakes, if
you're willing to constantly question yourself and your work, and make sure
each iteration of a project is more and more usable. This weeks
installment covers the 1998-2000 Web Site and the temporary closing of
the site.
The toughest site you will ever build
Where to start? What to include? What to do? Are these common questions
among web developers? Only when designing their own site. Lee Creek offers
developers some advice for when the site they're building is their own.
Usability and HTML Forms
Visitors don't enjoy filling out HTML forms. That makes good usability
doubly important. Here's a detailed look at forms for e-commerce —
individual form elements such as dropdown boxes and radio buttons, plus
validation and error messages.
Fresh Styles for Web Designers: Eye Candy from the Underground
This book introduces the reader to new ways of styling Web sites. Specific
examples provides a wealth of techniques for the designer who wishes to
apply these approaches in their own work. This excerpt is Chapter 4, "Lo-Fi
Grunge Style".
E-commerce and Usability
Ease of use is central to the success of any e-commerce site. You need a
shopping cart that mirrors the supermarket experience, and a checkout
sequence that keeps the customer in full control of the transaction. That
sense of control across all aspects of your site is essential if you want
to provide the best shopping experience. Andrew Starling looks at the
details.
Design for Community: Part 1
Design for Community goes beyond the basic how-to of programming Web
features to actually dissecting the purposes and best ways to implement
those features to foster a real, productive online community. This is the
first excerpt from Chapter 5. This installment covers setting,
communicating, and enforcing the rules.
Design for Community: Part 2
In this second (and final) installment, we look at the job description of a
host. Also included is an interview with Caleb Clark, who has played host
to countless communities over the last five years. Design for
Community goes beyond the basic how-to of programming Web features to
actually dissecting the purposes and best ways to implement those features
to foster a real, productive online community.
Usability and Navigation
Ever given up on a site because it's too difficult to get around? It's a
silly way to lose visitors. In this article Andrew looks at how you can set
up internal links so your visitors can move from page to page with
ease.
Building Web Sites From Start to Finish
With the many tools available to web site builders these days, the actual
construction of the site is often the easiest part of the process. The hard
part is getting to that point, and that requires more than a little
planning.
Usability - the Basics
Want to impress your visitors? Forget the fancy graphics and neat technical
tricks, just choose the right page width and hyperlink colors. Here's a
basic introduction to the science of usability, drawing on research, expert
opinion, and common features from the Web's most popular sites.
Design and Architecture of a Content-Rich Web Site
Information architecture is the practice of designing the infrastructure of
a Web site, a combination of organizing a site's content into categories
and creating a navigation interface to support those categories.
Design and Architecture of a Content-Rich Web Site: Part 2
Information architecture is the practice of designing the infrastructure of
a Web site. In the conclusion of this article, Alan covers accessibility
and usability, the home page as site map, and compromising between too
little and too much.
Web Sites: Learn to Build Smart and Buy Smart
Building and buying Web sites should be a rewarding experience for both
builder and buyer. For that to happen, though, the builder needs to make
sure the buyer is getting honest value by using professional tools and
professional methods. Further, buyers should insist on getting their
money's worth.
From content and page design to designing for ease of navigation and users with disabilities, Jakob Nielsen delivers complete direction on how to connect with any Web user, in any situation. This is the first installment of Chapter 4, excerpted from Designing Web Usability.
Designing Web Usability: Part 2
This installment looks at the difference between the home page and interior
pages. In addition, the use of the metaphor in the home page is examined.
This is the second installment of Chapter 4, excerpted from Designing
Web Usability.
Designing Web Usability: Part 3
This installment covers navigation on the site. How does the visitor know
where he is, where he is going, or even where he has been? This is the
third installment of Chapter 4, excerpted from Designing Web
Usability.
Designing Web Usability: Part 4
This installment covers navigation aids and helps to give understanding of
how to help the visitor work his way around the site. This is the fourth
installment of Chapter 4, excerpted from Designing Web Usability.
Designing Web Usability: Part 5
This installment covers searches on the Web site and the Internet. This is
the fifth installment of Chapter 4, excerpted from Designing Web
Usability.
Designing Web Usability: Part 6
Does it really matter how you list the URL of your site? You bet! In this
installment, Jakob Nielsen covers URL design and how to support old URLs.
This is the sixth installment of Chapter 4, excerpted from Designing Web
Usability.
Designing Web Usability: Part 7
What is the best way to handle user-contributed content? How about applet
navigation? In this last installment, Jakob Nielsen covers these issues as
they apply to the design and usability of Web sites. This is the seventh
installment of Chapter 4, excerpted from Designing Web Usability.
Table Talk
The use of tables is a perfect example that just by learning and utilizing
the lesser-used capabilities of HTML, we can yield some impressive
results.
Designing Web Sites to be Disability Friendly
Over 15% of the population have a learning disability (LD). In addition, a
sizable percentage of the population is physically challenged or has
related problems. Making your page accessible means bearing in mind that
not all of the visitors to your Web site will be viewing it on a monitor
and navigating with a mouse. A clear, well-formatted site, with easy
words, can make it easier on everyone. Read on to learn more...
How to Build Web Sites with Free Stuff - Yet More Stuff
In this fifth and final article in the Free Stuff series, we will look at
sites that offer multiple services such as Website Tools Providers,
Community Interaction, Scripts and Applets, and an assortment of items that
didn't seem to fit anywhere else.
How To Build A Web Site with Free Stuff - Syndicated Content
Ever wish you could have daily updates to your site with little or no work
on your part? Now you can! Learn how to add News Headlines, Cartoons,
Tips, Weather and Stock Quotes that update on a regular basis without
having to update them yourself, and the best part... it's free!
How To Build a Web Site with Free Stuff Part 3: Games and Puzzles
In this third part of our series on free stuff to build Web sites with, we
look at ways to entertain your visitors. Whether your site is about
entertainment or not -your visitors might welcome a few moments of light
relief! Perhaps some fun games to play, or a tricky puzzle or maze to
solve...
Designing for Net Devices
Today's Internet not only includes those browsing from their desktop or
laptop, but those surfing with WebTV, Palmpilots, cellphones and other net-
connected devices. In the first part of this series about designing for net
devices, we're going to show you how to create a page that looks good in
both a Web browser and Web TV, along with the code required to detect the
WebTV browser using both JavaScript and Perl.
How To Build a Web Site with Free Stuff
Design great Web sites with free applets, graphcs, HTML editors and more!
There's a fair amount of free stuff available on the Web, with no strings
attached. In this and subsequent articles, we're going to show you where to
get Web development tools, graphics, clip-art, photos, Java applets,
Shockwaves, search engines, polls, surveys, news and weather, music, etc
etc - all for free!
How To Build a Web Site with Free Stuff 2: Graphics
Design great Web sites with free applets, graphics, HTML editors and more!
There's a fair amount of free stuff available on the Web, with no strings
attached! This month we're going to show you where to get graphics, clip-
art, photos, and more - all for free!
Build Traffic Through Good Site Design
Everybody knows about Web site promotion; submitting to search engines,
creating reciprocol links, banner swaps and mailing lists are necessary
steps to building Web site traffic. But when all is said and done, the most
important traffic-building technique of all may be site design.
Web Design - More than Meets the Eye
Many elements go into succesful Web site design; we can cluster those
elements into sensory, conceptual, and reactive aspects. That is, design
isn't only what you see, it's also what you think and feel as you navigate
a Web site. This article explores some of the basic principles of Web site
design, and provides many links to other resources for further detailed
study.
Page Layout, Margins, Indenting, and Columns
"How can I indent text?" "How can I make newspaper-like columns?" "How can
I make margins?" "How can I position graphics?". These are all layout
issues, which HTML was not originally designed to address. However, some
techniques are available to solve these problems - e.g. hacks and kludges,
tables, and style sheets. We explain and demonstrate them, and give links
to further details.
Designing Attractive Web Pages
A well- designed page, whether in print or on the Web, is a thing of
beauty. A skilled page designer can take widely differing elements like
body text, headings, graphics, links and whatever, and arrange them into a
harmonious whole. Good design is practical as well as aesthetic. Well-
designed pages are easier to read, and lead your readers' eyes where you
want them to be led. This article looks strictly at the visual aspects of
page design.
Don't Make Me Think! A Common Sense Approach to Web Usability
Find out how people really look at your Web site. This book is for
the people in the trenches — the designers, the programmers, the
webmasters, the project managers, the marketing people and the folks who
sign the checks.
Navigation
Articles and Tutorials on designing for good Web site navigation.
Multimedia for the Web
Descriptions and demonstrations of the various media available
for Web developers, providing sound and graphic experiences
beyond the classical static images and hypertext.