Google Web Designer-da banner yaratish va sozlash haqida malumot

1-qadam: Boshlang

Google Web Designer — bu veb-ustalar uchun bepul rivojlanish muhiti, bu veb-sahifalarni yaratish qobiliyatini, jumladan, bannerlar kabi alohida elementlarni, CSS3 va HTML5-dan foydalangan holda yaratadi. Ushbu vositadan foydalanish uchun, avvalo, rasmiy faylni o’rnatish faylini yuklab olishingiz va o’rnatishni amalga oshirishingiz kerak.

Google Web Designer-ni rasmiy veb-saytidan yuklab oling

Dasturni o’rnating

1. Dasturiy ta’minotning asosiy sahifasiga o’tish uchun yuqoridagi havolani bosing va bosing «Veb -dizaynerni yuklab oling». Iltimos, dastur faqat Windows 7 va undan keyingi versiyalariga mos kelishini unutmang.
2. Qalqib chiquvchi oyna orqali. «Saqlamoq». kompyuterda joyni tanlang va pastki panelda belgilangan tugmani ishlating.
3. O’zingiz saqlagan fayl bilan papkaga o’ting va sichqonchaning chap tugmachasini ikki marta bosib oching. Bu o’rnatish oynasini ochishi kerak.

   O’rnatish protsedurasining o’zi to’liq avtomatik rejimda amalga oshiriladi, katalogdagi barcha ishlaydigan fayllarni tizim diskidagi boshqa dasturlar bilan saqlaydi.

Ruxsat

1. Agar siz loyihalarni Internetda saqlamoqchi bo’lsangiz yoki umuman Google-ning ichki xizmatlari uchun maxsus banner yaratmoqchi bo’lsangiz, qo’shimcha avtorizatsiya qilishingiz kerak. Buning uchun dasturni tegishli belgi bilan boshlang, xush kelibsiz oynasini yoping va ustiga bosing «Kirish». yuqori satrda.
2. Google hisob qaydnomangiz ma’lumotlarini kiriting, tugmasini bosing «Keyingi». va kerak bo’lganda tasdiqlashni to’ldiring. Hisob boshqa konfiguratsiyaga ehtiyoj sezmasdan darhol qo’shiladi.

Sozlamalarni o’zgartiring

1. Tayyorgarlik hal qilingandan so’ng, kelajakda ishni engillashtirish uchun dasturiy ta’minotning asosiy parametrlariga o’zgartirish kiritish maqsadga muvofiqdir. Yuqori panel orqali menyuni kengaytiring «Tahrirlash». va bo’limni tanlang «Sozlamalar». ro’yxatning oxirida.
2. Yorliqda. «Asosiy» Loyihalarni tezda ochish uchun dasturning boshlang’ich xatti-harakatlarini o’zgartirishingiz, yaratilgan andozalarni saqlash uchun papkani tayinlashingiz va u yaratilganida variant variant uchun standart qiymatlarni o’rnatishingiz mumkin.
3. Keyingi sahifa. «Dizaynni ko’rish rejimi» Tahrirlovchining tashqi ko’rinish parametrlarini o’z ichiga oladi. Taqdim etilgan sozlamalarni o’zgartirib, elementlarning aniqroq joylashuvi uchun panjara va ob’ektni suratga olishni sozlashingiz mumkin.
4. Google Web Designer-da o’z sozlamalariga ega kod muharriri mavjud. Masalan, yorliqda «Kodni ko’rish rejimi». Siz tartib uslubini tayinlashingiz, formatlash parametrlarini o’rnatishingiz va vazifalarga kalit birikmalar qo’shishingiz mumkin.
5. Oxirgi yorliq. «Murakkab». faqat ikkita parametrni o’z ichiga oladi — «Yozuv». и «Qo’llash ko’lami».. Birinchi holda, uni faollashtirish o’zgarishlar jurnalini yaratadi, ikkinchi element esa muharrirning ish maydoni uchun yangi standart o’lchovni o’rnatishga imkon beradi.
   

   Ehtiyot bo’ling! Agar siz o’lchovni juda katta qilib qo’ysangiz, muhim elementlar uchun ekran maydoni etarli emasligi bilan bog’liq muammolar bo’lishi mumkin.

