Posts Tagged navigation

Website Navigation Usability 小貼士

Posted by Chowky in Design, Jquery, Mootools on December 26, 2009

每一個 website ，除了 visual 上要設計之外，navigation 上的設計其實更為重要。 試問user click來click 去都找不到自己想要的information。這種website 的user experience 一定不會好，即使visual 上做得好好，都只是一個外觀很好的website。

User 找不到想要的info，看完就算，對於你的目標，就是否這麼簡單呢？你可能會失到potential customers。

所以website navigation 上面一定要花心機去令website 更容易去browse.

這方面就應該要參考一下其他人的做法呢。

1. 簡潔的 Menu Navigation
這個例子當然會是apple 的design。直接的表達，就會避免混亂，而且可以令到visitors 更容易找到想要的資料

2. 加上主頁的link去自己的logo 上
現在很多不同的website 都已經是這樣做了，差不多是 standard 做法，最重要的是visitors 早已習慣。

Read the rest of this entry »

Share

, , , ,

No Comments

CSS navigation with 3 個不同的state (default, active, hover)

Posted by Chowky in Jquery, Mootools on September 10, 2009

這個navigation 令chowky 眼前一亮，真的很難明白為什麼一個developer 會有這麼高的design sense 呢~ 令人羨慕。

見到效果是否覺得不錯呢~。

最難得是簡單直接~~(當然這個東西不太適用於cms 的template design 上，他的做法不是dynamic 的~但得到的是design 上的空間)

HTML 方面都是利用ul (unordered list)

<ul id="topnav">
	<li class="home"><a href="index.htm">Home</a></li>
	<li class="about"><a href="about.htm">About Us</a></li>
	<li class="services"><a href="services.htm">Services</a></li>
	<li class="portfolio"><a href="portfolio.htm">Portfolio</a></li>
	<li class="contact"><a href="contact.htm">Contact</a></li>
	<li class="blog"><a href="blog.htm">Blog</a></li>
</ul>

Read the rest of this entry »

Share

, , , , ,

No Comments