Gotove omote za VK 1590 400. Dizajniranje zajednice VKontakte: najdetaljniji vodič u Runetu za grupu ili javnu stranicu

Pojavom društvene mreže VKontakte, poduzetnici su počeli aktivno pokretati posao na Internetu i tražiti nove izvore prihoda - grupe i javnosti postali su alat za zarađivanje novca. Naslovnica grupe VKontakte nije samo prekrasna slika - to je vizit karta za vaše klijente. Što bolje spakujete svoju zajednicu, veća je vjerovatnoća da će naručiti od vas, a ne od vaših konkurenata.

Poklopac prodavnice odeće dizajnirao je naš studio za grafički dizajn

Naslovnica grupe VKontakte mali je dio potrebnog dizajna i, ako se samo okušate kao internetski biznismen, ovo je najjeftinija opcija pakiranja. U idealnom slučaju, VKontakte grupa ili javnost treba da sadrži: privlačan reklamni baner (otvara meni), naslovnicu, meni (navigaciju ili wiki slijetanje), lijepo dizajnirane proizvode i omote foto albuma, kao i brendirane postove. Sve ovo stvara lice vašeg poslovanja i utiče na to kako će vas kupci percipirati.

Šta staviti na naslovnicu Vkontakte grupe:

Prilikom dizajniranja naslovnice grupe VKontakte, razmotrite mobilnu verziju. Ako je dizajn jako izrezan, bitne točke će biti skrivene (kontakti, usluge, logotip, itd.), izgubit ćete neke kupce. Na računarima i laptopima, poklopac se prikazuje u potpunosti, a na mobilnom je odsečen sa leve i desne strane za 197 px i zatamnjen odozgo za 83 px.

Nemojte preopteretiti naslovnicu grupe informacijama. Trebao bi biti lagan, ali informativan!

Gdje mogu naručiti dizajn naslovnice?

Možete naručiti izradu naslovnice grupe VKontakte od dizajnera na slobodnoj burzi, pronaći umjetnika na društvenim mrežama ili pretražiti web stranicu web studija na Internetu.

Svaka od ovih metoda ima svoje karakteristike. Uštedjet ćete novac na slobodnoj burzi, ali ćete u većini slučajeva pronaći dizajnera početnika ili studenta. Za web studio rade iskusni, odabrani dizajneri, ali će i studio imati koristi od narudžbe. Lakše je naručiti putem VKontakte grupa - odmah možete vidjeti rad dizajnera i uporediti cijene nekoliko izvođača.

Na tržištu usluga cijene dizajna VKontakte poklopca su od 500 do 3500 rubalja. i nije samo to. Početnici rade jeftinije, ali njihov nivo je nizak; studiji su posrednici i rade sa marginom; a uspješni popularni dizajneri rade za sebe.

Kako postaviti omot za grupu?

U vašoj grupi, u gornjem desnom uglu ekrana ispod "avatara" nalaze se tri tačke "...", kliknite na njih i u prozoru koji se pojavi izaberite odeljak "Upravljanje zajednicom", u njemu ispod informacije o grupi, vidjet ćete natpis: "Zajednica naslovnica" i akcije Download and Delete. Dodajte naslovnicu i vratite se na glavnu stranicu da vidite rezultat.

Kada je poklopac instaliran, možete ga promijeniti u bilo kojem trenutku jednostavnim prelaskom miša preko njega i odabirom akcije „Preuzmi, uredi ili izbriši naslovnicu“. Više o tome kako postaviti omot u grupu možete saznati u našem videu:

Primjeri našeg rada na dizajnu grupa "prije i poslije".

Glavna stvar koja se promijenila je još jedna imitacija Facebooka u obliku omota zajednice. Još nema naslovnica za lične stranice, ali mislim da će to biti u bliskoj budućnosti. imitacija konkurenta.

Veličine naslovnica VK zajednice i nove funkcije

Da biste učitali naslovnicu, idite na stranicu za upravljanje zajednicom i na prvoj stranici kliknite na "Pošalji" pored stavke "Omot zajednice". Korica je veličine 795x200 px ili 1590x400 px za HD ekrane.

Dugmad koja su se nalazila na avataru su zgodno smještena ispod poklopca po cijeloj širini. Zadržao se i avatar zajednice na početku naslovnice, ali već u obliku male sličice zajednice.

Umjesto zakačenog unosa, tri vrste informacija su sada označene karticama:

• zakačena objava
• informacije zajednice
• meni zajednice (ako je urađeno)

Usput, prilično je zgodno. Ranije je postojao jedan od 3 u zaglavlju zajednice, a sada je moguće omogućiti korisnicima da vide sva 3 prebacivanjem između kartica.

Kao što je prvobitno zamišljeno, prva kartica je zakačeni unos, a nakon toga ostali su prioritet.

Takođe od novina - neznatno je izmijenjen blok prijatelja koji su se pridružili zajednici.

Inače, kao i u slučaju robe svojevremeno, ova inovacija još ne radi na mobilnim uređajima, ali obećavaju da će poboljšati ovaj propust u budućnosti.

6 sviđanja

Mnogi vlasnici zajednica žele kreirati naslovnicu za grupu u VK online. U našem članku pokušat ćemo razumjeti sve nijanse postupka i pružiti savjete korisnicima.

VK je stranica koja se stalno ažurira i poboljšava. Administratori grupe sada imaju mnogo alata za personalizaciju svoje zajednice. Jedan od njih je kreiranje naslovnice za VK grupu na mreži.

Ali šta je to? Ovo je posebna slika postavljena u zaglavlje grupe. Zašto ti treba pokrivač?

1. Omogućava vam da poboljšate dizajn.
2. Stranici je moguće dati poseban stil.
3. Svidjet će vam se novi dizajn.
4. Naslovnica može reći o temi zajednice.
5. Grupe sa lijepim dizajnom su od najvećeg interesa za korisnike.
6. Ljudi će biti spremniji da se pretplate na zajednicu.
7. Moguće je prilagoditi sliku punoj i mobilnoj verziji stranice.
8. Izrada poklopca je prilično jednostavna, ovaj postupak ne bi trebao uzrokovati probleme.

Kako napraviti prekrasnu naslovnicu za grupu u VK?