Siz kiritgan har qanday o’zgarishlar dasturni u yoki bu tarzda qayta ishga tushirishni talab qiladi. Agar siz muharrir bilan ishlashni endi boshlasangiz, sozlamalarni har bir yorliqda alohida element orqali tiklash imkoniyatini unutmang.

2-qadam: Banner yarating

Dasturni sozlashdan so’ng, siz Google Web Designer-ning barcha funktsiyalaridan foydalangan holda bannerda ishlashni boshlashingiz mumkin. Shunga qaramay, ushbu vosita faqat vizual muharrir vazifasini bajarishini unutmang, bu sizga faqat alohida yaratilgan elementlarni joylashtirishga imkon beradi, masalan, Photoshop-da.

Shuningdek o’qing: Adobe Photoshop-da banner yaratish

Dizayn tayyorlash

1. Yangi loyiha yaratish uchun havoladan foydalaning «Fayl yaratish». boshlash oynasida. Faylni qayta ochish uchun elementdan foydalanishingiz mumkin «Yaratmoq». menyuda «Fayl»..
2. Blokda. «Reklama». tanlang «Bayroq». va asosiy maydonni to’ldiring «Ism».u holda loyihani saqlash mumkin emas. Shuningdek, siz loyihani tayyorlash uchun joyni belgilashingiz mumkin.
3. Ochiladigan ro’yxatdan foydalaning «Kontekst». bannerning kelajakdagi qo’llanilishiga qarab variantlardan birini o’rnating. Ruxsatning o’zi menyu orqali o’zgartirilishi mumkin «O’lchamlari»..

   Agar kerak bo’lsa, tartib o’lchamlari mustaqil ravishda sozlanishi mumkin. Buning uchun parametrni o’rnating «Shaxsiylashtirilgan». va kerakli rezolyutsiyani ko’rsating.

   Qutini belgilash. «Moslashuvchanlik».Hajmi haqida tashvishlanishingiz shart emas, chunki sayt saytga qo’shilgandan so’ng reklama asosiy blokka qarab cho’zilib ketadi.

4. Moslashtirish parametrlarini boshqa yorliqni tanlash orqali kengaytirish mumkin «Kengaytiriladigan». O «Interstitsial».. Ushbu variantlarni ko’rib chiqmaymiz, chunki namunaviy loyiha misol sifatida etarli.

   Shuni alohida ta’kidlab o’tamiz «AMPHTML banner» reklamaingizni mobil qurilmalarga moslashtirmoqchi bo’lsangiz, foydalanish kerak. Bu sizning reklamalaringizni yuklashni tezlashtiradi, lekin ba’zi muharrir xususiyatlarini bloklaydi.

Asboblar bilan ishlash

1. Maketni tayyorlaganingizdan so’ng, asboblar bilan tanishishingiz kerak. Yuqori panelda asboblar ro’yxati e’tiborga loyiqdir «Ko’rinish»., bu yordamchi elementlarni faollashtirish va o’chirishga imkon beradi.
2. Menyu orqali «Deraza». ma’lum bir interfeys elementini vaqtincha o’chirib qo’yishingiz mumkin. Masalan, agar siz statik banner qilishni xohlasangiz, «Vaqt chizig’i». Bu faqat xalaqit beradi, shuning uchun uni olib tashlaganingiz ma’qul.
3. Asosiy muharrir vositalari chap ustunda keltirilgan. Biz har qanday variantni ko’rib chiqmaymiz, chunki yaratilish paytida har qanday buyum ishlatilmaydi, lekin o’zingiz tajriba qilish tavsiya etiladi.
4. Asboblar paneli yonida keltirilgan «Tekshiruvchi e’lonlari». Turli xil hissalar bilan. Shuni ta’kidlash kerak «Voqealar».u yoki bu bayroq ob’ekti bilan harakatlar uchun javobgar va «CSS»bu erda uslub parametrlari o’rnatiladi.
5. Shuningdek, dasturning o’ng qismida rangni, matnni, ob’ektlarning tuzilishini, xususiyatlarini va oddiygina qatlamlarni boshqarishga imkon beradigan vositalar to’plami mavjud. Asosiy funktsiyalar to’plamidan tashqari, loyihani yaratishda derazalarni o’zingiz o’rganishingiz yaxshiroqdir.
6. Bilan kerak bo’lganda «Vaqt chizig’i». animatsion banner yaratishingiz mumkin. Shu nuqtada muharrirning asosiy maydonini, shuningdek masshtab parametrlariga ega blokni boshqarish uchun bo’sh joy satrini va LKM-ni ishlating.

