Kako postaviti pametne telefone i računala. Informativni portal
  • Dom
  • vijesti
  • Kako umetnuti reklamni banner u kontakt. Veličine bannera za promotivne postove na VKontakteu

Kako umetnuti reklamni banner u kontakt. Veličine bannera za promotivne postove na VKontakteu

Avatar i banner za vk grupu.

Sada je postalo važno prilikom kreiranja grupe na društvenoj mreži lijepo dizajnirati, pogotovo ako je grupa stvorena za poslovanje, prodaju robe ili usluge. Vrlo je važno da dizajn bude ugodan oku i da se vaša grupa izdvaja od konkurencije. Dobar dizajn povećava postotak novih članova i potencijalnih kupaca koji se pridružuju vašoj grupi.

Vrlo često, gotovo uvijek to rade tako da s bannera na vrhu stranice možete doći do izbornika. I često se od njih traži da slika s avatara ide u banner.

To ćemo sada učiniti. Kako bi sve bilo lijepo i ne iskrivljeno, odredit ćemo veličinu. Ova slika ih savršeno demonstrira, uzimajući u obzir da na vrhu imamo status ne duži od jednog retka, ako statusa nema, u nekim preglednicima postoji kosina, slika neće prelaziti glatko.


Udaljenost između bannera i avatara je 10 piksela. Ako želite više informacija postaviti iznad bannera, savjetujem vam da koristite mySize ravnalo i izmjerite sve, otprilike ovako.

Ovdje, na primjer, udaljenost nije 50 piksela kao što je naznačeno na prethodnoj slici, već 206. Sve će se to uzeti u obzir prilikom crtanja vodiča u Photoshopu.

Dakle, krenimo: Otvorite Photoshop -> Datoteka -> Novo ili Ctrl + N.
Otvara se prozor, napišemo ime i veličinu, ali zašto sam uzeo 2420 do 2000. Upravo sam povećao naše veličine 4 puta, po mom mišljenju, izgleda bolje u VK.

Sada nacrtajte vodilice. Ako nema ravnala oko rubova, uključite ih: Pogled -> Ravnala ili Ctrl + R. Vodilice se mogu izvući iz njih, uzimajući u obzir da pokazuju piksele, za to desnom tipkom miša kliknemo na ravnalo i odabiremo piksele ako postoji nešto drugo.

Postoji još jedan način postavljanja vodiča: Pogled -> Novi vodič. Otvara se prozor, prvo birate koji vodič vam je potreban, vodoravni ili okomiti, a zatim gdje ćete ga staviti.

Postavite sljedeće horizontalne vodilice: 0, 2000 (ekstremno), 200, 1360 piksela; okomito: 0, 2420 (ekstremno), 1580, 1620 piksela. I imamo prazninu za naš avatar i banner.

U gornjem desnom kutu postavio sam zaokruživanje na 30 piksela, možete staviti bilo koji želite. Odaberimo drugu boju osim bijele, ja ću imati plavu i nacrtati naš avatar i banner duž vodilica.

Sada pokupimo sliku, imam grupu na teme dizajna, neka slika bude ovakva.

Povucimo ga u naš dokument.

Sada kopirajte i premjestite jedan sloj na sloj iznad ava.

Uzmite Rectangle Tool i nacrtajte dva pravokutnika na vrhu i dnu baze. Na vrh ćemo smjestiti naziv grupe, na dno - poziv na akciju.

Isto ćemo napraviti s pravokutnicima, pa ćemo ih sa slikama zalijepiti na ave. I prefarbat ćemo u boju koja nam se sviđa. Ja imam plavu.

Pozivu na akciju nedostaju gumbi i strelice. A za naslov, napravimo podcrt.

Nacrtajte strelice bijelim linijama ili ih preuzmite s interneta i zalijepite. Za gumb ponovno uzmite pravokutnik sa zaobljenim kutovima. Radimo sve na sloju ispod naše etikete! Uklonite popunjavanje na 0.

Otvorite stil sloja i idite na potez, neka bude oko 4px bijelim. Tu opet po vlastitom nahođenju.

Ispod imena nacrtajte dvije ravne crte. Bojimo ih bojama: jedna - malo tamnija od glavne, druga - malo svjetlija.

Imam neke natpise u svojoj ideji na slici, pa je moram manje istaknuti. Stavimo na njega homogenu prozirnu pozadinu. Dugo sam se igrao bojama i metodama blendanja i došao do sljedećeg rezultata. Bež pozadina - 80% neprozirnost, način miješanja - Multiply.

Sad mi se čini da nema dovoljno okvira oko rubova, napravim kopiju ave, smanjim je i napravim iste radnje kao za gumb, maknem ispunu i napravim potez. Isto radim i sa bannerom.

