Vodič za raspored sadržaja

Kad želimo montirati sadržaj na web, jedan od velikih problema koji nalazimo je da se prijedlozi koje primam nikad nisu dobro zamislili kako bi bili uspješno ugrađeni u web. Općenito je problem što bez adekvatne strukture dizajn i izgled obično ne izgledaju previše dobro, dajući nezadovoljavajući rezultat.

Zato ću dati nekoliko vrlo osnovnih objašnjenja kako treba razmotriti izgled sadržaja u uvjetima da se rad maksimalno pojednostavi i da rezultat bude optimalan.

Cilj ovog vodiča je da mi bez znanja o programiranju ili razvoju web stranica može dati kvalitetan izgled i da ne moram trošiti previše vremena pokušavajući izvući ideju kroz više razgovora dok ne postignem zaključak.

Korak 1: Predložak

Da bismo imali šablon na kojem bismo mogli da „nacrtamo“ naš predlog, ono što ćemo uraditi je da uzmemo A4 list papira i savijemo ga za TREĆINU po dužini.

Korak 2: Sadržaj blokira

Zamislimo da imamo nekoliko vrsta sadržaja: video, slika, tekst. Svaki sadržaj je pravougaoni ili kvadratni blok. Moramo uklopiti blokove odozgo prema dolje šablona po našem izboru. Ilustriraćemo tri vrste sadržaja.

Video blok

Pretpostavit ćemo da će videozapis općenito biti YouTube video, u predlošku ćemo ga predstaviti na sljedeći način:

Blok slike

O tome ovisi da li je slika pejzažna ili portretna, kao što ćemo se složiti.

Tekst blok

Isto kao i blok slike, ovisno o tome kako želimo tekst staviti ćemo blok ili neko drugo. Predstavljamo ga paralelnim linijama.

Tekstualni blokovi mogu biti tekstualni blokovi sa uključenim stavcima, pa čak i partije liste tekstualnih elemenata

Navest ću dva primjera: blok teksta pored slike pejzaža i drugi pored portretne slike:

Naslovni blok

Naslovi idu u zasebne blokove su izduženi blokovi koji uglavnom zauzimaju čitavu liniju.

Blok dugmeta

Ako želimo staviti gumb da ljudi kliknu i odvedu ih na drugi dio weba ili se pojavi samo prozor s nekim informacijama (ili obrascem)

Ostali blokovi

Ideja je slična. Ako smo shvatili kako blokovi djeluju, mislim da bismo mogli jasno staviti još jedan tip bloka koji, slično prethodnim, odgovara kvadratnom ili pravokutnom obliku. Na primjer, ako smo htjeli staviti obrazac uvrsten u sadržaj. Iako je to obično najmanje uobičajeno, bolje je pitati prije upotrebe novih blokova koji nisu od gore spomenutih tipova. Pokušat ću ažurirati ovu listu jer izlaze nove blokovske ideje koje bi mogle biti zanimljive svima.

Na kraju, evo primjera predloška sa svim vrstama spomenutih blokova:

Proširivanje blokova

Ako nam treba više prostora, jednostavno ćemo dodati više stranica u dizajn bloka pri dnu. Nije potrebno sve ispuniti, već je važno da ne ostavite prazne praznine odozgo prema dolje između sredine svakog bloka. Na ovaj način možemo proširiti stranicu:

Korak 3: Izrada sadržaja

Sad kad imamo izgled sadržaja po blokovima i vrstama blokova potrebno je kreirati sadržaj koji će ići u te blokove. Korak 3 zamjenjiv je s korakom 2. Drugim riječima, sadržaj možemo kreirati prije, a zatim ga postaviti prema znanju količine sadržaja koji želimo ugraditi. To je nejasno učiniti na ovaj ili onaj način, ali moramo biti svjesni da se sadržaj mora točno uklopiti u naš izgled

Slijedit ćemo prethodni primjer. Na 4 slici možemo vidjeti sljedeće blokove:

• 2 blokovi naslova
• 4 tekstualne blokade
• 1 video blok
• Blokovi slike 2
• Blok dugmeta 1
• ukupan: Blokovi 10