Dizaynni to’ldiring

1. Banner yaratish har doim fon bilan boshlanadi, shuning uchun maketni tayyorlagandan so’ng, yorliqni oching «Xususiyatlar». va blokda «Sahifa». kichik bo’limdan foydalaning «To’kish».. Bu erda har qanday rangni, shu jumladan gradientni yoki to’liq shaffof fonni o’rnatish juda mumkin.
2. Keyinchalik, ustunlik tartibida oldindan tayyorlangan grafik elementlarni qo’shishingiz kerak. Buni yorliqda qilish mumkin «Ob’ektlar kutubxonasi» yorlig’i.belgini bosish orqali «+» pastki panelda.
3. Kerakli grafik fayllarni tanlang va bosing «Ochadi».. Siz buni barcha kerakli qatlamlar uchun birdan yoki alohida bajarishingiz mumkin, yuqoridagi amallarni takrorlang.
4. Joylashtirishni amalga oshirish uchun yorliqdagi kerakli rasmni bosing «Ob’ektlar kutubxonasi» yorlig’i. va asosiy muharrir maydoniga sudrab olib boring.

   Tanlash vositasi faol bo’lganida odatdagidek tortish va masshtablash orqali ob’ektning joylashishini boshqarishingiz mumkin. Qo’llanmalar har doim kerak bo’lganda ishlatilishi mumkin.

5. Ish joyida yoki yorliqda grafik faylni tanlash «Struktura muharriri» yorlig’i.Ochish «Xususiyatlar».. Bu erda fonga qaraganda ko’proq imkoniyatlar mavjud, masalan, chegara yoki chuqurlik sozlamalari.
6. Agar sizning banner dizayni matnni o’z ichiga olsa, siz mos keladigan elementni standart Google Web Designer vositasi yordamida qo’shishingiz mumkin. Belgini bosing «T» Chap panelda muharrirning asosiy oynasini bosing va kerakli belgilar to’plamini kiriting.

   Matnni boshqarish uchun yorliqdagi qatlamni tanlang «Struktura muharriri» yorlig’i., kattalashtiring «Matn». va tegishli parametrlarni o’rnating.

Animatsiyani sozlash

1. Blokda. «Vaqt chizig’i». animatsiya effektlarini qo’shishingiz va sozlashingiz mumkin. Boshlash uchun tugmani bosing «Belgini qo’shish». belgisi bilan «+».
2. Belgini bosing «.5s» ramkalar orasidagi masofani bosib, kerakli sozlamalarni o’rnating. Masalan, siz o’tish muddati va uslubini o’zgartirishingiz mumkin.
3. Barcha bloklar «Vaqt chizig’i». u boshqalardan butunlay mustaqildir. Animatsiyalar yaratish uchun ba’zi elementlarni o’zingizning xohishingizga o’zgartiring va natijani ijro etish tugmasi bilan tekshiring.

   Tahrirlash jarayonini tugatgandan so’ng tugmachadan foydalaning «Takrorlash».. Bu cheksiz animatsiya yaratadi.

Voqealar qo’shish