Sada možete instalirati u grupu. Za avku samo kliknite na upload nove fotografije i upload. Za transparent. Stavljamo link na izbornik, brišemo ga kada se poveznica pojavi na dnu kao na snimci zaslona i kliknemo za prijenos fotografije. Pritiskamo za slanje i budite sigurni da ste u ime grupe. Zatim pritisnemo vrijeme polaska i pojavimo se ispod gumba za objavu: uredi, izbriši, popravi. Pritisnemo - da popravimo.

I ovdje je naš gotov dizajn.

Nadam se da sam više-manje jasno objasnio, ako imate pitanja, rado ću odgovoriti na njih i pokušati vam pomoći da to shvatite. Sa zahvalnošću ću prihvatiti i utemeljenu kritiku, budući da sve to tek učim i nema iskustva koliko bih želio.

p.s. Bonus - avatar i banner + font, što smo i učinili u članku. Promijenite tekst, boje i sliku i dobijete cool gotov dizajn.

Nedavno su stručnjaci za zatvorene razgovore, početnici koji ciljaju stručnjake, smmschiki, kao i poduzetnici koji se okušaju u sebi v promo objave, vrlo često postavljaju pitanje „koja je veličina potrebna za promotivni post? ". Zato sam na primjerima odlučio detaljno opisati kakav bi format trebao biti banner za promo post tako da bude lijepo i što veće prikazano na računalima, mobitelima i tabletima. Pa idemo 🙂

Za ilustrativan primjer, usporedit ću dva bannera dimenzija 1280 * 720 i 800 * 525. Usput, veličina i kvaliteta bannera mogu biti različiti - ovdje su najvažnije proporcije. Dakle, ovako izgleda takav banner u feedu vijesti na različitim uređajima:

PC - STARI DIZAJN VKONTAKTE



Kao što vidite, banner veličine 800 * 525 ima mnogo veću marginu s desne strane nego kada koristite veličinu od 1280 * 720. Međutim, širi je i zauzima veće područje za gledanje kroz feed vijesti. Pogledajmo kako će ovi banneri izgledati u novom dizajnu VKontaktea.

PC - NOVI DIZAJN VKONTAKTE


Pa, u novom dizajnu VKontaktea, obje ove veličine razlikuju se samo po visini, ali širina ostaje ista. I, za razliku od stare verzije VK-a, ne vidimo veliku uvlaku s desne strane. Ali banner 800 * 525 hvata puno veće vidljivo područje u feedu vijesti od veličine 1280 * 720 - slika je sve veća i veća!

Sada da vidimo kako će ovi banneri izgledati u mobilnoj verziji aplikacije VKontakte na iOS-u.

MOBILNI - NEWSLINE


Također, kao i u novom dizajnu VKontaktea, banner veličine 800 * 525 izgleda mnogo veći (više) od bannera veličine 1280 * 720. A to je vrlo veliki plus za mobilnu verziju, jer je područje za gledanje vijesti malo i oglasi s ovom veličinom bannera će uhvatiti većinu toga!

Pa, sada da vidimo kako će kvadratna slika izgledati u feedu vijesti! Radi jasnoće, napravit ću tablicu.

PC - stari VKontakte dizajnPC - novi dizajn VKontakteaMobitel - aplikacija VKontakte







Pa, sada smo jasno vidjeli da slike veličine 800 * 525 i više dobivaju veći prikaz, približavajući se kvadratnom obliku. Ali! ne zaboravite da u promo postovima postoji i tekst, pa kada odaberete veličinu slike ne zaboravite da za pregled teksta na raznim uređajima slika ne smije zauzimati sav vidljivi prostor u news feedu! To je važno!

Budući da sada dio publike "sjedi" na VKontakte kroz novi dizajn, a većina kroz stari, bolje je koristiti veličinu 800 * 525. Da, pokušavali smo i gnjavili se s drugim veličinama, pokušavajući smanjiti uvlačenje s desnog ruba, ali se samo povećavalo i najmanja uvlaka (uzimajući u obzir više gledanja putem mobitela) ispala je 800 * 525.

Eto, to je sve za danas. Hvala na pažnji i kvalitetnim promocijama! 😉

Hvala na pažnji!

U ljeto 2016. programeri društvene mreže Vkontakte konačno su iznenadili svoje korisnike potpuno ažuriranim dizajnom. Iskreno govoreći, redoviti posjetitelji ove stranice novi su dizajn doživjeli vrlo dvosmisleno, u većoj mjeri se odnosio na vlasnike zajednica sa spojenom slikom kao dizajnom (avatar + banner). Udaljenost između prikačene vijesti i avatara doslovno se udvostručila, banner se osjetno povećao i potonuo niže, a minijatura zajednice sada nije četvrtasta, već okrugla površina - svi ti neugodni trenuci stvarali su mnogo problema ljudima koji su naručivali i ranije instalirali dizajne za svoje grupe. Jedini izlaz u ovoj situaciji bila je prerada starog dizajna kako bi se zadovoljili novi zahtjevi uz zadržavanje koncepta.

