自我挑戰的第十一天，天天都覺得要斷更了OWO。

Day 11: 登入選單區塊

• 網頁右上角的登入選單區塊中，會用來放置個人檔案與帳號設定、登出功能、購物車等等的工具集。
• 大部分使用者已經習慣從右上角來找到他們需要的工具，因此請把這樣的工具集放在User所期待地方。
• 如果User沒有登入時，右上角的區域可以改成放置登入框。
• 盡量別讓登入選單區塊的空間太過繁雜，反而轉移了主要內容的焦點，其中有些項目可以用小icon來代替文字，例如購物車、設定、通知等等的文字。

另外，登入之後點擊右上角帳號圖片會跳出的登入選單裡可能會有：

• 登出用的按鈕
• 帳號設定
• 個人檔案設定
• 幫助與說明
• 購物車
• 通知或訊息
• 回首頁

這些項目會依照每個網頁的服務類型會稍微有所不同或增加。

像是我們常用的github，在登入之後，右上角的區塊除了帳號圖片之外，也還有通知與新增的小圖標，點擊照片會跳出登入選單。

而github在登入之前，右上角的區域是收納註冊和登入相關選項，這時的搜尋框也放在旁邊。

還有YouTube，在登入之後右上角放置的是帳號的圓型圖片，通知與新增影片的按鈕。

點開之後可以看到登入選單跳了出來，可以看到更多與該帳號與網站的內容相關的連結。

另外Yahoo也是把登入的按鈕放置在右上角的區塊中，另外還有天氣、信箱、通知的圖標。

綜上所述，因為User已經習慣在登入之前，在右上角找登入按鈕，並且在登入之後點擊帳號的圖片來瀏覽更多設定與內容，因此在開發網站時，建議把右上角的區塊，保留給登入/登出與登入選單做使用。

最後要補充的是，平常開發時～免費的icon都去哪裡找呢：

• Bootstrap的icon
• Google Font的icon