Đang tải... (xem toàn văn)
Advantages • Important interface elements are always in sight and available • Allows for independent scrolling of various content sections • Feels more like a desktop application • Lends itself to more natural AJAX integration
for Web Applications Steve Smith Hi, I’m http://sidebarcreative.com http://orderedlist.com @orderedlist Windowed Interface? What is a [...]... Notes about Consistency Be consistent in • Navigational treatments • Button styles and placement • Cursor treatments • Graphical elements across sections • Section width, height, and placement How to develop a Windowed Interface Start simple: Think in Groups #header #content #secondary #main HTML My Web Application Main Content... • Take only the space necessary for each element • The fewer items you need to show, the more breathing room you can give them, which increases usability • Maximize the clickable area on any visually small elements Prepare for Window Flexibility Think about Cursor Styles vs Arrow Cursor Pointer Cursor Fight!!! Suggestion: Use the arrow pointer everywhere except on standard text links Why alter the... HTML My Web Application Main Content Secondary Content Start to Position and Style Style the Header #header { height:60px; line-height:60px; width:100%; position:absolute; overflow:hidden; } Style the Content Area #content { position:absolute; top:60px; left:0; right:0; bottom:0;