Los banners adaptables son la próxima generación de anuncios responsivos, que optimizan el tamaño de los anuncios para cada dispositivo y maximizan el rendimiento. Si se mejoran los banners inteligentes, que solo podían admitir alturas fijas, los banners adaptables les permiten a los desarrolladores especificar el ancho del anuncio y usarlo para determinar el tamaño óptimo del anuncio.
Para elegir el mejor tamaño de anuncio, los banners adaptables usan relaciones de aspecto fijas en lugar de alturas fijas. Esto genera anuncios de banner que ocupan una parte más coherente de la pantalla en todos los dispositivos y proporcionan oportunidades para mejorar el rendimiento.
Cuando trabajes con banners adaptables, ten en cuenta que estos siempre mostrarán un tamaño constante para un dispositivo y un ancho determinados. Una vez que hayas probado tu diseño en un dispositivo determinado, podrás asegurarte de que el tamaño del anuncio no cambiará. Sin embargo, el tamaño de la creatividad del banner puede cambiar en los diferentes dispositivos. Por lo tanto, te recomendamos que te asegures de que tu diseño pueda adaptarse a las variaciones de altura del anuncio. En casos excepcionales, es posible que el tamaño completo no se complete y, en su lugar, se centrará una creatividad de tamaño estándar en este espacio.
Cuándo usar banners adaptables
Los banners adaptables están diseñados para reemplazar de forma directa a los banners estándar de la industria de 320 x 50, así como al formato de banner inteligente al que sustituyen.
Por lo general, estos tamaños de banner se usan como banners fijos, que suelen estar bloqueados en la parte superior o inferior de la pantalla. En el caso de los banners fijos, la relación de aspecto cuando se usan banners adaptables es similar a la de un anuncio estándar de 320 x 50, como se puede ver en estas capturas de pantalla:
Los banners adaptables aprovechan mejor el tamaño de la pantalla disponible. Además, en comparación con un banner inteligente, un banner adaptable es una mejor opción debido a las siguientes razones:
Usa un ancho proporcionado en lugar del ancho de pantalla completa, lo que te permite áreas seguras.
Selecciona una altura óptima para el dispositivo específico, en lugar de tener una altura constante en dispositivos de diferentes tamaños, lo que mitiga los efectos de la fragmentación.
Notas de la implementación
Cuando implementes banners adaptables en tu app, ten en cuenta lo siguiente:
- Debes conocer el ancho de la vista en la que se ubicará el anuncio y debe tener en cuenta el ancho del dispositivo y cualquieráreas seguras que se apliquen.
Asegúrate de que el fondo de la vista del anuncio sea opaco para satisfacer las políticas deAdMob cuando se publiquen tamaños de anuncios más pequeños que no ocupen el espacio publicitario.
Asegúrese de utilizar la versión más reciente del SDK de anuncios de Google para dispositivos móviles. Para la mediación, usa los adaptadores de mediación de la versión más reciente.
Los tamaños de banner adaptable están diseñados para funcionar mejor cuando se usa el ancho total disponible. En la mayoría de los casos, este será el ancho completo de la pantalla del dispositivo en uso. Asegúrate de tener en cuenta losáreas segurasaplicables.
El SDK de anuncios de Google para dispositivos móviles muestra una altura de anuncio optimizada para el ancho determinado en un
GADAdSize
.Existen tres métodos a fin de obtener un tamaño de anuncio para banners adaptables: uno para horizontal, uno para vertical y otro para la orientación actual en el momento de la ejecución. Para obtener más información, consulta la documentación completa de la API a continuación.
El tamaño que se muestra para un ancho determinado en un dispositivo determinado será siempre el mismo, por lo que una vez que hayas probado tu diseño en un dispositivo determinado, podrás estar seguro de que el tamaño del anuncio no cambiará.
La altura del banner fijo nunca supera el 15% de la altura del dispositivo y nunca menos de 50puntos.
Inicio rápido
Sigue los pasos que se indican a continuación para implementar un banner fijo adaptable.
Crea el objeto a
GADBannerView
y establece tu ID de bloque de anuncios.Obtenga un tamaño de anuncio de banner adaptable. El tamaño que obtengas se usará para solicitar tu banner adaptable. Para obtener el tamaño del anuncio adaptable, asegúrese de lo siguiente:
- Obtén el ancho del dispositivo en uso o configura tu propio ancho si no deseas usar el ancho completo de la pantalla.
- Usa los métodos estáticos apropiados en la clase de tamaño de anuncio, por ejemplo
GADCurrentOrientationAnchoredAdaptiveBannerAdSizeWithWidth(CGFloat width)
, a fin de obtener un objetoGADAdSize
para la orientación elegida. - Configura el tamaño del anuncio en la vista del anuncio de banner; para ello,configurando la propiedad
adSize
enGADBannerView
.
A continuación, se incluye un ejemplo completo.
Crea un objeto de solicitud de anuncio y carga tu banner con el método
loadRequest
en tu vista de anuncio preparada, tal como lo harías con una solicitud de banner normal.
Ejemplo de código
A continuación, se muestra un ejemplo de un controlador de vista que carga y vuelve a cargar un banner adaptable en cualquier versión de iOS teniendo en cuenta el área segura y la orientación de la vista:
Swift
class ViewController: UIViewController {
@IBOutlet weak var bannerView: GADBannerView!
override func viewDidLoad() {
super.viewDidLoad()
// Step 1 - Create a GADBannerView
(in code or interface builder) and set the
// ad unit ID on it.
bannerView.adUnitID = "ca-app-pub-3940256099942544/2435281174"
bannerView.rootViewController = self
}
override func viewDidAppear(_ animated: Bool) {
super.viewDidAppear(animated)
// Note loadBannerAd is called in viewDidAppear as this is the first time that
// the safe area is known. If safe area is not a concern (e.g., your app is
// locked in portrait mode), the banner can be loaded in viewWillAppear.
loadBannerAd()
}
override func viewWillTransition(to size: CGSize,
with coordinator: UIViewControllerTransitionCoordinator) {
super.viewWillTransition(to:size, with:coordinator)
coordinator.animate(alongsideTransition: { _ in
self.loadBannerAd()
})
}
func loadBannerAd() {
// Step 2 - Determine the view width to use for the ad width.
let frame = { () -> CGRect in
// Here safe area is taken into account, hence the view frame is used
// after the view has been laid out.
if #available(iOS 11.0, *) {
return view.frame.inset(by: view.safeAreaInsets)
} else {
return view.frame
}
}()
let viewWidth = frame.size.width
// Step 3 - Get Adaptive GADAdSize and set the ad view.
// Here the current interface orientation is used. If the ad is being preloaded
// for a future orientation change or different orientation, the function for the
// relevant orientation should be used.
bannerView.adSize = GADCurrentOrientationAnchoredAdaptiveBannerAdSizeWithWidth(viewWidth)
// Step 4 - Create an ad request and load the adaptive banner ad.
bannerView.load(GADRequest())
}
}
Objective‑C
@implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; // Step 1 - Create aGADBannerView
(in code or interface builder) and set the // ad unit ID on it. self.bannerView.adUnitID = @"ca-app-pub-3940256099942544/2435281174"; self.bannerView.rootViewController = self; } - (void)viewDidAppear:(BOOL)animated { [super viewDidAppear:animated]; // Note loadBannerAd is called in viewDidAppear as this is the first time that // the safe area is known. If safe area is not a concern (e.g., your app is // locked in portrait mode), the banner can be loaded in viewWillAppear. [self loadBannerAd]; } - (void)viewWillTransitionToSize:(CGSize)size withTransitionCoordinator:(id)coordinator { [super viewWillTransitionToSize:size withTransitionCoordinator:coordinator]; [coordinator animateAlongsideTransition:^(id _Nonnull context) { [self loadBannerAd]; } completion:nil]; } - (void)loadBannerAd { // Step 2 - Determine the view width to use for the ad width. CGRect frame = self.view.frame; // Here safe area is taken into account, hence the view frame is used after // the view has been laid out. if (@available(iOS 11.0, *)) { frame = UIEdgeInsetsInsetRect(self.view.frame, self.view.safeAreaInsets); } CGFloat viewWidth = frame.size.width; // Step 3 - Get Adaptive GADAdSize and set the ad view. // Here the current interface orientation is used. If the ad is being // preloaded for a future orientation change or different orientation, the // function for the relevant orientation should be used. self.bannerView.adSize = GADCurrentOrientationAnchoredAdaptiveBannerAdSizeWithWidth(viewWidth); // Step 4 - Create an ad request and load the adaptive banner ad. GADRequest *request = [GADRequest request]; [self.bannerView loadRequest:request]; } @end
Aquí, se usa la función GADCurrentOrientationAnchoredAdaptiveBannerAdSizeWithWidth(CGFloat width)
a fin de obtener el tamaño de un banner en una posición fija para la orientación de la interfaz actual. Para precargar un banner fijo en una orientación determinada, usa la función relevante de GADPortraitAnchoredAdaptiveBannerAdSizeWithWidth(CGFloat width)
y GADLandscapeAnchoredAdaptiveBannerAdSizeWithWidth(CGFloat width)
.
Ejemplo completo en GitHub
Swift | Objective‐C |