Listopad 24

Mala škola web dizajna za totalne početnike - Lekcija 1 - osnove HTML-a

These icons link to social bookmarking sites where readers can share and discover new web pages.
  • Digg
  • del.icio.us
  • Divanhana
  • Furl
  • hr.digg
  • ukusno

Uvod

Odlučio sam početi pisati ovu malu školu iz nekoliko razloga:
1. Zato što sam skužio da nisam objasnio dobro neke stvari u prva dva tutorijala.
2. Zato što želim napraviti jedan sveobuhvatni tečaj na ovim stranicama počevši od samih osnova pisanja koda pa do grafičkog oblikovanja web stranica u Photoshopu.

Lekcije će izlaziti barem jednom tjedno i bit će napravljene kao obični tekstualni ili kao video tutoriali, zavisi o temi lekcije. Naprimjer za ovu lekciju nije potreban video tutorial zato što se ovdje radi većinom o teoriji i mislim da je lakše pratiti ovako napisano nego kao video tutorial.

Nadalje, pokušat ću ovu školu napraviti tako da je poprilično jednostavna za pratit i bez prevelikog ulaska u tehničke detalje, pošto i inače u stvarnom životu predajem neke informatčke tečajeve shvatio sam da ljudi puno bolje nauče ako nešto rade nego ako samo čitaju ili slušaju o nekoj temi. Naravno ohrabrujem svako detaljiziranje na svoju ruku. Probajte prateći ovaj tutorial, raditi vježbe - ako ih tako mogu nazvati - koje i ja radim.

Struktura HTML dokumenta

Za početak ćemo uzeti jedan html dokument i njega ćemo malo rasčlaniti da vidimo očemu se tu radi:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns=“http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=“Content-Type” content=“text/html; charset=iso-8859-1″ />
<title>Naslov stranice</title>
</head>
<body>

<h1>Pozdrav. Ovo je moja prva html stranica.</h1>

</body>
</html>

Što je ovo iznad? Kako dolazimo do toga? Znači, neki dokument nazivamo html dokumentom kada ima nastavak .html ili .htm. Znači da bi napravili ovu vježbu, napravite dokument u vašem omiljenom text editoru (može i obični notepad) prekopirajte gornji kod i nazovite dokument prva.html. Nakon toga ga pokrenite (dvoklik) i trebali bi dobiti nešto ovako.

Na donjoj slici možete vidjeti glavne dijelove html dokumenta:

kod-01.gif

Gornja slika prikazuje glavnu podjelu html dokumenta. Sada ću malo opisati te dijelove:

1. Pod brojem jedan imamo doctype - doctype služi da bi browser bolje generirao stranicu. Bilo bi najbolje da si uvijek kopirate ovakav doctype u zaglavlje svih html dokumenata. Browser će generirati stranicu i bez doctypa ali velika je vjerovatnost da ju neće generirati na način na koji mi to očekujemo. Zasad toliko o doctypu rko želi znati više neka posjeti ovaj link.

2. Broj 2 počinje sa < html xmlns=.... a zavrsava sa < / html >. Ova formacija u kodu se naziva TAG. Tag je najjednostavnije rečeno označivač koji govori gdje neki dio html-a počinje a gdje završava. Kao što vidite većina tagova počinje sa < unutar zagrade se nalazi ime taga nakon kojeg mogu slijediti neka svojstva i onda početak taga zatvorimo sa >. Kraj taga opet počinje sa < nakon toga stavljamo kosu crtu / koja označava kraj taga i nakon toga upisujemo ime taga, ovdje ne idu nikakva dodatna svojstva i naravno opet zatvaramo sa >. < html > tag označava početak html koda i bilo bi jako dobro da se nalazi u svakom vašem html dokumentu.

3. Primjetite da se broj 3 i 4 nalaze unutar html taga, što znači da su to njegovi elementi. Sljedeći tag na koji nailazimo je head tag. Head tag predstavlja zaglavlje vaše stranice, primjetite da se unutar head taga nalazi još nekoliko dodatnih tagova (iako ih inače ima puno više - ali o tome kasnije). Znači imamo:

<meta http-equiv=“Content-Type” content=“text/html; charset=iso-8859-1″ />

