You should take advantage of the two different application views:
Small
and Canvas.
Design each view uniquely. Keep in mind that each view has a variety of
states that can appear across the Yahoo! network in different contexts.
Use a lightweight Small View to entice the user into running the
application within the rich and interactive Canvas View. Don’t assume the
dimensions of the container, as they might change.
- Create a widget-like Small View and a rich, interactive Canvas
View. (Example: Addicted to Chappelle's
Show)
- Allow fluid dimensions for different sizes in different places
around Yahoo!. Use a width of 100% for your applications so that its
width adjusts if the window size changes. (Example: Flixter)
- Ensure that the fluid dimensions of your application enable it
to display properly within the smallest available container. Factor
in the width of a scrollbar, which is about 20 pixels wide, as well
as the fixed height of the window on the Yahoo! homepage
(www.yahoo.com). If your window extends below this fixed height, it
may not appear without scrolling.
- Don't create a Small View that merely duplicates the Canvas
View.
- Don't restrict an application to a fixed width (Example:
<div
style="width:478px;">...</div>).
- Don’t assume you know the size of the application container.
There is currently no method you can call to obtain the container's
dimensions. That said, please note the rough dimensions of the
Yahoo! homepage's Small View (400 pixels wide by 460 pixels high)
and Canvas View (750 pixels wide by 460 pixels high).