Troškovi rada za izradu zavise od vaših želja. Generalno, administratori grupe imaju dvije opcije:

• Uzmite gotovu sliku i stavite je.
• Kreirajte svoju jedinstvenu sliku.

Naravno, drugi način je mnogo komplikovaniji. Da biste kreirali jedinstvenu naslovnicu, morat ćete koristiti uređivač fotografija. Morate imati barem minimalne vještine u radu sa programima poput Photoshopa da biste postigli željeni rezultat.

Korica za VK grupu: vel

Dimenzije mogu varirati. Na primjer, na PC-u, naslovna slika se prikazuje u rezoluciji od 795×200 piksela. Na pametnim telefonima prilagođava se ekranu uređaja.

Ali nije uvijek moguće pronaći sliku upravo u ovoj rezoluciji! Ne brinite, kada otpremite sliku, sistem će od vas tražiti da je izrežete. Odaberite željeni dio, rubovi će se automatski ukloniti.

Važno je zapamtiti da se prikaz naslovnice na mobilnim uređajima razlikuje od desktopa. Odsečen je 83px od vrha, ovaj prostor zauzimaju sistemske ikone. Takođe na pametnim telefonima sa širinom ekrana do 400px, izrezivanje se dešava na ivicama za 196px.

Kao rezultat toga, mala površina će biti nevidljiva korisnicima mobilnih uređaja. Bolje je ostaviti ga praznim tako da samo pozadina slike bude oko rubova, tada elementi neće biti odrezani.

Program za kreiranje omota za grupu u VK

Dostupni načini za kreiranje zaglavlja za grupu:

1. Preuzmite gotovu sliku za naslovnicu.
2. Učinite to putem online usluge.
3. Naručite od stručnjaka.
4. Koristite uređivače fotografija i kreirajte svoje.

Internet je pun besplatnih slika i šablona u psd formatu. Mogu se prilagoditi vašoj grupi i staviti u zaglavlje zajednice. Ovo je daleko najlakša opcija.

Možete koristiti posebne programe - Adobe Photoshop, Pixelmator, itd. Ali morate znati raditi sa ovim aplikacijama, trebat će vam vremena da ih savladate.

Kako napraviti omot za grupu u VK u Photoshopu

Adobe Photoshop je najpopularniji softver za uređivanje slika. U njemu možete brzo kreirati naslovnicu ako imate određene vještine. Glavna prednost ove metode je da je moguće razviti jedinstven dizajn.

Bitan! Za osnovu uvijek birajte slike koje su veće od preporučenih veličina. Morat ćete podesiti sliku na željenu rezoluciju. Ali u slučaju rastezanja, kvaliteta slike se značajno pogoršava, što je neprihvatljivo.

Otvorite Photoshop. Izaberite stavku iz menija da biste kreirali novu datoteku. Da biste ga sačuvali, morate postaviti sljedeće parametre:

• Odmah navedite ime datoteke.
• Veličina - 1590x
• Pozadina je prozirna.
• Režim boje - RGB boje 8 bita.
• Rezolucija - 72 piksela po inču.

Sada pronađite sliku na Internetu, kopirajte je i zalijepite u program. Za podešavanje veličine potrebno je:

1. Idite na "Uređivanje".
2. Zatim na Transformaciju.
3. Sada odaberite odjeljak "Skaliranje".
4. Držite Shift.
5. Kliknite lijevom tipkom da uhvatite kut slike.
6. Prilagodite sliku ivicama.
7. Pritisnite Enter da potvrdite radnju.

Morate napisati naziv zajednice. Za ovo vam je potrebno:

• Odaberite stavku da kreirate novi sloj.
• Kliknite na dugme da dodate tekst.
• Odredite prostor za njegovo postavljanje.
• Odaberite veličinu, boju, font.
• Unesite naziv zajednice.
• Otvorite panel sa stilovima.
• Odaberite pravi da bi tekst izgledao lijepo.

Imaš prilično jednostavnu naslovnicu. Prema uputama, to može učiniti gotovo svaki korisnik. Naravno, kreiranje zaglavlja sa mnogo elemenata će trajati mnogo više vremena.

1. Otvorite iz menija Datoteka.
2. Odaberite "Sačuvaj za web".
3. Navedite PNG-24 set.
4. Sačuvaj sliku.

Kako učitati gotovu sliku?

Za otpremanje slike u grupu, trebat će vam:

• Prijavite se u zajednicu.
• Odaberite stavku za kontrolu iz menija.
• Pronađite opciju s pokrovom zajednice.
• Odaberite stavku za preuzimanje.
• Otvoriće se obrazac za dodavanje.
• Možete odabrati sliku u Exploreru ili je prevući u prozor.
• Otpremite ga na stranicu.
• Potvrdite spremanje.

Idite na glavnu stranicu zajednice i ocijenite rezultat. Ako ste slijedili preporuke u vezi s veličinama, onda će slika u potpunosti odgovarati.

Naučili ste kako napraviti naslovnicu za grupu u VK-u. Proces nije tako komplikovan, dovoljno je uzeti u obzir sve date savjete.

Dinamična naslovnica za VK grupu

Sada je moguće kreirati dinamički omot. Proces njegove pripreme je mnogo složeniji, morat ćete potrošiti mnogo više vremena.

Koja je razlika između dinamičnog šešira i običnog? U njemu se slike mogu ažurirati. Učestalost promjene se konfiguriše posebno tokom kreiranja.

Ali zašto nam je potrebno dinamičko zaglavlje? Postoji mnogo opcija za njegovu upotrebu:

1. Možete prikazati svoj CRM sistem.
2. Može kreirati tajmer.
3. Prikažite dan u sedmici, datum, vrijeme.
4. Pokažite imena najnovijih stolara.
5. Navedite dodatne informacije.
6. Takve navlake su pogodne za grupe kompanija.

U zaglavlje je moguće staviti razne informacije koje se mogu dobiti od VK-a ili sa bilo koje druge stranice. Opcije za njegovu upotrebu ovise samo o vašim potrebama.

Kako radi?

Princip je prilično jednostavan:

• U pripremi je standardni šablon.
• Na pravim mjestima dodijeljene su zone za ažuriranje podataka.
• Za punopravni rad potrebna je posebna skripta.