Iako se dizajn Vkontakte zajednica čini prilično problematičnim poslom (osobito u usporedbi s drugim društvenim mrežama, gdje su u osnovi dovoljni pravokutni omot i kvadratni avatar), to zapravo nije sasvim točno. Zatim će biti opisani zahtjevi za grafičkim slikama i općenito načini uređenja grupe kao takve.

Prvi način da svoju zajednicu učinite prodajnom i privlačnom je pomoću standardne sheme avatara + bannera + izbornika.

Avatar

Avatar je ostao u veličini 200 x 500 piksela (ali i dalje bolji od 400 x 1000 s marginom kvalitete), iako je u početku tijekom beta testiranja novog dizajna razmatrana varijanta veličine 200 x 300. Minijatura je sada okrugla, ali ako je ovaj krug upisan u kvadrat, tada će njegove dimenzije biti 200 x 200 piksela, kao što je bilo prije.

Banner (zakačena objava)

Optimalna veličina bannera je 1024 x 680 piksela (s marginom kvalitete). Vidio sam mnoge varijacije idealne veličine bannera na internetu, ali ipak, pri 1024 x 680, dijelovi bannera nisu odrezani kada se gledaju s računala, s obične mobilne verzije ili iz Android aplikacije. Također je vrijedno napomenuti da se banner sada nalazi ispod zbog duplikata naziva zajednice u području iznad slike, a datum objave pomaknut je s područja ispod slike na mjesto pod duplikatnim imenom. Još jedna važna točka je nedostatak klikabilnosti na banner s mobilnog uređaja. Oni. s telefona ljudi će morati kliknuti na link ispod slike, a ne na samu sliku.

izbornik

Što se tiče dizajna izbornika i wiki oznake, općenito se ništa nije promijenilo. Kao i prije, koristim širinu izbornika od 606 piksela i bilo koju duljinu. Za prilagodljivost na mobilnim uređajima, bolje je postaviti navigaciju unutar tablice - na ovaj način, kada se gleda na telefonu, jednostavno se proporcionalno smanjuje kako bi stajala na zaslonu. Ali ako ste kreirali navigaciju u kojoj su stavke jednostavno smještene jedna ispod druge, onda to ne morate učiniti - metoda s tablicom potrebna je samo za one vrste izbornika gdje je broj gumba u nizu više od jednog . Općenito, za praktičnost korisnika, bolje je ne napraviti izbornik samo u obliku poveznica na materijale, već izraditi wiki stranice sa složenom strukturom.

Ako vam je potrebna jedna slika za dekoraciju, onda prvo popunite avatar i banner u obliku fiksne vijesti u neku grupu za eksperimente. Prepišite sve podatke iz uzorka zajednice u svoju grupu: status, ime (ovo je važno, jer se ti podaci dupliciraju u vijestima) i zatražite od klijenta tekst koji će biti iznad bannera.
Nakon toga već možete uzeti uzorak pomoću snimke zaslona, ​​koja se mora postaviti u Photoshop.

Postoji i takva metoda dizajna kao što je "poklopac + banner + izbornik". Općenito, možete ostaviti samo omot i staviti sve najvažnije informacije na njega. Ali u svakom slučaju, avatar mora biti postavljen: neće biti vidljiv u samoj grupi, ali će minijatura zajednice biti preuzeta iz nje. Optimalna veličina omota je 1590 x 400 piksela, a sliku možete prenijeti pomoću naredbe Upravljanje zajednicom - Naslovnica zajednice: Upload.

Veličine slika za VKontakte dizajn

  • Avatar: 200 x 500 piksela (kvaliteta 400 x 1000 piksela);
  • Sličica avatara 200 x 200px
  • Banner ili veličina prikvačenog posta u grupi: 1024 x 680 piksela, ali ne manje od 510 px u širinu;
  • Izbornik: širina 606px;
  • Pokrijte 1590 x 400 piksela.
25.07.15. 71,2K

Broj aktivnih korisnika i obožavatelja društvenih mreža teži 100% od ukupnog broja korisnika World Wide Weba. Istodobno, društvena mreža VKontakte stabilno zauzima vodeće pozicije u Runetu. Osim toga, smatra se najmasovnijim - više od 150 milijuna registriranih korisnika, a to ne uključuje botove, napuštene i lažne račune.

Ova činjenica nije mogla ne poslužiti u reklamnoj cjelini. Danas VKontakte nudi najprikladnije oglašavanje, kako za obične korisnike, tako i za reklamne agencije. Istodobno, banneri VKontaktea su najpopularniji. Korisnici ih učinkovito koriste za razvoj poslovanja i informiranje o događajima u grupama u zajednici:

1. Banneri na VKontakteu

