D TE GH RI PY CO RI TE MA AL 1
The Distinction of Web Design Principles and variables of a visually appealing layout
4 DISTINCTIVE DESIGN CREATING THE IDEAL, aesthetically pleasing, distinctive design seems like an impossible task to many. While most web industry fields have their own methodology to improve and yield results in the layout and the structure of the content, a few basic defining concepts underpin the whole process of forging beautiful designs. Essentially, the goal is to achieve maximum impact on users.
CHAPTER ONE THE DISTINCTION OF WEB DESIGN 5 each part of your site as someone within a crowd. The loudest individuals are shouting above everyone else. This clashing certainly results in quieter voices going unnoticed, even if that voice is important within the project’s context. Gauging every object’s importance against the level of noise and distraction elsewhere on the page is central to assigning a level of purposeful distinction to your pages.
6 DISTINCTIVE DESIGN Important Remember that feedback is quite subjective (and should be taken with a grain of salt). Don’t implement changes that users request on a whim without a good reason. Some things can actually make a design worse, and the last thing you want to do is destroy all your hard work! Time, space, and relativity Understanding the needs of your content is central to the concept of distinctive design, but the user experience demands more than simple information visibility.
CHAPTER ONE THE DISTINCTION OF WEB DESIGN 7 > Patience: The average visitor feels a great variety of emotions when browsing a site (some of which you can manipulate). If barriers to entry are high, the willingness to continue may be lost. > Attention: Objects on a page are always vying for a user’s focus, and in polar opposition, users are themselves trying to get the attention they require from objects. This must be accounted for.
8 DISTINCTIVE DESIGN variables that people use to measure your work’s value (such as time and trust) and affect the impact upon a user (see Figure 1-3 for an example). Figure -: Straightforward forms are much less time-intensive than complex documents. Distinctive design influences the time it takes to locate important details within a page. It also sets the tone for how tedious or enjoyable finding that information is (and by association causes relativity to take effect).
CHAPTER ONE THE DISTINCTION OF WEB DESIGN 9 Defining the ideal perspective Of the variables and principles that impact your capability to serve visitors effectively, the most common failures occur as a result of either obtrusive subjectivity (doing what you think is best for the end-user rather than what actually may be the case) or a lack of attention to detail. Appealing to the widest possible audience is critical to underpinning a distinctive design.
10 DISTINCTIVE DESIGN Figure -: Building a distinctive and beautiful website is simpler than it may appear.
CHAPTER ONE THE DISTINCTION OF WEB DESIGN 11 > Keep your visitors enlightened (offer them knowledge). > Maintain clarity and reduce noise pollution. Implementing the Zen concept within distinctive design and following the ideals of a neutral interface is relatively straightforward. Designs composed of well-balanced content (in which the required distinctive features take precedence over less useful information) allow you to draw focus to the parts of a page that require attention.
12 DISTINCTIVE DESIGN (yet, if the page includes several headings, none stands out). This is due to how humans are naturally attracted to uncommon sights. Gaining a user’s eye requires a clever mix of eye candy and offsetting the layouts equilibrium. If all of your content has little to no emphasis (such as just paragraphs of text), the readability of that content is diluted to a neutral level.
CHAPTER ONE THE DISTINCTION OF WEB DESIGN 13 Emphasizing the essentials If you’ve been coding with HTML for a while or have any experience with producing websites, you should already know that certain HTML elements provided within the W3C specifications, such as strong and em, provide visual emphasis not just on the screen within the browser window (with default styles that can be overwritten) but in context within the content itself.
14 DISTINCTIVE DESIGN One of the principles maintained through this book is that content must be emphasized tastefully, with serious consideration about how your visitors may be affected by the increased level of awareness to one item (against the lessened awareness of other content). Remember that balance affects your content and the value it inherits. Your goal is to ensure that viewers regard the obvious material on a page as useful, not as a blatant spam attempt.
CHAPTER ONE THE DISTINCTION OF WEB DESIGN 15 Figure -: Balancing a page using less-emphasized content (of various types) redirects attention. So far, you have seen the benefits of becoming Zen-like in your design approach by redrawing the balance when you feel it can improve the way information is conveyed, and by balancing neutrality and emphasis, which reflects the opposing sides of attentionfocusing. In the next section, I go over the more straightforward principle of simplicity.
16 DISTINCTIVE DESIGN With increasing techniques to provide content on demand, the capability to perform such a function has become more widespread and popular. A website is essentially the composition of its many parts joining together in harmony. Distinctive designers need to reduce information overload and simplify the overall experience. Luckily for us, the web is evolving rapidly in ways that are helping you to achieve the design goals you set ourselves.
CHAPTER ONE THE DISTINCTION OF WEB DESIGN 17 Figure -: This is one of the cleanest environments known to man . . . a blank website. Obviously, as a web designer, you are required to include content or items of interest for the visitor, and this coincidently means the addition of material to your once derelict yet simplified blank page. Clean can be very beautiful, but context and richness have more value! One beautiful example of simplicity in effect is the www.madebysofa.
18 DISTINCTIVE DESIGN Figure -: Progressively enhancing or gracefully degrading, both are great design philosophies. Sanitizing the interface Four primary methods accurately depict how to remove content that is otherwise deemed unnecessary from an interface in order to better portray the content that already exists. Although each tends to come with a varying set of definitions (as everyone seems to have a different interpretation of its meaning), they all play an essential role in design.
CHAPTER ONE THE DISTINCTION OF WEB DESIGN 19 interface, don’t add it. If there is a way to achieve something on the page with fewer objects, elements or visual points of interest, it’s worth doing, as the likelihood for distraction will be minimized. Minimalism Minimalism is a method that encourages simplicity by preventing the enhancement of elements until it is required.
20 DISTINCTIVE DESIGN Being Consistent is Critical Consistency is an important aspect of a web interface. With regard to your visitors and audience, learning new things can be a particularly scary idea if they are forced to use trial and error to find what they are looking for.
CHAPTER ONE THE DISTINCTION OF WEB DESIGN 21 Part of the justification for emphasis within a website is to lead your visitors by the hand and guide them to the content that matters most to them.
22 Important DISTINCTIVE DESIGN On rare occasions, a distinctive design can suffer a negative impact. This is only caused when the visitor’s finite resources suffer and run dry (such as a lack of trust or loyalty to a particular brand). Avoiding such events will be straightforward if you follow any prescribed guidelines. No visitor wants to endure the frustration of trying to adapt their skill set to match your site’s requirements.
CHAPTER ONE THE DISTINCTION OF WEB DESIGN 23 Consequences of distinction The benefits of a user-centered experience are justified within distinctive design because you ensure those who use the information on your site have access to it. With visitors often finding themselves unable to locate information that should be visible within a site, it’s important to guide users without limiting their interaction capabilities.