Discussion:
Sivusto ja maksimileveys
(too old to reply)
Otto J. Makela
2010-02-08 14:06:03 UTC
Permalink
Minulle esitettiin perusteluna www-sivuston vapaan maksimileveyden
rajoittamiseksi sitä, että ihmisillä on nykyään niin suuria näyttöjä
että niiden levyinen rivi olisi kovin vaikealukuinen.

Mikä on kommenttinne, onko keskiverto www-käyttäjä nykyään oikeasti
niin osaamaton että hän ei osaa/halua säätää selainikkunansa kokoa
niin että tekstin lukeminen on miellyttävää, ja tällaisiin
rajoituksiin on tarpeen ryhtyä sivuston suunnittelijan toimesta?

Peruskäyttäjä on painanut kerran F11 eikä voi enää asialle mitään?
--
/* * * Otto J. Makela <***@iki.fi> * * * * * * * * * * * * * * * */
/* Phone: +358 40 765 5772, FAX: +358 42 7655772, ICBM: 60N 25E */
/* Mail: Mechelininkatu 26 B 27, FI-00100 Helsinki, FINLAND */
/* * * Computers Rule 01001111 01001011 * * * * * * * * * * * * */
Mika Iisakkila
2010-02-08 14:48:11 UTC
Permalink
Post by Otto J. Makela
Mikä on kommenttinne, onko keskiverto www-käyttäjä nykyään oikeasti
niin osaamaton että hän ei osaa/halua säätää selainikkunansa kokoa
niin että tekstin lukeminen on miellyttävää, ja tällaisiin
rajoituksiin on tarpeen ryhtyä sivuston suunnittelijan toimesta?
Kyllä tällaista valitettavan usein näkee. En minäkään hirveästi
väkisin palstoittamisesta perusta, mutta jos kohderyhmä ei ole
jotenkin erityisesti tietokoneväki, aika iso osa painaa back-nappia
kun leipäteksti leviää 1600-1920 pikselin leveydelle...
--
http://www.hut.fi/u/iisakkil/ --Foo.
Jukka K. Korpela
2010-02-08 17:18:23 UTC
Permalink
Post by Otto J. Makela
Minulle esitettiin perusteluna www-sivuston vapaan maksimileveyden
rajoittamiseksi sitä, että ihmisillä on nykyään niin suuria näyttöjä
että niiden levyinen rivi olisi kovin vaikealukuinen.
Näytöt ovat jo kauan olleet leveämpiä kuin optimaalinen rivinpituus, mutta
tietysti tilanne on kärjistynyt.
Post by Otto J. Makela
Mikä on kommenttinne, onko keskiverto www-käyttäjä nykyään oikeasti
niin osaamaton että hän ei osaa/halua säätää selainikkunansa kokoa
niin että tekstin lukeminen on miellyttävää, ja tällaisiin
rajoituksiin on tarpeen ryhtyä sivuston suunnittelijan toimesta?
Voi kyllä ihmetellä, käyttävätkö ihmiset todella esimerkiksi 1680 pikselin
levyistä näyttöä DOS-tyylisesti (yhtenä ikkunana). Kyse ei ehkä ole vain
osaamattomuudesta tai tietämättömyydestä vaan myös siitä, että www-sivustoja
on suunniteltu yhä leveämpiä näyttöjä varten. Lisäksi kun todennäköisesti
suurin osa sivuista on tehty niin, että ne toimivat hyvin leveässäkin
ikkunassa (laidoille vain jää tyhjää tilaa), ihmiset eivät koe tarvetta
selainikkunan kaventamiseen - eivätkä siksi ehkä todellakaan tule
ajatelleeksi sitä silloin, kun siitä olisi hyötyä.

Asiaan vaikuttaa myös se, miten helppoa on asettaa maksimileveys ilman, että
siitä seuraa joustamattomuutta ja riskejä. Nykyisin se on melko helppoa, jos
lähdemme siitä, että vanhojen selainten käyttäjät saavat tyytyä siihen, että
maksimileveyttä ei ole asetettu (heillä sitä paitsi todennäköisesti on
vanhoja näyttöjä).

Aikoinaan kun aiheesta keskusteltiin tässä ryhmässä, Jori Mäntysalo
huomautti, että maksimileveyden asettaminen poistaa mahdollisuuden katsella
sivun tekstisisältöä ensin yleiskatsauksellisesti, koko ikkunan leveyttä
hyödyntäen. Ajatus on ehkä hiukan teoreettinen ja koskee kai lähinnä
tehokäyttäjiä, joiden voi olettaa tarvittaessa osaavan heittää peliin
vaikkapa Firefox Web Developer Extensionin, joka on ihan kätevä työkalu myös
pelkässä surffailussa - sillä voi sanoa vaikkapa lennosta
* { max-width: 100% !important; }
ja sinne menivät maksimileveydet (jos ne oli asetettu fiksusti CSS:llä).
--
Yucca, http://www.cs.tut.fi/~jkorpela/
Otto J. Makela
2010-02-09 14:27:32 UTC
Permalink
Post by Jukka K. Korpela
Voi kyllä ihmetellä, käyttävätkö ihmiset todella esimerkiksi 1680
pikselin levyistä näyttöä DOS-tyylisesti (yhtenä ikkunana). Kyse ei
ehkä ole vain osaamattomuudesta tai tietämättömyydestä vaan myös
siitä, että www-sivustoja on suunniteltu yhä leveämpiä näyttöjä
varten. Lisäksi kun todennäköisesti suurin osa sivuista on tehty
niin, että ne toimivat hyvin leveässäkin ikkunassa (laidoille vain
jää tyhjää tilaa), ihmiset eivät koe tarvetta selainikkunan
kaventamiseen - eivätkä siksi ehkä todellakaan tule ajatelleeksi
sitä silloin, kun siitä olisi hyötyä.
Hämmästyttävän usein törmää ei niin kaupalliseenkaan sivustoon jossa
on varattu leveitä palkkeja joka puolelta tekstiä (ja usein tekstin
sisältäkin) erilaisiin varsin turhiin linkkilistoihin ja mainoksiin,
kun itse leipäteksti on pilkottu hyvin lyhyiksi erilliseksi sivuksi,
jolloin lukemisen lomassa joutuu hyvin tiheään painelemaan hankalahkoa
next-nappia.

