a href (ongelmaa)

[jhh]

Mitä vikaa on seuraavassa koodissa:

<a href="esitteet/fin/kummitus.pdf" target="_blank"><img src="kummitus.jpg"></a>

Antaa validoinnissa seuraavia ilmoituksia:

- required attribute "alt" not specified
- end tag for "img" omitted, but OMITTAG NO was specified
- start tag was here (ja näyttää < ennen img:tä)

[Marbo]

No siinähän se lukee. Esim alt tagi puuttuu.

esim:

Koodi: Valitse kaikki

<a href="esitteet/fin/kummitus.pdf" target="_blank"><img src="kummitus.jpg" alt="kummitus"></a>

[kari.patila]

Ja img-tagi pitäisi sulkea myös:

Koodi: Valitse kaikki

<img src="" alt="" />

[Juhani L]

Olisi hyvä opiskella kunnolla html:n (ja css:n) syntaksin perusteet. Vähän kuin autofoorumilla kysyisi, pitääkö pyöränpultit kiristää ennen kuin lähtee ajamaan. Sivut on hyvä ajaa validaattorien lävitse, koska silloin paljastuvat omat kirotusvireet ja syntaksierheet.

[morbusg]

alt-attribuuttiin tulee laittaa lyhyt kuvaus siitä mitä kuvassa on. Tyhjät alt-attribuutit ei palvele tarkoitustaan; ihme ettei validaattori tarkista tyhjää alt-attribuuttia.

Ja img-tagi pitäisi sulkea myös:

Koodi: Valitse kaikki

<img src="" alt="" />

img-tagin, tai ylipäänsä "itsenäisen" tagin sulkeminen on XHTML dokumenttityypin edellytys. Validaattori sanoo näin:

The sequence <FOO /> can be interpreted in at least two different ways, depending on the DOCTYPE of the document. For HTML 4.01 Strict, the '/' terminates the tag <FOO (with an implied '>'). However, since many browsers don't interpret it this way, even in the presence of an HTML 4.01 Strict DOCTYPE, it is best to avoid it completely in pure HTML documents and reserve its use solely for those written in XHTML.

Toisin sanoen, HTML ja XHTML on kaksi eri asiaa!

[lassem]

Lisäksi target-attribuutti on vanhentunut, eikä mukana uudemmissa Strict-spekseissä. Tässä ilmeisesti kuitenkin mentiin löyhempien standardien mukaan, koska validaattorikaan ei ollut siihen puuttunut...

[MTI]

alt-attribuuttiin tulee laittaa lyhyt kuvaus siitä mitä kuvassa on. Tyhjät alt-attribuutit ei palvele tarkoitustaan; ihme ettei validaattori tarkista tyhjää alt-attribuuttia.

Itse asiassa tyhjälläkin alt-attribuutilla on oma tarkoituksensa: se kertoo ruudunlukijoille, että kyseinen kuva on sisällöllisesti "merkityksetön". Alt-attribuutti tulisikin jättää tyhjäksi puhtaasti sivuston visuaalista ilmettä parantavilta kuvilta, kuten tilanvaraajana käytetyiltä kuvilta.