Banner VKontakte je statična ili animirana slika s potpisom i sloganom, koji je ujedno i poveznica, klikom na koju možete otići na stranicu s detaljnijim informacijama o proizvodu, usluzi, događaju. Ova akcija se zove " kliknite na banner».

Oglašavanje na društvenoj mreži VKontakte predstavljeno je s dva bannera na lijevom rubu. Međutim, dobit od njih može premašiti i najluđa očekivanja. Zanimljivo je da možete postaviti ne samo reklamne bannere VKontakte dizajnirane za prodaju proizvoda / usluge, već i one koji će biti od interesa za obične korisnike.

Ovaj hibrid profesionalnog i prilagođenog oglašavanja može ubiti dvije muhe jednim udarcem. Zahvaljujući tome, uprava vodeće ruske društvene mreže gotovo je udvostručila ciljanu publiku oglašivača:

Vrste oglašavanja na VKontakteu

Konvencionalno, oglašavanje VKontakte podijeljeno je u dvije vrste ( načinom plaćanja). Može se nazvati ciljanim i neciljanim. Ako kod ciljanog oglašavanja plaćate klikove na banner, onda kod neciljanog oglašavanja plaćate impresije. Pritom je 1000 pojavljivanja puno jeftinije od 1 prijelaza. Što god netko rekao, ali od 1000 dojmova, subjekt će najvjerojatnije napraviti barem 1 prijelaz. Stoga se ispostavlja da je druga opcija isplativija.

  • Slika. Tematska slika koja karakterizira vaš proizvod/uslugu, stranicu na društvenoj mreži itd.;
  • Ime. To može biti glasan slogan, naziv tvrtke;
  • Potpis. Kratki unos ili jedinstvena prodajna ponuda ( ako veličina bannera dopušta da stane).

Pravila postavljanja VK oglasa

2. Zašto su nam potrebni banneri VKontakte?

Osim širokog dosega publike i velike popularnosti, banner oglašavanje VKontakte ima jednu vrlo važnu prednost - mogućnost preciznog ciljanja. Gotovo 90% uspjeha reklamne kampanje ovisi o ispravnosti njezinih postavki. Uostalom, vas ne zanimaju svi sudionici VKontaktea, već samo određeni dio njih.

Postavke VK-a omogućit će vam da samostalno odredite kojem dijelu publike će se prikazati vaš banner. Postoji ciljanje prema dobi, zemljopisnom području, spolu itd.

Ispravnim postavljanjem ciljanja isključit ćete nepotrebna pojavljivanja, čime ćete optimizirati proračun za reklamnu kampanju.

Kao i kod drugih platformi za oglašavanje, važno je razumjeti što je točno vrijedno promovirati putem VKontaktea. Glavna svrha posjeta društvenoj mreži je komunikacija i zabava. Iz ovoga možemo zaključiti da je najbolje reklamirati robu široke potrošnje, a oglašavanje provedeno u svrhu generiranja potencijalnih kupaca također može dati dobar rezultat. Gotovo svaki visokospecijalizirani oglas na VKontakteu osuđen je na propast.

Prije umetanja bannera provjerite ima li oglašeni proizvod/brend zajednicu, grupu obožavatelja ili javnost. Njihova prisutnost uvelike će povećati šanse da vaša oglasna kampanja bude uspješna.

Također, obratite pozornost na cjenovnu kategoriju. Nema smisla promovirati proizvode na društvenim mrežama koji koštaju više od 200 dolara:

3. Kako postaviti banner na VKontakte? Cheat sheet za početnike, tajne i savjeti

Prije dodavanja bannera, slijedite vezu "Oglašavanje" u podnožju stranice:


Zatim kliknite na " Ciljani oglasi"I prijeđite na sljedeću stranicu:


Kliknite na " Napravite oglas"I vidimo sljedeći popis:


Ovdje morate odabrati što ćete točno oglašavati: aplikaciju VKontakte (IFrame i Flash), zajednicu ( javno, grupno ili na sastanku), video snimanje ( s vezom na web stranicu oglašivača) ili vanjsku stranicu.

Posljednja opcija je najpopularnija. Veza s takvog bannera VKontakte, u pravilu, preusmjerava korisnike na odredišnu stranicu ( odredišna stranica).

VK banner formati oglasa

Mogu se koristiti tri vrste oglasa:

  • Slika + tekst. Ovdje možete postaviti banner VKontakte 90 x 65 piksela s naslovom (25 znakova) i opisom (60 znakova);
  • Velika slika. Moguće je dodati banner veličine 90 x 120 piksela bez opisa i s naslovom od 25 znakova;
  • Ekskluzivna opcija. Banner 90 x 160 piksela s naslovom od 25 znakova. Njegova glavna prednost je što se drugi oglasi ne prikazuju dok se prikazuje. Međutim, trošak takvog oglašavanja je 2 puta veći.