Ovaj tzv. meta tag opisuje koji charset (set slova) će se koristiti na stranici, u ovom primjeru to će biti zapadnoeuropski, ako hoćemo dobro prikazivati naša slova trebali bi upisati caharset=iso-8859-2. Primjetite da meta tag nema zatvarajućeg elemnta, zanči ne postoji nešto kao < / meta > nego se zatvara sa “/>”. Nakon meta taga imamo title tag:

<title>Naslov stranice</title>

Title tag određuje naslov stranice. Što god da upišete između < title > i < / title > će biti naslov stranice koji će se prikazivati na vrhu vašeg omiljenog browsera. Ispod title taga imamo < / head > koji označava završetak head taga odnosno zaglavlja stranice.

Vrlo je bitno da shvatite da head tag ne predstavlja zaglavlje stranice u nekom grafičkom smislu. Zanči da se head tag praktički neće vidjeti na stranici, osim naslova na vrhu browsera. On samo sadrži podatke koji su potrebni za ispravno funkcioniranje stranice. Ali o tome više kasnije.

4. I na kraju dolazimo do body taga. Body je jako bitan zato što označava gdje počinje i završava ono što korisnik web stranice vidi. Uglavnom sve što budete željeli da vam se prikaže na web stranici morate staviti u body tag. Što znači između < body > i < / body >. Unutar body taga imamo tag koji se naziva h1 - h1 sa h1 označavamo da je sve što se nalazi između početka i završetka taga naslov.

h tagovi

Zašto je podnaslov h tagovi? Zato što naravno imamo više h tagova. Oni se razlikuju u broju koji dolazi poslije slova h. Znači imamo ih nekoliko: h1, h2, h3 itd. Ali da nebi previše pričali o tome, proširite sada vaš prvi html dokument da izgleda ovako:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns=“http://www.w3.org/1999/xhtml”>

<head>
<meta http-equiv=“Content-Type” content=“text/html; charset=iso-8859-1″ />
<title>Naslov stranice</title>
</head>

<body>

<h1>Pozdrav. Ovo je moja prva html stranica.</h1>
<h2>Pozdrav. Ovo je moja prva html stranica.</h2>
<h3>Pozdrav. Ovo je moja prva html stranica.</h3>
<h4>Pozdrav. Ovo je moja prva html stranica.</h4>
<h5>Pozdrav. Ovo je moja prva html stranica.</h5>
<h6>Pozdrav. Ovo je moja prva html stranica.</h6>


</body>
</html>

i trebali bi dobiti ovako nešto.

Znači što je broj iza slova h veći to će slova na prikazu biti manja. To je super, ali je isto tako i netočno i nepotrebno, zato što ćemo kasnije naučiti da mi možemo odrediti veličinu slova h tagova pomoću css-a. Za sada je bitno shvatiti da h tagovi određuju konstrukciju stranice, odnosno, određuju koliko je ono što je izmedju h taga upisano važno ili koliko bi se trebalo isticati. Možemo na to gledati i ovako, h1 je glavni naslov nekog teksta, h2 je neki podnaslov u tom tekstu, h3 je podnaslov u podnaslovu itd. Možemo mi napraviti stranicu ne koristeći ni jedan h tag, ali to je loša praksa. Pošto ako je stranica dobro konstruirana web tražilice će ju bolje prepoznavati i prije će ju unijeti u svoju bazu.

Još jedna bitna stvar je to da bi stranica trebala dobro izgledati i bez stilizacije (css dokumenta), a u tome h tagovi pomažu da se zna što je najvažnije na stranici, što je manje važno itd.

p tag

P tag nam služi za određivanje gdje počinje i završava pojedini paragraf odnosno odlomak teksta. Za primjer možete izmjeniti vaš .html dokument da izgleda ovako:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns=“http://www.w3.org/1999/xhtml”>

<head>
<meta http-equiv=“Content-Type” content=“text/html; charset=iso-8859-1″ />
<title>Naslov stranice</title>
</head>

<body>

<h1>Tekst ispod ovoga je paragraf.</h1>