Näissä asioissa joka tapauksessa on niin montaa mielipidettä kuin
lukijaakin, ja kaikilla juuri se ainoa oikea :-/

Minulle tuli ihan ajatuskokeena mieleen, onko jossain näkynyt jollain
siistillä javascript+css-tekniikalla toteutettuna sivustoa jonka
muotoilussa lukija itse voisi valita tämäntapaisia asioita?

Vaihtoehtoina voisi olla vaikkapa täysin vapaa selainikkunassa,
selainikkunan korkuisiksi palstoiksi pilkottuna (niin monta kuin
kerralla ruudulle mahtuu), tai yksi yhtenäinen leveysrajoituksella?
--
/* * * Otto J. Makela <***@iki.fi> * * * * * * * * * * * * * * * */
/* Phone: +358 40 765 5772, FAX: +358 42 7655772, ICBM: 60N 25E */
/* Mail: Mechelininkatu 26 B 27, FI-00100 Helsinki, FINLAND */
/* * * Computers Rule 01001111 01001011 * * * * * * * * * * * * */
Otto J. Makela
2010-02-14 00:04:55 UTC
Permalink
Post by Otto J. Makela
Hämmästyttävän usein törmää ei niin kaupalliseenkaan sivustoon jossa
on varattu leveitä palkkeja joka puolelta tekstiä (ja usein tekstin
sisältäkin) erilaisiin varsin turhiin linkkilistoihin ja mainoksiin,
kun itse leipäteksti on pilkottu hyvin lyhyiksi erilliseksi sivuksi,
jolloin lukemisen lomassa joutuu hyvin tiheään painelemaan hankalahkoa
next-nappia.
New York Times:
http://www.nytimes.com/2010/02/14/magazine/14texbooks-t.html

Ainakin minulla (Mozilla/5.0 (X11; U; Linux x86_64; en-US; rv:1.9.1.6)
Gecko/20100107 Fedora/3.5.6-1.fc12 Firefox/3.5.6) kymmeneksi alasivuksi
pilkottu artikkeli (josta oikealle jää kolmanneksen levyinen palkki);
JavaScriptin ollessa päällä ikkuna aina skaalautuu sen kokoiseksi että
alhaalla on vaakascrolli-palkki?!
--
/* * * Otto J. Makela <***@iki.fi> * * * * * * * * * * * * * * * */
/* Phone: +358 40 765 5772, FAX: +358 42 7655772, ICBM: 60N 25E */
/* Mail: Mechelininkatu 26 B 27, FI-00100 Helsinki, FINLAND */
/* * * Computers Rule 01001111 01001011 * * * * * * * * * * * * */
Jukka K. Korpela
2010-02-14 14:53:03 UTC
Permalink
Post by Otto J. Makela
http://www.nytimes.com/2010/02/14/magazine/14texbooks-t.html
Ainakin minulla (Mozilla/5.0 (X11; U; Linux x86_64; en-US; rv:1.9.1.6)
Gecko/20100107 Fedora/3.5.6-1.fc12 Firefox/3.5.6) kymmeneksi
alasivuksi pilkottu artikkeli (josta oikealle jää kolmanneksen
levyinen palkki); JavaScriptin ollessa päällä ikkuna aina skaalautuu
sen kokoiseksi että alhaalla on vaakascrolli-palkki?!
Sivu on ehkä "optimoitu" IE:lle (siis sivuntekijät ovat testanneet lähinnä
vain IE:llä), sillä IE:llä vaakavierityspalkki häviää "jo" noin tuhannen
pikselin levyisessä ikkunassa.

Joka tapauksessa taitto on tehty aika ikävästi. Palstanleveys on kiinteä ja
liian iso mukavaan lukemiseen (lähes 90 merkkiä). Tosin kun ikkunan kaventaa
tekstipalstan levyiseksi, mitään olennaista ei jää pois, paitsi että
sivustoa ylläpitävän firman kannalta voisi luulla olennaiseksi, että
mainoksista jää tällöin suurin osa pois.