(Lisälukemista aiheesta: http://diveintoaccessibility.org/day_21 ... mages.html)

[morbusg]

... puhtaasti sivuston visuaalista ilmettä parantavilta kuvilta...

Hyvä pointti, mutta ideaalisti puhtaasti sivuston visuaalista ilmettä parantavia kuvia olisi syytä laittaa niille tarkoitettuun paikkaan, eli tyylitiedostoon.

[MTI]

Hyvä pointti, mutta ideaalisti puhtaasti sivuston visuaalista ilmettä parantavia kuvia olisi syytä laittaa niille tarkoitettuun paikkaan, eli tyylitiedostoon.

Joo totta, useimmiten näin. Tästä lienee turha jauhaa täällä sen enempää, pointti tuli kai kaikille selväksi

[Touho]

Juuh, kyllä kait se ongelman kuvaus noissa vastauksissa tulikin, mutta kenties kysyjän kannalta hiukan turhan hankalasti ja vieraalla kielellä ilmaistuna. Ehkä, ehkä ei, tiedä häntä. Mutta varmuuden vuoksi tässä vähän selvennystä.

Suomi-nörtti-Suomi -baabelinkalan läpi suodatettuina noista vastauksista saisi sellaisen lopputuleman, että sivusi html-koodi eli esim. tuo rimpsu ja sivun määrittely (=se <!DOCTYPE -rimpsu siellä sivun ylälaidassa) ovat keskenään ristiriidassa, ja että sivullasi on vielä kirjoitusvirheitä.

Tuo linkkikoodisi on sinänsä oikeaa html4 -koodia, mutta jos sivusi DOCTYPEssä on määrittelynä joku muu, esim. XHTML 1.0 strict, ei tuollainen koodi ole siinä enää validia. Tässä tapauksessa sivullasi on kenties muitakin virheitä, joita et ole vielä huomannut.

Nuo validaattorit, sekä W3C:n online-validaattori että ne html-editorien sisäänrakennetut sellaiset ovat siitä "keljuja", että jo yksi puuttuva / -merkki saati kokonainen tägi aiheuttaa usein pitkän rimpsun sinänsä epäolennaiselta vaikuttavia virheviestejä.

Pojat ovat ihan oikeassa siinä, että jos/kun valitset jonkun tiedostomuodon ja haluat saada aikaan virheetöntä ja W3C-standardien mukaista jälkeä, kannattaa noiden tagien, mahdollisesti puuttuvien /-merkkien ja sivunmäärittelyjen kanssa olla tarkkana.

Selaimet kyllä antavat tiettyyn rajaan asti anteeksi myös suurpiirteisempää koodia, eikä puuttuva alt-määre vielä aiheuta ongelmia sivun renderöinnissä selaimella, mutta nuo validaattorit herjaavat jo siitä yhdestä unohtuneesta /-merkistä tai alt-tagistakin.

Siksi noita validaattorien herjoja kannattaa hiukan opetella tulkitsemaan, ja siitä koodin tuntemuksesta on hyötyä, ettei hämmenny mahdollisesti pitkistäkään herjalitanioista. Joskus jo yksi puuttuva <-merkki saattaa aiheuttaa viisi riviä herjatekstiä validaattorissa.

PS.
Kun rupeat noita a href- ja img-rimpsujasi korjailemaan, kannattaa opetella laittamaan niihin valmiiksi kaikki normi attribuutit, eli altin lisäksi myös esim. imagen koko, ja vaikka Mac-ihmisiä ja/tai muita vaihtoehtoselaajia varten se title-tägi myös.Muista myös laittaa ne lopputagit oikein. Katso vaikka jonkun W3C-väkäsellä varustetun saitin "sorsia" ja ota niistä mallia.
Kyllä se siitä.

[flatologi]

Itsehän opiskelin täysin nollasta html-koodausta omia sivuja tehdessäni. Validaattorista oli suurta apua, joskin alussa eri virheitä oli listassa pitkälti puolen tuhatta, mutta jo yhden / tai > -merkin lisääminen saattoi poistaa puolet virheistä. Alun tuskastelujen jälkeen syttyi se "hehkulamppu" ja nykyään "puhdasta" koodia tulee selkärangasta.

[jhh]

Olen yrittänyt tehdä oppienne mukaan, mutta nyt mahtaa olla jotain tärkeää unohtunut, kun antaa 20 kpl virheitä samasta viasta.
Nouvoja tarvittaus, että miten sais validoinnin puhtaaksi? Eiks ton koodin kuminkin voi suoraan laittaa body-osioon?

Error Line 63, Column 65: document type does not allow element "a" here

…="http://www.jopo.fi" target="_blank"><img src="jaasalaatti_thumbs.gif" borde…

Ja koodihan on tuolta: http://www.dynamicdrive.com/dynamicinde ... tslide.htm

[kari.patila]

Olen yrittänyt tehdä oppienne mukaan, mutta nyt mahtaa olla jotain tärkeää unohtunut, kun antaa 20 kpl virheitä samasta viasta.
Nouvoja tarvittaus, että miten sais validoinnin puhtaaksi? Eiks ton koodin kuminkin voi suoraan laittaa body-osioon?

Error Line 63, Column 65: document type does not allow element "a" here

…="http://www.jopo.fi" target="_blank"><img src="jaasalaatti_thumbs.gif" borde…

Ja koodihan on tuolta: http://www.dynamicdrive.com/dynamicinde ... tslide.htm

Skripti näemmä laittaa hreffit span-elementin sisään, mistä varmaan tulee tuo huomautus. Kokeile mitä tapahtuu jos vaihdat spannit vaikka diveiksi tällä rivillä:

Koodi: Valitse kaikki

document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100px;left:-9000px">'+leftrightslide+'</span>')

[Perduel]

Kyllä inline-elementtien sisällä saa normaalitilanteessa olla toisia inline-elementtejä. Ts. kyllä a-elementti saa olla spanin sisällä. Ts. ei se siitä huomauttele.

[MacFinn]

Voi veljet miten paljosta jään paitsi kun väkerrän noita sivuja Freewayllä... ja saitit validoituu suit sait...

[kari.patila]

Kyllä inline-elementtien sisällä saa normaalitilanteessa olla toisia inline-elementtejä. Ts. kyllä a-elementti saa olla spanin sisällä. Ts. ei se siitä huomauttele.

Sitten se heittää nuo spannit johonkin mihin ne eivät kuulu. En jaksanut käydä koko skriptiä läpi.

[Perduel]

Ei se validaattori edes suorita tota koodia eli ei se koodi tee mitään. Validaattorihan vaan lukee tekstimuotoista dataa.
Tuo skripti on ihan karmeeta schaibaa, mutta veikkaanpa että ongelmat katoaa ihan sillä että lisää välittömästi script-tagin aloituksen jälkeen "<![CDATA[" ja viimeiseksi riviksi ennen skriptin sulkevaa tagia "]]>". Ja molemmat ilman lainausmerkkejä.

Ja tämä siksi koska kyseinen skripti ei ole merkkausta, vaikka html-merkkauksen kaltaista tekstiä sisältääkin. Ja validaattorin (tai mikä ikinä sitä parsiikin) pitää tulkita se vain kirjaimista muodostuvana datana eikä merkkauksena. Jos sitä aletaan merkkauksena tulkitsemaan niin ojaan mennään, koska se ei ole merkkausta vaan skripti, joka luo merkkausta.

Mutta oikeesti, tuo skripti on ihan hirveä. Ihan suoraan jostain webin pimeimmältä 90-luvulta. jQuerylla ja jollain vastaavalla pluginilla saa paljon kauniimpaa (ja varmaan toimivampaakin) jälkeä. Ohjeita luulisi löytyvän jollain jquery + carusel hakusanoilla.

edit. Jos puhuu englantia niin saattaa onnistua paremmin Googlessa. Carousel siis eikä mikään carusel.

[jhh]

Ok, kävin nyt katsomassa noita Jqueryitä. Komeita on. Eli otan nyt tuon "shaibakoodini" pois kokonaan ja laitan Jqueryä tilalle.
Voisiko joku ystävällisesti kertoa mulle, että mistä löydän sellaisen koodin/mallin, kun haluaisin että on esim 700 x 150 px laatikko, jossa pienet kuvat liikkuisivat (rullaisivat) jatkuvasti oikealta vasemmalle ja sitten tiettyä kuvaa klikkaamalla saisin sen klikattua suuremmaksi...

Itse en pääse nyt oikein eteenpäin ilman teidän apuja... =0

[macsami]

Ok, kävin nyt katsomassa noita Jqueryitä. Komeita on. Eli otan nyt tuon "shaibakoodini" pois kokonaan ja laitan Jqueryä tilalle.
Voisiko joku ystävällisesti kertoa mulle, että mistä löydän sellaisen koodin/mallin, kun haluaisin että on esim 700 x 150 px laatikko, jossa pienet kuvat liikkuisivat (rullaisivat) jatkuvasti oikealta vasemmalle ja sitten tiettyä kuvaa klikkaamalla saisin sen klikattua suuremmaksi...

Itse en pääse nyt oikein eteenpäin ilman tietän apuja... =0

Tällainen löytyi ku googletteli "jquery sliders"
http://galleria.aino.se/

Vähän kattavampi lista erilaisista vaihtoehdoista: http://www.noupe.com/tutorial/more-on-j ... rials.html

[villeristi]

Jos halutaan "idioottivarmaa" ja yksinkertaista (jQueryyn vasta tutustuvalle) slideria, suosittelisin ehdottomasti Cyclea
Helppo asennus ja eri efektit saa muutamalla sananpätkällä.

[Fixx]

Jos haluaa tehdä ilman käsiä niin http://wowslider.com/

[Touho]

Voi veljet miten paljosta jään paitsi kun väkerrän noita sivuja Freewayllä... ja saitit validoituu suit sait...

Olipa taas harvinaisen viksu kommentti. Tuo on vähän sama kun menisi möläyttämään naapurin pihassa uuden talon rakentamisesta keskustelevalle puusepälle ja mestarille että "Voi veljet miten paljosta jään paitsi kun en rakenna taloani itse, vaan ostan sen valmiina talonrakennusfirmasta"

Saitin validoituminenkaan ei tarkoita vielä muuta kuin sen, että teksti ei sisällä kirjoitusvirheitä. Saitti voi olla ihan minkälaista silavalla kuorrutettua siansaksaa tahansa, kunhan siellä ei vaan ole syntaktisia virheitä, ja läpi menee.

Et tosiaan edes tiedä, mistä kaikesta jäät paitsi. Mutta se ei kuulu tällaisiin ketjuihin, joten annahan poikien opetella rauhassa käsin koodausta. Joku sen oikeanlaisen koodin generoitumisen on joutunut käsin väkertämään myös sinne wysiwyggeriin.

/OT

[spiidi78]

Olipa taas ...

Jos postauksista voisi tykätä, niin tästä tykkäisin
Valitettava tosiasia on se, että mitä helpommaksi mikä tahansa koodaus tehdään, sitä geneerisempää koodia se on (eli sitä huonompaa se on).

[MacFinn]

Ja käsin kirjoitettu koodi on aina parasta ja virheetöntä?

[spiidi78]

Ja käsin kirjoitettu koodi on aina parasta ja virheetöntä?

Ne virheet voi sentäs itse korjata Ja tietää mitä siellä konepellin alla oikeesti tapahtuu Ei välttämättä ole mikään kovin merkittävä juttu jos siellä ei tapahdu paljoa mitään, mutta jos haluaa tehdä logiikkaa yms niin lopputulos on hirveä läjä ylimääräistä toiminnallisuutta (= resurssien haaskaamista), jos ei koodaa itse.