Web design



A Web Design PrimerWhen you put pencil to paper to plan your site, you should make your designs as detailed as possible. But most important, you need to decide two things. First, you need to choose your overall navigation structure: how pages will link together, how sections will be organized, what content should go on which page, and how visitors will move throughout the site. Second, you need to decide on a design layout for the individual pages: the look and feel, the content layout, and what you want appearing on each page.When embarking on planning a site, I like to get away (far away) from the computer and find a quiet place where I can think clearly, a place without the distractions of phones, e-mail, or Beverly Hillbillies marathons. I go for bell towers, hunting lodges, or the crow’s nest of a clipper ship. You might want to do the same.Unwritten Web Design ConventionsBefore actually getting into the down and dirty of site design, let’s get some tried-and-tested web conventions out of the way. In web design, nothing’s hard and fast, but there are some unwritten laws that surfers have come to expect web sites to obey. When things don’t work as expected, visitors tend to get frustrated and eventually surf somewhere else. I’ll bet you’ve come to expect most of these unwritten rules as you surf from site to site, too.Most conventions are navigational, so let’s get those out of the way first. A standard on virtually all sites is a main menu, which should appear on every page either across the top or down the left side. Menu buttons link to the landmark pages of the site and then branch off from there. Try to keep your buttons simple and easy to follow. Some sites use indecipherable icons or text captions that don’t clearly indicate where links go. Navigation 101So you know the essential conventions. Now it’s time to sit down and work out your navigational structure on paper. The key idea here, when you begin thinking about navigation is that you want to build a site that’s easy to get around in. This means being sensitive to the needs of both novice and experienced users. Good sites don’t rely on the web browser’s Back button for navigation. Instead, they provide several methods to move through the site, and the best sites keep each of these methods simple and easy to follow.A main menu is a must. Think seriously about including text links at the bottom of the page. Another way to employ text links is to use something called breadcrumbs. Breadcrumbs usually appear toward the top of the page and provide a trail of links leading back to where the visitor started. But Isn’t Content King?There’s an unfortunate fact in web design. Because the web is a visual medium like film or TV, your site’s design is the first thing visitors will see and begin evaluating you by. If you’re not a designer or visual person, this may not make a lot of sense. Some people think that if they have really well-written content, the masses will come, that the visual design doesn’t matter.Well, there’s actually a bit of psychology here. Get this: If you’ve got killer content in a really badly designed site, the perception in people’s minds is that the content has no value. And the opposite is true. If you have really bad content in a nicely designed packaging, people immediately think it’s of high value. Want a real-world example of this? Watch any top-10 music video countdown.Branding: Your Consistent MessageRemember that building a site is all about communication, and I don’t mean through text. Design, color, and images speak. The best-designed sites are those that embody the overall look and message of the organization they represent. In design circles, this is called branding. Branding encompasses everything from the overall look, colors, and fonts of the organization, to more abstract things like attitude and environment. It is the story that an organization is telling.Planning Page LayoutWhen beginning the design of that first page, keep this in mind: On the web there’s no fixed page size. This means that you can make your pages as long and wide as you like, but be careful. Surfers don’t like to do a whole lot of scrolling, especially horizontal scrolling. So make sure that the size of your page is appropriate for the content it’s going to hold.What I find easiest is to design an initial page template to use for the main pages of my site. I decide where I want the main menu, contact information, common links, and so on to appear. This process isn’t just about deciding where to put elements on my page, but also how they’ll look and what colors to use. As you begin roughing out your designs on paper, think about what you like and dislike about sites that you visit. Are there particular elements that you’d like to incorporate?Metric? Imperial? It’s All about Pixels and Browsers NowIn the land of web design, everything’s measured in pixels. Why? Because that’s how computer monitor resolution is measured. If you’re not familiar with monitor resolution, it’s the number of pixels horizontally and vertically that are displayed onscreen.The lowest resolution, and really used only on older computers, is 640x480. One notch up is 800 x 600, which is a good worst-case scenario for web design. The most popular resolution is 1024 x 768. From there, resolutions get pretty high—up to 1152 x 864, 1600 x 1200, 1280 x 1024, and even 1600 x 1280. For more on monitor resolution, go to monitorrez.Additional ResourcesOnline Web Design ResourcesCheck out these web design resources:Get a head start with Dreamweaver and web design at devnet/mx/dreamweaver/best_practices.html. Want to know more about information architecture? Read Louis Rosenfeld and Peter Morville’s book Information Architecture for the World Wide Web. There are lots of resources on the web regarding information architecture. To get started, check out ia. Visit for nearly endless resources on structure design, interfaces, conventions, and a bazillion other topics. For help building your own site maps—and lots more—check out XtREEME SiteExpert (). Visit mysterymeatnavigation.html for examples of what not to do!Changing Monitor ResolutionHave you never changed your monitor resolution before? It’s easy. Just follow these steps for your particular operating system.Windows XP:Minimize all your programs so that all you see is your desktop.On the desktop, right-click and choose Properties from the menu that appears.In the Properties dialog box, click the Settings tab.At the bottom of the tab, drag the Monitor Resolution slider left or right to increase or decrease the screen resolution. ................
................

In order to avoid copyright disputes, this page is only a partial summary.

Google Online Preview   Download