MyCity » Web dizajn / HTML » Članak: Validan HTML kod

Validan HTML kod

Napisano na dan: 14.3.2007
1

Validan HTML kod
Sledeća strana Pagination

Idi na vrh

Poslao: 14 Mar 2007 01:39
Idi na vrh
offline
  • 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
Arrow 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 Smile

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
Idi na vrh
offline
  • bocke  Male
  • Moderator foruma
  • Glavni moderator Linux foruma
  • Veliki Pingvin
  • Guru
  • Pridružio: 16 Dec 2005
  • Poruke: 12488
  • 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. Wink



Poslao: 14 Mar 2007 10:07
Idi na vrh
offline
  • 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
Idi na vrh
offline
  • 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
Idi na vrh
offline
  • Pridružio: 18 Apr 2003
  • Poruke: 8134
  • Gde živiš: U kesici gumenih bombona...

Nikako nije problem Wink.

Addin je dobar jer mozes da proveris validnost, a da ne moras biti konektovan na net.

Poslao: 15 Mar 2007 18:07
Idi na vrh
offline
  • 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
Idi na vrh
offline
  • 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
Idi na vrh
offline
  • 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
Idi na vrh
offline
  • 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 Smile

Poslao: 24 Mar 2007 17:40
Idi na vrh
offline
  • Pridružio: 24 Mar 2007
  • Poruke: 5
  • Gde živiš: Trnava, Čačak, Serbia

Hehe Smile

Ima i za to resenje. Smile

dvarudnikazlata.com/validan-kod-za-youtube-i-ostale

MyCity » Web dizajn / HTML » Članak: Validan HTML kod

Ko je trenutno na forumu
 

Ukupno su 1588 korisnika na forumu :: 47 registrovanih, 13 sakrivenih i 1528 gosta   ::   [ Administrator ] [ Supermoderator ] [ Moderator ] :: Detaljnije

Najviše korisnika na forumu ikad bilo je 3466 - dana 01 Jun 2021 17:07

Korisnici koji su trenutno na forumu:
Korisnici trenutno na forumu: AF-1, Andrija357, Apok, babaroga, Bane san, Ben Roj, bokisha253, bufanje, comi_pfc, darios, darkangel, Dorcolac, Dovla, flash12, frenki1986, gomago, goxin, Insan, kikisp, Kubovac, kunktator, kuntalo, ladro, mercedesamg, Mi lao shu, milenko crazy north, Milometer, opt1, Parker, pein, pera12345, raso7, Raso75, royst33, Sirius, slonic_tonic, sombrero, suton, tmanda323, Trpe Grozni, USSVoyager, vathra, vladaa012, voja64, Webb, wolf431, šumar bk2