07 September 2010

59: Web Trends 2010 - 2011

http://ezinearticles.com/?Web-Design-in-2010-2011---Analysis&id=4315617

COMMENTARY

1. The days of static design visuals are dead
This is a gross overstatement and idiotic. This author is an Utopian Idealist. Most of the technologies spoken of are still in their infancy and even when they become mature, they will not replace static images in every case. The visual noise generated would be a "screech."

2. Grid-based designs, Mobile Designs, Retro Designs are gaining popularity as well.
Grid designs have always been important to ALL design. Mobile design from real surveys of real web designers show there is a resistance by designers to support small-screen technology. I anticipate mobile hardware developers will find workarounds to display traditional websites, not the other way around. Retro Designs could mean low-tech design or actual "vintage" theming. They aren't clear about this --but both are popular.

3. Print Design influence
This paragraph is obvious and been the goal of web designers for years. It's just now they can finally do some of those things. So it's not really a trend but a longed for goal.
I heard a good statement from a seminar on web design in 2011. The comment was that web designers are always trying to make "paper behind glass." That meaning the web is a different medium and shouldn't try into mimic another. Quit wasting time on pixel perfect design. The web was never intended for that type of perfection. Think of the web as a 1960's typewriter with the same limitations as far as design is concerned. This will prove less frustrating.

4. Faster and better Web browsers
Big deal! This is the natural progress of things.

5. Growth of community-oriented Platforms
I see these social places as approaching bloat and there has been some negative blow back of "disconnecting" as Twitter and Facebook become more "corporate big brother."

6. Interactive Designs
"Horizontal scroll bars have been out there for a decade, but today it feels that they are gaining a new context. The move to horizontal scroll bars is probably an attempt among some designers to provide a more distinct user experience."

Interestingly, "horizontal scroll" is real easy to do in Frames and I've been watching people struggle in complicated code to do something that is simple with "low-tech." I'd like to do something with this. I've experimented with it before. It's great for displaying side-by-side photos --like for portfolios or products.

7. Slab Typefaces
"These are relatively new as in the past logos and headers were smaller and more understated by web designers. However, combined with the trend toward larger headers, slab typefaces demand the reader to take notice."

I see this trend and I like it. It means using some built type for headlines.

8. Rich and strong Typography
This is "hoo-ha" fluffy stuff.

9. Recent trends
All most all of the trends they talk about in this paragraph are bloated fads. But I agree with one thing very much, "Introduction blocks (place the most important message of the website right there and thus make sure that readers get the message as quickly as possible.) will continue to grow in this year."

This is putting the "market positioning strategy" right up front. It key in my philosophy for HOME pages.

10. More Personalization
Uh. Not on small sites. Sorry.

05 August 2010

58: Another lo-band website deconstructed


A 48.3K home page experiment. Here are the 39.4K of graphic components:

7K bamboo

13.8K stone stack

3.1K logo

15K tile

307B X 4 corners
Orange flare 3.2K

30 July 2010

57: Minimalist web design

Beautiful but not bare.
Minimalism reduces user distraction. Too many page elements, is visual noise. A minimalist design puts the focus squarely on the content. Any splash of color on a black-and-white design, for example, is sure to get the user’s attention. The color itself becomes the focal point. The graphic element brings color, texture and/or shape. It is the most important element.

How to Minimize Content
Cut out anything that is not essential. Throw out as much as possible.
    * Icons or graphics for social media, or a social media section at all
    * Taglines and supplementary descriptions or introductions
    * “Featured,” “Popular” and “Recent” lists (including Twitter and RSS feed lists)
    * Pages with more than three major sections (e.g. “Introduction,” “About” and “Services”)
    * Secondary navigation pages.

How to Simplify the Design
Minimalist designs should have little texture, color, shape, lines, content or type. Go too bare, though, and the design will be boring. Rather than dumping everything out, give the design appeal by making just one important feature the focal point. Choose what that focus will be, and keep the tips below in mind as you work through your design.

    * Decide on what content you absolutely need.
    * In a list, prioritize the content.
    * Sketch based on your list to experiment with the best visual hierarchy.

White space is practically synonymous with minimalism.
No matter how creative you are with it, a minimalist design without plenty of white space is not really minimalist at all. So, be sure to add more white space around elements than you normally would. The space is needed to balance the few elements that will appear on the page.

Balance, Alignment, Contrast
While much of the load can be carried by white space and a good layout, special care should be taken with the fundamentals of design. The three biggest related to minimalism are balance, alignment and contrast. It does not need supplementary visuals to look “finished.”

Black and White
One trends is extensive use of black and white. This is obvious enough: color should be simplified along with texture, shape and content. But it can be overdone and look  boring. Think of how to stay minimalist even with strong use of color.

Typography-based Web design is closely tied to minimalism.
When designers have very little else to excite the user, they often seize on interesting typography. You could even go so far as to use typography as the sole visual element. Look for ways to make typography enhance the design while remaining unique.

Flash
A surprising number of minimalist web designs are Flash-based. With so little else for visual stimulation, a design could benefit from subtle animation (such as text fading in and out) without being overpowering. Also, Flash removes certain limitations in the design process.

negative-effects of minimalism

It’s Just a Style
Simplifying a website is one thing, but minimalism on its own is just a style like grunge, illustrated and sleek Web 2.0 are styles. Not every design needs it.

Minimalism Is for “Artsy” Websites
Extreme minimalism is common in portfolios and other creative-type websites. Minimalist design best suits modern websites in creative industries.