1. Maketni ishlab chiqqandan so’ng, alohida elementlar yoki butun bayroq uchun o’tish hodisalarini qo’shishingiz kerak. Buning uchun ustunda Reklama inspektori. yorliqni oching «Voqealar» va belgini bosing «+» pastki panelda.
2. Ro’yxatni ochadigan oynada «Maqsad». mos yozuvlar vazifasini bajaradigan ob’ektni tanlang.
3. Sahifada. «Voqea». Kengaytirish «Sichqoncha». va tanlang «bosing».. Natija talablariga qarab, turli xil sozlamalar birlashtirilishi mumkin.
4. Ro’yxat pastga. «Harakat». Ochish «Google reklamalari». va qiymatini belgilang «O’tish».. Ushbu tanlov foydalanuvchiga siz tanlagan ma’lum bir veb-sahifaga o’tishga imkon beradi.
5. Nima. «Qabul qiluvchi». taqdim etilgan bitta variantni tanlang «Gwd-ad».
6. Daladagi so’nggi bosqichda. «Ko’rsatkich identifikatori». yorliq va to’ldirish uchun havola «URL»kerakli sahifani belgilash. Saqlash uchun foydalaning «QABUL QILAMAN»..

Manba kodi bilan ishlash

1. Yuqorida aytib o’tganimizdek, Google Web Designer-da o’rnatilgan kod muharriri mavjud. Siz uni tugma bilan yoqishingiz mumkin «Kod». yuqori panelning o’ng tomonida.
2. Siz nafaqat ingl. Tahrirlovchisini, balki to’g’ridan-to’g’ri loyiha faylidagi kod bilan ishlashni ham ishlatib, banner tuzilmasiga o’zgartirish kiritishingiz mumkin. Ko’pgina kichik elementlar hizalanganda yoki dastur tomonidan kutilmagan hodisalar qo’shilsa, bu juda foydali bo’lishi mumkin.

Ta’riflangan harakatlar, dasturdan qat’i nazar, banner yaratish uchun etarli bo’lishi kerak. Biroq, siz ushbu vositalarni birlashtirib, imkoniyatlarni ancha kengaytira olasiz.

3-qadam: ishni tugating

Banner tugagandan so’ng va veb-saytga joylashtirishga tayyor bo’lgach, siz oxirgi bosqichga o’tishingiz mumkin. Birinchi narsa — bu sizning ishingiz haqiqiy veb-sahifada qanday ko’rinishini tekshirish.

Ko’rib chiqish

1. Yuqori panelda tugmani bosing. «Ko’rib chiqish».qo’shimcha menyu ochish uchun. Bu erda bannerni ochishda foydalaniladigan brauzerni belgilashingiz mumkin.
2. Ochilganda bannerning barcha funktsiyalari va ko’rinishi saqlanib qoladi, ammo bir nechta g’alati narsalar bilan. Masalan, animatsiyani cheksiz takrorlash uchun o’rnatgan bo’lsangiz ham, bu erda hamma bitta takrorlash bilan cheklangan.
3. Agar sizga kerak bo’lsa, natijani har doim boshqalarga namoyish qilishingiz mumkin. Buning uchun tanlang «Umumiy havolani oling». va dasturning Google hisobingizga kirishini tasdiqlang.

   Bunda yuqoridagi kabi bannerni ushbu rejimda ko’rish uchun havola ko’rsatiladi. Albatta, bu sizning hisob qaydnomangiz bo’lsagina mumkin.

Saqlang va nashr qiling

1. Loyihani saqlashni amalga oshirish uchun avval fayl menyusini oching va ushbu parametrdan foydalaning «Saqlamoq».. Asl fayl kompyuteringizda saqlanadi va keyinroq ochilishi mumkin.
2. Saytda nashr etish uchun loyihani tayyorlash uchun menyuni oching «Xabar berish uchun». dasturning yuqori o’ng burchagida va saqlash joylaridan birini tanlang.
3. Nashr oynasi sozlamalarini o’zingizning xohishingizga ko’ra o’zgartiring, faqat kerakli qutilarni qoldiring va bosing «Xabar berish uchun».. Ushbu usulni tejash loyihaning hajmidan qat’iy nazar tezkor bo’ladi.

   Olingan papka saqlanadigan joyda. Saytdagi bannerning joylashishi saytga qarab farq qiladi va umuman yaratish tartibiga umuman ahamiyat bermaydi.

Ushbu maqola sizga yordam berdimi?