Mislim da su svi koji aktivno koriste društvenu mrežu Vkontakte već upoznali lijepo dizajnirane grupe i publiku. Mnogi od njih, osim menija, imaju i mnogo stilizovanih ugniježđenih stranica, direktorija itd., što u stvari stvara malu stranicu unutar društvene mreže.
Evo nekoliko primjera kako bi svi shvatili o čemu se radi.
Takve grupe vam omogućavaju da se izdvojite od konkurencije i privučete više korisnika. Pogotovo ako je i sadržaj zanimljiv :)
U okviru ovog članka govorit ćemo o tome kako se sve to radi. Da bismo sve detaljnije rastavili i uronili u sve suptilnosti, uzmimo konkretan primjer. Održat će se mala majstorska klasa grupnog dizajna.
Prva faza našeg rada je ideja. Moramo razumjeti šta želimo da kažemo i kome. Postoji nekoliko formata zajednica u kontaktu i vrijedi ih odabrati na osnovu postavljenih zadataka. Iako se u budućnosti grupa može pretvoriti u javni format i obrnuto.
Objašnjavam to na prstima. Javno- ovo je nešto za upoređivanje sa blogom. Newsline. Drugim riječima, našim pretplatnicima govorimo o nekim stvarima i oni neće moći pisati na zidu naše zajednice. Maksimum je komentarisati.
Grupa omogućava vam da stvorite otvoreniju zajednicu za razgovor i diskusiju, gdje ljudi mogu objavljivati u svoje ime u feedu. Na njega možete dodati i prijatelje sa svoje liste. Ne postoji takva mogućnost u javnosti. Osim toga, grupa ima malo više opcija za integraciju wiki oznaka (postoji odjeljak "Novosti" u koji možete integrirati meni).
Globalno, možete razmišljati ovako: ako trebamo stvoriti zajednicu za radnju, onda bih uzeo "javni" format. Ako govorimo, na primjer, o ljubiteljima ribolova, onda je bolje uzeti "grupu". Mada, svako je slobodan da radi kako mu odgovara. Na kraju krajeva, format se može promijeniti u bilo kojem trenutku. Međutim, imajte na umu da Vkontakte uvodi ograničenje za ponovnu promjenu formata zajednice i nakon prvog puta morat ćete pričekati nekoliko dana prije nego što možete sve vratiti ako je potrebno. Stoga je bolje testirati funkcionalnost prije nego što grupa počne da se puni sadržajem.
Kao dio ove majstorske klase, uzet ću igru Mad Max baziranu na istoimenom filmu, koji je izašao prije samo nekoliko sedmica, kao polaznu tačku i stvorit ću zajednicu za igrače sa raznim materijalima o ovoj igrici . Glavni cilj je odvući promet na vašu web lokaciju za igre.
Format će biti "Grupa", jer morate stvoriti prirodan protok publike i maksimizirati komunikaciju unutar zajednice. Odmah ću pojasniti da ću koristiti univerzalnu tehniku koja se može primijeniti iu grupnom i javnom formatu. Radi svuda.
Ima puno sadržaja, počinjemo da oživljavamo ideju!
Kreiranje grupe
Da biste kreirali grupu, idite na "Moje grupe" u desnom meniju vašeg Vkontakte naloga i kliknite na plavo dugme na vrhu "Kreiraj zajednicu".
Trebalo bi da se pojavi ovaj prozor u koji unosimo naziv naše grupe i biramo format.
Nakon unosa potrebnih podataka, ispred nas se otvara kontrolni panel za našu zajednicu. U mom slučaju to izgleda ovako.
Kao što vidite, dodao sam nekoliko parametara: uključio sam video, audio snimke, diskusije i niz drugih funkcija koje će mi koristiti u budućem radu prilikom prikupljanja sadržaja. Sve se to može dalje mijenjati bez ikakvih ograničenja. Takođe sam registrovao adresu svog sajta. Ako nemate stranicu, ili njena tematika ne odgovara formatu zajednice (radi se o različitim stvarima i nisu ni na koji način međusobno povezane), onda ovaj red možete ostaviti prazan.
Stavljam starosne granice u ovom slučaju od 18, po analogiji sa onima koje su programeri izložili igri. Mada gotovo i ne sumnjam da se i djeca igraju.
Sve. Grupa je kreirana!
Sada možete početi da ga dizajnirate.
Dizajn grupe Vkontakte
Ova faza se može podijeliti na 2 komponente: grafičku i tehničku. Za rad nam je potreban šablon za kreiranje grupnog avatara i menija, kao i malo mašte i osnovno poznavanje Photoshopa (aka Adobe Photoshop).
Predložak za označavanje
Šta je šablon i šta je uopšteno? Šablon je neka vrsta praznine. U ovom slučaju, u * .psd formatu, označili smo područja za sliku ispod menija i avatare grupe.
Kao što možete vidjeti u drugom primjeru na početku ovog članka, možemo napraviti dizajn u istom stilu za avatar i sliku menija. Istovremeno, vizualno ga seče na 2 dijela. Dakle, predložak vam omogućava da formirate sliku na takav način da eliminišete pomicanje grafike i uklopite slike na jedan nivo što je više moguće.
Da bude jasnije, evo primjera.
Vidimo da je sa obje strane slike pruga koja gleda na stambeni dio. Gotovo je nemoguće učiniti tačno prvi put bez upotrebe šablona. Morat ćete prilagoditi slike, mjereći odstupanja do 1px. Dok kada koristimo šablon, jednostavno mu dodamo grafiku unutar oznake i odmah dobijemo željeni rezultat.
Želim napomenuti da je ovaj šablon dizajniran za 1 red u objašnjenju. Na snimku ekrana primjera nalaze se telefoni. Ako se pojavi drugi red, morat ćete koristiti drugi predložak ili ručno popraviti dizajn.
U međuvremenu prelazimo direktno na grafički dizajn naše nove grupe. Ovdje idem putem najmanjeg otpora i idem na Google Images da pronađem dizajnerske komade. Možete koristiti i Yandex. Ko šta više voli.
Nemam dizajnersko obrazovanje, pa se nećemo detaljno zadržavati na odabiru fontova i drugim sitnicama. Nakon neke magije u Photoshopu, dobio sam sljedeći rezultat.
Na lijevom fragmentu (gdje je natpis "Meni"), također možete dodati nekoliko okidača. U ovom slučaju, odlučio sam bez njih. Sve. Dizajn avatara je spreman. Pritisnite Shift + Ctrl + Alt + S prečice u Photoshopu i sačuvajte naše fragmente u fasciklu na vašem tvrdom disku.
Prva faza rada sa grafikom je završena. Vraćamo se na kontakt.
Postavljanje avatara i menija za grupu
Kliknemo na dvije vrste na mjestu ava naše grupe i tamo učitavamo našu sliku. Ovi momci, ispod njih takođe piše "Učitaj fotografiju".
Dodajte sliku. Odredite polja i odaberite sličicu. Ovdje je sve jednostavno i ne bi trebalo biti nikakvih problema.
Kao što vidimo, morate znati ID zajednice. Vrlo je lako saznati. Pronalazimo meni u našoj grupi (odmah ispod avatara) i otvaramo "Statistike zajednice". U ovom slučaju, nešto slično će se pojaviti u adresnoj traci pretraživača (brojevi će biti drugačiji).
Ovi brojevi iza "? Gid =" su željeni id grupe. Dobivenu vrijednost ubacujemo u formu skripte i upisujemo naziv stranice koju želimo kreirati. U ovom slučaju vozim u "Menu".
Treba napomenuti da će stranica biti kreirana samo ako je prozor sa grupom otvoren u susjednoj kartici. Jednostavno rečeno, morate biti prijavljeni na VK u istom pretraživaču. Zaista, samo administrator grupe i ljudi koji su im dodijeljeni imaju pristup takvim manipulacijama. Slučajni prolaznik ne može lako da preuzme i promeni podešavanja grupe kojoj u admin panelu nema pristup.
Ako je sve urađeno kako treba, ova stranica će se otvoriti.
Ovo je upravo prozor u kojem ćemo kasnije napraviti wiki oznake i kreirati interni meni za našu grupu. Za sada nam je dovoljno da ovde nešto napišemo. Nakon toga pritisnemo plavo dugme "Sačuvaj stranicu" i na vrhu pritisnemo link Povratak na stranicu.
Napisao sam "Meni" za sebe i moja stranica je nakon snimanja počela izgledati ovako.
Još nema dizajna, ali sada nam treba samo link do ove stranice. Podižemo ga u adresnoj traci pretraživača i vraćamo se na glavnu stranicu naše grupe. U traku.
Ovdje kreiramo objavu sljedećeg sadržaja: ubacite sliku i link do stranice menija za grupu.
Kliknite pošalji. Nakon toga kliknemo na vrijeme slanja poruke i između svih opcija biramo stavku "Pin". Ažuriramo stranicu (taster F5 na tastaturi) i, ako je sve urađeno kako treba, dobijamo prvi rezultat: grupa je nabavila avatar i link za odlazak na odjeljak menija.
Wiki oznaka menija grupe Vkontakte
Sada krenimo sa dizajniranjem samih menija. Vratite se u Photoshop i kreirajte dizajn za naš meni. Kada dizajnirate sučelje, morate se sjetiti onih ljudi koji će ući u VK putem aplikacije s mobilnih telefona. Drugim riječima, ne treba imati male elemente i osim toga, treba se truditi da sve bude što jasnije. Da ne bismo morali nagađati kako je sve ovdje raspoređeno i gdje treba kliknuti... već jednostavno gurnemo na željenu tačku i proučimo tražene podatke.
Sada se neću detaljno zadržavati na tome kako sam tačno sastavio jelovnik. To sam i uradio.
Minimum polja. Vertikalni raspored. Idealan format za responsive menije. Odnosno, ništa neće ići nikuda na mobilnim uređajima. Sve će biti baš kao na ekranima kompjutera i tableta. Uzimam širinu od 500 px, da se kasnije ništa ne bi smanjilo i da ne izgubi kvalitet slike dva puta. Visina nije bitna.
Izrežite sliku na fragmente i sačuvajte ih.
Sve. Vrijeme je za završni akord - jelovnik skupljamo već u samoj grupi.
Da bismo to učinili, vraćamo se na glavnu stranicu grupe (gdje su feed i naša slika-link koja vodi do menija). Kliknemo mišem na sliku menija i dođemo do same stranice koju smo ranije kreirali za meni.
Ako ste administrator ili kreator grupe (u našem slučaju je to slučaj), onda će na vrhu stranice biti link "Uredi". Kliknemo na njega.
Zatim idemo u režim wiki-markiranja (ispod dugmeta za zatvaranje u gornjem desnom uglu stranice, takav okvir je nacrtan sa<>unutra). Kada je aktiviran željeni način rada, ovo dugme je označeno sivom bojom.
Zatim gurnemo u ikonu kamere i dodamo sve fragmente našeg menija odjednom. U wiki modu nećemo vidjeti same slike, već samo kod ovih slika sa veličinama i parametrima.
Želim postaviti meni u centar tako da nema praznina između fragmenata. Stoga svaki od elemenata umotavamo u oznaku
Prva i poslednja stavka menija ne bi trebalo da budu dugmad - na mojoj slici je to samo grafički element bez veze ka internoj stranici, pa im dodajemo parametar "nolink". Ovo će ukloniti mogućnost da kliknete na ovaj element da biste otvorili dio slike u zasebnom prozoru. Sada se ništa neće dogoditi jednim klikom miša. Ovo je normalna pozadina stranice. Neaktivan.
U mom slučaju, kod menija izgleda ovako.
Odvojeno, želio bih napomenuti činjenicu da nakon uvoza slika u VK, ugrađeni sistem ponekad pogrešno ukazuje na veličinu slika. Stoga, morate to pomno pratiti i izložiti upravo one koje smo planirali u fazi projektovanja dizajna. U suprotnom, sve može poći po zlu i slagalica se na kraju neće riješiti.
Kada smo napisali kod i poravnali sve elemente, sačuvamo stranicu i vidimo istu stvar kao u Photoshopu.
Završni dodir ostaje - potrebno je da kreirate same stranice na koje će naš meni slati ljude. Da bismo to uradili, ponovo ćemo se obratiti skripti za generisanje wiki stranica i ovog puta naručujemo tri stranice odjednom. U ovom slučaju, također morate napisati nešto na svakom i ne zaboravite da sačuvate njihove adrese negdje iz adresne trake pretraživača.
Zatim u wiki-kod menija ubacujemo linkove ka novim stranicama u obliku stranice-102302049_51013384, gdje je prvi broj id grupe, a drugi broj stranice. Mada, to generalno nije važno. Na kraju krajeva, samo trebamo kopirati ovaj komad URL-a i zalijepiti ga u oznaku.
Kao rezultat, kod menija poprima sljedeći oblik.
Spolja, ništa se nije promijenilo. Ali kada kliknemo na stavke menija, vidimo da sada radi!
Što se tiče same oznake i pravila po kojima je kod napisan, savjetujem vam da pročitate Vkontakte grupu posebno posvećenu ovoj stvari. Momci su opisali sve ključne tačke iu njihovom katalogu možete lako pronaći potreban element i smisliti kako ga dodati na svoju wiki stranicu.
Prekrasan dizajn zajednice VKontakte nije hir, već važan element koji formira povjerenje korisnika u vas i vašu kompaniju. Ako javna stranica ili grupa nije profesionalno dizajnirana, vaši potencijalni klijenti mogu sasvim logično zaključiti da ste jednako nemarni prema 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 veličina i principi prikazivanja slika promijenili. Memorandum, koji će biti dat u nastavku, odgovara svim inovacijama i sadrži dimenzije koje su relevantne u ovom trenutku.
Sada pogledajmo pobliže svaku stavku.
Veličina VK avatara
Minimalna veličina avatara je 200 x 200 piksela. Ako pokušate učitati sliku manju od 200 piksela širine ili dužine, vidjet ćete grešku poput ove:
Maksimalna veličina avatara je 200 x 500 piksela. Ali, u principu, možete postavljati slike i veće veličine - do 7000 piksela sa svake strane. Glavna stvar je da omjer njihovih strana ne prelazi 2 do 5.
Dozvolite mi da vam pokažem na primjeru.
Imam sliku. Njegova veličina je 200 x 800 piksela (odnos 2 prema 8). Prilikom učitavanja ne dolazi do greške. 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 ne prikazuje se puna verzija omota, već samo dio veličine 1196 x 400 piksela. Pogledajte kako se izrezuje 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 na post više ne rastežu, već ostaju takve kakve jesu. Stoga, ako želite da vaša slika u potpunosti ispuni svoj dodijeljeni prostor u feedu vijesti, njena širina mora biti najmanje 510 piksela. Najbolje je da je to kvadrat ili pravougaonik u pejzažnoj orijentaciji.
Zvuči malo zbunjujuće :) Pa ću vam pokazati na primjeru.
Recimo da imamo kvadratnu sliku sa stranicama od 510 piksela. Ako ga priložimo uz naš post, izgledat će vrlo dobro 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 pametnih telefona. Da biste to provjerili, 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 im u drugom slučaju biti malo udobnije.
Slike za postove sa linkom
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že se lako promijeniti - ili možete odabrati drugu sliku iz članka pomoću posebnih strelica:
Ili prenesite svoje:
Minimalna veličina slike koju možete koristiti kao pregled za svoj članak je 537 x 240 piksela. Međutim, možete otpremati veće slike sve dok je omjer širine i visine ispravan.
Slika za članak kreiran u uređivaču
Veličina slike za naslovnicu članka, kreirana u uređivaču, je 510 x 286 piksela. Bolje je da je tamna i manje-više jednobojna, jer se naslov članka i zajednica gubi na svijetloj pozadini.
dobar primjer:
Nije 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.
Priče treba da koriste fotografije i video zapise u vertikalnom formatu.
Imajte na umu: priče u ime zajednica u ovom trenutku mogu dodavati samo velike zajednice za koje su programeri VKontaktea otvorili ovu funkciju. I to se radi pomoću službene aplikacije. Ovo se ne može uraditi sa računara.
Veličina omota foto albuma
Veličina slike za video
1280 x 720 piksela.
Wiki stranica
Oblast sadržaja wiki stranice je široka 607 piksela. Ako otpremite veću sliku, ona će automatski prenijeti širinu od 400 piksela. Primjer: Imam sliku 1366 x 768. Ako je dodam na wiki stranicu, izgleda ovako:
Da biste promijenili veličinu slike, potrebno je kliknuti na nju i postaviti željene vrijednosti:
U nastavku ću detaljno opisati kako raditi sa wiki stranicama. 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 kvalitet slike.
Ako ste ikada pokušali da otpremite VKontakte slike (nije važno da li 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 vidljivo na tamnoj (a posebno na 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, ali u znatno manjoj mjeri), potrebno ju je učiniti 2-3 puta većom od potrebne 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, uzmite - 1020 x 800.
Slika na tamno plavoj pozadini, koju sam doneo malo iznad, ima veličinu 510 x 350. Napravio sam je duplo veću (1020 x 700) i sačuvao. Eto šta je ispalo iz toga:
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 stilizirati zaglavlje stranice
Zaglavlje vaše javne stranice ili grupe je prva stvar koju korisnici vide kada vas posjete. U većini slučajeva ovo mjesto se koristi za postavljanje menija za navigaciju na osnovu javnih materijala, nekih zanimljivih objava ili važnih najava. Pogledajmo primjere kako različite kompanije koriste ovaj prostor.
Cover
Ne tako davno, VKontakte je uveo ažuriranje - sada možete postavljati velike i lijepe naslovnice na stranice (1590 x 400 piksela). Da biste to učinili, idite na Postavke i kliknite na dugme Preuzmi.
Na naslovnicu možete staviti sve što želite: 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 omota. Kako funkcionira, u koje svrhe se može koristiti i s kojim servisima ga instalirati, pročitajte u našem članku.
Primjeri dinamičnih skinova:
Naslovnica + opis zajednice + link na web stranicu
Neke kompanije posebno ne popravljaju nijednu objavu u zaglavlju kako bi korisnici mogli pročitati osnovne informacije o stranici i otići direktno 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 sreo nijedan slučaj na ovu temu, pa ako neko zna bit ću zahvalan ako podijelite link.
Zakačen post koji govori o čemu je stranica
Ako želite detaljnije ispričati svoju stranicu (sa fotografijama, linkovima i lijepim izgledom), onda možete priložiti wiki post ili članak, otkucan u uređivaču, sa svijetlom slikom na najavi u zaglavlje, koji će potaknuti korisnike da kliknu 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 stavki se sastoji. To jest, slika za pregled wiki posta u potpunosti duplira njegov sadržaj. Tako korisnici odmah vide šta ih čeka unutra. Dozvolite mi da vam pokažem na primjeru.
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 na kojoj nema stavki menija. Obično na njemu pišu: "Izbornik", "Navigacijski meni" ili "Kretanje kroz javne materijale".
A evo šta vidimo kada kliknemo na njega:
Usput, treba napomenuti da su to daleko od jedine opcije. U suštini, 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:
Fusion meni za grupu
Spojeni meni je kada je slika na najavi vašeg menija jedna slika sa avatarom. U nastavku ću vam detaljno reći kako da napravite takav meni, a za sada pogledajte kako lijepo izgleda.
GIF i avatar u jednoj slici
Ali ova opcija za dizajn kapice me je zaista jako impresionirala. Automatski reprodukovani GIF se spaja sa avatarom u jedinstvenu kompoziciju i privlači pažnju korisnika, iako o njemu uopšte nema informacija.
Inače, vidio sam ovaj primjer u grupi SMM marketingaša Sergeja Šmakova. Tako da mu se zahvaljujem na pronalasku :)
Skriveni meni
Skriveni meni je dostupan samo za grupe (stranice nemaju ovu 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 vašem izborniku može 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 posjeti vašu stranicu, video priložen uz zaglavlje počinje automatski da se reproducira. Uz pomoć ove tehnike možete privući još veću pažnju korisnika (posebno onih koji su prvi posjetili vašu stranicu), a ujedno, ne nervirati one koji ne vole kada im se nameće njihov sadržaj, jer video svira se bez zvuka i praktički ne ometa...
Kako dodati takav video u zaglavlje vaše stranice?
Da biste to učinili, moraju biti ispunjena tri uslova:
- Priložite video na objavu i zakačite ovu objavu na vrh zajednice.
- Osim videa, uz snimak ne smije biti priloženo ništa drugo. Samo video i tekst opcioni.
- Videozapis mora prenijeti VKontakte - plejeri trećih strana nisu podržani.
Objava koja dobija mnogo dijeljenja
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 se to radi, mislim, svima je jasno - što više repostova, to je veća pokrivenost, stranica ima više pretplata.
Najave novih klipova, albuma, događaja
Prezentacija novih proizvoda/usluga
Popusti i promocije
Futrole, recenzije kupaca
Application Advertising
Praktične šale
Pravila zajednice
Linkovi na druge društvene mreže
Naveo sam daleko od svih opcija za dizajn zaglavlja. Uglavnom, na naslovnici i u zakačenom postu možete postaviti bilo koju informaciju: poslove, oglase, linkove na najprodavanije proizvode itd. Zato se nemojte ograničavati na primjere iznad. Budite kreativni i koristite dizajn zajednice da biste postigli svoje ciljeve.
Šta bi trebao biti avatar
Avatar nije samo prekrasna slika s logom vaše kompanije, već i radni alat za marketerskog stručnjaka, uz pomoć kojeg on ostvaruje svoje ciljeve. Pogledajmo pobliže šta bi to trebalo da bude kako bi privuklo pažnju korisnika i potaknulo ih da izvrše ciljanu akciju. Počnimo sa minijaturom.
Sličica avatara
- Tekst na sličici avatara mora biti dovoljno velik da može biti čitljiv.
- Tekst ne bi trebao ići dalje od sličice.
- Korisnici bi trebali razumjeti šta je prikazano na avataru.
- Ako je moguće, najbolje je ne koristiti slike sa zaliha, jer one često umanjuju kredibilitet kompanije.
- Nepoželjno je da sličica avatara bude previše dosadna i dosadna, inače će se izgubiti na pozadini svjetlijih avatara konkurenata.
- Ako želite da vaš avatar izgleda moderno, napravite ga u minimalističkom stilu: manje teksta, sjenki, preliva i elemenata koji ne nose nikakvo semantičko opterećenje. Vaš avatar bi trebao biti što jednostavniji i uredniji. Ovaj stil je sada u trendu.
- Ako vam je cilj privući pažnju korisnika i izdvojiti se iz pozadine drugih avatara u feedu, morat ćete uključiti maštu. Razmislite šta tražite kada tražite zanimljive zajednice? Ovdje su me, na primjer, više puta privlačili 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 sugeriram da će ovaj trik funkcionirati i na vašoj stranici. Ono što želim da kažem je da postoji jako, jako mnogo načina da se izdvojite, samo trebate postaviti ovo pitanje i pokazati malo kreativnosti. Na primjer, evo 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će raditi? Ali kada skrolujete kroz listu zajednica, ovi 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
Slobodna radna mjesta
Š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 instaliranu naslovnu sliku. Za takve slučajeve sam napisao ovaj odeljak. Dakle, kakav bi trebao biti avatar vaše zajednice kako bi korisnici odmah shvatili da je vaša kompanija odgovorno i profesionalno pristupila kreiranju stranice.
- Avatar mora biti visokog kvaliteta. Kako to postići, napisao 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.
- Poželjno je da avatar bude u kombinaciji sa menijem: ima istu šemu boja, ima iste fontove, elemente itd. Zahvaljujući tome, zaglavlje vaše stranice će izgledati urednije i profesionalnije. primjer:
- Sam avatar i sličica avatara mogu biti različiti. Na primjer, možete nacrtati krug na svom avataru, stilizirati ga kako god želite, odabrati to područje kao sličicu i stilizirati ostatak avatara u drugom stilu.
- 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 avatara i popratiti ga strelicom koja pokazuje na dugme.
- Pokušajte da ne objavljujete previše informacija na svom avataru, inače će izgledati pretrpano i neuredno. Dodajte mu samo najvažnije tačke i uverite se da između njih postoji "zrak".
Druga opcija je podijeliti avatar na dva dijela. Jedan za sličicu i jedan za ostatak avatara.
Koje informacije se mogu staviti na avatar?
U suštini, možete staviti bilo šta na svoj avatar. Za razliku od minijatura, ovdje se zaista ima gdje lutati. Najvažnije, ne preterujte :)
Domena web stranice
Telefon / adresa / radno vrijeme
Konkursi / promocije
Najviše kupljeni proizvodi/novi artikli
informacije o isporuci
Oglašavanje mobilnih aplikacija
Glavne prednosti kompanije/stranice/proizvoda itd.
Obnavljanje asortimana/nova kreativnost, 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. Dao sam samo nekoliko ideja kako biste mogli vidjeti šta drugi rade i biti inspirirani njihovim primjerima. Pa, imajte na umu osnovne preporuke: avatar bi trebao biti kvalitetan, font bi trebao biti velik, a između elemenata bi trebalo biti više "zduha".
Kako napraviti spojeni avatar i meni
Da biste napravili spojeni avatar i meni, potreban vam je Adobe Photoshop ili njegov ekvivalent. Objasnit ću cijeli proces na primjeru Photoshopa. Pa idemo.
- Preuzmite predložak za Photoshop koji sam posebno pripremio za ovaj članak. Uobičajena veličina (meni - širina 510 piksela, avatar - 200) ili zumirana (meni - širina 1020 piksela, avatar - 400).
- Otvorite sliku na kojoj želite da se zasnivate.
- Kopirajte ga, zalijepite u šablon i postavite na način na koji želite da ga izrežete.
- Dodajte efekte, tekst, grafiku i još mnogo toga.
- Ako ne želite da se dio slike izgubi (na tom prostoru, što je 50 piksela), pomaknite ga udesno kao što je prikazano na sljedećem gif-u:
- Odaberite alat "Citting" i kliknite na dugme "Slices by guides".
- Izbrišite nepotrebne fragmente (desni klik - "Izbriši fragment") i uredite postojeće (desni klik - kliknite na prazan prostor - uzmite potrebnu oblast i rastegnite je na potrebnu veličinu).
- Idite na odjeljak "File" i odaberite naredbu "Save for Web".
- Dođite do lokacije na kojoj ste spremili 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 vaša vrijednost može biti manja. 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šu mailing listu, učestvovati u natjecanju, pročitati i ostaviti recenzije, otvoriti pretragu u zajednici, dobiti poklon, kupon za popust itd.
Evo nekoliko primjera kako izgledaju widgeti na stranici VKontakte:
Kako stilizirati slike za postove
Ako ste web dizajner ili imate umjetnički ukus i osjećaj za lijepo, onda vam ne bi trebalo biti teško da osmislite korporativni identitet za svoje slike. Međutim, čini mi se da će takvi ljudi u ovom članku biti manjina (ni ja njima, inače, ne pripadam). 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 to isplati, svako odlučuje za sebe. Jedino što bih želio savjetovati: 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, a slika će izgubi svoju atraktivnost.
Gdje mogu dobiti dobre slike?
Imamo dobar članak na blogu na ovu temu - "". Svi su besplatni, ali za neke je potrebna registracija. Ako ne nađete ništa prikladno za sebe, pokušajte tražiti ključnu riječ + pozadina (ili, ako je na engleskom, pozadina). Obično se za takav zahtjev objavljuju visokokvalitetne slike. 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 mogu 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 različite 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 šabloni koji nemaju ikonu dijamanta.
Zalijepite ga u šablon, odaberite ga lijevom tipkom miša, odaberite naredbu Layer (ikona sendviča) i kliknite na Premjesti 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 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 ukrasite svoju sliku. Radi na istom principu kao i prethodni. Registriramo se na servis (možete koristiti svoj Google+ račun ili email).
Odabirom našeg područja djelovanja. 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 dimenzije, promijenite tekst, font i poziciju natpisa. Nakon toga pritisnite dugme "Preuzmi", odaberite format slike i sačuvajte je na računaru ili bilo kom drugom uređaju.
Kako formatirati članke u uređivaču
Nedavno je VKontakte mogao 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 daje sam "Kontakt".
Wiki markup je jezik za označavanje koji se koristi za formatiranje teksta na web stranicama (obično pripadaju klasi wiki projekata) i olakšava pristup mogućnostima 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 po vašoj zajednici - wiki je nezamjenjiv.
Baš kao što Wordpress (ili bilo koji drugi CMS) ima HTML uređivač pomoću kojeg kreirate članke, tako i Contact ima svoj uređivač za kreiranje i uređivanje wiki stranica. izgleda ovako:
Uz pomoć ovog uređivača kreiraju se navigacijski meniji, kao i članci sa slikama, video zapisima i audio snimcima. U nastavku ću detaljno analizirati kako raditi u ovom uređivaču, ali prvo vas molim da dodate dvije veze u svoje oznake. Oni će vam puno pomoći u učenju wiki markiranja.
Uređivanje članka na Wikipediji je jednostavno. Pratite link "uredi". Stranica za uređivanje će se otvoriti; ima tekstualni oblik sa izvorom članka, koji sadrži posebne znakove - "wiki" oznaku opisanu u nastavku.
Uređivanje
Zatim: izvršite željene promjene u izvornom tekstu; ukratko opišite značenje vaše revizije u redu "Opis izmjena"; da biste provjerili ispravan prikaz stranice, kliknite na dugme "Pregled"; ako je stranica u redu, objavite svoju novu verziju klikom na dugme "Sačuvaj stranicu".
Molimo pišite iz neutralnog ugla: izbjegavajte pristrasnost i pretjeranu emocionalnost; Navedite izvore informacija kako biste pomogli drugima da potvrde i dopune vaš rad. Vwilam: Nije teško i veoma korisno.
Dodatne mogućnosti
Iznad obrasca za uređivanje teksta nalaze se dugmad za formatiranje teksta, ispod - panel za brzo umetanje specijalnih znakova, elemenata wiki označavanja i šablona. Dugme "Promjene napravljene" vam omogućava da uporedite izvorni kod sa onim što imate u prozoru za uređivanje. Registrirani članovi također imaju pristup: kućici za potvrdu "Mala promjena" koja vam omogućava da svoje promjene označite kao manje; Označite potvrdni okvir "Dodaj ovu stranicu na listu za praćenje" kako biste pratili daljnje izmjene ovog članka. Često je zgodno prvo kopirati tekst u uređivač teksta (preko međuspremnika), urediti, a zatim ga prenijeti nazad u obrazac za uređivanje u pretraživaču. U ove svrhe trebate koristiti uređivač teksta koji podržava Unicode. Osim toga, možete raspravljati o člancima s drugim članovima. Gotovo svaki članak na Wikipediji ima paralelnu stranicu za diskusiju. Učesnici jednostavno uređuju ovu stranicu, baš kao i članke: idite na stranicu "diskusija" i kliknite "uredi" tamo. Diskusije, opet, treba da prate pravila; glavno je da izbegavate oštrinu i pretplatite se (četiri tilde niska 14:39, 14. jun 2007. (MSD) u kodu stranice).
Wiki markup
Ispod je referentna tabela za uređivanje na Wikipediji.
Odjeljci, paragrafi, liste i redovi
Započnite odjeljak s naslovnom linijom:
Novi odjeljak == === Pododjeljak === ==== Pododjeljak ====
Pomak u jednom redu ne utječe na označavanje. Može se koristiti za razdvajanje rečenica u istom pasusu. Neki urednici smatraju da ovo olakšava uređivanje i poboljšava funkciju usporedbe verzija.
Ali prazan red počinje novi pasus.
Sa oznakom "br", možete prekinuti redove bez započinjanja novog pasusa
Lako je napraviti listu
- svaki red počinje zvjezdicom;
- što je više zvijezda, to je dublji nivo; udubljenje unutra se može uraditi uz pomoć debelog creva
Numerisane liste su takođe dobre:
- Numerisane liste su takođe dobre:
- vrlo organizirano;
- lako za čitanje
Možete napraviti i mješovite liste:
- Možete napraviti i mješovite liste:
- i investirati ih
- kao što je,
- ovdje.
- i investirati ih
Tačka i zarez na početku reda iza koje slijedi dvotočka stvara listu na dva nivoa.
Dvotačka na početku reda uvlači pasus.
Jednostavan prijelom reda započinje novi pasus.
Napomena: Ovo se uglavnom odnosi na stranice za razgovor.
Ako red počinje razmakom, tada će biti formatiran na isti način na koji je upisan; font fiksne širine; bez prijeloma linija. Ovo se može koristiti za:
* umetanje unapred formatiranog teksta; * opisi algoritama; * izvorni kod programa * ascii art (kreiranje slika pomoću tekstualnih simbola).
Centriran tekst.
Horizontalna linija razdvajanja: četiri crtice u nizu (----)
Pomoću oznake možete kontrolirati poravnanje teksta pasusa
Sa parametrom poravnanja, sa vrijednošću centra za poravnanje po sredini, poravnanje po širini, lijevo za lijevo poravnanje, desno za desno poravnanje.
Lijevo poravnanje je prihvaćeno prema zadanim postavkama.
Na primjer, da se poravnate sa širinom, koristite ovu konstrukciju:
Tekst pasusa
Linkovi, URL
London ima dobre veze javnog prevoza. Prvo slovo odredišta je automatski veliko. Interni razmaci se automatski predstavljaju kao donje crte (podvlake imaju isti efekat kao razmak, ali se ne preporučuju).
Dakle, gornji link vodi na http://ru.wikipedia.org/wiki/Public_Transport, što je članak pod nazivom "Javni prevoz".
Pažnja: ako se padež riječi ili fraze na koju upućuje ne poklapa s nominativom, tada treba staviti okomitu crtu u dvostruke uglaste zagrade i napisati nominativ lijevo od njega, a desno - onaj koji odgovara gramatiku rečenice u koju je veza umetnuta.
primjer: London ima dobre veze javnog prevoza.
London ima dobar [[javni prevoz]]. London ima dobar [[javni prevoz | javnim prevozom]].
Završeci spojeni sa referencom: testiranje, geni
Automatski skriva ono što je u zagradi: kraljevstvo.
Imenski prostor se automatski sakriva: Portal zajednice.
Zatvoreno u zagradama je automatski skriveno: [[kraljevstvo (biologija) |]]. Imenski prostor se automatski sakriva: [[Wikipedia: Portal zajednice |]].
Možete se pozvati na pododjeljak u samom članku tako što ćete ga navesti iza "haša": Link.
Možete se pozvati na pododjeljak u samom članku tako što ćete ga postaviti iza heša: [[Wikipedia: Pravila i smjernice # Link | Link]].
Potpišite svoje komentare kada dodajete komentare na stranicu za razgovor. Ovo se može učiniti dodavanjem tri tilde da biste dobili korisničko ime:
niskaili četiri da dobijete korisničko ime plus datum/vrijeme:
niska 14:39, 14. jun 2007. (MSD)To je opcija sa datumom i vremenom koja je preferirana.
Kada dodajete komentare na stranicu za razgovor, morate ih potpisati. Ovo se može uraditi dodavanjem tri tilde da biste dobili korisničko ime:: ~~~ ili četiri da biste dobili korisničko ime plus datum/vrijeme:: ~~~~ Datum i vrijeme su preferirani. Eksterni link:, za linkove koji nisu na ruskom jeziku, poželjno je navesti jezik: ((ref-en))
Ili samo unesite URL: http://www.nupedia.com.
Ova adresa je samo za primjer, nemojte je koristiti.
E-mail možete odrediti ovako:
[[Mediji: Sg_mrob.ogg | Zvuk]] [[Mediji: Tornado.jpg | Tornado Slika]]
ISBN 0123456789X
Formatiranje teksta
Podebljani i kurzivni stilovi se koriste u sljedećim slučajevima: logički naglasak, strukturni naglasak, logički naglasak u strukturnom naglasku (ili obrnuto) logički stres
strukturna alokacija
logički naglasak u strukturnom naglasku (ili obrnuto)
.
- Ovo su dvostruki i trostruki apostrofi, a ne navodnici.
"" "strukturirani odabir" ""
"" "" "logički naglasak u strukturnom naglasku (ili obrnuto)" "" "".
Također možete pisati kurzivom i podebljanim ako ste zainteresirani za određeni stil fonta umjesto logičnog naglaska, na primjer u matematičkim formulama: F = ma
:F = maMonospace font za tehničke termine tehničke termine
tehnički uslovi
Posebno formatiranje za isječke izvornog koda
izvorni kod
Možete koristiti mali tekst za naslove mali tekst za naslove
mali tekst>
Možete precrtati izbrisani materijal i podvući novi materijal, precrtati izbrisani materijal i istaknuti novi materijal
precrtati izbrisani materijal i istaknuti novi materijal
Od vitalnog je značaja da administrator ili moderator grupe zna kako da kreira wiki stranicu VKontakte, jer je ovo jedan od najlakših načina da lepo dizajnirate post i privučete maksimalnu pažnju na objavljene informacije. U stvari, za javni wiki, stranice su ogroman korak naprijed u borbi za publiku.
Wiki markup, koji je postao osnova za kreiranje wiki stranice, je poseban jezik izgleda. Prvobitno je korišten za strukturiranje članaka na Wikipediji. Ali postao je najpopularniji kada se pokazalo da ga je moguće koristiti i na VKontakteu.
Osnove wiki označavanja su toliko jasne da ih može naučiti korisnik koji nema pojma o vještinama programiranja.
Koje mogućnosti pruža poznavanje wiki markiranja?
Pošto ste savladali način jednostavnog formatiranja teksta:
- Kreirajte naslove, liste, pasuse;
- Napravite kurziv i podebljan naglasak;
- Umetanje slika u tekst;
- Koristite sidrene veze;
- Nacrtajte odredišne stranice;
- Kreirajte kataloge i više stranica;
- Razviti navigacijski meni za javnost;
- Crtanje tablica.
Kreiranje wiki stranice VKontakte može postati izvor dodatnog prihoda. Wiki oznaka je otvorila beskrajne prostore za objavljivanje, omogućavajući vam da utjelovite svoje najluđe fantazije. I što je dizajn grupe originalniji, veća je šansa da će biti zapažen među stotinama konkurenata. Ali prije nego što naučite kako napraviti zaista vrijedne stranice, morate potrošiti vrijeme na učenje. Nije potrebno angažovati nastavnike ili pohađati specijalizovane kurseve.
Lako je pronaći vodič za wiki oznake za lutke na internetu i naučiti ga sami.
Kako napraviti VKontakte wiki stranicu za grupu ili javnu?
Za osobu koja se nikada u životu nije susrela s takvim načinom osmišljavanja sadržaja, zadatak se čini nemogućim. Ali u stvari, nema ništa superkomplicirano. Nakon što ste jednom proučili teoriju, nakon što ste znanje potvrdili kratkom praksom, nećete htjeti koristiti obične zapise. Izgledaju bezlično naspram živahnih mogućnosti wiki označavanja.
Kako napraviti wiki stranicu za javnost?
Zamijenite tekst "naslov stranice" naslovom koji želite vidjeti na wiki stranici. A javni ID ćete saznati otvaranjem bilo koje objave sa zida. U adresnoj traci ćete vidjeti link u kojem će iza slova id biti brojevi koji su vam potrebni. Kopirajte ih i počnite popunjavati stranicu.
Kako bi se vaša stranica izdvojila od drugih, dobro razmislite o dizajnu. U tome će vam pomoći posebne oznake:
Da wiki stranice budu dostupne drugim korisnicima, postavite linkove do njih na zid ili u meni.
Kako napraviti VKontakte wiki meni za grupu: označavanje
Dodavanje wiki menija grupi je jednostavno. Potrebno je urediti rubriku "Najnovije vijesti". Nalazi se u zaglavlju zajednice i najprikladniji je za naše svrhe. Kako napraviti lijep meni? Ne možete bez wiki oznaka. Već znate da se može koristiti za umetanje slika u tekst i sidrenje veza. Ako lako uspijete u ovim manipulacijama, onda se ne bi trebala postavljati pitanja s implementacijom ideje.
Viki menija Vkontakte je lijepo dizajnirana lista veza do stranica sa važnim informacijama.
Stoga, prije izrade samog menija, treba razmisliti o tome na šta tačno želite privući pažnju korisnika. Jeste li odlučili? Onda ne oklijevajte, jer već imate svo znanje koje vam je potrebno za kreiranje wiki stranica i Vkontakte menija.
Mislim da su svi koji aktivno koriste društvenu mrežu Vkontakte već upoznali lijepo dizajnirane grupe i publiku. Mnogi od njih, osim menija, imaju i mnogo stilizovanih ugniježđenih stranica, direktorija itd., što u stvari stvara malu stranicu unutar društvene mreže.
Evo nekoliko primjera kako bi svi shvatili o čemu se radi.
Takve grupe vam omogućavaju da se izdvojite od konkurencije i privučete više korisnika. Pogotovo ako je i sadržaj zanimljiv :)
U okviru ovog članka govorit ćemo o tome kako se sve to radi. Da bismo sve detaljnije rastavili i uronili u sve suptilnosti, uzmimo konkretan primjer. Održat će se mala majstorska klasa grupnog dizajna.
Prva faza našeg rada je ideja. Moramo razumjeti šta želimo da kažemo i kome. Postoji nekoliko formata zajednica u kontaktu i vrijedi ih odabrati na osnovu postavljenih zadataka. Iako se u budućnosti grupa može pretvoriti u javni format i obrnuto.
Objašnjavam to na prstima. Javno- ovo je nešto za upoređivanje sa blogom. Newsline. Drugim riječima, našim pretplatnicima govorimo o nekim stvarima i oni neće moći pisati na zidu naše zajednice. Maksimum je komentarisati.
Grupa omogućava vam da stvorite otvoreniju zajednicu za razgovor i diskusiju, gdje ljudi mogu objavljivati u svoje ime u feedu. Na njega možete dodati i prijatelje sa svoje liste. Ne postoji takva mogućnost u javnosti. Osim toga, grupa ima malo više opcija za integraciju wiki oznaka (postoji odjeljak "Novosti" u koji možete integrirati meni).
Globalno, možete razmišljati ovako: ako trebamo stvoriti zajednicu za radnju, onda bih uzeo "javni" format. Ako govorimo, na primjer, o ljubiteljima ribolova, onda je bolje uzeti "grupu". Mada, svako je slobodan da radi kako mu odgovara. Na kraju krajeva, format se može promijeniti u bilo kojem trenutku. Međutim, imajte na umu da Vkontakte uvodi ograničenje za ponovnu promjenu formata zajednice i nakon prvog puta morat ćete pričekati nekoliko dana prije nego što možete sve vratiti ako je potrebno. Stoga je bolje testirati funkcionalnost prije nego što grupa počne da se puni sadržajem.
Kao dio ove majstorske klase, uzet ću igru Mad Max baziranu na istoimenom filmu, koji je izašao prije samo nekoliko sedmica, kao polaznu tačku i stvorit ću zajednicu za igrače sa raznim materijalima o ovoj igrici . Glavni cilj je odvući promet na vašu web lokaciju za igre.
Format će biti "Grupa", jer morate stvoriti prirodan protok publike i maksimizirati komunikaciju unutar zajednice. Odmah ću pojasniti da ću koristiti univerzalnu tehniku koja se može primijeniti iu grupnom i javnom formatu. Radi svuda.
Ima puno sadržaja, počinjemo da oživljavamo ideju!
Kreiranje grupe
Da biste kreirali grupu, idite na "Moje grupe" u desnom meniju vašeg Vkontakte naloga i kliknite na plavo dugme na vrhu "Kreiraj zajednicu".
Trebalo bi da se pojavi ovaj prozor u koji unosimo naziv naše grupe i biramo format.
Nakon unosa potrebnih podataka, ispred nas se otvara kontrolni panel za našu zajednicu. U mom slučaju to izgleda ovako.
Kao što vidite, dodao sam nekoliko parametara: uključio sam video, audio snimke, diskusije i niz drugih funkcija koje će mi koristiti u budućem radu prilikom prikupljanja sadržaja. Sve se to može dalje mijenjati bez ikakvih ograničenja. Takođe sam registrovao adresu svog sajta. Ako nemate stranicu, ili njena tematika ne odgovara formatu zajednice (radi se o različitim stvarima i nisu ni na koji način međusobno povezane), onda ovaj red možete ostaviti prazan.
U ovom slučaju postavljam starosne granice od 18 godina, po analogiji s onima koje su programeri postavili za igru. Mada gotovo i ne sumnjam da se i djeca igraju.
Sve. Grupa je kreirana!
Sada možete početi da ga dizajnirate.
Dizajn grupe Vkontakte
Ova faza se može podijeliti na 2 komponente: grafičku i tehničku. Za rad nam je potreban šablon za kreiranje grupnog avatara i menija, kao i malo mašte i osnovno poznavanje Photoshopa (aka Adobe Photoshop).
Predložak za označavanje
Šta je šablon i šta je uopšteno? Šablon je neka vrsta praznine. U ovom slučaju, u * .psd formatu, označili smo područja za sliku ispod menija i avatare grupe.
Kao što možete vidjeti u drugom primjeru na početku ovog članka, možemo napraviti dizajn u istom stilu za avatar i sliku menija. Istovremeno, vizualno ga seče na 2 dijela. Dakle, predložak vam omogućava da formirate sliku na takav način da eliminišete pomicanje grafike i uklopite slike na jedan nivo što je više moguće.
Da bude jasnije, evo primjera.
Vidimo da je sa obje strane slike pruga koja gleda na stambeni dio. Gotovo je nemoguće učiniti tačno prvi put bez upotrebe šablona. Morat ćete prilagoditi slike, mjereći odstupanja do 1px. Dok kada koristimo šablon, jednostavno mu dodamo grafiku unutar oznake i odmah dobijemo željeni rezultat.
Želim napomenuti da je ovaj šablon dizajniran za 1 red u objašnjenju. Na snimku ekrana primjera nalaze se telefoni. Ako se pojavi drugi red, morat ćete koristiti drugi predložak ili ručno popraviti dizajn.
U međuvremenu prelazimo direktno na grafički dizajn naše nove grupe. Ovdje idem putem najmanjeg otpora i idem na Google Images da pronađem dizajnerske komade. Možete koristiti i Yandex. Ko šta više voli.
Nemam dizajnersko obrazovanje, pa se nećemo detaljno zadržavati na odabiru fontova i drugim sitnicama. Nakon neke magije u Photoshopu, dobio sam sljedeći rezultat.
Na lijevom fragmentu (gdje je natpis "Meni"), također možete dodati nekoliko okidača. U ovom slučaju, odlučio sam bez njih. Sve. Dizajn avatara je spreman. Pritisnite Shift + Ctrl + Alt + S prečice u Photoshopu i sačuvajte naše fragmente u fasciklu na vašem tvrdom disku.
Prva faza rada sa grafikom je završena. Vraćamo se na kontakt.
Postavljanje avatara i menija za grupu
Kliknemo na dvije vrste na mjestu ava naše grupe i tamo učitavamo našu sliku. Ovi momci, ispod njih takođe piše "Učitaj fotografiju".
Dodajte sliku. Odredite polja i odaberite sličicu. Ovdje je sve jednostavno i ne bi trebalo biti nikakvih problema.
Kao što vidimo, morate znati ID zajednice. Vrlo je lako saznati. Pronalazimo meni u našoj grupi (odmah ispod avatara) i otvaramo "Statistike zajednice". U ovom slučaju, nešto slično će se pojaviti u adresnoj traci pretraživača (brojevi će biti drugačiji).
Ovi brojevi iza "? Gid =" su željeni id grupe. Dobivenu vrijednost ubacujemo u formu skripte i upisujemo naziv stranice koju želimo kreirati. U ovom slučaju vozim u "Menu".
Treba napomenuti da će stranica biti kreirana samo ako je prozor sa grupom otvoren u susjednoj kartici. Jednostavno rečeno, morate biti prijavljeni na VK u istom pretraživaču. Zaista, samo administrator grupe i ljudi koji su im dodijeljeni imaju pristup takvim manipulacijama. Slučajni prolaznik ne može lako da preuzme i promeni podešavanja grupe kojoj u admin panelu nema pristup.
Ako je sve urađeno kako treba, ova stranica će se otvoriti.
Ovo je upravo prozor u kojem ćemo kasnije napraviti wiki oznake i kreirati interni meni za našu grupu. Za sada nam je dovoljno da ovde nešto napišemo. Nakon toga pritisnemo plavo dugme "Sačuvaj stranicu" i na vrhu pritisnemo link Povratak na stranicu.
Napisao sam "Meni" za sebe i moja stranica je nakon snimanja počela izgledati ovako.
Još nema dizajna, ali sada nam treba samo link do ove stranice. Podižemo ga u adresnoj traci pretraživača i vraćamo se na glavnu stranicu naše grupe. U traku.
Ovdje kreiramo objavu sljedećeg sadržaja: ubacite sliku i link do stranice menija za grupu.
Kliknite pošalji. Nakon toga kliknemo na vrijeme slanja poruke i između svih opcija biramo stavku "Pin". Ažuriramo stranicu (taster F5 na tastaturi) i, ako je sve urađeno kako treba, dobijamo prvi rezultat: grupa je nabavila avatar i link za odlazak na odjeljak menija.
Wiki oznaka menija grupe Vkontakte
Sada krenimo sa dizajniranjem samih menija. Vratite se u Photoshop i kreirajte dizajn za naš meni. Kada dizajnirate sučelje, morate se sjetiti onih ljudi koji će ući u VK putem aplikacije s mobilnih telefona. Drugim riječima, ne treba imati male elemente i osim toga, treba se truditi da sve bude što jasnije. Da ne bismo morali nagađati kako je sve ovdje raspoređeno i gdje treba kliknuti... već jednostavno gurnemo na željenu tačku i proučimo tražene podatke.
Sada se neću detaljno zadržavati na tome kako sam tačno sastavio jelovnik. To sam i uradio.
Minimum polja. Vertikalni raspored. Idealan format za responsive menije. Odnosno, ništa neće ići nikuda na mobilnim uređajima. Sve će biti baš kao na ekranima kompjutera i tableta. Uzimam širinu od 500 px, da se kasnije ništa ne bi smanjilo i da ne izgubi kvalitet slike dva puta. Visina nije bitna.
Izrežite sliku na fragmente i sačuvajte ih.
Sve. Vrijeme je za završni akord - jelovnik skupljamo već u samoj grupi.
Da bismo to učinili, vraćamo se na glavnu stranicu grupe (gdje su feed i naša slika-link koja vodi do menija). Kliknemo mišem na sliku menija i dođemo do same stranice koju smo ranije kreirali za meni.
Ako ste administrator ili kreator grupe (u našem slučaju je to slučaj), onda će na vrhu stranice biti link "Uredi". Kliknemo na njega.
Zatim idemo u režim wiki-markiranja (ispod dugmeta za zatvaranje u gornjem desnom uglu stranice, takav okvir je nacrtan sa<>unutra). Kada je aktiviran željeni način rada, ovo dugme je označeno sivom bojom.
Zatim gurnemo u ikonu kamere i dodamo sve fragmente našeg menija odjednom. U wiki modu nećemo vidjeti same slike, već samo kod ovih slika sa veličinama i parametrima.
Želim postaviti meni u centar tako da nema praznina između fragmenata. Stoga svaki od elemenata umotavamo u oznaku
Prva i poslednja stavka menija ne bi trebalo da budu dugmad - na mojoj slici je to samo grafički element bez veze ka internoj stranici, pa im dodajemo parametar "nolink". Ovo će ukloniti mogućnost da kliknete na ovaj element da biste otvorili dio slike u zasebnom prozoru. Sada se ništa neće dogoditi jednim klikom miša. Ovo je normalna pozadina stranice. Neaktivan.
U mom slučaju, kod menija izgleda ovako.
Odvojeno, želio bih napomenuti činjenicu da nakon uvoza slika u VK, ugrađeni sistem ponekad pogrešno ukazuje na veličinu slika. Stoga, morate to pomno pratiti i izložiti upravo one koje smo planirali u fazi projektovanja dizajna. U suprotnom, sve može poći po zlu i slagalica se na kraju neće riješiti.
Kada smo napisali kod i poravnali sve elemente, sačuvamo stranicu i vidimo istu stvar kao u Photoshopu.
Završni dodir ostaje - potrebno je da kreirate same stranice na koje će naš meni slati ljude. Da bismo to uradili, ponovo ćemo se obratiti skripti za generisanje wiki stranica i ovog puta naručujemo tri stranice odjednom. U ovom slučaju, također morate napisati nešto na svakom i ne zaboravite da sačuvate njihove adrese negdje iz adresne trake pretraživača.
Zatim u wiki-kod menija ubacujemo linkove ka novim stranicama u obliku stranice-102302049_51013384, gdje je prvi broj id grupe, a drugi broj stranice. Mada, to generalno nije važno. Na kraju krajeva, samo trebamo kopirati ovaj komad URL-a i zalijepiti ga u oznaku.
Kao rezultat, kod menija poprima sljedeći oblik.
Spolja, ništa se nije promijenilo. Ali kada kliknemo na stavke menija, vidimo da sada radi!
Što se tiče same oznake i pravila po kojima je kod napisan, savjetujem vam da pročitate Vkontakte grupu posebno posvećenu ovoj stvari. Momci su opisali sve ključne tačke iu njihovom katalogu možete lako pronaći potreban element i smisliti kako ga dodati na svoju wiki stranicu.