Nakon odabira željenog formata i prijenosa podataka, trebali biste navesti temu i pododjeljak ( zemljopis, demografija, interesi, obrazovanje i rad, kao i dodatni parametri). U dodatnim parametrima možete odrediti operativni sustav, vrstu uređaja, grupe za ponovno ciljanje, preglednik.

Što je ciljna publika preciznije konfigurirana, to je bolji CTR, uz dobar promet i konverziju.

U završnoj fazi postavljanja, prije izrade VK bannera, navodimo način plaćanja ( za dojmove ili prijelaze), reklamne platforme ( možete dodatno odabrati partnerske stranice društvene mreže), trošak prijelaza. Dodjeljujemo naziv reklamnoj kampanji.

Pritisnemo " Napravite oglas"! I čekamo da se moderira. U pravilu će se nakon nekoliko sati vaši banneri VKontaktea početi prikazivati ​​potencijalnim kupcima. Sada je vaš zadatak pratiti statistiku koju predstavlja društvena mreža VKontakte i donijeti pravovremene odluke za poboljšanje performansi.

4. Kako umetnuti banner u grupu VKontakte?

Pogledajmo kako napraviti banner u grupi VKontakte.

Korak 1. Idite na stranicu grupe:


Korak 2. U bloku s desne strane odaberite stavku " Oglašavajte zajednicu»:


Prije izrade bannera definiramo format bannera, prijelaze ili impresije. Spremite i pričekajte da se banner moderira:

5. Banner oglašavanje na VKontakteu

Oglašavanje bannera na VKontakteu često obavlja funkciju podrške za sliku, pomaže u promicanju novih robnih marki. Međutim, to ne znači da ne može biti prodajno ili manje učinkovito od kontekstualnog. Banner oglašavanje doprinosi formiranju lojalne publike pružanjem odgođene potražnje. Ona postupno od korisnika formira potencijalnog klijenta. Ako trebate rebrandirati ili ući na tržište s novim proizvodom, banneri VKontakte izvrsno djeluju za prepoznavanje.

Oglašavanje na Facebooku namijenjeno je starijoj publici. Odnoklassniki dobro pokriva regije. Istodobno, banner oglašavanje VKontakte univerzalno je rješenje koje vam omogućuje promicanje robnih marki i novih proizvoda među mladima. Ona radi tamo gdje se vaši potencijalni klijenti odmaraju, i razgovara s njima na njihovom jeziku, u njihovom je području interesa.

Prilikom izrade bannera važno je uzeti u obzir karakteristike publike i koristiti značajke korporativnog identiteta. Što je banner profesionalnije kreiran, to je uočljiviji i učinkovitiji.

6. Kako napraviti banner VKontakte za vlastitu web stranicu, zašto je potreban i kako se može koristiti?

Banner na koji se može kliknuti omogućuje prijelaz na bilo koju stranicu na web mjestu. Prilikom izrade trebali biste uzeti u obzir sljedeće točke. Nakon učitavanja bannera u medijske datoteke svoje stranice, dodajte kod bilo gdje u resursu. Na primjer, odlučili ste dodati banner VKontakte na svoju bočnu traku:

Idite na widgete i dodajte sljedeći kod:

U polju "link adresa" navedite adresu stranice na koju želite preusmjeriti posjetitelja nakon što klikne na banner. "Put slike" je poveznica na banner. Kopirajte vezu na sliku i zalijepite je umjesto "Put do slike".

Testiranje je jedna od najvažnijih faza u provedbi uspješne reklamne kampanje. Prilikom odabira bannera VKontakte za web-mjesto, morate predvidjeti izradu nekoliko zaglavlja, slika i tekstova. Analizirajte statistiku i unesite izmjene u postavke, to će optimizirati vašu reklamnu kampanju:

7. Izrada bannera za VKontakte

Možete se ograničiti na jednostavnu sliku, međutim, personalizacija za određenog korisnika i interaktivnost bannera omogućit će vam postizanje visokog rezultata.

Dakle, banner treba sadržavati informacije od interesa, motivator za prijelaz/klik, biti lijep, imati profesionalan grafički dizajn.

Postoji nekoliko načina za izradu bannera:

  • Narudžba od dizajnera;
  • Samoizrada u grafičkom uređivaču;
  • Korištenje posebnih programa za izradu bannera;
  • Kreiranje pomoću online usluga.

Jedan od najučinkovitijih, najjednostavnijih i najbržih načina je izrada online bannera. U te svrhe možete koristiti uslugu kao što je bannerfans.com. Sučelje na ruskom jeziku i veliki izbor predložaka omogućit će vam stvaranje zanimljivog izgleda.

Prvo odaberete pozadinu i veličinu, zatim dodate natpis u karticu "Tekst", promijenite stil, boju i veličinu fonta, a zatim radite na efektima ( okviri, sjene itd.). U završnoj fazi, spremite banner u potrebnom formatu.