Zašto je potrebna skripta?

Skripta se koristi za primanje podataka i njihovo prikazivanje u za to određenim područjima. To jest, on iskrcava informacije iz izvora i prenosi ih na omot, spojni je element.

Brzina osvježavanja može se podesiti prema vašim potrebama. Možete odabrati optimalnu vrijednost za prikaz ažuriranih informacija u zaglavlju.

Stvaranje dinamičke naslovnice sa skriptom je teže od obične. Biće potrebno mnogo više znanja i specijalizovanog softvera. Stoga je bolje povjeriti ovu proceduru profesionalcima. Tada možete biti sigurni u savršeno funkcioniranje.

Kako povezati skriptu?

Nakon završetka projekta, stručnjaci će vam pružiti:

1. Dizajn dizajna.
2. Izvori u PSD formatu.
3. Skripta.
4. Licencni ključ za vezanje.

Profesionalci uključeni u razvoj dizajna za zajednice preuzimaju glavne zadatke. Zbog toga je moguće uštedjeti vrijeme i ne ulaziti u sve nijanse stvaranja takvih omota.

Da bi skripta radila, morate je negdje instalirati. Postoji nekoliko opcija:

• na kućni računar.
• Na server kompanije koja ga je razvila.
• Na udaljeni server.

Možete staviti skriptu na svoj PC. Ali kompjuter mora raditi 24 sata dnevno. Ako je uređaj isključen, informacije u zaglavlju se više neće ažurirati. Stoga mali broj vlasnika zajednica koristi ovu metodu.

Možete platiti hosting i instalirati skriptu na udaljenom serveru. Troškovi održavanja počinju od 80 rubalja mjesečno. Ali morate odabrati pouzdan hosting koji može osigurati nesmetan rad.

Mnoge kompanije za dizajn zajednice nude instaliranje skripte na svoj server. Cijena usluge je mala, pretplata obično ne prelazi 100 rubalja mjesečno. Takođe, zaposleni u kompaniji će podržati funkcionisanje skripte.

• naznačiti temu i smjer grupe;
• uštedite vrijeme korisnika za proučavanje zajednice;
• prikazati kontakte za komunikaciju na vidnom mjestu;
• stvoriti pravo raspoloženje i tematsku atmosferu;
• motivisati za komentare i lajkove;
• obavlja i druge posebne funkcije.

U kontaktu sa

Na ovoj društvenoj mreži možete koristiti avatar, naslovnicu, wiki meni, samo wiki postove, ikone za proizvode i ilustracije za objave za dizajniranje grupe ili javne stranice. Ako odaberete pogrešnu veličinu, kvaliteta slike se može pogoršati ili biti premala. Na internetu postoji mišljenje da veličina slike utiče na rangiranje u smart feedu, pa bi trebalo da bude najmanje 1024 px. Pitali smo podršku i saznali da veličina ne utiče na glavni sadržaj.

Odgovor podrške o uticaju veličine slike na poziciju u rezultatima pretrage

Kako pametna traka čita sadržaj ilustracije nije baš jasno. Ako znate, pišite u komentarima, bit ćemo vam zahvalni.

Cover

Dimenzije: 1590×400 px, vidljivo područje za mobilnu verziju 1196×400 px.

Ovo je izdužena horizontalna slika u zaglavlju zajednice, na nju se ne može kliknuti.

Naslovnica naše grupe vk.com/prcyru

Naslovna slika je opciona za zajednicu, ako nije postavljena, avatar grupe će se otvoriti u punom formatu sa desne strane.

Bend bez omota

Kako se kvaliteta omota ne bi pogoršala, uprava Vkontaktea savjetuje postavljanje slike veličine 1590 × 400 px. Ali u mobilnoj verziji cijela naslovnica ne stane na ekran, ivice desno i lijevo su odsječene na 197px, pa je bolje sve podatke, tekstove i slike koji se ne mogu izrezati smjestiti u vidljivu zonu, ovo je 1196 × 400 px. A na vrhu, oko 83 px zauzima traka sa indikatorima komunikacije, nivoa napunjenosti i drugih.

Šema omota s oznakom

Natpisi se uklapaju u vidljivu zonu, ikona postavki preklapa tekst samo za administratore zajednice

Dio naslova na naslovnici je odrezan

Mnogi savjetuju da na naslovnici napravite strelice koje će vas navesti da kliknete na pretplatu ili napišete poruku.

Strelica pokazuje na dugme za slanje

Strelica pokazuje na dugme sa porukom

Snimak ekrana statistike PR-CY grupe

Ako je vjerojatnije da će publika gledati grupu s mobilnog, onda takva ikona nema smisla, jer se u mobilnoj aplikaciji pomiče i pokazuje na sličicu avatara, a ne na dugme za pretplatu ili poruku.

Strelica pokazuje na avatar

Strelica pokazuje na prazno polje

Kako ne biste sami označavali područja, napravili smo šablon u psd formatu sa vodičima koji razgraničavaju područja. Može se preuzeti.

Ne tako davno, Vkontakte je uveo funkciju dinamičkih omota, što znači da će naslovnica imati promjenjive podatke i biti ažurirana nakon određenog vremenskog perioda. Takva naslovnica je zgodna jer na njoj možete prikazati gotovo sve: gradskim portalima će možda trebati vrijeme, tečajevi, gužve u prometu ili vrijeme, grupe koje održavaju promocije ili organiziraju događaje imat će koristi od odbrojavanja, a prikaz avatara većine aktivni korisnici se mogu potaknuti da ostavljaju komentare ili lajkuju objave.

Primjer sa prikazom avatara aktivnih učesnika na naslovnici

Novi avatar pretplatnika na naslovnici

Za dinamičku naslovnicu potrebna vam je obična slika na koju će biti zakačeni inserti sa avatarima, vremenskom prognozom i drugim stvarima, skripta povezana sa grupom i hosting sa CronTAB podrškom na koji će se skripta instalirati. Ako ažurirate naslovnicu prečesto, svake sekunde, na primjer, možda će vam trebati anti-captcha.