The Ordinary Web User
the majority of Internet users are not creatives. Many non-designers don’t appreciate minimalist design or even find it visually appealing.

Content-Rich vs. Cluttered
We often mistake non-minimalist websites as being cluttered, and ugly. Cluttered websites are confusing and unattractive. Even experienced designers think first to remove elements when something is “missing.”

Cluttered vs. Content-Heavy
A cluttered design has little white space; its typographic styles, colors and other elements clash; it is a disorganized mess; the layout is ineffective or absent; and content is excessive, not rich.

Minimalism is undoubtedly effective. But it’s not for everyone, and some people prefer other styles.

Below are a few common mistakes made with minimalist design:

    * Self-Defeating Usability
      Minimalist websites should be the most usable websites, because nothing is there to confuse or get in the way; and the text is thought out extra carefully. Often though, with little on the page, visitors have difficulty figuring out where to go. So, attention to visual hierarchy is a must. Also, getting creative with the navigation is fine, but don’t get too creative.
    * Minimal Design or Minimal Interest?
      Beautifully minimal or just plain boring? You can make a minimalist design interesting in a number of ways, while preserving its calm and simple appeal.
    * Is the Message Strong Enough?
      Minimalist designs are best for adorning messages that are compelling on their own. The idea is to strip the website of any excess content or elements that would detract from the message. If the message is weak, ill-conceived or absent, then a minimalist design may not be the right choice. Brochure websites are an example of this: basic information with no distinct message.

We improve a design by simplifying it: that’s a basic design rule.

24 July 2010

56: Balancing Speed and Decoration

SPEED VS DECORATION
Web design is different from print design in typography, page layout, colors, and function. One of the key diferences is "speed" (meaning browser page load time.) Speed of comprehension is important in both. But functionally, if a webpage loads too slowly, the viewer will bail out and never see the website content. This is called the "poverty of attention." Simply, if there is too much artistic detail to load or absorb the visitor must block the "noise" or move on to a less complicated site.

Thus, decoration (image files) are conterproductive to speed. The ideal site would have no images to slow it down. But it would then be very boring.

There are two worlds needing BALANCE.

1. Speed versus any decoration (complexity.)

2. Classical decoration versus ornate decoration (complexity, again.)

Complexity seems to be the enemy. Unlimited or unrestrained creativity can be a barrier to understanding.

Classical design doesn't necessarily mean the load speed is fast. But when you strip a design of decoration to enhance speed, you end up with a more classical design.

Yet, decoration is perceived at subconscious speeds and influences how a user feels about a site: The First Impression. The aesthetics (body language) then is critical after getting past the speed barrier. If having endured the load time, at this moment a visitor once again decides whether to stay or leave. They instantly "feel" they've found the solution they were searching for. A positioning statement is a shortcut to that search motive. This is also called content relevance. If there is too much "site noise" they will not recognize or percieve the answer quick enough before "attention span" runs out.

There must be a minimal aesthetic applied in a discipled fashion (aka checklist) to achieve a balance of Classical and Expressive:

1) color (theme, complement, etc)
2) organics elements like foliage, rust, texture, etc.
3) lighting like shadow, depth, gradient, etc
4) legibility of text.
5) optimization of images.

21 July 2010

54: Aesthetics and Web Design

Classical Aesthetics are: good taste, pleasant, clean, clear, and symmetrical. It corresponds to "visual clarity."

Expressive Aesthetics are: creative, using special effects, original, complex, and fascinating. Users perceptions of the creativity, originality, and visual richness include ornamentation, character, and theme.

Complexity without order produces confusion; order without complexity produces boredom.
Classical and Expressive Aesthetics share two qualities of landscape design --order and complexity. Order is the "lawfulness" governing the relations among the design elements. Complexity is the large number of relationships among the elements. Human preference is for landscapes that "makes sense" (i.e. is clear and legible)) and the degree where it is stimulating. Good design strives to balance their degrees given the design context.

Perceptions of aesthetics and usability are highly correlated.
Classic design is strongly connected to perceived site usability while expressive design is less so. The classical is an philosophical idea and a usability principle. Beauty is confirmed when "form follows function."

The classical aesthetic originated from antiquity until the 18th century (Greek, Roman, etc.) These notions stress orderly and clear design. The expressive aesthetics are reflected by the designers' creativity and originality and by the skill to break design conventions. While both classifications of aesthetics are drawn from a pool of aesthetic judgments, they are clearly distinguishable from each other. Each of the aesthetic is measured by a five-item scale:

Factor 1: Classic aesthetics
Good Taste
Pleasant design
Clear design
Clean design
Symmetric design

Factor 2: Expressive aesthetics
Creative design
Fascinating design
Use of special effects
Original design
Complex design

Factor 3: Usability
Convenient use
Easy orientation
Easy to use
Easy to navigate
Clear design

Factor 4: Pleasurable interaction (Comfort?)
Feel joyful
Feel pleasure
Feel gratified

Factor 5: Service quality
Can count on site
Site contains no mistakes
Site provides reliable information

20 July 2010

53: Website Design & Aesthetics

Every graphic you use will slow down your site for its visitors.

According to some estimates, 20 percent of your visitors leave for every 10 seconds you ask them to wait for a page to download. That means, if 100 people arrive at your slow-loading page: 80 remain after 10 seconds; 64 remain after 20 seconds; 51 remain after 30 seconds; 41 remain after 40 seconds; 33 remain after 50 seconds; and after one minute you have lost all but 26 of the original 100 visitors. Rest assured all those who left will never return.