Animirani banner može se izraditi pomoću Easy GIF Animatora. Ovaj program nudi 20 probnih izvođenja, što će vam omogućiti da besplatno izradite više bannera. Intuitivno sučelje omogućit će vam da se brzo nosite sa zadatkom:


Zaključak: Banner oglašavanje na VKontakteu omogućuje precizno prilagođavanje ciljane publike s prilično širokom pokrivenošću. Međutim, trebali biste izbjegavati prikazivanje bannera istim korisnicima više puta. To može dovesti do povećanja cijene tranzicije, smanjenja CTR-a i "izjedanja" proračuna. Problem možete riješiti postavljanjem ograničenja broja pregleda.

Dobar loš

U ovom članku želio bih sistematizirati sve svoje znanje o dizajnu VKontakte grupa na temelju svog iskustva u interakciji s klijentima i njihovim preferencijama. Štoviše, u proteklih šest mjeseci VKontakte je napravio mnoge promjene za koje mnogi niti ne sumnjaju. Želio sam se detaljnije zadržati na nekim inovacijama, jer među njima ima zaista vrijednih i korisnih stvari. Čini se da smo se svi već oporavili od nekog šoka nakon redizajna VKontaktea, a iza vidljivih promjena otkrila se multivarijantnost funkcioniranja i sadržaja grupe. Dakle, sada dizajn grupa uključuje složenu proceduru koja nije ograničena isključivo na grafičku komponentu u obliku prekrasnih slika. Sada vlasnici moraju uzeti u obzir mnoge nijanse izgradnje grupne strukture, ovisno o predmetu poslovanja i pogodnostima korisnika.

To se uglavnom odnosi na izbor grafičkog dizajna između dvije međusobno isključive opcije, izradu internog jelovnika, odabir ulazne točke u interni jelovnik, razumijevanje razlike između kataloga i vitrine robe, pripremu promotivnih materijala za promociju grupe, korištenje korisnih aplikacije. Ali prije svega. Prvo ćemo pogledati glavne elemente grupnog dizajna, zatim ćemo prijeći na njihovu interakciju u obliku raznih kombinacija, a zatim ćemo govoriti o nekim korisnim trikovima i suptilnostima.

1. Horizontalni poklopac (zaglavlje)
Počnimo s vodoravnim omotom ili zaglavljem. Programeri VKontaktea uvjeravaju nas da naslovnica, zbog svoje veličine, daje veliku fleksibilnost u pružanju i vizualizaciji informacija. Obično, osim lijepe slike, zaglavlje sadrži logotip, popratne informacije, kontakte, poziv za pridruživanje grupi i adresu web stranice. Sumnjam da će jednog dana naslovnice postati jedina moguća dizajnerska opcija za grupu, pa bih preporučio da se odmah prebacite na njih kako biste izbjegli kasnije redizajn više sile.





Kako učitati naslovnicu
Da biste preuzeli naslovnicu, morate ići na Upravljanje zajednicom >> Osnovne informacije >> Naslovnica zajednice >> Preuzimanje. Preporučena veličina omota je 1590 × 400 piksela. U zaglavlju ne može postojati radni gumb na koji možete kliknuti – zapravo, ovo je slika i to je to. Danas je naslovnica vidljiva na mobilnim uređajima, a čini se da je već vidljiva u aplikacijama i klijentima.

Wiki kartica Najnovije vijesti
U gornjem bloku ispod zaglavlja sada mogu biti tri kartice: prikvačeni unos, informacije o zajednici i wiki izbornik (samo u grupama, takve kartice nema na javnim stranicama). Naglasak je i dalje na prikvačenom postu, ali čak i uz njegovu prisutnost, korisnik će sada uvijek imati pristup informacijama o zajednici, prelazeći kroz kartice. Da biste vidjeli karticu wiki izbornika (izvorno nazvanu Svježe vijesti), trebate otići na Upravljanje zajednicom »Odjeljci» Sadržaj »Ograničeno (ili otvoreno)» Spremi.

2. Vertikalni avatar
Sada skrenimo pažnju na stari dobri grupni avatar veličine 200x500 piksela. Do sada je to i način ukrašavanja grupe. Obično se na avataru nalaze sljedeće informacije: logo, popratni tekst ili slogan, kontakti, poziv za pridruživanje grupi. Na mobilnim uređajima se ne vidi cijeli avatar, vidljiv je samo dio – sličica. Za ukrašavanje grupe možete koristiti horizontalno zaglavlje (naslovnicu) ili okomiti banner. Ako postoji zaglavlje, okomiti avatar nije vidljiv. Na avataru ne može postojati nijedan radni gumb na koji možete kliknuti - zapravo, ovo je slika i to je to.

3. Minijatura
Trenutačno se okomiti avatar koristi za izradu minijature čija je minimalna veličina 200x200 piksela. Sličica se koristi u objavama i objavama kao mali krug na naslovu i kao veći krug u nekim odabirima i spominjanjima zajednice. U vezi s prijelazom na zaobljen oblik, zahtjevi za minijature postali su stroži. Kako bi se tekst na minijaturi mogao u potpunosti pročitati, vizualno ne smije izlaziti izvan granica kruga.