Petr Samokhin je na HabraHabre-u govorio o tome kako sam napisati scenario. Ako ne želite sami da shvatite, postoje plaćene dizajnerske usluge na koje možete povezati grupu i prilagoditi naslovnicu potrebnim aplikacijama za malu mjesečnu naknadu.

Funkcionalnost može biti različita, na primjer, dizajn zajednice može se potpuno promijeniti nakon klika na pretplatu. Dodatne funkcije se razvijaju zasebno, možete sami nešto napisati, možete pronaći grupe u potrazi za samim Vkontakteom, gdje razvijaju i prodaju takve aplikacije.

Avatar

Dimenzije: ne manje od 200x500 px i ne više od 7000 px, omjer stranica 2 do 5.

Ako je naslovnica postavljena u grupi, avatar će biti predstavljen samo kao sličica, punu verziju možete pogledati klikom. Ako nema poklopca, biće prikazan u potpunosti. Poređenja radi, PR-CY grupa sa naslovnom i avatarom i verzija iste grupe bez omota:

Naslovnica i avatar

Samo sa avatarom

Avatar može biti bilo koje veličine, ne manje od 200x500 px i ne više od 7000 px sa svake strane, ali maksimalni omjer širine i visine je 2 prema 5. To jest, neće uspjeti instalirati vrlo izduženu sliku, pokušali smo:

Uređivač vam ne dozvoljava da odaberete izduženije polje.

Wiki meni

Dimenzije:širina unutrašnje stranice 607 px, širina omota najmanje 600 px.

Vkontakte wiki format podrazumijeva stranicu s mogućnošću formatiranja teksta, pravljenja lista i podnaslova, umetanja slika na koje se može kliknuti s prijelazima na Vkontakte odjeljke i web stranice trećih strana. U wiki formatu, oni često prave meni i zakaču ga u zaglavlje grupe kako bi olakšali navigaciju kroz zajednicu i dali sve važne informacije na jednom mjestu.

Za wiki meni trebat će vam omot, koji će predstavljati ilustraciju za vezu do stranice menija i interne dijelove.

Poklopac menija

Fragment sekcija unutar menija

Širina polja wiki stranica je 607 piksela. Slike se mogu rastegnuti ili smanjiti navođenjem veličine u uređivaču koji se otvara klikom na sliku. Ali kada se rastegne i smanji, kvaliteta se pogoršava. Slike se automatski učitavaju sa visinom od 400 px.

Wiki editor slika

Wiki stranica sa odeljcima menija je konfigurisana u uređivaču. Detaljno ćemo opisati kako napraviti wiki meni u grupi u posebnom članku. Zatim se u post na zidu ubacuje link do stranice, nije potreban, ali je poželjna slika. Odabran je kao redovna ilustracija za post. Prilažemo i čuvamo objavu, sada će se wiki stranica otvoriti klikom na "Pogledaj" ili na ilustraciju.

Test post sa wiki menijem

Postovi

Dimenzije: najmanje 600 px širine za obične postove, najmanje 510x288 px za članak u uređivaču.

Feed postovi podržavaju bilo koju sliku, ali različiti postovi imaju svoja ograničenja.

Samo što objava može biti bilo koje veličine, ali je bolje da bude široka najmanje 600 px, inače će slika biti mala i lošeg kvaliteta. Na primjer, uzeli smo kvadratnu sliku, slike u pejzažnoj i portretnoj orijentaciji širine 1000 px.

Desktop View

Vidimo da su slike poravnate po širini ekrana, kvadratna slika zauzima najviše prostora, slika u pejzažnoj orijentaciji izgleda dobro. U portretnoj orijentaciji, na desktop verziji se pomiče u stranu i nije centriran, dok je na mobilnom centriran, ali se sa strane formiraju bijele margine.

Mobilno pretraživanje

Postoji još jedan format posta - članak u uredniku. Poklopac za njega treba da bude horizontalan, slika će se smanjiti na veličinu od 510x288 px. Bolje je bilo koje slike postaviti dalje od centra, ne morate pisati ni naslov, on će automatski stajati u sredini. Naslov je napisan bijelim fontom, ali je istaknut sjenom, tako da tamne ilustracije izgledaju bolje, ali se tekst ne gubi ni na svijetlim.

Ilustracija za članak sa svijetlom pozadinom

Ilustracija za članak s tamnom pozadinom

Proizvodi

Dimenzije: ne manje od 600 px.

Roba je obavezna ilustrovana, bez slike neće biti objavljena. Možete postavljati slike u bilo kojoj orijentaciji, ali svakako odaberite kvadrat kao sličicu za liniju proizvoda:

Uređivač ne dozvoljava rastezanje područja za odabir sličica

Instalirani kvadrat će biti prikazan u redu proizvoda, kada se klikne, kartica proizvoda će se otvoriti sa originalnom slikom.

Sličica proizvoda iz linije proizvoda

Otvorite karticu proizvoda

Red s proizvodima u PR-CY grupi

Otvorite karticu proizvoda

Veličina same slike ne smije biti manja od 400 i ne veća od 6000 px na svakoj strani. Preporučujemo da dizajnirate slike kartica proizvoda u istom stilu tako da izgledaju povoljno na listi s pločicama.

Ako želite saznati više o upravljanju grupama na društvenim mrežama, možda će vas zanimati i drugi naši članci iz SMM serije.

Prekrasan dizajn zajednice VKontakte nije hir, već važan element koji formira povjerenje korisnika u vas i vašu kompaniju. Ako je javna stranica ili grupa dizajnirana na neprofesionalan način, vaši potencijalni kupci mogu sasvim logično zaključiti da ste i vi nemarni u svom poslu. Da se to ne bi dogodilo, pobrinite se da vaša stranica VKontakte bude lijepa, uredna i jednostavna za korištenje. Kako uraditi? Pročitajte u nastavku.

Stvarne veličine slika "VKontakte"

Prije nekog vremena programeri društvene mreže VKontakte lansirali su novi dizajn. To je dovelo do činjenice da su se promijenile veličine i principi prikazivanja slika. Memorandum, koji će biti dat u nastavku, odgovara svim inovacijama i sadrži dimenzije koje su relevantne u datom trenutku.

Sada pogledajmo detaljnije svaku stavku.

Veličina VK avatara

