quo vadis, world wide web ? #001

ale hlavne preco pisat weby spravne ...tak, ako sluzba wwwaj jej nosne technologie, hlavne nam pojde o jazykHTML, presli od svojhovzniku burlivym vyvojom. menili sa moznosti siete, menili sa potrebya tuzby pouzivatelov, a aby im vyhovel, menil sa jazykHTML. W3C uvadzalo a stale uvadza novea nove verzie a tvorcovia prehliadacov sa snazia drzat s tymtoburlivym tempom krok.poziadavky a tuzby uzivatelov sieterastli zrejme este rychlejsie ako reakcie W3C, a tak niektoreprehliadace, v snahe vyhoviet uzivatelom (v konkurencnom boji o\"najlepsi\" browser), doplnali odporucania W3Co svoje vlastne prvky a technologie.vysledok vsetci pozname - heterogenny svet prehliadacov,technologii a ich uzivetelov, ktoreho mame moznost bytucastni.klukata a hrbolata je cesta web designeramnohi ludia sa snazili vniest do tohto zmatku trochu poriadkuzavadzanim pravidiel,pisanimrad,prirucieka celychkniho umeni web designu a o tom,ako sa co patri robit a co sa robitnepatri. bohuzial, aj tieto nazory sa mnohokrat roznia. copotom chudaci tvorcovia, snaziaci sa v tom vsetkom vyznat... a tak sa casto stava, ze tvorcovia napisu stranku, pozru siju v niekolkych najpouzivanejsich prehliadacoch (dnes uz zialmnohokrat iba v jednom), a ked vidia stranku dobre, podla svojichpredstav, su spokojni.najpouzivanejsi prehliadac MS IExplorer zasa dokazechybny HTML subor pomernedobre zrekonstruovat, a tak mnohe chyby zostanu neodhalene.neblahe dosledkyvysledkom pochopitelne je, ze mnoho takto vytvorenych stranoksa v alternativnych prehliadacoch vobec neda citat. ak naviactvorca stavi na niektore nestandardne technologie, ako jenapr. implementacia DOM(document object model)v IEa pomocou tychto technologii vytvori zakladne navigacne prvky (roznedynamicke menu, objekty s dynamickym obsahom, client-side kontrolaa odosielanie formularov scriptovacim jazykom, ...), nemusia byttieto dolezite casti v niektorych prehliadacoch vobec funkcne,ci viditelne. uzivatel vidi casto inym prehliadacom iba zlomokz celeho webu. :(( sem mozno radit aj nevhodne pouzitiejavovskych appletov, pripadne flash (natvorbu navigacnych prvkov stranky). tieto technologie trebapouzivat uvazlivo a vzdy k nim poskytnut alternativne navigacneprvky (textove odkazy, alebo celu verziu webu pre alternativneprehliadace). ide nam predsa o dostupnost nasho webu kazdemu uzivatelovi,alebo nie?tvorca takychto stranok dalej nuti pouzivatelov, ktori majuskutocny zaujem pozriet si tieto stranky, pouzit nim podporovanyprehliadac, v mnohych pripadoch znovu - len IE. kedzeje tento prehliadac viazany na platformu MS Windows,Apple MacOS,takymito strankami tvorcovia podporuju tieto platformy aznevyhodnuju ostatne, napomahaju firme microsoft udrziavat simonopolne postavenie na trhu. :(takyto web bol este v nedavnej minulosti vopred odsudeny na to, aby ho uzivateliazavrhli. v casoch zdravsej konkurencie prehliadacov jednoduchotaketo stranky nemohli byt 'prvou triedou'. firmy dbali na to,aby bol ich web pozeratelny cimkolvek. zda sa vsak, ze toto uzdnes neplati. :-...nekorektne dokumenty. ale kde sa podeli tie korektne? svoj web moze kazdy spristupnit uzivatelom vsetkych prehliadacova platforiem velmi jednoducho. napise stranku tak, aby sa dala pozrietkazdym prehliadacom.prvy krok k tomuto je platne HTML(pripadne StyleSheet), tedaspravna syntax, podla odporucani W3C.dovod je prozaicky, ked napisete dokument spravne, kazdy dobryprehliadac, ktory podporuje vasu verziu pouzitej technologie(HTML, StyleSheet, ...), zobrazi vasdokument spravne. t.j. vas dokument by mal byt zobrazeny spravneaj novymi prehliadacmi, ktore v buducnosti vzniknu, ako aj novsimiverziami existujucich prehliadacov.W3C za tymto ucelom prevadzkuje sluzbuvalidation service.klucove su hlavne dva produkty:html validator acss validator.pomocou nich moze kazdy lahko overit spravnost svojho kodu.dalsi uzitocny nastroj je html tidy,automaticky opravuje chyby, formatuje zdrojaky, atd.a pritom je to take jednoduche...castokrat staci malo zmien a pripravovany dokument je spravny. jedna saprevazne o dokumenty, ktore su v podstate spravne, ale sem tam chyba povinny parameter, alebo uvodzovky...na co sa najcastejsie zabuda, je uviest na zaciatku suborudocument type declaration, teda informaciu o pouzitej verziiHTML a specifikovat pouzitekodovanie(znakovu sadu).<pre><!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\"><HTML><HEAD> <TITLE>Title</TITLE> <META HTTP-EQUIV=\"Content-Type\" CONTENT=\"text/html; charset=utf-8\" > </HEAD> <BODY> <-- ... telo dokumentu ... --></BODY></HTML></pre>HTML 4.0zavadza pre elementSCRIPTpovinne atributtype.naproti tomu atribut languageje oznaceny ako deprecated (naozaj len tazko hladat slovensky vyraz)a nemal by sa pouzivat. kedze zvyk je zelezna kosela, mnoho autorovtento fakt veselo ignoruje :( . taketo pocinanie ale nemozno tolerovat,pretoze zdeprecated atributov (ktorych podpora u prehliadacov je danaspecifikaciou) sa mozu v buducnosti stat obsolete atributy (ktorych podpora u prehliadacov nie je nijako zarucena).<pre><SCRIPT LANGUAGE=\"javascript\" SRC=\"/main.js\"></SCRIPT> Error: required attribute \"TYPE\" not specified <SCRIPT TYPE=\"text/javascript\" SRC=\"/main.js\"></SCRIPT></pre>rovnako od verzie HTML 4.0musime povinne pomocou attributuALTpriradit kazdemu obrazku (element IMG) alternativny text. tento bud strucne popisuje, co naobrazku je alebo, ak ma obrazoknavigacnu funkciu, mal by text opisat tuto funkciu (t.j. kam smerujeodkaz, ...). tato textova informacia sa potom zobrazuje namiestoobrazku, kym sa obrazok nestiahne, alebo ak ma uzivatel cisto textovyprehliadac, pripadne vypnute obrazky.<pre><IMG SRC=\"lion.jpg\">Error: required atribute \"ALT\" not specified<IMG SRC=\"lion.jpg\" ALT=\"the king of animals\">hodnoty niektorych atributov (napr.ID, HTTP-EQUIV)musia byt v celom dokumente navzajom rozne, musia zacinat pismenom([A-Za-z]), za ktorym mozu nasledovat pismena, cislice ([0-9]), aznaky \"-\", \"_\", \":\" a \".\", a su case-sensitive.<pre><DIV ID=\"1\">Error: value of attribute \"ID\" must start with a letter,not \"1\"<DIV ID=\"d1\">autori velmi casto zabudaju uzatvarat parove tagy:<pre> Line 244, column 5:</DIV>Error: \"TABLE\" not finished but containing element endedLine 244, column 5:</DIV>Error: end tag for \"TABLE\" omitted; possible causes includea missing end tag, improper nesting of elements, or use ofan element where it is not allowedLine 233, column 0:<TABLE CELLPADDING=\"0\" CELLSPACING=\"0\" WIDTH=\"100%\">Error: start tag was hereniektore (pomerne casto pouzivane) atributy elementuBODYnenajdeme v specifikaciiHTML 4.0,HTML 3.2, ci v specifikaciiHTML 2.0.okrem toho, od verzieHTML 4.0su niektore atributy elementu BODY, ako aj niektore elementy (napr. FONT,BASEFONT),deprecated. ich funkciu plne preberaju (a v mnohom rozsiruju) styly.<pre><BODY LEFTMARGIN=\"0\" TOPMARGIN=\"0\" MARGINHEIGHT=\"0\"> Error: there is no attribute \"LEFTMARGIN\" for this element(in this HTML version)<BODY></pre>v HTML musi bythodnota atributu v uvodzovkach, ak obsahuje ine znakyako pismena, cisla, pomlcky (\"-\") a bodky (\".\"). vXHTML su uvodzovkypovinne vzdy.<pre><A HREF=#rabbit>bugs bunny</A> Error: an attribute value must be quoted if it containsany other character than letters (A-Za-z), digits, hyphensand periods, quote in doubt <A HREF=\"#rabbit\">bugs bunny</A></pre>ano, XHTML jecase-sensitive. nazvy elementov a atributov pozostavaju zmalych pismeniek ([a-z]).<pre><DIV CLASS=\"encapsulator\">Error: element \"DIV\" is not defined in this HTML version<div class=\"encapsulator\"></pre>teraz nasleduje niekolko ukazok vaznejsich priestupkov (nech lahkostnapravy je mierou vaznosti). uz som pisal(priklad 4), ze hodnoty atributovIDmusia byt v celom dokumente navzajom rozne. IE umoznujescriptovacimjazykom sikovne v cykle pristupovat k elementom s rovnakymID.k viacerim elementom s roznymIDsa pristupujev cykle horsie (neda sa to tak elegantne zapisat :)). a kedze lenivostje matka pokroku...pri vnarani elementov sa treba drzat jednoducheho pravidla:inlineelement nemoze obsahovatblock-levelelemnent. v XHTML naviacnie je povolene prekryvanie(overlapping) elementov.<pre><SPAN CLASS=\"address\">address: <DIV CLASS=\"text-field\"> name: Lenon, John<BR> street: 7, Abbey Road<BR> city: Liverpool </DIV></SPAN> Error: element \"DIV\" not allowed here; possible cause isan in-line element containing block-level element<DIV CLASS=\"address\">address:<BR> <SPAN CLASS=\"text-field\"> name: Lenon, John<BR> street: 7, Abbey Road<BR> city: Liverpool </SPAN></DIV></pre> IE tiez dovolujevyvojarom pouzit vlastne (nove) elementy, atributy, (pripadne rozsiritkonecny obor hodnot niektorych atributov o vlastne hodnoty)a vdychnut im \"zivot\" pomocouscriptova stylov. toto samozrejmenie je zly napad ako taky. ale pozor! taketo dokumenty by nemalautor v ziadnom pripade vydavat za nejaku znamu verziuHTML. minimalne sa ziadavytvorit a pouzit valstneDTD(document type definition) k novej, rozsirenej verziiHTML. to ale uz nie jelahodka, do ktorej sa hocikto s chutou pusti. je tiez mozne, ze v niektorejbuducej verzii HTML budenahodou pridany element (atribut, ...) s rovnakym menom, ako namidodefinovany element, ale s odlisnou funkcnostou. v pripade, zepouzijeme vlastneDTDa nas prehliadac ho zohladni, toto samozrejme nie je problem. problemje s prehliadacmi, ktore vo vseobecnosti nezvladaju lubovolne DTD(a s autormi ktori si ho nepisu). dalej nastanu komplikacie, ked sarozhodneme dokument prepisat do takejto buducej verzie HTML (napriklad zistime,ze nova verzia sa nam viac pozdava). preto tvorcom, ktorymnejde o vyskum novych technologii, ale skor o prehladnea kompatibilne, lahko upravitelne weby, odporucam taketo funkcieradsej nevyuzivat. sucasna technologia je (aspon podla mna) dostatocneobsiahla a robustna.<pre><IMG ID=\"img01\" ALIGN=\"absmiddle\" SRC=\"leo34.jpg\" MYNAME=\"lion\" MYCOMMENT=\"king of aminmals\">Line 13, column 21: ALIGN=\"absmiddle\"Error: value of attribute \"ALIGN\" cannot be \"ABSMIDDLE\";must be one of \"TOP\", \"MIDDLE\", \"BOTTOM\", \"LEFT\", \"RIGHT\"Line 15, column 12: MYNAME=\"lion\"Error: there is no attribute \"MYNAME\" for this element(in this HTML version)Line 16, column 15: MYCOMMENT=\"king of aminmals\"Error: there is no attribute \"MYCOMMENT\" for this element(in this HTML version)Line 17, column 0:&gtError: required attribute \"ALT\" not specified<IMG ID=\"img01\" SRC=\"leo34.jpg\" ALT=\"picture of the lion\"><SPAN ID=\"img01-name\" CLASS=\"hidden\">lion</SPAN><SPAN ID=\"img01-comment\" CLASS=\"hidden\">king of animals</SPAN></pre>odkial si nebrat priklad? 1ked si pozriete stranky televizie markizav IE,budu sa vam mozno zdat efektne a prepracovane. ale skusaliste sa na ne pozriet niecim inym? ja som skusal. koniec koncovIE, ked zrovnanemusim, nepouzivam. kto by si chcel alternativnym prehliadacom precitat niektory article, ma smolu.a to som vyskusal operu,mozillu ajkonqueror.stranky su totiz vyrazne \"site\" naIE. v casti,kde sa zobrazuju clanky, sa v inych prehliadacoch zabrazuje zaroven (cez ne) nejaky iny text, takze article savobec neda precitat. stranky firmy microsoftsu (necakane) vyrazne optimalizovane pre IE. mnohe navigacneprvky, ktore sa v IEdynamicky zobrazuju, nie su v inych prehliadacoch vobec viditelne.najhlavnejsie navigacne prvky nastastie viditelne su. pozitivomoproti strankam markizy je, zedynamicky obsah sa nemiesa so samotnymi informaciami na stranke, tie sa teda daju precitat.prikladom nevhodneho (client side) pouzitia javy je web ceskej firmyvertical sport. ak nematejava runtime environmentnainstalovane, uvidite iba titulnu stranku. kedze autor neposkytolnahradne textove odkazy (namiestoappletov), nemoznosa k dalsim dokumentom vobec \"doklikat\". pouzitieappletov na vytvorenieodkazov reagujucich na udalost onMouseOver je pritom uplneneopodstatnene, pretoze mozno pouzit napr.CSS, aleboscript.stava sa, ze sa autori pomocou appletovpokusaju vytvarat falosnu iluziu profesionality (pripadne bezpecia) -vid. prielom #17.web firmy topsoft ma zasa introvytvorene vo flashi, ktorepresmeruje (onClick) prehliadac na hlavnu stranku. chybatu textovy odkaz (skip, no flash, ...), ktory by umoznoval ajuzivatelom, ktori nemaju flash playernainstalovany, prezriet sisamotny firemny web(postaveny na standardnych technologiach, s ktorymi si vacsinabrowsrov v pohode poradi).lepsie, no stale nie dokonale ...nasledujuce weby mozu ist predchadzajucim skor prikladom. vsetky sasnazia publikovane informacie sprostredkovat rovnako vsetkym uzivatelomnajroznejsich platforiem. kazdopadne, ani jeden z nich nema validneHTML 1.osobitne by som chcel upozornit na slovensky webpoistovne generali, ktory osahujedynamicke navigacne menu funkcne vIE, vkonquerori, vmozille, vnetscape aj vopere (ine som neskusal) :)). tak sa to ma robit (!) ...nasleduje zoznam stranok organizacii a spolocnosti, ktore by podlamna mali ist, pokial ide o reprezentacny web, prikladom. aj ked suto vsetko perfektne weby a naozaj vidiet snahu o pristupnost auniverzalnost, ani jeden z nich nie je skutocne validny: netscape, newsforge, blackhole, linux.com, linux.sk, google, NASA, University of California, Berkeley, Stanford University, Harvard University, Univerzita Komenskeho, Slovenska Technicka Univerzita, Technicka Univerzita v Kosiciach, Univerzita Karlova, Ceske Vysoke Uceni Technicketo je ono... alebo odkial si priklad treba brat!nasledujuce stranky vsetky validuju 1.prve tri z nich zaroven tvoria \"zoznam odporucanej literatury\".fakt velmi poucne ...World Wide Web Consortium ma prirodzenestranky podla svojich odporucani. da sa tu najst vela uzitocnychmaterialov. odporucam pravidelne sledovat.Viewable with Any Browser jevelmi poucna kampan o tom, ako a preco pisat weby tak, aby vyzerali vkazdom prehliadaci rovnako. obsahuje velmi dobru prirucku pre vyvojarov.~cac6982 - demonstraciana temu \"preco ano, CSS\".vrele odporucam vsetkym, co sa nehanbia aj nadalej tuto technologiuprehliadat. (mozno vidiet to istu stranku v (zatial) 19 roznychgrafickych prevedeniach (zmena len vCSS), autor pridava jednokazdy mesiac)aj dalsie stranky su prikladom toho, ze dobry web sa da napisatkorektne. kto neveri nech tam bezi. prial by som si aby somnabuduce nemusel taketo stranky hladatgooglom :(Opera Sofrware,the K desktop environment,The Apache Software Foundation,Messachussets Institute of Technology,University of Cambridge,University of Oxford,The University of Western Australia, LyX,XEmacs,idontsmoke.co.ukdufam, ze moja evangelizacia nebola marna :). sam som uzivatelom prehliadaca opera. problemy,o ktorych som pisal, casto pocitujem. dufam, ze casom sa situaciazlepsi a web budeme moct prehliadat aj takymi exotickymi prehliadacmi,ako je napr. vznikajuci X-Smiles.1) tento article reflektuje stavzaciatkom marca 2002.tbc

quo vadis, world wide web ? #001

Správy

Distribúcia arix linux s KDE 1

Na Slovensku vyšla bezplatná knižka napísaná umelou inteligenciou

Zaujímavý web o retro hardvéri

Apple dostal pokutu 1,8 miliardy €

DDoSia bot

Protimonopolný úrad SR sa vyjadril k vypínaniu českých televízií

Pomoc pre SK-Spell (PHP8)

PyCon SK 2024

Video návod na vytvorenie externého disku s Linuxom

Damn Smal Linux vstáva z mŕtvych

Anketa

Stretli ste sa s open-source stratégiou Bitka o Wesnoth?

O Linuxe

Portál

Odporúčame

Podporte nás