<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque id diam et massa mattis nonummy. Aenean tincidunt. Praesent et mauris. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Duis gravida. Curabitur a enim. Aliquam magna neque, euismod in, convallis et, tincidunt vitae, tellus. Nunc tristique nibh. Donec nec massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vivamus vestibulum.</p>

<p>Praesent purus tortor, scelerisque tristique, ullamcorper ut, imperdiet et, felis. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aenean sed orci. Pellentesque auctor arcu sit amet nisi egestas dapibus. Maecenas sed quam a dui convallis convallis. Donec nec quam. Pellentesque justo eros, condimentum vitae, nonummy in, ornare et, mi. Donec sit amet magna at libero volutpat consequat. Cras auctor. Phasellus orci leo, malesuada non, rhoncus at, varius a, lacus. Praesent ornare. Praesent aliquam libero nec mauris. Morbi porttitor hendrerit enim. Nam sapien diam, convallis id, placerat a, rhoncus a, lorem. In id eros. Morbi mollis, felis a egestas ullamcorper, tortor sem egestas urna, a hendrerit leo sem ac justo.</p>


</body>
</html>

i trebali bi dobiti ovo.

Znači napravili smo 2 odlomka. Možemo vidjeti da su 2 pošto su i fizički odvojena. P tagove koristimo kada želimo da nam neki tekst predstavlja odlomak. P tagovi se isto kao i h tagovi kasnije mogu oblikovati pomoću css-a da bi izgledali onako kako mi to želimo i isto su bitni za samo konstrukciju stranice.

ul i li tagovi

ul i li su tagovi koji se koriste u kombinaciji. li tagovi se uvijek moraju nalaziti unutar ul tagova. Za primjer ćemo dopisati ispod drugog odlomka sljedeće:

<ul>
    <li>Prvi navod</li>
    <li>Drugi navod</li>
    <li>Treći navod</li>
   
</ul>

Rezultat možete pogledati ovdje.

Dakle ul i li tagovi nam služe za prikaz ne uređene liste. ul je unorder-list (neuređena lista) ali li je list-item (član liste). Moramo paziti da li tagovi uvijek budu između < ul > i < / ul >. < ul > tag kaže da započinjemo listu, zatim < li > tag kaže da započinjemo upis člana liste, zatim < / li > tag govori da smo završili sa upisom člana i onda nam na kraju < / ul > tag govori da smo završili sa upisom liste.

img tag

Img tag je jedan od rijetkih tagova koji se ne zatvara sa npr. < /img > nego se zatvara sa />. Ovaj nam tag služi za prikazivanje slika. Da bi pokazali kako radi ovaj tag, trebamo napraviti male promjene u mapi u kojoj ste spremili vaš .html dokument. Najprije napravite mapu koju ćete nazvati “slike” ili “images” ili kako već želite, ta mapa će nam služiti da u njoj držimo slike koje ćemo stavljati na našu stranicu. U tu mapu spremite neku sliku po vašem izboru i promjenite joj ime u slika.jpg ili slika.gif ako koristite .gif sliku, tako da lakše možete pratiti ovaj primjer. Kada ste to sve obavli upišite sljedeće ispod neuređene liste:

<img src=“images/slika.gif” title=” naslov slike” alt=“alternativni naslov slike” />

Ovako izgleda taj primjer sa slikom koju sam ja stavio.

Ajmo sad malo objasniti tu liniju koda:

< img označava početak taga, nakon toga imamo src=”images/slika.gif”, pomoću ovoga govorimo browseru gdje nam se nalazi slika koju želimo prikazati, znači slika se nalazi u mapi images a zove se slika.gif. Kada bi nam se slika nalazila npr. u podmapi mape images koja se zove druge-slike onda bi napisali src=”images/druge-slike/slika.gif”. Na ovo treba jako dobro obratiti pažnju, jer ako putanja do slike nije dobro upisana browser nam neće prikazati tu sliku. To je jedna od najčešćih grešaka kod prikaza slika. Nakon toga imamo title=”naslov slike”, sa ovom komandom kažemo kako se slika zove ili unutra možemo upisati opis slike. Title komanda i nije toliko važna i možete je kompletno izostaviti iz taga ako vam se neda pisati. Nakon title komande imamo alt=”alternativni naslov slike”, u alt upisujemo alternativni naslov ili opis slike. Ovau isto kao i title ne morate stavljati u img tag, ali je poželjno da ju stavite, zato što će se taj naslov prikazati ako netko isključi prikaz slika u svome browseru ili ako koristi čitač ekrana (slabovidne i slijepe osobe najčešće koriste takve programe). Isto tako, stranica vam neće proći W3C validaciju ako nemate alt komandu unutar img taga, ali će slika ipak biti prikazana. I na kraju tag zatvaramo sa / >.