Minimalna veličina avatara je 200 x 200 piksela. Ako pokušate učitati sliku koja je manja od 200 piksela široka ili duga, vidjet ćete ovu grešku:

Maksimalna veličina avatara je 200 x 500 piksela. Ali, u principu, možete uploadati veće slike - do 7000 piksela sa svake strane. Glavna stvar je da omjer njihovih strana ne prelazi 2 do 5.

Pokazat ću vam primjerom.

Imam sliku. Njegova veličina: 200 x 800 piksela (odnos 2 prema 8). Nema grešaka prilikom učitavanja. Međutim, još uvijek ne mogu koristiti ovu sliku, jer mi "Kontakt" ne dozvoljava da je u potpunosti izaberem.

Cover

Veličina omota za punu verziju stranice je 1590 x 400 piksela.

Napomena: u mobilnoj verziji i aplikacijama nije prikazana puna verzija omota, već samo dio veličine 1196 x 400 piksela. Pogledajte kako je izrezan u mobilnoj aplikaciji:

Kako biste spriječili da se to dogodi, postavite glavne elemente omota unutar 1196 x 400 piksela.

Priložene slike

U ažuriranom dizajnu "Kontakta" širina feeda vijesti je fiksna. To znači da se slike prikačene uz post više ne rastežu, već ostaju takve kakve jesu. Stoga, ako želite da vaša slika ispuni svoj puni prostor u News Feedu, mora biti široka najmanje 510 piksela. Najbolje je da to bude kvadrat ili pravougaonik u pejzažnoj orijentaciji.

Zvuči malo zbunjujuće :) Stoga ću vam pokazati na primjeru.

Recimo da imamo sliku kvadratnog oblika sa stranicama od 510 piksela. Ako ga zakačimo na naš post, izgleda sjajno u feedu vijesti na svim uređajima:

A ovako izgleda horizontalna slika u pejzažnoj orijentaciji (širina 510 piksela):

Kao što vidite, što je slika uža (po visini), izgleda manje u feedu pametnog telefona. Da biste to potvrdili, pogledajte sliku ispod:

Jasno je da razlika ovdje nije posebno kritična, a korisnici pametnih telefona će i dalje uzeti u obzir vašu sliku, samo će u drugom slučaju biti malo ugodniji.

Slike za postove sa linkovima

Svi ovi podaci preuzeti su iz Open Graph markup koda:

Ako Open Graph nije naveden, naslov se uzima iz meta oznake Naslov, a slika iz članka. U isto vrijeme, možete ga jednostavno promijeniti - ili odabrati drugu sliku iz članka pomoću posebnih strelica:

Ili prenesite svoje:

Minimalna veličina slike koju možete koristiti kao najavu za svoj članak je 537 x 240 piksela. Međutim, možete otpremati veće slike sve dok se poštuje omjer širine i visine slike.

Slika za članak kreiran u uređivaču

Veličina slike za naslovnicu članka kreiranog u uređivaču je 510 x 286 piksela. Bolje je da je tamne boje i manje-više jednobojne, jer se naziv članka i zajednice gubi na svijetloj pozadini.

dobar primjer:

Nije baš dobar primjer:

Veličina fotografija i videa za priče

Veličina za fotografije je 1080 x 1920 piksela. Veličina videa je 720 x 1280 piksela.

Specifikacije za video snimke:

• do 15 sekundi;
• ne više od 5 MB;
• h.264 kodek;
• AAC zvuk.

U pričama morate koristiti fotografije i video zapise u vertikalnom formatu.

Imajte na umu: u ovom trenutku priče u ime zajednica mogu dodavati samo velike zajednice za koje su programeri VKontaktea otvorili ovu funkciju. I to se radi pomoću službene aplikacije. To se ne može uraditi sa računara.

Veličina omota foto albuma

Veličina video slike

1280 x 720 piksela.

Wiki stranica

Područje wiki sadržaja je široko 607 piksela. Ako otpremite veću sliku, ona će automatski učitati širinu od 400 piksela. Primjer: Imam sliku veličine 1366 puta 768. Ako je dodam na wiki stranicu, izgleda ovako:

Da biste promijenili veličinu slike, potrebno je kliknuti na nju i postaviti željene vrijednosti:

Kako raditi sa wiki stranicama, detaljno ću opisati u nastavku. Stoga se ovdje nećemo zadržavati na ovoj tački.

Kako osigurati da se slike VKontaktea ne smanjuju? Utjecaj pozadine i veličine na kvalitetu slike.

Ako ste ikada pokušali da otpremite slike na VKontakte (bilo da je to bila slika avatara ili samo fotografija sa vašeg putovanja), onda verovatno već znate da se one obično smanjuju. To je posebno uočljivo na tamnoj (a posebno crvenoj) pozadini i kada slika nije prevelika. primjer:

Kako osigurati da se kvalitet slika ne pogorša?

Da se slika ne bi smanjila (tačnije, smanjila se, ali u znatno manjoj mjeri), potrebno je učiniti 2-3 puta većom od željene veličine. Na primjer, ako trebamo napraviti avatar veličine 200 x 500 piksela, snimamo sliku veličine 400 x 1000 piksela. Ako trebate napraviti meni veličine 510 x 400 piksela, uzimamo - 1020 x 800.

Tamnoplava slika koju sam postavio iznad je 510 x 350. Napravio sam je duplo veću (1020 x 700) i sačuvao. Eto šta je iz toga proizašlo:

Kako to popraviti? Odgovor je vrlo jednostavan - morate odabrati drugu pozadinu. Činjenica je da su pikseli vidljiviji na tamnoj pozadini nego na svijetloj. Stoga, ako želite postići savršenu kvalitetu (iako slika iznad već izgleda sasvim normalno), onda morate malo promijeniti shemu boja. Na primjer, učinite pozadinu bijelom, a tekst plavim:

Kako dizajnirati zaglavlje stranice

Zaglavlje vaše javne stranice ili grupe je prva stvar koju korisnici vide kada vas posjete. U većini slučajeva, meni za navigaciju zasnovan na javnim materijalima, nekim zanimljivim objavama ili važnim najavama se nalazi na ovom mjestu. Pogledajmo primjere kako različite kompanije koriste ovaj prostor.

Cover

