Post by Juha HäikiöMitenhän on, jos laitan mobiililaitteille css-tyylisäännön, että
jotain raskasta grafiikkaa ei näytetä {visibilty:hidden}, niin
hakeeko user agent silti sen?
Hakee, eikä tämä johdu vain siitä, että kaikki selaimet jättävät
deklaraation visibilty:hidden huomiotta. :-)
Oikein kirjoitettu visibility:hidden aiheuttaa sen, että selain käsittelee
elementin normaalisti (myös muotoilee sen) mutta jättää sen näyttämättä eli
sen tilalla on tyhjä alue (jonka koko yleisesti ottaen riippuu muotoilun
tuloksesta).
Sen sijaan display: none aiheuttaa elementin jättämisen kokonaan pois
muotoilusta eli ulkoasu on kuin koko elementtiä ei olisikaan. Jos elementti
on esimerkiksi kuva, niin selain silti hakee tai ainakin yrittää hakea
kuvadatan vaikka ei sitä mihinkään käytäkään.
Post by Juha HäikiöKannattaako mobiililaitteelle tarjota
eri sisältöä vai pelkästään luottaa css:ään datasiirron minimoimisessa?
Luottaa CSS:ään? Älä koskaan luota hymyilevään kissaan. Ks. CSS Caveats,
http://www.cs.tut.fi/~jkorpela/css-caveats.html
Datansiirtoon CSS ei vaikuta mitään, paitsi siltä osin kuin CSS-koodi
saattaa aiheuttaa _lisää_ datansiirtoa (esimerkiksi kun CSS:ssä ilmoitetaan
taustakuva).
Eri sisältöä? Riippuu siitä, mitä olet tekemässä.
Mutta yksinkertaisissa ongelmissa saattaa riittää esimerkiksi seuraava
lähestymistapa: Laitetaan sivulle elementti, jossa on vaikkapa tekstiä tai
pieni kuva tai mitä nyt katsotaankin sopivaksi myös pienille laitteille ja
hitaita yhteyksiä käytettäessä. Sivuun liitetään onload-määritteellä
JavaScript-koodi, joka käy muuttamassa kyseisen elementin sisällön, ensin
tutkittuaan joillakin keinoilla, millaisessa tilanteessa ollaan (tämä onkin
haastavaa, koska mitään kovin selvää tapaa tähän ei ole, mutta
mahdollisuudet ovat ainakin laajemmat kuin CSS:ssä).
--
Yucca, http://www.cs.tut.fi/~jkorpela/