div tag

Div tag je zadnji tag kojeg ćemo obraditi u ovoj lekciji. Njegova primjena vam najvjerovatnije neće biti baš najjasnija dok ne pređemo na drugu lekciju i počnemo učiti CSS pomoću kojega ćemo oblikovati ove tagove koje smo naučili. Dodajte ovo ispod slike:

<div>Ovo je moj prvi div tag</div>

Probajte pokrenuti dokumnet prva.html i vidjet ćete da nam se pojavio samo tekst “Ovo je moj prvi div tag”, i ništa se drugo posebno nije dogodilo. To je zato što div tag opisuje blok, odnosno neku određenu cijelinu na stranici. Da bi se shvatila puna moć div tagova, moramo se upoznati sa CSS-om i u njemu oblikovati div tag. Zato ovdje više neću opisivati div tagove jer neće imati smisla ako ga ne vidite u punoj snazi, a to nam slijedi u idućoj lekciji.

Zaključak

Ovih nekoliko tagova koje sam naveo gore su vam sasvim dovoljni da napravite svoju prvu web stranicu, što ćemo nastaviti raditi u lekciji 2, kada se počinjemo baviti CSS-om i oblikovanjem tagova koje smo danas naučili. Od sljedeće lekcije počinjemo praviti naš web site. Korak po korak, tako da ćemo do kraja ovog tečaja imati potpuno funkcionalan web site. Pišite ako vam što nije jasno.


Ovaj unos je postavljen 24.10.2007 u 15:37 i pohranjen je pod HTML i CSS, Mala škola web dizajna za totalne početnike, Tutoriali. Možete pratiti odgovore kroz RSS 2.0 feed. Možete ostaviti odgovor, ili napraviti trackback sa svog sajta.