Kako prenijeti minijaturu
Minijatura je postala potpuno samostalan element i kada koristite naslovnicu (zaglavlje) u dizajnu grupe, sada morate napraviti zasebnu minijaturu, imajte na umu. Ako grupa nema zaglavlje (naslovnicu), tada za preuzimanje minijature trebate kliknuti "Prenesi fotografiju" u bloku avatara (gore desno). Ako u dizajnu postoji zaglavlje (naslovnica), tada za preuzimanje minijature morate kliknuti na krug odmah ispod zaglavlja i tamo odabrati stavku "Prenesi fotografiju".

4. Banner
Banner (engleski banner - zastava, transparent) je grafička slika informativne, reklamne ili poticajne prirode. Banner je priložen kao slika uz objavu i može imati samo jednu internu poveznicu. Mnogi su još uvijek uvjereni da se iz bannera na početnoj stranici može napraviti nekoliko poveznica. Ovo nije slučaj, samo jedan link i to je to. Istaknuo bih sljedeće vrste bannera.

4.1 Informativni banner
Uobičajena vrsta bannera koji sadrži opće informacije o tvrtki, grupi, usluzi ili događaju s detaljnim popisom pogodnosti i drugim popratnim materijalima. Često se koristi kao prikvačena objava u grupi. Veličina takvog bannera je 510x307 piksela. Kod ove veličine, banner na dnu podudara se s avatarom. Ako nema veze s avatarom, možete koristiti bilo koju veličinu. Na primjer, koristim 600x350 piksela. Format kvadrata 510x510 piksela također je prikladan i sada postaje sve popularniji - s ovom veličinom banner zauzima najveće moguće područje u feedu vijesti.

4.2 Banner za ulazak u interni izbornik
Ako banneru iz prethodnog stavka dodamo upečatljiv natpis "Otvori izbornik", dobit ćemo banner čija je glavna zadaća služiti kao ulazna točka u interni izbornik. Ponekad naprave trik u obliku nekoliko gumba na banneru, ali to je iluzija, kada korisnik klikne, i dalje dolazi na internu stranicu, a tamo svaki gumb ima svoju poveznicu. Veličina takvog bannera je 510x307 piksela. S ovom veličinom, banner na dnu podudara se s avatarom. Ako ulaz u izbornik nije vezan uz avatar, tada možete napraviti bilo koju veličinu bannera, čak i uski gumb s natpisom "Otvori izbornik". Glavna stvar je da širina bannera bude najmanje 510 piksela.

4.3 Kartica za repost, promocije
Nedavno su kartice za ponovne objave ili promocije stekle posebnu važnost. Njegova je zadaća pozvati na konkretnu akciju. U osnovi je to "Pridruži se grupi, repost ili lajk i osvoji nagradu." Takvi banneri se koriste kao dio reklamnih kampanja ili promocija kako u svojim grupama tako i za promociju u drugim grupama. Obično koristim 600x350 piksela.

4.4 Banner s gif animacijom
Nakon što su programeri VK početkom godine napravili veću veličinu za gif slike, gifovi su odmah stali u niz s informativnim bannerima. Na primjer, na GIF banneru možete dati slike nekoliko proizvoda ili tekstova koji se mijenjaju - pokret odmah privlači pozornost. A kad je funkcija dodana u lipnju automatsko pokretanje gif animacija u feedu vijesti, GIF-ovi su postali predmetom pomne pažnje oglašivača i marketinških stručnjaka.

5. Dizajn avatara + zakačeni banner
Donedavno je ovaj modularni dizajn, koji se sastojao od avatara i prikvačenog bannera, bio najpopularniji način ukrašavanja grupa. Više pojedinosti o tome kako napraviti takav dizajn opisano je u lekciji. S pojavom kapice (poklopca), popularnost ovog dizajna može se malo smanjiti.

Osim toga, postoji mogućnost da će VKontakt ponovno promijeniti neke parametre blokova i tada će sav dizajn odletjeti, kao što je to već bilo dva puta u posljednjih šest mjeseci. Dakle, dragi vlasnici grupa, kada birate dizajn za svoju grupu, uzmite u obzir ovu činjenicu. Da, i još nešto, na mobilnim uređajima se ne vidi sva ljepota jedne slike, budući da se ne prikazuje avatar, već samo sličica, a prikvačena objava nalazi se odmah ispod.

6. Interni navigacijski izbornik
Izbornik u obliku aktivnih veza nalazi se na internoj stranici VKontaktea i napisan je pomoću wiki naredbi za označavanje. Kako napraviti samu unutarnju stranicu opisano je u lekciji. Uz pomoć izbornika korisnik se kreće kroz grupu. U nastavku ćete razmotriti vrste internog izbornika, ali za sada se zadržimo na nekoliko važnih točaka.

