Size: 3743
Comment:
|
Size: 4192
Comment:
|
Deletions are marked like this. | Additions are marked like this. |
Line 21: | Line 21: |
Fixed in the viewport. Especially for multi-tier apps, where payment removes it. Rest of app scrolls but this is locked to the bottom of the viewport for reveal menus, where the menu overlaps it when open. Often at top for fixed menus or when closed reveal menus would interfere with display. | Docked, or fixed in the viewport. Especially for multi-tier apps, where payment removes it. Rest of app scrolls but this is locked to the bottom of the viewport for reveal menus, where the menu overlaps it when open. Often at top for fixed menus or when closed reveal menus would interfere with display. |
Line 25: | Line 25: |
Can click it. Should load so that it doesn't ruin the primary process. | Advertising should always be selectable, so the user may get more information or purchase the product. This link must load so it does not interfere with the existing process, by opening in a new browser window, or launching the application store. |
Line 27: | Line 27: |
Provide a way (when the business model works like this) to buy the app to remove ads, in context with the ad, such as text immediately adjacent to the ad. | For tiered services, which an ad is displayed for low-price or free access, a link should be provided immediately adjacent to the ad to allow the user to upgrade to the paid version, without advertising. |
Line 41: | Line 41: |
The ability to select the ad should be clear. Provide a link or button in the ad, whenever possible. If there is insufficient room, use the OS standard method to indicate a link (such as a border on the image). |
Problem
Ads are required... for business needs etc.
Solution
Many sites, applications, and even entire mobile services are ad sponsored. These ads must be neither hidden away, nor so prominent they damage the user experience. They are a key, necessary function of the product, and must be integrated correctly and well or the product will go out of business.
Must not be confused with the content.
Must be always the same place on every screen in the app/site/process.
that lots of products are ad supported; without doing this right, the app/site will go out of business.
Should be able to hide, cancel, skip without making the mistake of clicking the ad.
Variations
In context (with the content of the page, so it scrolls) usually at the top and bottom of a particular page.
Docked, or fixed in the viewport. Especially for multi-tier apps, where payment removes it. Rest of app scrolls but this is locked to the bottom of the viewport for reveal menus, where the menu overlaps it when open. Often at top for fixed menus or when closed reveal menus would interfere with display.
Interaction Details
Advertising should always be selectable, so the user may get more information or purchase the product. This link must load so it does not interfere with the existing process, by opening in a new browser window, or launching the application store.
For tiered services, which an ad is displayed for low-price or free access, a link should be provided immediately adjacent to the ad to allow the user to upgrade to the paid version, without advertising.
Presentation Details
Banners should always display in standard sizes. Ad providers can then use existing ad units, and do not need excessive productions details, as they can follow standards published elsewhere. In most cases, the sizes and other specifications published by the Mobile Marketing Association will work (See http://www.mmaglobal.com/mobileadvertising.pdf for details).
NON-FLOAT IMAGE
Only for very large devices, especially tablet-sized devices, will other sizes be used. These will often be provided by others (such as ad services) or the smaller common desktop sizes can be used instead.
The ad must be displayed in a manner that clearly differentiates is from the actual page content. There are three basic ways to accomplish this:
- Place the ad on a shaded, tinted or colored background. Usually, the background should extend the full width of the page.
- Separate the ad from the rest of the content with rules, which must run full width, or a closed box larger than the ad.
- If the ad is slightly smaller than the screen width (by using one size smaller than the suggested size for the screen) use different alignment than the content. If content is left aligned, right align or center the advertising.
The ability to select the ad should be clear. Provide a link or button in the ad, whenever possible. If there is insufficient room, use the OS standard method to indicate a link (such as a border on the image).
Antipatterns
Mobile is generally so task focused that failures in advertising, that make it too obvious or confuse it with the content, may cause immediate loss of customers... Don't do it badly!!!...
Make sure banners have sizes specified and accounted for in the page layout. Especially for web, it must not suddenly load well after the rest of the page, then push other content down...
Do not make ads too large, so the content is difficult to read. This is especially key for small screens using docked advertising space. If this could be a problem, then switch to the in-line style.
Avoid saying "advertising" -- should be able to communicate this with design. If not, fix the design, don't just waste space with labels...
Should almost never animate. Will distract from the rest of the experience. If absolutely required, do so very carefully...
Do not use custom sizes for any banners. Advertisers will not go to the effort of making new sizes, and all services require abiding by their guidelines, so your revenue base will be severely limited.