Tulos voisi kuitenkin olla huonompikin. Jopa 90 merkin rivi on siedettävä,
kun fonttina on Georgia ja ennen muuta rivinkorkeus on niinkin iso kuin
1.5em.
--
Yucca, http://www.cs.tut.fi/~jkorpela/
Otto J. Makela
2010-06-15 10:14:03 UTC
Permalink
Huomasin muuten vasta nyt, että http://www.randi.org/ on rakennettu
samalla idealla jota olen ajatellut, eli yläreunasta löytyy säädin
jolla sivun leveys voidaan lukita tai antaa mennä vapaasti
selainikkunan mukaan.
--
/* * * Otto J. Makela <***@iki.fi> * * * * * * * * * * * * * * * */
/* Phone: +358 40 765 5772, FAX: +358 42 7655772, ICBM: 60N 25E */
/* Mail: Mechelininkatu 26 B 27, FI-00100 Helsinki, FINLAND */
/* * * Computers Rule 01001111 01001011 * * * * * * * * * * * * */
Jukka K. Korpela
2010-06-16 05:26:30 UTC
Permalink
Post by Otto J. Makela
Huomasin muuten vasta nyt, että http://www.randi.org/ on rakennettu
samalla idealla jota olen ajatellut, eli yläreunasta löytyy säädin
jolla sivun leveys voidaan lukita tai antaa mennä vapaasti
selainikkunan mukaan.
Mutta rakennettu kummallisen huonosti - IE 8 ilmoittaa skriptivirheistä
(päättymättömiä merkkijonovakioita), samoin Firefox (viittauksia
määrittelemättömiin ominaisuuksiin, ilmeisesti siksi, että sivun koodi tekee
selaimentunnistusta tavanomaisella eli rikkinäisellä tavalla). En ruvennut
debuggailemaan; Javascript-koodi vaikuttaa osittain vahvasti obfuskoidulta,
ja kun HTML-koodistakin validaattori löytää 44 virhettä, eikä pelkkiä
tavanomaisia epästandardisuuksia vaan myös raskaita rakennevirheitä (koodi
ei ole edes well-formed XML vaikka on julistettu XHTML:ksi), tulee mieleen,
eikö Randin pitäisi olla vähän skeptisempi "kotonaan" eli esimerkiksi
kotisivujensa koodauksen suhteen. :-)

Sivulla on myös fonttikoon säätö, sekin tavanomaisen rikkinäinen: pienennys-
ja suurennuspainike näkyvät ja ovat klikattavissa silloinkin, kun pienennys
ja suurennus eivät enää onnistu, ja muutenkin homma toimii huonommin kuin
fonttikoon säätö selaimen toiminnoilla.

Leveyden säädössä näyttää olevan kaksi vaihtoehtoa, joista kapeampikin on
sellainen, että IE 8:ssa selainikkunan pitää olla luokkaa tuhat pikseliä,
jotta ei tulisi vaakavierityspalkkia. Firefoxissa mukautuu paremmin ikkunan
kaventamiseen, mutta lisää kavennettaessa mukautuvuus häviää ja teksti menee
värillisen marginaalin puolelle.

Vaihtoehdot on nimetty oudosti: tooltip-tekstit ovat "Wide width" ja "Fluid
width", vaikka jälkimmäinen on riittävän leveässä ikkunassa leveämpi. "Wide
width" tarkoittaa todellisuudessa sitä, että leveydelle on asetettu yläraja,
joka tosin on (liian) iso.

Kapeampi vaihtoehto on kokoruututilassa sellainen, että tekstin rivinpituus
on 130 merkin luokkaa, siis ehdottomasti aivan liikaa. Leveämpi vielä
pahempi.
--
Yucca, http://www.cs.tut.fi/~jkorpela/
Otto J. Makela
2010-05-20 10:12:49 UTC
Permalink
Kokeillaan vielä kerran, siinä toivossa että kysymykseni olisi
sattunut jäämään huomaamatta ihmiseltä jolla on kokemusta asiasta?

Minulle tuli ihan ajatuskokeena mieleen, onko jossain näkynyt jollain
siistillä javascript+css-tekniikalla toteutettuna tekstisivustoa jonka
muotoilussa lukija itse voisi valita muotoiluasioita?

Vaihtoehtoina voisi olla vaikkapa täysin vapaa selainikkunassa,
selainikkunan korkuisiksi palstoiksi pilkottuna (niin monta kuin
kerralla ruudulle mahtuu), tai yksi yhtenäinen leveysrajoituksella?

Jonkinlainen muotoilun valintacookie olisi varmaan sopiva tapa
toteuttaa tällainen?
--
/* * * Otto J. Makela <***@iki.fi> * * * * * * * * * * * * * * * */
/* Phone: +358 40 765 5772, FAX: +358 42 7655772, ICBM: 60N 25E */
/* Mail: Mechelininkatu 26 B 27, FI-00100 Helsinki, FINLAND */
/* * * Computers Rule 01001111 01001011 * * * * * * * * * * * * */
Jukka K. Korpela
2010-05-20 16:08:32 UTC
Permalink
Post by Otto J. Makela
Minulle tuli ihan ajatuskokeena mieleen, onko jossain näkynyt jollain
siistillä javascript+css-tekniikalla toteutettuna tekstisivustoa jonka
muotoilussa lukija itse voisi valita muotoiluasioita?
http://www.tv-opas.com/
kohta "Asetukset".
(Aloin kyllä vähän ihmellä, kun katsoin evästeitä: muotoiluasetuksiin
vaikuttava eväste vanhenee jo kahden kuukauden kuluttua.)

