Poslao: 14 Mar 2007 01:39
|
offline
- Svemirko
- Legendarni građanin
- Pridružio: 24 Mar 2004
- Poruke: 3962
- Gde živiš: Zemun
|
Validan HTML kod
Sta je to validan kod ?
- Validan kod je kod koji je pisan po odredjenim standardima.
Cemu sluzi validan html kod ?
-Ispravan html kod znaci da ste radili po standardima koje je prepisao www.w3c.org (World Wide Web Consortium ili skraceno w3c) i da ce sajt jednako izgledati u svim web browserima (web citacima) koji su pravljeni po tim standardima. (nazalos ovo drugo se bas i nije ispostovalo)
Sta treba da sadrzi validan HTML ?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
Ovo je neki minimum koji mora da se ispostuje.
Gde da proverim ispravnost svoje strane/sajta ?
- http://validator.w3.org/
I to na tri nacina:
1. Unosenjem link-a (znaci sajt mora vec biti hostovan…..napomena, ako je odgovor da je kod validan to ne znaci da je ceo sajt uredu vec samo ta stranica koja je uneta)
2. Uploadovanjem strane sa vaseg lokalnog HDD-a
3. Ubacivanjem koda u odredjeni deo (klasican copy/paste)
FireFox dodatak (Firefox 1.0 - 2.0.0.*)
Html Validator Version 0.7.9.5
https://addons.mozilla.org/firefox/249/
Primeri:
Ubacivanje .swf (flash animacija) u html stranu
DW i drugi alati cesto za ubacivanje flash animcije koriste tag embed koji nije dozvoljen standardom.
Ukoliko zelite da ubacite flash animaciju to cete izvesti na sledeci nacin
<object type="application/x-shockwave-flash" data="VasaFlashAnimacija.swf" width="120" height="60">
<param name="movie" value="VasaFlashAnimacija.swf" />
</object>
Opis:
data="putanja do Vaseg .swf fajla"
widht="120" sirina u px po defaultu
height="60" visina u px po defaultu
Tekst preko slike
Verovatno ste videli do sada da ide neki tekst preko neke slike
U odredjenu kolonu (tag <td>) mozete izabrati
<td background=”putanja do slike”>neki tekst</td>
Ali to ipak nije dozvoljeno standardom
Jedino ispravno resenje nalazi se u CSS.
Definisete CSS u <head> tagu
<style type=”text/css>
#slika {
background-image: url(putanja do slike.gif) //recimo
}
</style>
A da posle u zeljenom td ubacite zeljenu sliku preko id=”slika”
<td id=”slika”>Neki tekst</td>
Postoji sada jedan novi problem… sta ako zelite da u vise td ubacite razlicitih slika. Pozivanjem id=”slika” svaki td imace istu sliku. Resenje je da napravite novu definiciju u css-u. Problem moze biti I ako ima previse slika I previse td-a, pa se gubi ogromno vreme trazeci kom td-u treba koja slika (recimo 30 td-a I 30 slika). Uz to treba napraviti I 30 razlicitih definicija u CSS-u.
Ako je vec tako I ako Vas bas mrzi da se igrate sa novim ravno 30 komada ID mozete uzeti sledece resenje. Cim napravite TD odmah ubacite sliku preko sledeceg koda
<td style="background-image:url(putanja do Vase slike.gif)”>Neki tekst </td>
Treba napomenuti da ovaj kod nije preporucen od strane w3c ali se ipak nece buniti, kod ce proci HTML validator
Jos samo da napomenem da prilikom kreiranja CSS-a koristio sam ID ili #nesto
Isto se moze postici I sa .nesto (tacka nesto) samo sto to nije ID vec class pa se u td tagu vrsi pozicanje
<td class=”nesto”>neki tekst</td>
Problem sa ubacivanjem slike (neispravan kod)
Ubacivanje slike se vrsi sa tagom <img>
Izvor slike se obelezava unutar taga sa skracenicom src=”putanja.jpg” od source
Staviti samo
<img src=”putanja.jpg”>
Nije dovoljno I smatra se neispravnim kodom.
Pored img I src (sto je generalno dovoljno za prikaz slike na sajtu) potrebni su jos I parametri alt (alternativa),width (sirina) I height (visina)
Alt tag ili altetnativa je string zapis I govori browseru sta da ispise ukoliko je slika iz bilo kog razloga nedostupna. Uzgred budi receno taj tag ako ga pravilno koristite moze samo da vam donese koris, jer pretrazivaci su jos uvek nemocni na fotografije za razliku od teksta, tako da kada robot nekog pretrazivaca poseti Vas sajt moci ce umesto slike da vidi o cemu se tu radi, pa kasnije I da indeksira Vasu stranu za dati upit
height="16" width="16" je suvisno objasnjavati. Govori koja je velicina slike (u ovom slucaj 16x16 piksela). Preporuceno je da koristite prave vrednosti slike, mada po Vasoj zelji mozete I za sliku od 16x16 piskela da stavite I 500x500 piksela ali za dizajn Vam ne garantujem
Problem sa JavaScript (neispravan kod)
Ovde je jako jednostavno
Umesto
<script language="javascript">
</script>
Koristite kod
<script type="text/javascript">
</script>
Jer tag <script> zahteva type atribut
autor: Svemirko
P.S. Ovo su neke standardne i ceste greske i to mi je prvo palo napamet, tako da ce se ovo prosirivati po potrebi.
Izvinjavanj se za sve eventualne greske (trudicu se da ih ispravim ukoliko uocim)....
|
|
|
Registruj se da bi učestvovao u diskusiji. Registrovanim korisnicima se NE prikazuju reklame unutar poruka.
|
|
Poslao: 14 Mar 2007 02:02
|
offline
- bocke
- Moderator foruma
- Glavni moderator Linux foruma
- Pridružio: 16 Dec 2005
- Poruke: 12520
- Gde živiš: Južni pol
|
Svaka čast Svermirko! Vrlo zanimljiv članak. Kad budem ponovo imao vremena da petljam oko dizajna, pregledaću ga ponovo. A ti ako se setiš još neke od čestih grešaka koji izazivaju javljanje one strašne greške o nevalidnosti koda, dopiši.
|
|
|
|
Poslao: 14 Mar 2007 10:07
|
offline
- snoop
- Genghis Khan
- Pridružio: 18 Apr 2003
- Poruke: 8134
- Gde živiš: U kesici gumenih bombona...
|
Ima i Html Validator 0.7.9.5 add-in za FF koji prikazuje validnost ucitane strane bilo dok ste na netu ili u lokalu.
Link ne mogu da vam kazem jer mi net ne radi kako treba.
Jako malo stranih sajtova mogu da otvorim. Cak ni Google ne mogu otvoriti.
Radjen je sa Tidy-jem i tezak je oko 600KB.
|
|
|
|
Poslao: 14 Mar 2007 14:38
|
offline
- Svemirko
- Legendarni građanin
- Pridružio: 24 Mar 2004
- Poruke: 3962
- Gde živiš: Zemun
|
@bocke
tnx, ako se i ti setis neke greske dopisi pa da resimo problem
@snoop
tnx za predlog, evo postavio sam link u pocetnu poruku ako nije problem
|
|
|
|
Poslao: 15 Mar 2007 17:35
|
offline
- snoop
- Genghis Khan
- Pridružio: 18 Apr 2003
- Poruke: 8134
- Gde živiš: U kesici gumenih bombona...
|
Nikako nije problem .
Addin je dobar jer mozes da proveris validnost, a da ne moras biti konektovan na net.
|
|
|
|
Poslao: 15 Mar 2007 18:07
|
offline
- puela
- Građanin
- Pridružio: 06 Jan 2006
- Poruke: 64
|
a youtube? znam da je njihove kodove potrebno promeniti, blogowski je to objasnio, a kasnije na dvarudnikazlata.com je napravljen jednostavan konverter.
|
|
|
|
Poslao: 16 Mar 2007 00:57
|
offline
- Svemirko
- Legendarni građanin
- Pridružio: 24 Mar 2004
- Poruke: 3962
- Gde živiš: Zemun
|
puela ::a youtube?
ma to je isto kao i flash... zabranjeno je koristiti <embed> tag
|
|
|
|
Poslao: 16 Mar 2007 01:03
|
offline
- bobby
- Administrator
- Pridružio: 04 Sep 2003
- Poruke: 24135
- Gde živiš: Wien
|
NVU editor ima validator, ali treba da si povezan na net posto se u stvari HTML kod salje na w3c na proveru.
|
|
|
|
Poslao: 16 Mar 2007 01:41
|
offline
- puela
- Građanin
- Pridružio: 06 Jan 2006
- Poruke: 64
|
Svemirko ::puela ::a youtube?
ma to je isto kao i flash... zabranjeno je koristiti <embed> tag
hvala na objašnjenju
|
|
|
|
|