Ulazne točke u internom izborniku
Želim napomenuti jednu suptilnu točku koja se često zanemaruje. Ponekad klijenti od mene naruče interni jelovnik, ali u isto vrijeme nemaju pojma kako će korisnik ući upravo u taj interni jelovnik. U njega možete ući na dva načina: ili putem fiksnog bannera (pogledajte odlomak 4.2) ili putem tekstualne veze na gornjoj kartici ispod statusne trake (pogledajte donju sliku). Ponekad se tekstualna veza također postavlja u blok "Veze" u desnom stupcu sučelja.

Veze unutarnjeg izbornika
Obično prilikom naručivanja kupci naznače sljedeće stavke menija: O nama, Naši proizvodi (katalog), Načini dostave, Plaćanje, Jamstva, Recenzije, Kontakti, Promocije, Popusti, Raspored, Kako naručiti, Portfolio, Pitanja i odgovori, Informacije, Napravite narudžbu. Veze iz stavki izbornika mogu ići na odgovarajuće odjeljke vanjske stranice. Tada će se veza automatski otvoriti u novom prozoru. Većina točaka vodi na interne stranice VKontaktea. U tom slučaju, stranica se otvara u istom prozoru i morate napraviti poveznicu ili gumb "Povratak na glavni izbornik".

Veze na albume s fotografijama i videozapisima otvorit će se u novom prozoru. Veze na teme s raspravama (na primjer, Recenzije), na dijaloški okvir za pisanje poruka, na aplikacije (vidi paragraf 10), na odabir po hashtagovima (vidi paragraf 12) otvaraju se u istom prozoru i u ovom slučaju možete dobiti povratak na izbornik samo putem glavne stranice web-mjesta ili putem gumba "Natrag" u pregledniku. Ovo je možda najnezgodniji trenutak s takvim poveznicama.

Uređivanje izbornika
Često me klijenti pitaju je li moguće urediti interni izbornik. Moj odgovor je, ako ste samouvjereni korisnik i upoznati ste s wiki označavanjem i načinima uređivanja, onda možete uređivati. Ali ako niste upoznati sa svim ovim, onda apsolutno ne. U ovom slučaju jednostavno poništite sve postavke.

Citirat ću riječi samih programera VKontaktea. “Jedan jednostavan savjet uštedjet će vam puno energije i živaca: radite samo u jednom načinu rada. Ili je to vizualni ili wiki način označavanja. Upravo prebacivanje između ova dva načina rada u procesu rada na označavanju donosi većinu problema: slike se mogu smanjiti, razni parametri mogu nestati. Ovo je jedan od onih trenutaka koji će se sigurno ispraviti u budućnosti, ali za sada ovu činjenicu morate imati na umu."

Mobilni odziv
I još nešto o prilagodljivosti. Kako bi interni izbornik izgledao isto na mobilnim uređajima, morate pisati na tablicama. Tada će slika biti čvrsto pričvršćena. Inače, kada se veličina zaslona smanji, slike imaju tendenciju kliziti jedna ispod druge, kršeći izvorno zamišljeni redoslijed.

Ovdje, opet, riječi programera na račun prilagodljivosti. “wiki izbornik se prikazuje u mobilnim preglednicima, ali se ne prilagođava veličini zaslona, ​​što može uzrokovati da slike izgledaju drugačije od računala. Na mreži se mogu pronaći vodiči za prilagođavanje wiki oznaka za mobilne uređaje, ali čak ni oni ne jamče 100% performanse na svim uređajima."

7. Vrste internog navigacijskog izbornika
Ispod su najčešće vrste internih izbornika. Postoje jednostavnija i pristupačnija rješenja s visokim stupnjem pouzdanosti. A postoje složeniji i naporniji dizajni u smislu grafike i izgleda. Ali izgledaju impresivnije.

7.2 Veliki grafički izbornik
U ovom slučaju, okomiti red veza nalazi se na velikoj pozadinskoj slici i ima čvrsto fiksiranu strukturu. Evo tutorijala.

7.3 Izbornik u obliku ikona, pločica
Ovaj dizajn pretpostavlja nekoliko redaka i stupaca u obliku grafičkih ikona i natpisa na njima ili grafičkih višebojnih ili jednobojnih pločica.

7.4 Dinamički izbornik s navigacijskim efektom
Vrlo impresivan dizajn koji oponaša navigaciju web-mjesta s učinkom klikanja na gumbe ili na drugi način označavanja posjećenih poveznica. Takvim je izbornikom prilično teško upravljati i zahtijeva vještine u komunikaciji s wiki oznakama, budući da ćete također morati uređivati ​​podatke na stranicama u wiki oznaci. Ovdje je tutorial na ovu temu.

Vrhunski povezani članci