Mislim da ste se svi bar jednom susreli sa ogromnim formama koje trebaju biti popunjene. Zahvaljujući kolegi Janku Jovanoviću od sada možete jednostavno pretransformirati svoju formu u wizard sa više koraka. Osim što će posjetiocima razbiti monotoniju popunjavanja, imati će osjećaj da ustvari postoji manje polja.
Za početak, moramo nabaviti sve potrebe vanjske kodove koje ćemo koristiti:
Kako bi bilo lakše i jednostavnije editirati anketu, ona će biti napravljena kao html stranica koja će putem ajaxa komunicirati sa PHP kodom. Korištenjem html-a, anketu možete ubaciti u svoju stranicu vrlo jednostavno preko iframe-a ili javascripta.
Zbog potrebe da se različiti elementi unutar HTML-a mogu selektirati, postoje dvije vrste selektora: klasa i id. Iako se sam element može selektirati korištenjem negovog imena (npr. ul), kod složenih web stranica postoji previše elemenata da bi ovakav način mogao uspjeti.
Glavni koristici klasa i id-a su CSS i Javascript, preko kojih možemo upravljati određenim elementom unutar HTML-a. Ali koje su razlike?
Float je svojstvo CSS-a koje služi za pozicioniranje elemenata na stranici. Iako se najčešće koristi, početnicima je vrlo teško shvatiti kako točno float radi i zašto se događaju određene promjene u browserima prilikom korištenja istoga. Za početak ćemo krenuti od same ideje float-a, koji je primarno zaživio u print dizajnu. Float se koristi za postavljanje elemenata, npr. slika tako da ih tekst okružuje (eng. text wrap).
(više…)
Da bi posao bio lakši za obavljati, potrebno je imati odgovarajući alat (u našem slučaju programe). Iako je izbor programa, kao i izbor alata za bilo koji drugi posao subjektivna stvar, ovdje ću opisati par programa koje smatram dostojom zamjenom komercijanim aplikacijama. Nitko ne očekuje da kad krenete sa učenjem prvo potrošite par tisuća eura na programe (piratluk nije opcija 
), ali zato besplatne aplikacije mogu i više nego dobro poslužiti – čak i u komercijalne svrhe..
Cilj same ideje CSS resetiranja je smanjiti razlike između prikaza stranice na različitim browserima. Radi se o problemu kada ne navedete vrijednost za neki element (tipa margin) browser će koristiti svoju defaultnu vrijednost, ali naravno nemaju svi brosweri iste vrijednosti te se odjednom stvori višak prosotra oko nekog elementa, a vi ne znate zašto i gdje je uzrok.
Kako bi se smanjili ti problemi, na početku css-a dobro je resetirati sve na početne vrijednosti. Postoji više načina da se to napravi, a jedan od najpopularnijih i najdetaljnijih je sigurno Eric Meyer-ov koji čak dolazi sa nekim od css frameworka.
Najjednostavniji reset koji možete napraviti sami je:
* {padding: 0; margin: 0;}
Sigurno ste svi barem jednom vidjeli popularni MAC-ov izbornik (tako-zvani fish eye). Radi se o zumiranju ikone na kojoj je trenutno miš – time se dobiva velika preglednost i lagano korištenje. Uz to, ovaj pristup ne koristi javascript (što nažalost smanjuje ljepotu), ali povečava funkcionalnost jer će raditi na svim preglednicima sa i bez uključenog javascripta.
Jeste li ikad pomislili kako bi bilo lijepo kad bi mogli staviti neki svoj ili tuđi font na web stranicu? Iako CSS ima mogućnost postavke vrste fonta, ukoliko se taj font ne nalazi na korisnikovom računalu neće se prikazati. Trenutno najučestaliji način je kreiranje slike sa željenim tekstom i fontom.
Ovaj način, iako radi svugdje ima podosta mana. Za početak, odlučite se promijeniti tekst… i onda slijedi otvaranje vaše slike, promjena teksta, spremanje, upload na server i refresh par puta. Druga velika mana je što ga tražilice ne prepoznaju, tako da ako želite imati solidan rank na googlu zaboravite naslove u slikama. Srećom, postoji par načina kako se može vaš font postaviti na web.
Vjerojatno prva korisna stvar koju ćete raditi u PHP-u je izrada kontakt forme. Za ovu priliku ćemo koristiti dvije vanjske PHP klase (PHPMailer i PHP Validation). Korištenje ovih klasa daje predodžbu o tome kako kod treba izgledati da se može ponovno i ponovno koristiti (reusability). Tako da na cijelom projektu imate samo jednu klasu koja je zadužena za slanje e-mailova i samo jednu preko koje radite svu validaciju korisničkih podataka.