Stoga ćemo morati prilagoditi svoj sadržaj tako da se savršeno uklapa u ove blokove bez napuštanja i da je veličina fonta u svim njima jednaka. Za to je moguće vrijedi prvo kreirajte sadržaj, a zatim ga blokirajte. To već puno zavisi od osobe.

Korak 4: prilagođavanje sadržaja blokovima

Pretpostavimo da na papiru već imamo crtež dizajna i sve stvorene blokove sadržaja. Sada je posljednji korak to kombiniranje. Za ovo ćemo koristiti nekoliko alata za kombiniranje svega i pošaljite ga web dizajneru.

Video blokovi

Video se mogu prenositi na dva načina:

1. U MP4 video formatu putem alata kao što je WeTransfer.
2. PREFERRED OPTION: Učitavanje na YouTube marčev kanal i prosljeđivanje YouTube veze na video.

U slučaju da u izgledu postoji samo jedan video neće biti problema. Ali ako postoji nekoliko videozapisa, morat ćemo ih na neki način povezati s izgledom koji smo napravili na papiru.

Na primjer. Zamislite da postoje tri videa. U izgledu ćemo izvući 1 broj u prvom videu, 2 broj u drugom video i 3 broj u trećem video. I onda kada šaljemo svu dokumentaciju stavićemo ovako:

• Video 1: Video koji se bavi frazama nenasilja sa naslovom: "Najvažnije fraze nenasilja"
• Video 2: Video koji se bavi bojama zastave sa naslovom: «Zastava nenasilja»
• Video 3: Video koji se bavi grupom koja će marširati Argentinom pod naslovom: “Bazni tim Argentine”

Tako ćete lako znati koji video odgovara svakom odjeljku.

Blokovi slike

U tom slučaju sve slike moraju biti prenesene na IMGUR platformu: https://imgur.com/upload

I onda proslijedite veze do tih slika. Idealno je da slike budu iste kao i video zapisi, označeni sa 1, 2, 3 i tako dalje. Na primjer, zamislimo da imamo 4 slike u pokretu u Južnoj Africi. Sva četiri imaju isti naziv: “sudafrica.jpg”. Pa, stavljamo uzastopna imena do tačke na kojoj će biti u rasporedu i slikamo broj na papiru kojem odgovaraju. primjer:

• Južna Afrika-1.jpg
• Južna Afrika-2.jpg
• Južna Afrika-3.jpg
• Južna Afrika-4.jpg

Blokovi gumba, naslova i teksta

Na kraju, ovi blokovi trebaju biti zapisani u Word dokumentu, ili po mogućnosti u Google Dokumentima.

Format je vrlo jednostavan: u Word dokument stavljamo vrstu bloka (naslov, gumb ili tekst), a slijedi broj kojem će se u rasporedu podudarati.

Primjeri:

• Naslov 1:….
• Naslov 2:…
• Tekst 1:…
• Tekst 2:…
• Tipka 1:…
• Tipka 2:…

Zatim stavljam primjer dokumenta s potpuno slučajnim tekstovima, tako da se može vidjeti kako će to biti strukturirano, slijedeći primjer slike 4:

Ovako treba izgledati izgled nakon što stavimo brojeve koji odgovaraju svakom odjeljku:

Korak 4: Pošalji sve

Nakon što učinimo sve, jednostavno ćete ga morati poslati osobi koja će biti zadužena za izgled

Jednostavno bi trebalo

1. Skice na papiru s izgledom
2. Sadržaj
   • Video veze na YouTube ili WeTransfer
   • IMGUR veze slika
   • Veza do dokumenta u Google dokumentima ili Word datoteci

Zabilježbeno važno finale

Idealno bi konačno bilo uključiti izvanrednu sliku koja će pratiti naslov 1 naslova stranice. Zato se naslov 1 uvijek treba pojavljivati ​​na početku.

Slika zaglavlja mora imati veličinu 960 x 540 piksela. IMGUR ovu sliku može poslati kao i ostale slike, poput ostalih

Konačni rezultat

I konačno bi se sa svim tim informacijama postavila stranica. Slijedom i za kraj ovog primjera, stranica s konačnim rezultatom koji slijedi sve prethodno navedene parametre bila bi:

Završna stranica