Friday, March 29, 2013

Зареждане на различни по размер банери в сайт с адаптивен (отзивчив/responsive) дизайн

Още един начин да зареждате различен по размер банери на сайта ви в зависимост от резолюцията на посетителя. Проблемът ми беше, че когато отворя сайта от мобилен телефон, всичко е ок с изключение на банера 468x60, който се виждаше на около 60%. Част от банера не се визуализираше поради малката резолюция на телефона 320x480 (468>320 :) ). Така се наложи да потърся опция сайта да зарежда различни по размер банери според резолюцията на устройството което използва потребителя. PHP скрипта ползва javascript за определяне резолюцията на потребителя, и в зависимост от нея определяте кой от трите размера банери да се зареди. 234x60 ,468x60 и 728x90 , но вие можете да ги смените естествено. Аз използвам скрипта за зареждане на iframe банери от сайта insert.bg , който съм показал в примера по долу.



Отдолу още един вариант с 4 размера реклами:

Thursday, March 28, 2013

Google реклами за сайтове с адаптивен (отзивчив) дизайн

Здравейте. В този пост иде реч за притежателите на сайтове с адаптивен (отзивчив/responsive) дизайн, които са разположили на тях реклами от Гугъл (Google Adsense). Сигурно не съм единственият, който се е сблъскал с този проблем. Търсих в интернет различни варианти за да направя така, че размера на рекламите от Google да се променя както и самият дизайн на сайта. Попаднах на тази много полезна статия, която на мен ми свърши идеалната за случая работа. На кратко за самия код и идеята на автора му: Идеята е много елементарна, но върши добра работа :) Практически вие създавате няколко размера реклами (в моя случай 768×90, 468×60 и 234×60) и в зависимост от резолюцията на устройството на потребителя се зарежда подходящият размер реклама. Не забравяйте да замените google_ad_client и google_ad_slot във кода със вашите! Добрата новина е,че Google Adsense Екипа официално е одобрил тази техника за адаптивна /responsive/ реклама! Можете да видите кода за рекламата в действие и да го тествате на различни устройства на сайта за въпроси и отговори тук. Ето и една интересна статистика на Топ 14 на резолюциите на мобилни устройства в България за последната година.

Source: StatCounter Global Stats - Mobile Screen Resolution Market Share