Ne tako davno, VKontakte je uveo ažuriranje - sada možete prenijeti velike i lijepe naslovnice (1590 x 400 piksela) na stranice. Da biste to učinili, idite na postavke i kliknite na dugme "Preuzmi".

Na naslovnicu možete staviti bilo šta: od naziva i mota vaše kompanije do svih vrsta promocija, ponuda, pa čak i takmičenja.

Preporučujem da obratite posebnu pažnju na mogućnosti dinamičkog pokrivanja. Pročitajte naš članak o tome kako funkcionira, u koje svrhe se može koristiti i s kojim servisima ga instalirati.

Primjeri dinamičkih omota:

Naslovnica + opis zajednice + link do stranice

Neke kompanije posebno ne popravljaju nijedan postove u zaglavlju kako bi korisnici imali priliku pročitati osnovne informacije o stranici i odmah otići na stranicu.

Opis sa hashtagovima

Neke kompanije dodaju hashtagove standardnom opisu stranice koji je karakterizira. To je učinjeno kako bi stranica imala jasniju relevantnost, te je zbog toga veća u potrazi za relevantnim upitima. Da budem iskren, ne znam da li ova metoda radi ili ne. Nisam vidio slučajeve na ovu temu, pa ako neko zna bit ću zahvalan ako podijelite link.

Zakačena objava koja govori o čemu je stranica

Ako želite detaljnije ispričati svoju stranicu (sa fotografijama, linkovima i lijepim izgledom), onda možete u zaglavlje priložiti wiki post ili članak napravljen u editoru sa svijetlom slikom na najavi koja će potaknuti korisnike da kliknite na njega. Primjer takvog posta:

A evo šta korisnik vidi nakon što klikne na link:

Grupni meni je otvoren

Otvorenim menijem nazivam takav meni, koji odmah pokazuje od kojih se stavki sastoji. Odnosno, slika-najava wiki posta u potpunosti duplira njegov sadržaj. Tako korisnici odmah vide šta ih čeka unutra. Pokazat ću vam primjerom.

Evo kako izgleda zakačena objava u zaglavlju stranice Flatro:

Grupni meni je zatvoren

Zatvoreni meni je isti wiki post kao u prethodnom pasusu, samo najava ima sliku bez stavki menija. Obično na njemu pišu: “Meni”, “Navigacijski meni” ili “Navigacija kroz javne materijale”.

Evo šta vidimo kada kliknemo na njega:

Usput, vrijedi napomenuti da ovo nisu jedine opcije. U stvari, na ovoj slici možete napisati šta god želite. Glavna stvar je da korisnik želi da klikne na nju, i da razumije šta ga čeka nakon toga. primjer:

Grupni meni

Spojeni meni je kada je slika na najavi vašeg menija jedna slika sa avatarom. Malo niže ću vam detaljno reći kako napraviti takav meni, ali za sada pogledajte kako lijepo izgleda.

GIF i avatar u jednoj slici

Ali ovaj dizajn šešira me je zaista jako impresionirao. Gif koji se automatski reprodukuje spaja se sa avatarom u jedinstvenu kompoziciju i privlači pažnju korisnika, iako o njemu nema nikakvih informacija.

Inače, špijunirao sam ovaj primjer u grupi SMM marketingaša Sergeja Šmakova. Pa, zahvaljujem mu na pronalasku :)

Skriveni meni

Skriveni meni je dostupan samo za grupe (stranice nemaju takvu funkciju). Da biste ga vidjeli, potrebno je da kliknete na odgovarajući link. Prednost ove metode dizajna je u tome što korisnici mogu vidjeti osnovne informacije zajednice, a ako žele koristiti meni, samo treba da naprave jedan klik. Međutim, ovdje postoji mali nedostatak - nisu svi korisnici svjesni postojanja ove funkcije, tako da bi vašem izborniku mogla pridati manje pažnje nego da je zakačen na vrh stranice.

Automatska reprodukcija videa

Krajem novembra 2015. na društvenoj mreži VKontakte pojavila se zanimljiva inovacija - čim korisnik uđe na vašu stranicu, video priložen uz zaglavlje počinje automatski da se reproducira. Ovom tehnikom možete privući još veću pažnju korisnika (posebno onih koji su prvi posjetili vašu stranicu), a pritom ne nervirati one kojima se ne sviđa kada im se nameće njihov sadržaj, jer se video reproducira bez zvuka. i praktično ne ometa.

Kako dodati ovaj video u zaglavlje vaše stranice?

Da biste to uradili, moraju biti ispunjena tri uslova:

• Priložite video na objavu i zakačite ovu objavu na vrh zajednice.
• Uz video, ništa drugo ne treba priložiti uz unos. Samo video i tekst opcioni.
• Videozapis mora prenijeti VKontakte - plejeri trećih strana nisu podržani.

Objava koja dobija mnogo repostova

Drugi način da produktivno iskoristite prostor u zaglavlju vaše stranice je da na njega zakačite jednu od svojih najuspješnijih objava – onu koja je već stekla i nastavlja dobivati ​​veliki broj lajkova i dijeljenja. Zašto to učiniti, mislim da svi razumiju - što više repostova, to je veća pokrivenost, stranica prima više pretplata.

Najave novih klipova, albuma, događaja

Prezentacija novih proizvoda/usluga

Popusti i promocije

Futrole, recenzije kupaca

Oglašavanje aplikacija

Praktične šale

Pravila zajednice

Linkovi na druge društvene mreže

Naveo sam daleko od svih opcija dizajna za kapu. Zapravo, na naslovnici i u zakačenoj objavi možete postaviti bilo koju informaciju: poslove, najave, linkove do najprodavanijih proizvoda itd. Zato se nemojte ograničavati na primjere iznad. Uključite svoju maštu i koristite dizajn svoje zajednice da postignete svoje ciljeve.

Šta bi trebao biti avatar

Avatar nije samo prekrasna slika sa logotipom vaše kompanije, već i radni alat za marketingaša, pomoću kojeg on ostvaruje svoje ciljeve. Pogledajmo pobliže kako bi to trebalo biti da bi privukli pažnju korisnika i potaknuli ih da završe ciljanu akciju. Počnimo sa sličicom.

Sličica avatara

1. Tekst na sličici avatara mora biti dovoljno velik da može biti čitljiv.