Tekniikka ei tässä taida olla ongelmana. Yksinkertainen menetelmä, joka
toimii varmaan reilusti yli 90 %:lle käyttäjistä (eikä oikein tehtynä
haittaa silloin kun ei toimi), on se, että sivulla on esimerkiksi painike,
jonka napsauttaminen asettaa evästeen, ja sivun latautuessa (sekä tuon
asettamisen jälkeen) suoritettavana koodina on sellainen, joka tutkii
evästeen arvoa ja jos se on asetettu, muuttaa sen mukaisesti CSS-tiedostoon
viittaavan link-elementin href-määritettä. Jotta tämä toimisi järkevästi,
tarvitaan tietysti koodi sivuston jokaiselle sivulle. Tämä taas on aika
triviaalia, jos SSI tai vastaava on käytettävissä, ja rasittavan työlästä
jos ei ole.

Haastavinta on vaihtoehtoisten muotoilujen tekeminen. Luulen että tämä on se
syy, miksi jo kauan sitten kuvattu idea käyttäjän tekemistä tyylivalinnoista
on jäänyt toteutuksissa aika harvinaiseksi. Hyvän ulkoasun suunnittelu on
työlästä. Kuka viitsii tehdä monta vaihtoehtoista ulkoasua? Siis sen
jälkeen, kun olet tehnyt mielestäsi parhaan, pitäisi suunnitella vielä
muita.

Viitsimiseen on ehkä syytä silloin, kun käyttäjän valintoja käytetään
muuhunkin kuin ulkoasun säätämiseen. Tuossa tv-oppaassakin tallennetaan
valintoja siitä, mitä tv-kanavat näkyvät, mikä on tietysti erittäin hyvä
ajatus. Kauppapaikassa voisi tallentaa käyttäjän preferenssejä tuotteiden
suhteen, jolloin käyttäjä aina sivuille tullessaan näkee häntä
kiinnostavimpia asioita. Tämä tosin yleensä toteutetaan ihan
sisäänkirjautumisen kautta. Mahdollisuuksia on hurjan paljon, ja sellaisessa
henkilökohtaistamisessa ulkoasu olisi vain pieni osa, joskin tärkeä myös
siksi, että saa sivuston _tuntumaan_ asiakkalle räätälöidyltä. Mutta kuten
niin monet ideat, tämäkin tahtoo hukkua toteutuksen työmäärään. (Tarkoitan
kunnollista toteutusta. Huonon toteutuksen hyöty on helposti negatiivinen.)
Post by Otto J. Makela
Vaihtoehtoina voisi olla vaikkapa täysin vapaa selainikkunassa,
selainikkunan korkuisiksi palstoiksi pilkottuna (niin monta kuin
kerralla ruudulle mahtuu), tai yksi yhtenäinen leveysrajoituksella?
Tuo riippuu olennaisesti sivujen sisällöstä, eli yleisen työkalun tekeminen
ei tunnu mielekkäältä. Olennaisempaa ehkä on, että palstoiksi jako on
todella haastavaa, mitä sillä sitten tarkemmin ottaen tarkoitetaankin
--
Yucca, http://www.cs.tut.fi/~jkorpela/
Otto J. Makela
2010-05-28 19:42:59 UTC
Permalink
Mikäli jonkun ideointia sattuisi auttamaan, opiskelin hieman jQuery:n
käyttöä ja rakensin sillä koesivun jossa on javascriptillä säädettävä
cookie-toiminen <body>-osion leveyssäätö (kiinteä tai vapaa):
http://www.otto.net/~otto/
--
/* * * Otto J. Makela <***@iki.fi> * * * * * * * * * * * * * * * */
/* Phone: +358 40 765 5772, FAX: +358 42 7655772, ICBM: 60N 25E */
/* Mail: Mechelininkatu 26 B 27, FI-00100 Helsinki, FINLAND */
/* * * Computers Rule 01001111 01001011 * * * * * * * * * * * * */
Jukka K. Korpela
2010-05-28 20:07:17 UTC
Permalink
Post by Otto J. Makela
Mikäli jonkun ideointia sattuisi auttamaan, opiskelin hieman jQuery:n
käyttöä ja rakensin sillä koesivun jossa on javascriptillä säädettävä
http://www.otto.net/~otto/
Sivulla ei ole mitään, mikä edes vihjaisi säädettävyyteen, jos kyseessä on
kai aika teoreettinen säätömahdollisuus. Poikkeaako se jotenkin siitä, että
selaintaan tunteva käyttäjätä voi itse säätää leveyden? Ehkä sikäli, että
jälkimmäinen on joskus todellista. :-)
--
Yucca, http://www.cs.tut.fi/~jkorpela/
Otto J. Makela
2010-05-28 20:35:39 UTC
Permalink
Post by Jukka K. Korpela
Post by Otto J. Makela
Mikäli jonkun ideointia sattuisi auttamaan, opiskelin hieman jQuery:n
käyttöä ja rakensin sillä koesivun jossa on javascriptillä säädettävä
http://www.otto.net/~otto/
Sivulla ei ole mitään, mikä edes vihjaisi säädettävyyteen, jos
kyseessä on kai aika teoreettinen säätömahdollisuus. Poikkeaako se
jotenkin siitä, että selaintaan tunteva käyttäjätä voi itse säätää
leveyden? Ehkä sikäli, että jälkimmäinen on joskus todellista. :-)
Anteeksi, en ymmärrä kommenttiasi? Oikeassa yläreunassa on ainakin
minulla nuoli, jolla voi valita onko leveys joko rajattu 30 em vaiko vapaa.
--
/* * * Otto J. Makela <***@iki.fi> * * * * * * * * * * * * * * * */
/* Phone: +358 40 765 5772, FAX: +358 42 7655772, ICBM: 60N 25E */
/* Mail: Mechelininkatu 26 B 27, FI-00100 Helsinki, FINLAND */
/* * * Computers Rule 01001111 01001011 * * * * * * * * * * * * */
Jukka K. Korpela
2010-05-29 05:59:28 UTC
Permalink
Post by Otto J. Makela
http://www.otto.net/~otto/
- -
Post by Otto J. Makela
Anteeksi, en ymmärrä kommenttiasi? Oikeassa yläreunassa on ainakin
minulla nuoli, jolla voi valita onko leveys joko rajattu 30 em vaiko vapaa.
IE 8:lla ei näy mitään nuolta, selainikkunan koosta riippumatta. Sivun
sisältönä on pelkkää tekstiä. Skriptien suoritusta en ole estänyt selaimen
asetuksista.

