|
要建置一個網站真的易如反掌。
但是資訊爆炸再爆炸，
當成千上萬個網站擠在你眼前，
到底有幾個是真正吸引你的目光？
使用者不再是單純的上網找資料，
在瀏覽網站的時候，若沒有什麼特色吸引使用者，
很可能幾秒內這個網站就被淘汰在資訊洪流了。
如何樹立網站特色，要考慮的面向非常多，
首先一定是最開始映入使用者眼簾的版面，
創意、美學、排版、布局、配色、介面，
都是需要深思熟慮的。
文章來自：http://www.smashingmagazine.com/2008/09/03/40-creative-design-layouts-getting-out-of-the-box/
20 × Getting Creative With CSS Pavel Buben
Pavel Buben uses a magazine cover-style layout for his one-page-site. Unfortunately, there are no internal pages — it would be interesting to seek how they would be designed. An interesting and unusual approach.
 AIGA Los Angeles
AIGA Los Angeles uses boxes in a creative way. All design elements are placed according to the underlying grid, however they clearly break out of the boxes. This approach creates tension within the design and looks truly distinctive.
 SpaceCollective
For its gallery section SpaceCollective uses a five-column grid. Text and images are perfectly placed on the grid giving the layout a complete form and a sense of order. Notice various font sizes and text styling in the design — they introduce a profound visual hierarchy into the layout that works perfectly within the complex, unpredictable layout.
 Jason Santa Maria
Jason Santa Maria has taken a truly different route with his site layout. Each article is laid out differently, with strong focus on typography and visual clarity. Below three of the layouts are presented. You may have a hard time finding similar layouts on the Web.  Checkout: Point of Sale for Mac (POS)
At the first glance, Checkout looks like an ordinary Apple grid-layout. What makes the layout interesting is not only the position of its visual elements, but the fact that each section of the page has its individual (although consistent) design. Still, the layout is very scannable and intuitive.  NOFRKS.design
NOFRKS uses JavaScript to slide between various parts of the site. What we found more interesting was the way the content is presented. Most elements are placed within a context, giving the content a secondary meaning.  SMS Parking
At the first glance SMSParking has no layout at all. The design appears to be one single illustration — all elements fit perfectly with each other, creating visual harmony and a sense of balance and closure. 
Matriz Communicacao
This Brazilian company delivers a perfect example of how design and content can seamlessly be integrated within a complete yet simple layout.  Mihmorandum
Mihmorandum uses a common 3-column-layout in an unusual way. Although the structure is quite usual, the design itself looks distinctive and resembles a pile of paper put inside a folder.  3rdM
3rdM uses icons to indicate various navigation options. This is not a type of layout you will find in many other web designs. And that’s what makes the layout creative.    
   
    Nile Inside
Many portfolios use vertical layout to showcase their works. Nile.ru displays its works in a chronological order as if it was a horizontal blog.  Rockatee
Rockatee uses asymmetry to position content blocks in an unusual yet appealing style. Notice that the left block perfectly aligns with the navigation option “Home” at the top of the page. The screenshot in the middle of the page spans exactly two navigation options and has the same width as the description block on the right side of the page. The distortion in the layout is caused by the underlying organic texture. Although the design is perfectly aligned according to the grid, it seems to be chaotic at first glance. The tension between order and chaos creates tension in the layout and looks very appealing.
 Get London Reading
An effective background image can help a layout stand out. The effect achieved here fits with the objective of the project — to encourage people to read more. 
BL:ND ( blind )
At the first glance, the layout looks underwhelming. What distinguishes it, though, are the choice of images sizes and a good use of white space. Notice how well negative space is used in the sidebar, where individual elements are clearly separated and properly aligned. The width of the images equals the width of the content blocks. Yes, the layout is boxy, but the wise use of whitespace makes it far from boring. 
URLshrinker
Creative design solutions can be as simple as this one. An elegant and attractive layout by URLshrinker. 
|