35 Komentara do sada

  1. e sad kad bi t ja reko da sam izmjenio izgled jednog foruma totalno (phpBB) koristeći html,css i neke java skripte ..rekao bi:pa zasto tu pises za pocetnike..:)
    Evo zašto:–sve što sam radio tamo radio sam na blef .tj igrao sam se a da ustvari ja neznam ni ovo sto si ti napisao,tj osnove :)
    ovo ti je super , sami početak ,hvala ti …super je sad su mi neke stvari puno jasnije :) ustvari…nisam imao pojma cemu šta služi dok nisam ovo procitao..
    Thanks :)

  2. Ej! Ovaj site je zakon!!!
    Nadam se da ću nešt naučit…mislim s obzirom na znanje prije pronalaska ove stranice i do sada je nebo i zemlja…ma great thing

  3. Hvala, Hvala. Ovakvi komentri mi pomažu da nastavim dalje sa ovim projektom. Štoviše mislim da će danasa biti gotova još jedna lekcija :).

    Pozdrav

  4. sažeto, jednostavno i razumljivo. pohvala i od mene

  5. Jako razumljivo i jako dobro. Završila sam tečaj web dizajna, ali nikad dosta uputa, pogotovo zato što se tamo vrlo brzo prelazi pojedine lekcije. Puno će mi pomoći. Bravo i hvala na trudu!

  6. Pozdravljam ovu genijalnu ideju i poduhvat za malu skolu za pocetnike..Htela sam da upisem kurs web dizajna ali bezuspesno za sad.Zanima me Vase misljenje da li zaista potreban kurs da bi se ovaj posao sutra mogao raditi(web dizajner)ili je ovakav nacin ucenja bolji?Sta je zaista start kada nemam bas neku osnovu?Hvala,nadam se da ce te mi pisati.

  7. Pozdrav Svetlana,

    ja nisam završio nikakav tečaj web dizajna tako da ti ne mogu reći dali ti to može pomoći u poslu. Isto tako znam da ni većina ljudi koji ovaj posao rade profesionalno nisu završili nikakav tečaj. I ako budeš tražila posao web dizajnera velika je vjerovatnost da ti nitko neće tražiti da imaš završen tečaj, nego će tražiti da vide ono što si do sada napravila na tom području. Moj prijedlog ti je da učiš i praviš web stranice, ako ne prave, onda izmišljenje, za sebe, za psa, mačku, obitelj, nije bitno. I kad budeš imala 5,6 dobrih stranica za pokazati onda ideš tražiti posao. Ja sam dosad napravio preko 100 stranica, većinu kojih nitko osim mene nije ni vidio.

    I još jedna stvar, moraš voljet ovaj posao, ako vidiš neku dobru stranicu i uhvati te osjećaj da moraš tako nešto napraviti ili da odmah moraš sjest za komp i počet nešto raditi, onda si na pravom putu. Eto, to je moje mišljenje.

    Uživaj.

  8. Ova stvar je super,mislim nema dalje.Mene zanima kako da napravim onaj dio recimo mapu sitea kao npr.
    HOME
    LINKOVI
    KNJIGA UTISAKA ….
    da to bude sa strane ili na vrhu….e to me interesuje,ako mozes da mi odg na e-mail.hvala

  9. Bok Dejan,

    Nema ti jednostavnog odgovora na tvoje pitanje, mapu sajta ćeš morati ili napraviti sam ručno - što je poprilično mukotrpan posao ako ti je sajt velik - ili ćeš si morati skinuti neki program ili iskoristiti neki web servis za generiranje mape sajta. Probao sam ti nešto tražiti po googlu ali našao sam samo generatore koji generiraju XML, a to bi te moglo još više zbunit. Tebi treba generator koji generira HTML.

    Ako imaš Dreamweaver, mislim da on ima u sebi ugrađen generator mape sajta, pa probaj s tim.

    Pozdrav

  10. Moja prva stranica i zasad jedina, nastala je iz puke znatiželje. Jednostavno me zanimalo kako se to radi i kako funkcionira. Sve sam informacije našao na webu i uložio mnogo vremena i truda da shvatim zašto se i zbog čega nešto događa. Od hrpetine materijala teško je bilo naći “pravi početak” i onda nastaviti dalje s napredovanjem. Kao kad čitaš knjigu nasumce i na osnovu toga slažeš sadržaj.

    Kad čitam ove tutoriale popunjavaju se mali djelići mozaika koji mi nedostaju i slika o webu postaje jasnija i čišća. Zato sve pohvale autoru na uloženom trudu. Opisi su napisani sistematski, jednostavno i užitak je raditi po njima.

    S nestrpljenjem očekujem idući tutoriajal.

  11. Pozdrav Ivane i velike čestitke za ove predivne stranice koje si podelio sa milionima ljudi! Ovo je pravo blago!
    Radoslava, Novi Sad

  12. moram priznati da znas super objasniti……ev jedan veliki pozz of fabyyyy

  13. pozdrav!! moram da ti se zahvalim za sve ovo sto radis za nas koji smo pocetnici u ovome i da ti kazem da si tako,tako dobro to sve opisao i vodis me tako lagano kroz sve i da mi postaju jasne stvari koje nikad nisam mislio da cu jih moci shvatiti, probao i trazijo sam svugdje to ali nigdje nisam nasao objasnjenje kao kod tebe,velika mi je zelja bila da napravim neku svoju web stranicu,al sam mislijo da ce biti nemoguce,hobi mi je crtanje i imam toliko nekih ideja za neki web sajt ili njih vise ,mastovit sam i sad cu uz tebe i tvoje ucenje truditi se da se naucim sve i da pokusam da uradim nesto ,sve cu ti javiti kako ide,hvala ti puno i puno srece u zivotu ti zelim u svemu jer se vidi da si jako dobra osoba,hvala…..

  14. Pozdrav prijatelj,

    hvala na lijepim riječima. Btw. i ja sam počeo sa crtanjem, to ti je jako dobra podloga za web dizajn. Samo se trudi i vidjet ćeš da to sve zapravo i nije toliko teško. Pozdrav.

  15. Pa ovo je odlicno! Upravo spremam predavanje za moje djake iz druge godine - osnove HTML-a i sigurno cu im preporuciti ovu stranicu. Sve je tako jednostavno i pristupacno. Bravo!

    Veliki pozdrav i veliko hvala!

  16. Bravo. Jednostavno i dobro objašnjeno.
    Vidi se da voliš posao koji radiš.
    Hvala ti.

    Hrvoje, Split

  17. Mene samo zanima kako se radi web str. a da nije blog.
    Da joj nastavak završama na .com ???
    Tek sam početnik pa se nerazumjem u to!

  18. Pozdrav Marine,

    morat ćeš biti malo precizniji sa svojim pitanjem, jer ovo što si napisao nema smisla. Ovdje ti je napisano kako se prave web stranice. A sad da bi stranica imala nastavak .com, moraš kupiti .com domenu i na tu .com postaviti web stranice koje si napravio. Dali će te stranice biti blog ili nešto drugo to ovisi samo o tebi, princip je u osnovi isti.

    Pozdrav

  19. Pozdrav,

    Evo i ja sam počeo malo raditi na web design-u jer me to već duže vrijeme zanima. Nisam se moga odlučiti kako krenuti dok nisam vidio Tvoj tutorial. Stvarno je odličan. Možda bi moga krenuti i s naprednim tečajem.

    Pozdrav!! Zahvaljujem ti na izvrsnom tutorialu!

  20. Pozdrav,

    Imam neko predznanje u raznim grafičkim editorima, no već duže vrijeme me zanima HTML pošto su neke stvari neizvedive bez tog znanja, ali zbog nedostatka vremena nikako da upišem neki tečaj. Eto danas sam naišao na ovu stranicu i dajem joj svaku pohvalu. Tutorijali su jednostavno vrhunski!!

  21. Pozdrav!
    Ovo sto si objasnio sve mi je jasno ,no imam jedan problem koji nikako ne uspijevam rijesiti.Radi se o tome da mi se fotografije koje stavljam na stranice nese nikako prikazati..probao sam ih staviti i u jpg i gif formatu rezultat je isti.Pokazuje se mjesto gje sam ih smjestio ali nikako da se prikažu.Molim te za pomoć i unaprijed hvala.
    smarkovi

  22. Hm … mozda ja pokusam dati odgovor. Ako imas sliku: patka.jpg i stavio si ju u folder slike, tada ti putanja do nje mora izgledati ovako *img src=”slike/patka.jpg” /* <- umjesto zvijezdica na početku ide znak “manje”, a na kraju “više”, sliku možeš opisati na način da staviš:
    *img src=”slike/patka.jpg” alt=”patka” title=”patka”* ili odrediti joj veličinu i plutanje pa npr:
    *img src=”slike/patka.jpg” width=”200″ height=”179″ style=”float: left”*, sve u svemu ako si joj zadao pravu putanju, morale bi se prikazati … no, čekat ćemo odgovor stručnjaka, jer i ja se učim ;)

  23. Pozdrav smarkovi,

    riješenje bi ti trebalo biti u ovome što je Mario napisao. Znači najvjerovatnije putanja do slike ili možda slike nisi podigao na server. Ako je to http://www.ekozdravlje.hr stranica, mislim da je problem u putanji jer tebi se sve slike nalaze u index_files/ime-slike.gif, sad ti moraš pogledat dali na serveru uopće imaš mapu index_files i dali se u njoj nalaze slike koje pozivaš. Ali opet ne mogu u ovo biti 100% siguran, pošto nisam 100% siguran gdje si ti stavio slike.

    Pozdrav

  24. Downloadao sam cijelu stranicu pomoću HTTrack Website Copier-a, i tamo imaš na serveru samo index.html i ništa više, folder index_files ne postoji na serveru. Stranicu si radio u MS Publisheru koji ti je generirao neki jako cudan kod … Savjetujem ti da ovdje pogledas tutorijale i da HTML i CSS rucno napises, nakon sto osmislis kako bi ta stranica trebala izgledati ;)

  25. Pozdrav!
    Imam jedno pitanje. (ako može)
    S obzirom da sam već dovoljno savladao HTML a dovoljno i CSS-a,
    postavio bih sljedeće pitanje…
    Jeli možda tko od vas koji se jako dobro razumite u HTML znate
    kostur, ili, kako napraviti dizajn (kod) koji ima jedan prozor
    i da ima dijelove poput dizajna ove stranice i mnogih sličnih)
    Znači, da ima ovo kao BLOG | TUTORIJALI | PREDLOŠCI…isl. [ali da kod bude za blog.hr]
    Samo me zanima to. Hvala inaprijed!

  26. Pozdrav Marine,

    svaki HTML kod je manje-više isti, kod blog.hr su u pitanju samo (najvjerovatnije) moduli koje ćeš stavljati u taj HTML kod. Znaci npr. modul za prikazivanje najposjećenijih postova.

    Ali isto tako trebao bi razumjeti barem malo programskog koda, zato da razumiješ što će on napravit sa tvojim HTML kodom i da ti bude lakše napraviti takav template.

    A kostur takve stranice ćeš napravit kao i svaku “normalnu” HTML stranicu, jedino što ćeš na kraju morati ubaciti kod za module koje sam već prije spomenuo.

    Pozdrav.

  27. Pokušat ću što bolje skužiti.
    No, jednom sam uspio napraviti takav kod i uspjelo je, a sada
    više neznam ponoviti. Ali dosta dugo sam se bavio tim kodom,
    a sad ga više i neznam.
    Pa bih zamolio pomoć od vas jer mi je ovo jedna super stranica sa tutorima i vidim da mnogi od vas jako dobro kuže HTML za razliku
    od mene.

    Pozdrav!

  28. Oduvek sam zeleo izraditi sopstveni sajt , ali i pored zelje i gomile materijala koji sam pregledao ( uglavnom na engleskom jeziku), nije mi bilo lako shvatiti osnove. Ovaj Vas tutorijal je prava stvar! Razumljiv i jednostavno objasnjen , a to je retko moguce naci. Do ove stranice sam dosao posle ko zna koliko pretrage po web-u , i napokon nasao sta mi je trebalo. Svaka cast . Nastavi

  29. Hvala za trud!

  30. svaka cast majstore samo nastavi

  31. Ja sam upravo zavrsio tecaj u algebri za web desing , pa prodajem 8 knjiga za samostalno ucenje i DVD sa master kolekcijom(svi programi sa kljucem) Adobe CS3 .
    javi se na mail pa cemo se dogovoriti za cjenu.

  32. Hvala, ali to mi stvarno netreba.

  33. Zasto niko po svim tutorijalima(malim skolama) ne kaze kako se “pravi” ta mapa za slike? Ili se download-ira od negde? ….I kako se upotrebljava/koristi?

  34. Prodajem kolekciju knjiga za samostalno učenje WEBDIZAJNA , potrebne programe i tutorial DVDe , koje možete gledati na DVDplayeru ili na PC(zove se Total Training for Website Design: Extreme Website Makeover na 2 DVD).
    (ja sam uspješno završio Web Desing i ne trebam više knjige (knjige su potpuno nove).vidi sliku
    Cjena je za sve 1000Kn , ponude slati na E-mail stjepanmarkovic@net.hr ili na mob. 0958988597
    Knjige su na hrvatskom jeziku i objašnjavaju korak po korak kako se rade webstranice.Nakon ovih treninga možete da radite uspješno webstranice i zreli ste za polaganje certifikata za webdizajnera, koji vam se upisuje u radnu knjižicu.

  35. Našao sam sve, svaka Vam čast, ove sve škole se mogu sakriti
    Dario

Dajte svoj glas



Polja koja su bold su obvezna. Email adrese neće nikad biti objavljene ili distribuirane.
Nešto HTML koda je dopušteno:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>
URIi moraju biti potpuni (npr: http://www.imedomene.com) i svi tagovi moraju biti ispravno zatvoreni.
Prekidi linija i odlomci će biti automatski konvertirani.
Neka komentari budu relevantni za temu. Off-topic, i komentari koji su uvredljivi mogu biti cenzurirani ili obrisani.