Firefoxilla näkyy katkoviivanuoli. Ei kyllä tulisi mieleen ilman selityksiä,
että sillä voisi jotenkin säätää sivun ulkoasua. Tässä on yksi
säädettävyyden ongelmista: jotta sivusto- tai sivukohtainen säätötoiminto
olisi oikeasti käytettävissä, sitä pitää selittää - ja selittäminen vie
tilaa ja vie huomiota sivuston sisällöstä.

Oikeastaan ainoa säätötoiminto, joka on merkittävälle osalle kävijöistä
ymmärrettävissä ilman selityksiä, on fonttikoon säätö tietynlaisilla
kuvakkeilla. Se taas on hyödyllisyydeltään aika kyseenalainen: sivuntekijä
rikkoo yleisimmän selaimen (IE) fonttikoon säädön asettamalla kiinteän
fonttikoon ja sitten rakentaa sen jonkinlaisen muovijäljitelmän.
(Muistaakseni en ole koskaan nähnyt sentyyppistä säätötoimintoa, jossa olisi
_enemmän_ fonttikokovaihtoehtoja kuin IE:n tarjoamat surkeat viisi. Usein
vähemmän...)
--
Yucca, http://www.cs.tut.fi/~jkorpela/
Otto J. Makela
2010-05-29 08:29:07 UTC
Permalink
Post by Jukka K. Korpela
IE 8:lla ei näy mitään nuolta, selainikkunan koosta riippumatta. Sivun
sisältönä on pelkkää tekstiä. Skriptien suoritusta en ole estänyt
selaimen asetuksista.
Kiinnostavaa, ilmeisesti jQueryn html() -funktion toiminta ei ole täysin
luotettava eri selainten välillä. Tai sitten käyttämäni utf8-merkit
jotka nuo nuolet tekivät eivät ole käytettävissä kaikilla selaimilla.

Vaihdoin koesivuun kirjaimet A ja B osoittamaan vaihtoehtoja,
vaikuttaako tämä näkyvyyteen IE8:lla?
Post by Jukka K. Korpela
Firefoxilla näkyy katkoviivanuoli. Ei kyllä tulisi mieleen ilman
selityksiä, että sillä voisi jotenkin säätää sivun ulkoasua. Tässä on
yksi säädettävyyden ongelmista: jotta sivusto- tai sivukohtainen
säätötoiminto olisi oikeasti käytettävissä, sitä pitää selittää - ja
selittäminen vie tilaa ja vie huomiota sivuston sisällöstä.
Kyseessä onkin todella koesivu, "proof of concept". Tästä ehkä antaa
vihjeen myös että sivun sisältö on Lorem Ipsum -pseudolatinaa.
--
/* * * Otto J. Makela <***@iki.fi> * * * * * * * * * * * * * * * */
/* Phone: +358 40 765 5772, FAX: +358 42 7655772, ICBM: 60N 25E */
/* Mail: Mechelininkatu 26 B 27, FI-00100 Helsinki, FINLAND */
/* * * Computers Rule 01001111 01001011 * * * * * * * * * * * * */
Otto J. Makela
2010-05-29 08:41:07 UTC
Permalink
Post by Jukka K. Korpela
IE 8:lla ei näy mitään nuolta, selainikkunan koosta riippumatta. Sivun
sisältönä on pelkkää tekstiä. Skriptien suoritusta en ole estänyt
selaimen asetuksista.
Kiinnostavaa, ilmeisesti jQueryn html() -funktion toiminta ei ole täysin
luotettava eri selainten välillä. Tai sitten käyttämäni utf8-merkit
jotka nuo nuolet tekivät eivät ole käytettävissä kaikilla selaimilla.