2. Tekst se ne smije širiti dalje od sličice.







3. Korisnicima treba biti jasno šta je prikazano na slici profila.







4. Ako je moguće, najbolje je ne koristiti slike sa zaliha, jer one često smanjuju kredibilitet kompanije.




5. Nepoželjno je da sličica avatara bude previše izblijedjela i dosadna, inače će se izgubiti u odnosu na svjetlije avatare konkurenata.



6. Ako želite da vaš avatar izgleda moderno, napravite ga u minimalističkom stilu: manje teksta, sjenki, preliva i elemenata koji nemaju nikakvo semantičko značenje. Vaš avatar bi trebao biti što jednostavniji i uredniji. Ovaj stil je trenutno u trendu.







7. Ako vam je cilj privući pažnju korisnika i izdvojiti se od ostalih avatara u feedu, morat ćete uključiti maštu. Razmislite na šta sami obraćate pažnju kada tražite zanimljive zajednice? Evo, na primjer, nekoliko puta su me privukli avatari sa upaljenim svjetlom, što obično ukazuje da je stigla nova poruka. Ovo je vrlo stara tehnika, ali iz nekog razloga još uvijek djeluje na mene - kada vidim takvo svjetlo, sigurno ću ga zadržati.

Ne kažem da će ovaj trik funkcionirati i na vašoj stranici. Poruka koju želim da prenesem je da postoji toliko mnogo načina da se istaknete, samo morate sebi postaviti pitanje i postati malo kreativniji. Evo, na primjer, još jedne interesantne ideje na koju se teško da bih pomislio:

Avatar je crni krug: veliki i mali. Čini se, zašto to uopšte raditi? Ali kada skrolujete kroz listu zajednica, takvi avatari privlače pažnju, jer su veoma različiti od svih ostalih.

Koje informacije se mogu postaviti na sličicu avatara

Iako je sličica avatara vrlo mala, može (i treba) se koristiti za privlačenje sljedbenika u vašu zajednicu. Kako uraditi? Pogledajmo nekoliko opcija:

Najava novog proizvoda/usluge/događaja

Prednosti kompanije/usluge/stranice

Broj telefona kompanije

Povoljne cijene

Besplatni transport

Inače, vrlo često se uz naziv same grupe dodaje podatak da kompanija pruža besplatnu dostavu, tako da će korisnici svakako obratiti pažnju na to.

Stock

Konkursi

Poslovi

Šta bi trebao biti sam avatar?

Razmišljao sam kakva bi trebala biti sličica avatara i koji tekst se može staviti na njega. Sada pređimo na sam avatar. Puna verzija avatara će biti prikazana samo u zajednici koja nema set naslovnica. Za takve slučajeve sam napisao ovaj odeljak. Dakle, kako treba da izgleda avatar vaše zajednice kako bi korisnici odmah shvatili da je vaša kompanija odgovorno i profesionalno pristupila kreiranju stranice.

1. Avatar mora biti visokog kvaliteta. O tome kako to postići, pisao sam malo više. Za one koji su propustili ovaj dio, reći ću ukratko - veličina avatara bi trebala biti 2-3 puta veća od one koju ste planirali.
2. Poželjno je da avatar bude kombinovan sa menijem: da bude iste šeme boja, da ima iste fontove, elemente itd. Zahvaljujući tome, zaglavlje vaše stranice će izgledati urednije i profesionalnije. primjer:
3. Sam avatar i sličica avatara mogu se razlikovati. Na primjer, možete nacrtati krug na avataru, stilizirati ga kako god želite, odabrati to područje kao sličicu i stilizirati ostatak avatara u drugom stilu.




Druga opcija je podijeliti avatar na dva dijela. Jedan za sličicu i jedan za ostatak avatara.




4. Kako biste podstakli korisnike da se pretplate na vašu stranicu ili napišu poruku predstavniku kompanije, možete postaviti odgovarajući poziv na akciju na samom dnu slike profila i popratiti ga strelicom koja pokazuje na dugme.




5. Pokušajte ne stavljati previše informacija na avatar, inače će izgledati preopterećeno i neuredno. Dodajte mu samo najvažnije tačke i pobrinite se da između njih postoji "zrak".

Koje informacije se mogu staviti na avatar?

Zapravo, na avatar se može staviti bilo šta. Za razliku od minijature, zaista ima gdje lutati. Najvažnije, nemojte to zloupotrebljavati :)

Domena web stranice

Telefon / adresa / radno vrijeme

Konkursi/promocije

Najviše kupovanih proizvoda/Novosti

informacije o isporuci

Oglašavanje mobilnih aplikacija

Glavne prednosti kompanije/stranice/proizvoda itd.

Obnavljanje asortimana/nove kreacije, itd.

Informacije da je vaša zajednica zvanična

Informacije o predstojećim događajima

Adrese naloga na drugim društvenim mrežama

Prošireni opis stranice

Hvali se

Općenito, apsolutno sve informacije mogu se postaviti na avatar. Uključio sam samo nekoliko ideja kako biste mogli vidjeti šta drugi rade i inspirirati se njihovim primjerima. Pa, imajte na umu glavne preporuke: avatar bi trebao biti visokog kvaliteta, font bi trebao biti velik, a između elemenata bi trebalo biti više "zraka".

Kako napraviti spojeni avatar i meni

Da biste napravili spojeni avatar i meni, trebat će vam Adobe Photoshop ili njegov ekvivalent. Objasnit ću cijeli proces koristeći Photoshop kao primjer. Pa idemo.

1. Preuzmite predložak za Photoshop, koji sam posebno pripremio za ovaj članak. U normalnoj veličini (meni - širina 510 piksela, avatar - 200) ili uvećana (meni - širina 1020 piksela, avatar - 400).
2. Otvorite sliku koju želite da uzmete kao osnovu.
3. Kopirajte ga, zalijepite u šablon i postavite na način na koji želite da bude izrezan.

1. Dodajte efekte, tekst, grafiku i još mnogo toga.

1. Ako ne želite da se dio slike izgubi (u tom razmaku, koji iznosi 50 piksela), pomaknite ga udesno kao što je prikazano na sljedećem GIF-u:

