10 Korisnih Cheatsheetova
Popis 10 cheatsheetova koji bi mogli biti od velike pomoći web dizajnerima. Nije lako zapamtit sve te kodove, naredbe itd. a ponekad nešto i zaboravimo jer neke stvari ne koristimo često, u takvim trenucima dobro nam dođe da nabrzake preletimo po “šalabahterima” i podsjetimo se kako nešto napravit. A poneki će zasigurno pronaći i nešto novo što do sad nisu ni znali da se može napraviti. Osobito korisni bi mogli biti The Advanced WordPress Help Sheet, CSS Cheatsheet, Web Developer’s SEO Cheat Sheet.
- WORDPRESS
- Wordpress Help Sheet
- The Advanced WordPress Help Sheet
- CDBurnerXP HTML Cheat Sheet
- HTML Primer HTML Cheat Sheet
- HTML Primer CSS Cheat Sheet
- CSS Cheatsheet
- PHP Cheat Sheet
- MySQL Cheat Sheet
- Web Developer’s SEO Cheat Sheet
- HTML Character Entities Cheat Sheet
HTML
CSS
PHP
MySQL
SEO
HTML Characters
6 faza izrade web stranice, drugi dio
Ovo je nastavak prethodnog članka o 6 faza izrade web stranica.
Četvrta faza: Programiranje
Programiranje je korak na kojem je izgled web stranice već izrađen. Tada dizajner uzima sve individualne grafičke elemente sa dizajna i koristi ih za izradu konačne, funkcionalne stranice.
To se uobičajeno radi tako da se najprije razvije početna stranica, a zatim “školjka” za unutarnje stranice. Školjka služi kao templejt za stranice sadržaja i ima glavnu navigacijsku strukturu. Jednom kada je školjka napravljena, sadržaj se treba rasporediti na odgovarajuća mjesta. Za vrijeme ovoga koraka implementiraju se elementi kao što su interaktivne kontakt forme, flash animacije i e-commerce elementi.
Čitavo vrijeme dizajner mora nastaviti prikazivati klijentu trenutačan status stranice, kako bi mu on mogao predložiti neke dodatne izmjene ili ispravke.
S tehničke strane, uspješna web stranica zahtijeva razumijevanje klijentske strane web razvoja, što uključuje pisanje ispravnog XHTML/CSS koda koji je usklađen s trenutačnim web standardima te maksimiziranje funkcionalnosti kao i pristupačnosti za što veći dio posjetitelja.
To se ispituje u sljedećem koraku…
Peta faza: Testiranje i isporuka
U ovoj se fazi dizajner bavi završnim detaljima i testiranjem web stranice. Testira se funkcionalnost formi ili nekih drugih skripti te kompatibilnost sa svim popularnijim internetskim preglednicima, tj. osigurava se da web stranica jednako izgleda u svim preglednicima koji su u uporabi.
Dobar web dizajner upoznat je s aktualnim standardima za dizajniranje i programiranje internetskih stranica. Temeljne tehnologije koje se upotrebljavaju su (X)HTML i CSS. Kao dio testiranja trebalo bi provjeriti je li sav napisani kod validiran, što znači da je stranica napravljena u skladu s aktualnim web standardima.
Kada web dizajner dobije potvrdu da je web stranica zadovoljavajuća, vrijeme je za isporuku stranice. FTP programom web site se postavlja na server. Kada je stranica postavljena trebalo bi posljedni put testirati njezinu upotrebu kako bi se provjerilo jesu li sve datoteke postavljene na server i je li stranica i dalje funkcionalna.
To označava puštanje stranice u javnost, s obzirom na to da je sada dostupna svima.
Šesta faza: Održavanje
Izrada web stranice nije nužno gotova. Jedan od načina za dovođenje stalnih posjetitelja jest ponuda novih sadržaja na redovitoj bazi. Većina web dizajnera htjet će nastaviti surađivati s klijentom kako bi obnavljali informacije na stranici. Mnogi web dizajneri nude pakete održavanja po povoljnijim cijenama, ovisno o tome koliko će često raditi promjene ili stavljati dodatke na web stranicu.
Ako klijent preferira samostalno stavljanje vlastitih sadržaja, koristi se CMS (Sustav za upravljanje sadržajem) koji se implementira u web stranicu. O tome se odlučuje u fazi planiranja.
Web stranica pogonjena CMS-om pruža mogućnost da sami uređujete dijelove sa sadržajem. Tada dobivate pristup administracijskom sučelju gdje koristite online tekst editor, sličan mini-verziji Microsoft Worda. Na taj način pruža Vam se mogućnost uređivanja postojećeg sadržaja ili, ako želite, možete dodavati nove stranice i novi sadržaj. Mogućnosti su velike.
O Vama ovisi što želite te odabir načina koji Vam više odgovara. Nekim klijentima više odgovara potpuna kontrola kako bi mogli stavljati novi sadržaj kada god požele, dok drugima više odgovara potpuna predaja web stranice u ruke web dizajnera, s obzirom na to da zbog previše vlastitoga posla imaju za to premalo vremena. U takvim trenutcima dobro dođe pomoć web dizajnera koji preuzimaju održavanje web stranice umjesto klijenta, što je jedna stvar manje na koju klijent mora misliti u današnjem vremenu u kojem su svi zauzeti.
Druga vrsta “održavanja” uključuje SEO (Search Engine Optimization), tj. optimizaciju za tražilice. To znači optimizirati elemente Vaše stranice kao što su title tag, linkovi, heading tagovi te korištenje ključnih riječi (za koje se stranica optimizira) u tim elementima što rezultira boljim rankingom kod tražilica.
Mnogo je detalja uključeno u optimizaciju web stranice za tražilice, dovoljno za čitavi novi post. No, o tome u budućim postovima. Ovo je veoma bitan korak jer iako trenutačno imate web stranicu, morate osigurati da je posjetitelji mogu pronaći. Iako ovaj segment ne spada direktno pod održavanje već se optimizacija proteže kroz kompletnu izradu stranice, tako što se unaprijed planiraju struktura stranice, ključne riječi na koje se optimizira itd. No, radi lakše kategorizacije svrstano je u fazu održavanja i djelomično radi kampanje gradnje linkova koja dolazi tek nakon što je stranica napravljena.
Prenesen, preveden i dorađen tekst sa iDesign Studios bloga.
6 faza izrade web stranice, prvi dio
Mnogo je koraka u procesu izrade web stranice. Od inicijalnog prikupljanja podataka, planiranja, izrade do održavanja.
Točan proces izrade ovisi o dizajneru, ali neke osnove su manje-više uvijek iste.
Pregled faza:
1. Prikupljanje informacija
2. Planiranje
3. Dizajn
4. Programiranje
5. Testiranje
6. Održavanje
Prva faza: Prikupljanje informacija
Prvi korak u razvoju uspješne web stranice je prikupljanje potrebnih informacija. Potrebno je razmotrit mnogo čimbenika, među kojima je i briga o izgledu i doživljaju gotove stranice. Prvi korak je možda i najvažniji jer uključuje razumjevanje subjekta za kojeg se izrađuje web stranica. Treba razumijeti koji su poslovni ciljevi klijenta, i kako web stranica može biti upotrebljena za postizanje tih ciljeva.
Važno je da web dizajner postavi mnogo pitanja kako bi lakše razumio poslovanje kijenta te koje su potrebe i očekivanja od web stranice.
Naime, ovo je veoma važan korak u izradi web stranica zbog toga što na osnovi prikupljenih informacija web dizajner će osmislit plan po kojem će se izraditi stranica. To je važno jer je veoma nezgodno da u nekoj od kasnijih faza izrade dolazi do značajnijih promjena.
Neke stvari treba uzet u obzir:
Svrha?
Koja je svrha web stranice? Dali pružiti informacije, promovirati neki servis, uslugu, prodaja proizvoda, ostvariti prisutnost na webu?
Ciljevi?
Što se želi postići izradom web stranice? Najčešći ciljevi su povećati profit i pružiti informacije.
Ciljana skupina?
Dali postoji ciljana skupina ljudi koji će vam omogućiti postizanje ciljeva? Dobro je zamislit idealnu osobu kojoj je namijenjena web stranica. Uzmite u obzir njihov spol, godine, interese, sve to će pomoći pri izradi prikladnog dizajna za web stranicu.
Sadržaj?
Koju vrstu informacija će ciljana skupina tražiti na stranici? Dali traže specifične informacije, određeni proizvod ili uslugu, online naručivanje ili nešto drugo?
Druga faza: Planiranje
Koristeći informacije sakupljene u prvoj fazi sastavljamo plan za web stranicu. U ovom trenutku radi se site map tj. mapa stranice.
Mapa stranice je popis svih važnih kategorija, kao i podkategorija ako je moguće. Služi kao vodič o tome kakav će materijal biti na stranici i ključno je razviti konzistentan i lako razumljiv navigacijski sustav. Krajnji korisnik mora biti u centru pažnje tokom cijelog procesa dizajniranja stranice jer to su ipak osobe koje će putem web stranice doći u kontakt sa uslugom ili proizvodom koji ta stranica nudi. Dobro korisničko sučelje omogućava jednostavnu navigaciju korisnika kroz sadržaj web stranice.
Tokom faze planiranja web dizajner će ujedno i pomoći klijentu pri odluci koje tehnologije će se upotrijebiti. Sastavni elementi poput interaktivnih formi, web shop, flash itd. se dogovaraju tokom planiranja web stranice.
Treća faza: Dizajniranje
Koristeći se do sad prikupljenim informacijama, vrijeme je za utvrđivanje izgleda stranice.
Ciljani posjetitelji su jedan od glavnih čimbenika koji se moraju uzeti u obzir. Na primjer stranica namijenjena tinejđerima će izgledati drugačije nego stranica namjenjena financijskoj instituciji. U fazi dizajniranja važno je uključiti elemente kao što su logo ili boje poduzeća kako bi se na stranici ojačao brand tj. prepoznatljivost poduzeća.
U procesu dizajniranja, napravi se jedna ili više inačica dizajna stranice. Tipično je to jpeg slika dizajna koji bi trebao biti konačan. Većinom se šalju emailovi sa nacrtima dizajna ili se klijentima daje direktan pristup tako da mogu vidjeti trenutni status razvoja.
U bilo kojem slučaju, dizajner treba omogućiti klijentu pregled projekta kroz sve stupnjeve dizajniranja i razvoja. Najvažniji razlog za to je što daje klijentu mogućnost da izrazi zadovoljstvo ili negodovanje prije nego li je za to već kasno.
U ovom koraku, komunikacija između klijenta i dizajnera je presudna da bi se konačan izgled stranice podudarao sa potrebama i ukusima klijenta. Važna je suradnja klijenta sa dizajnerom i izmjenjivanje ideja dok god se ne dođe do konačnog dizajna stranice.
Tada može početi razvoj… više o ostalim fazama pročitajte u drugom djelu.
Nastavak pročitajte u drugom članku o 6 faza izrade web stranice.
10 Zakon Firefox add-onova za web dizajnere
Popis 10 zakon dodataka za Firefox koji vam mogu pomoći ako ste web dizajner.
1. Web Developer - menu i toolbar sa raznim web developer alatima
2. Firebug - gledajte, editirajte i pratite CSS, HTML i Javascript uživo na bilo kojoj stranici
3. FireShot / Screengrab - sačuvajte stranicu kao sliku a u slučaju FireShot-a možete dodavati i napomene
4. ColorZilla - napredni Eyedropper, ColorPicker, Page Zoomer
5 . GridFox - prikazuje proizvoljnu grid mrežu preko stranice
6. FireFTP - besplatni FTP klijent koji vam omogućava spajanje direktno iz browsera
7. MeasureIt - prikazuje ruler preko stranice te vam tako omogućava mjerenje visine, širine i pozicije elemenata
8. View Source Chart - vizualno prikazuje kako su enkapsulirani HTML elementi
9. SearchStatus - prikazuje Google PageRank, Alexa rank i još neke korisne SEO informacije
10. LinkChecker - provjerava ispravnost linkova
I za kraj jedna napomena, naime ima toliko zanimljivih add-onova ali znaju dosta usporiti rad Firefoxa te ponekad može doći i do konflikta među njima pa u slučaju nekih problema sa Firefoxom prvo probajte deinstalirati add-onove.
Ah, morao sam još samo par zanimljivih spomenuti a to su ReminderFox, A Contacts Manager i Font Finder.
Web dizajn inspiracija
Kao i sa listama čini se da su CSS galerije veoma popularne u zadnje vrijeme. Nažalost loša stvar je što u poplavi CSS galerija mnoge od tih galerija koje još nisu stekle “popularnost” su zapravo loše kvalitete tj. prihvačaju svakakve web stranice te se time nekako gubi smisao svega toga jer nitko ne želi za inspiraciju imati loš uradak.
Da bi u neku ruku umanjili taj efekt nije loše ponekad izdvojit neke od tih galerija, što mi se čini puno korisnije nego samo napravit listu od milijun galerija. Čitajuči legendarni tutorial blog uočio sam da je izdvojio jednu CSS galeriju koja ipak bira kvalitetne radove. Svakako bi preporučio da malo proučite CSS Heros kad vam fali inspiracije.