Vaihdoin koesivuun kirjaimet A ja B osoittamaan vaihtoehtoja,
vaikuttaako tämä näkyvyyteen IE8:lla?
Post by Jukka K. Korpela
Firefoxilla näkyy katkoviivanuoli. Ei kyllä tulisi mieleen ilman
selityksiä, että sillä voisi jotenkin säätää sivun ulkoasua. Tässä on
yksi säädettävyyden ongelmista: jotta sivusto- tai sivukohtainen
säätötoiminto olisi oikeasti käytettävissä, sitä pitää selittää - ja
selittäminen vie tilaa ja vie huomiota sivuston sisällöstä.
Kyseessä onkin todella koesivu, "proof of concept". Tästä ehkä antaa
vihjeen myös se, että sivun sisältö on Lorem Ipsum -pseudolatinaa.
--
/* * * Otto J. Makela <***@iki.fi> * * * * * * * * * * * * * * * */
/* Phone: +358 40 765 5772, FAX: +358 42 7655772, ICBM: 60N 25E */
/* Mail: Mechelininkatu 26 B 27, FI-00100 Helsinki, FINLAND */
/* * * Computers Rule 01001111 01001011 * * * * * * * * * * * * */
Jukka K. Korpela
2010-05-29 09:46:28 UTC
Permalink
Post by Otto J. Makela
Vaihdoin koesivuun kirjaimet A ja B osoittamaan vaihtoehtoja,
vaikuttaako tämä näkyvyyteen IE8:lla?
Vaikuttaa, mikä on hämmentävää. Nuolimerkin fonttiongelma nimittäin kävi
mielessäni aiemmin, ja ehdin jo kokeilla fontin vaihtoa - mutta nuolta ei
näkynyt vaikka valitsin fontiksi Code2000:n (todennäköisesti laajin
saatavissa oleva fontti, joka kattaa Unicoden BMP:n lähes kokonaan).
Fonttiongelma voi kyllä syntyä, koska kovinkaan moni fontti ei tuota merkkiä
sisällä, ks.
http://www.fileformat.info/info/unicode/char/21e5/fontsupport.htm

Ongelma syntyi kuitenkin muusta, enkä luultavasti olisi keksinyt syytä,
ellen itse olisi jokin aika sitten tehnyt olennaisesti aivan samanlaista
virhettä. Sivulla on script-elementti ja sen sisällä vielä CDATA-sektio,
joilla huolehditaan siitä, että skriptiin voi kirjoittaa mitä vain merkkejä
ilman että selain soveltaa niihin HTML:n sääntöjä. Mutta silloinpa ei sitten
toimikaan esimerkiksi
$("#set_width").html("&#x21e5");
koska siinähän käytetään HTML:n mukaista merkkiviittausta &#x21e5 (josta
tosin puuttuu XHTML:n sääntöjen vaatima puolipiste lopusta). Ongelma
ratkeaisi kirjoittamalla merkki sellaisenaan tai käyttämällä Javascriptin
mukaista merkkiviittausta:
$("#set_width").html("\u21e5");
--
Yucca, http://www.cs.tut.fi/~jkorpela/
Otto J. Makela
2010-05-31 08:26:09 UTC
Permalink
Post by Jukka K. Korpela
Ongelma syntyi kuitenkin muusta, enkä luultavasti olisi keksinyt
syytä, ellen itse olisi jokin aika sitten tehnyt olennaisesti aivan
samanlaista virhettä. Sivulla on script-elementti ja sen sisällä vielä
CDATA-sektio, joilla huolehditaan siitä, että skriptiin voi kirjoittaa
mitä vain merkkejä ilman että selain soveltaa niihin HTML:n sääntöjä.
Mutta silloinpa ei sitten toimikaan esimerkiksi
$("#set_width").html("&#x21e5");
koska siinähän käytetään HTML:n mukaista merkkiviittausta &#x21e5
(josta tosin puuttuu XHTML:n sääntöjen vaatima puolipiste lopusta).
Ongelma ratkeaisi kirjoittamalla merkki sellaisenaan tai käyttämällä
$("#set_width").html("\u21e5");
Kiitoksia debuggaamisesta, itse en tuota olisi keksinyt ilman
merkittävää pähkäilyä sillä minulle ei ole ollut selvää missä
järjestyksessä nuo eri tasojen escape-sekvenssit auotaan.

Tuon merkin käyttäminen oli joka tapauksessa hieman sivujuonne,
luultavimmin tuohon jatkossa tulisi joku sopiva img (selittävällä
titlellä) tai jotain sellaista. Syy miksi asetan linkin sisällön vasta
javascriptin puolella on tietenkin jotta sivu renderöityisi kauniisti
tilanteessa jossa javascript ei ole käytettävissä...
--
/* * * Otto J. Makela <***@iki.fi> * * * * * * * * * * * * * * * */
/* Phone: +358 40 765 5772, FAX: +358 42 7655772, ICBM: 60N 25E */
/* Mail: Mechelininkatu 26 B 27, FI-00100 Helsinki, FINLAND */
/* * * Computers Rule 01001111 01001011 * * * * * * * * * * * * */
Sami Ketola
2010-05-29 06:25:46 UTC
Permalink
Post by Otto J. Makela
Anteeksi, en ymmärrä kommenttiasi? Oikeassa yläreunassa on ainakin
minulla nuoli, jolla voi valita onko leveys joko rajattu 30 em vaiko vapaa.
Minun selaimellani ei näy. Safari 4. Ei myöskään Firefox 3.6.3 näytä nuolta,
vaan levittää koko sivun levyiseksi suoraan. Opera 10.53 näyttää nuolen ja
se jopa näyttää toimivan niinkuin on tarkoitettu.