1. Odaberite alat "Ugniježđenje" i kliknite na dugme "Fragmenti duž vodilica".

1. Izbrišite nepotrebne fragmente (desni klik - "Izbriši fragment") i uredite postojeće (desni klik - kliknite na prazno mjesto - uzmite željeno područje i rastegnite ga do željene veličine).

1. Idite na odjeljak "File" i odaberite naredbu "Save for Web".

1. Idite na mjesto gdje ste snimili slike (desktop ili neki određeni direktorij) i tamo pronađite mapu pod nazivom "Slike". Ovdje će biti vaše slike. Sada ostaje samo da ih popunite na stranici.

P.S. Visinu avatara možete promijeniti po vlastitom nahođenju. Uzeo sam maksimalnu veličinu - 500 piksela, ali ovu vrijednost možete imati i manje. Na primjer, kao na stranici "Wiki markup":

Kako koristiti widgete

Widgeti su također dio dizajna VK zajednice. Uz pomoć njih korisnik može: naručiti, pretplatiti se na vaš newsletter, učestvovati u nagradnoj igri, pročitati i ostaviti recenzije, otvoriti pretragu zajednice, dobiti poklon, kupon za popust itd.

Evo nekoliko primjera kako izgledaju widgeti na stranici VKontakte:

Kako postavljati slike

Ako ste web dizajner ili imate umjetnički ukus i osjećaj za lijepo, onda vam neće biti teško da osmislite korporativni identitet za svoje slike. Međutim, čini mi se da će takvih ljudi u ovom članku biti manjina (inače, ni ja nisam jedan od njih). Stoga, pogledajmo pobliže kako se to radi, na primjerima uspješnih kompanija.

Usput, imajte na umu da gotovo sve poznate kompanije VKontakte brendiraju svoje slike, odnosno dodaju mali logo, adresu svoje stranice ili vodeni žig. Ovo povećava svijest o brendu i štiti vaše slike od kopiranja. Da li se isplati, svako odlučuje za sebe. Jedino što bih želio savjetovati je da ako se ipak odlučite na to, pokušajte paziti da vaš logo ne bude previše svijetao i da ne zauzima previše prostora, inače će sav naglasak biti na njemu i slika će izgubiti svoju privlačnost.

Gdje mogu dobiti dobre slike?

Imamo dobar članak na ovu temu na našem blogu - "". Svi su besplatni, ali za neke je potrebna registracija. Ako ne pronađete ništa prikladno za sebe, pokušajte pretraživati ​​po ključnoj riječi + pozadina (ili, ako je na engleskom, pozadina). Tipično, takav zahtjev proizvodi slike visokog kvaliteta. Ali ovdje morate biti oprezni i provjeriti vrstu licence, inače, ako imate ozbiljan posao, možete upasti u nevolje.

A šta je sa onima koji ne znaju raditi u Photoshopu?

Ako nikada niste radili u Photoshopu (ili nekom drugom grafičkom uređivaču) i još niste spremni da odvojite vrijeme da ga savladate, možete koristiti servise koji već imaju gotove šablone slika za razne društvene mreže:

1. Fotor.com

Nakon toga na lijevoj strani ekrana odaberite šablon koji nas zanima. Imajte na umu da su besplatni samo oni šabloni koji nemaju ikonu dijamanta.

Umetnite ga u šablon, selektujte ga levim tasterom miša, izaberite komandu Layer (ikona sendviča) i kliknite na Premesti na dno. Tako će naša slika ići u pozadinu, a na njoj će biti postavljeni svi natpisi.

Nakon toga mijenjamo tekst, font, veličinu fonta, poziciju natpisa itd.

Zatim kliknite na ikonu u obliku diskete, odaberite naziv, format slike, kvalitet i kliknite na dugme Prijavi se za preuzimanje.

2.Canva.com

Još jedna usluga koja će vam pomoći da lijepo uredite svoju sliku. Radi na istom principu kao i prethodni. Registriramo se na servis (možete koristiti svoj Google+ račun ili email).

Odaberite svoje polje aktivnosti. Preskačemo korak u kojem se od vas traži da pozovete prijatelje. Dolazimo do glavnog menija, gdje biramo Facebook objavu ako nam je potrebna pravokutna fotografija ili Instagram objavu ako nam je potrebna kvadratna.

Odaberite predložak (ako je predložak označeno sa "FREE", onda je besplatan), promijenite tekst.

Ako je potrebno, postavite svoju sliku, prilagodite veličinu, promijenite tekst, font i poziciju natpisa. Nakon toga kliknite na dugme "Preuzmi", odaberite format slike i sačuvajte je na računar ili bilo koji drugi uređaj.

Kako formatirati članke u uređivaču

Od nedavno, VKontakte može kucati članke u posebnom uređivaču. Da biste kreirali članak, morate kliknuti na slovo "T":

Kako koristiti wiki oznake

Eto, dolazimo do najzanimljivijeg, a ujedno i teškog dijela. Možda među čitaocima ima ljudi koji ne znaju šta je wiki markiranje, a generalno prvi put čuju ovaj termin. Stoga ću, posebno za vas, dati definiciju koju sam "Kontakt" daje.

Wiki markup je jezik za označavanje koji se koristi za formatiranje teksta na web stranicama (obično klasifikovanih kao wiki projekti) i olakšava pristup funkcijama HTML jezika. Na našoj stranici, wiki stranice su dobra alternativa redovnim objavama i tekstualnoj navigaciji. Ako trebate napraviti veliki članak s različitim formatiranjem teksta (podebljano, podvučeno, naslovi, itd.) ili mu dodati grafiku, ili jednostavno kreirati šareni navigacijski meni za svoju zajednicu, wiki je neophodan.

Baš kao što Wordpress (ili bilo koji drugi CMS) ima HTML uređivač pomoću kojeg kreirate članke, Contact ima svoj uređivač za kreiranje i uređivanje wiki stranica. izgleda ovako:

Pomoću ovog uređivača kreiraju se navigacijski meniji, kao i članci sa slikama, video zapisima i audio snimcima. Malo niže ću detaljno analizirati kako raditi u ovom uređivaču, ali prvo vas molim da za sebe označite dvije veze. Oni će vam puno pomoći u učenju wiki markiranja.