Sami
Juhani Varemo
2010-05-29 07:07:44 UTC
Permalink
Post by Sami Ketola
Minun selaimellani ei näy. Safari 4. Ei myöskään Firefox 3.6.3 näytä nuolta,
vaan levittää koko sivun levyiseksi suoraan. Opera 10.53 näyttää nuolen
ja se jopa näyttää toimivan niinkuin on tarkoitettu.
FF 3.5.9 Linuxissa näkyy toimivan OK.
Konqueror 4.4.3 ei nuolta.
Opera 10.10 toimii.

<juhani>
Akseli Mäki
2010-05-30 19:32:09 UTC
Permalink
Post by Sami Ketola
Minun selaimellani ei näy. Safari 4. Ei myöskään Firefox 3.6.3 näytä nuolta,
vaan levittää koko sivun levyiseksi suoraan.
Firefox 3.5.8 näyttää nuolen ja sitä klikkaamalla palstan leveys muuttuu.
Tuollaista nuolta ei kyllä kovin helpolla arvaisi klikata.
Jukka K. Korpela
2010-06-13 12:38:10 UTC
Permalink
(Alkuperäinen otsikko: Re: Sivusto ja maksimileveys, taas)
Post by Jukka K. Korpela
Post by Otto J. Makela
Minulle tuli ihan ajatuskokeena mieleen, onko jossain näkynyt jollain
siistillä javascript+css-tekniikalla toteutettuna tekstisivustoa
jonka muotoilussa lukija itse voisi valita muotoiluasioita?
- -
Post by Jukka K. Korpela
Haastavinta on vaihtoehtoisten muotoilujen tekeminen. Luulen että
tämä on se syy, miksi jo kauan sitten kuvattu idea käyttäjän
tekemistä tyylivalinnoista on jäänyt toteutuksissa aika
harvinaiseksi. Hyvän ulkoasun suunnittelu on työlästä. Kuka viitsii
tehdä monta vaihtoehtoista ulkoasua? Siis sen jälkeen, kun olet
tehnyt mielestäsi parhaan, pitäisi suunnitella vielä muita.
Jäin miettimään tuota toukokuisen keskustelun teemaa ja päädyin siihen, että
yksi olennainen lisäongelma on tämä: Miten esitetään vaihtoehdot
käyttäjälle?

Edes niin yksinkertaisen säädön kuin fonttikoon valinnan esittäminen ei ole
ongelmatonta, ainakaan päätellen siitä, että noin kaikki tekevät sen väärin.
Käytetään erilaisia painikkeita, joissa kovasti yritetään viestiä ideaa "kun
klikkaat tästä, fonttikoko kasvaa" tms. (huomaamatta edes kertoa tätä
viestiä sanallisesti tooltip-tekstinä).

Otin kuitenkin mietittäväksi paljon haastavamman valinnan: fonttilajin
valinnan. Sehän on olisi järkevämpi tavoite kuin fonttikoon säätö, sillä
koko on yleensä suoraan valittavissa selaimesta, fonttilaji on hankalampi,
ja lisäksi rivinkorkeuden valinta fonttilajia vastaavaksi ei onnistukaan
millään selaimen asetuksilla.

Kokeilen sivulla
http://www.cs.tut.fi/~jkorpela/kreikka.html8
ideaa painikkeista, joilla voi valita fontin niin, että painikkeessa on
eräänlainen malliteksti kyseisellä fontilla. Tässä ei ole mitään
sivustokohtaisuutta, koska se on oikeastaan paljon yksinkertaisempi puoli
asiasta (pelkkää tekniikkaa, joskus toki työlästä).

Kommentteja?
--
Yucca, http://www.cs.tut.fi/~jkorpela/
Otto J. Makela
2010-06-13 21:20:00 UTC
Permalink
Post by Jukka K. Korpela
Kokeilen sivulla
http://www.cs.tut.fi/~jkorpela/kreikka.html8
ideaa painikkeista, joilla voi valita fontin niin, että painikkeessa
on eräänlainen malliteksti kyseisellä fontilla. Tässä ei ole mitään
sivustokohtaisuutta, koska se on oikeastaan paljon yksinkertaisempi
puoli asiasta (pelkkää tekniikkaa, joskus toki työlästä).
Ainakin minulle näyttäisi toimivan, joskin valinnat Verdana, Georgia
ja Palatino Linotype päätyvät minun selainympäristössäni (Mozilla/5.0
(X11; U; Linux x86_64; en-US; rv:1.9.1.9) Gecko/20100330
Fedora/3.5.9-2.fc12 Firefox/3.5.9) näköjään aivan samoiksi.
Lienee irrelevanttia tässä kontekstissa.
--
/* * * Otto J. Makela <***@iki.fi> * * * * * * * * * * * * * * * */
/* Phone: +358 40 765 5772, FAX: +358 42 7655772, ICBM: 60N 25E */
/* Mail: Mechelininkatu 26 B 27, FI-00100 Helsinki, FINLAND */
/* * * Computers Rule 01001111 01001011 * * * * * * * * * * * * */
Osmo Saarikumpu
2010-06-14 19:19:22 UTC
Permalink
Post by Jukka K. Korpela
Kokeilen sivulla
http://www.cs.tut.fi/~jkorpela/kreikka.html8
ideaa painikkeista, joilla voi valita fontin niin, että painikkeessa on
eräänlainen malliteksti kyseisellä fontilla. Tässä ei ole mitään
sivustokohtaisuutta, koska se on oikeastaan paljon yksinkertaisempi
puoli asiasta (pelkkää tekniikkaa, joskus toki työlästä).
IMHO, kätsyä, mutta, ainakin ilman erikoiskohdetta, lienee liian
työlästä suhteessa saavutettavaan hyötyyn. Vielä kun pitäisi disabloida
aktiivi valinta ja tuottaa painikkeet skriptillä.
--
Yst. terv. Osmo
Jukka K. Korpela
2010-06-16 07:31:08 UTC
Permalink
Post by Osmo Saarikumpu
Post by Jukka K. Korpela
Kokeilen sivulla
http://www.cs.tut.fi/~jkorpela/kreikka.html8
ideaa painikkeista, joilla voi valita fontin niin, että painikkeessa
on eräänlainen malliteksti kyseisellä fontilla. Tässä ei ole mitään
sivustokohtaisuutta, koska se on oikeastaan paljon yksinkertaisempi
puoli asiasta (pelkkää tekniikkaa, joskus toki työlästä).
IMHO, kätsyä, mutta, ainakin ilman erikoiskohdetta, lienee liian
työlästä suhteessa saavutettavaan hyötyyn.
Varmaankin. Valitsin testisivuksi sellaisen, jossa esiintyy kreikkalaisia
kirjaimia, jolloin on ehkä tavallista todennäköisempää, että lukija haluaa
kokeilla eri fontteja - ehkä löytääkseen sellaisen, jossa kreikkalaisten
kirjainten muoto on hänelle tuttu.

Oton mainitsema ilmiö "valinnat Verdana, Georgia ja Palatino Linotype
päätyvät - - aivan samoiksi" on kyllä olennainen ongelma, jonka takia käytin
painikkeille abstrakteja nimiä Fonttilaji 1 jne. ja toisaalta kirjoitin
"työkaluvihjeisiin" fonttien nimiä. Kompromissi, joka varmaan yhdistää eri
vaihtoehtojen huonot puolet, kuten kompromississa yleensä käy. :-(

Sen tunnistamiseen, mitä fontteja käyttäjän koneessa on, ei taida olla
mitään suoraa keinoa - päätellen siitä, millaisia kikkailuja tarkoitukseen
on kehitelty.
Post by Osmo Saarikumpu
Vielä kun pitäisi
disabloida aktiivi valinta ja tuottaa painikkeet skriptillä.
Joo, sellaista ei useinkaan jakseta tehdä. :-) Nyt huomaan, että olisi
kannattanut tehdä niin alun alkaen, koska silloin painikkeet olisi voinut
tuottaa silmukassa.
--
Yucca, http://www.cs.tut.fi/~jkorpela/
Osmo Saarikumpu
2010-06-16 16:15:06 UTC
Permalink
Post by Jukka K. Korpela
Varmaankin. Valitsin testisivuksi sellaisen, jossa esiintyy
kreikkalaisia kirjaimia, jolloin on ehkä tavallista todennäköisempää,
että lukija haluaa kokeilla eri fontteja - ehkä löytääkseen sellaisen,
jossa kreikkalaisten kirjainten muoto on hänelle tuttu.
Arvelinkin jotain tällaista. Minulle näyttivät kaikki tyynni yhtä
kreikkalaisilta :)

Tuli vielä mieleen tuosta kokeilustasi rivikorkeusasia, jonka hiljattain
huomasin.

http://www.w3.org/TR/WCAG20/

kohta: 1.4.8 Visual Presentation

(ei ankkuria suoraan tuossa, koskien "visual presentation of blocks of
text") sanoo:

Line spacing (leading) is at least space-and-a-half within paragraphs...

Joka, mikäli olen ymmärtänyt oikein, niin CSS:nnä tarkoittaisi vähintään:

p {line-height:1.5;}

riippumatta käytettävästä fontista. Mitä mieltä olet?
--
Yst. terv. Osmo
JSk88
2010-02-13 08:54:44 UTC
Permalink
Post by Otto J. Makela
Minulle esitettiin perusteluna www-sivuston vapaan maksimileveyden
rajoittamiseksi sitä, että ihmisillä on nykyään niin suuria näyttöjä
että niiden levyinen rivi olisi kovin vaikealukuinen.
Mikä on kommenttinne, onko keskiverto www-käyttäjä nykyään oikeasti
niin osaamaton että hän ei osaa/halua säätää selainikkunansa kokoa
niin että tekstin lukeminen on miellyttävää, ja tällaisiin
rajoituksiin on tarpeen ryhtyä sivuston suunnittelijan toimesta?
Peruskäyttäjä on painanut kerran F11 eikä voi enää asialle mitään?
Ja tyhmää tässä on se, että kun käyttää näyttöä pystyasennossa, niin
sitten useat vakioleveyteen pakotetut www-sivut on liian leveitä, ja
selaimeen ilmestyy vaakavierityspalkki.

J.
Loading...