Mobiililaitteet: xhtml, html loose vai html strict?

webnovice

1)
Olen tekemässä nettisivustoa. Mikähän on nykytilanne mobiililaitteiden ja html:n suhteen? Jos haluan, että sivusto näkyy myös kännyköillä, pitääkö sivusto olla xhtml-muodossa vai riittääkö html strict tai html loose? Olen siinä käsityksessä että nykyään mobiililaitteet tukevat myös html loose -sivuja, kunhan linkit eivät avaudu eri sivulle (ei siis ole target=blank).

2)
En haluaisi tehdä sivustoa ainakaan xhtml-muotoon, koska ainakin ennen oli niin, että jos koodissa on yksikin virhe, ei IE näytä sivua ollenkaan. Html loose -muodossa IE näyttää sivun, vaikka se ei olisi täysin validi. Html strict muodosta en tiedä. Tietääkö joku miten on Html strict -muodon laita?

9

712

    Vastaukset

    Anonyymi (Kirjaudu / Rekisteröidy)
    5000
    • Suosittelen tälläistä työprosessia:

      1) Valitse aina kehitystä varten käyttöön selainjulkaisu mikä edustaa vanhinta tekniikkaa mikä on käytössä nykyisten työasema/palvelinkäyttöjärjestelmien _edellisissä_ julkaisuissa valmiina tai saatavilla päivitystoiminnon kautta. Tänä päivänä se olisi Firefox 2.0 joka löytyy enää Solariksesta (viikko reilu viikko takaperin löytyi vielä Debianista).

      2) Kun olet rajoittanut selainteknologian ns. heikoimpaan lenkkiin, ota käyttöön uusimmat standardit mitä voit käyttää tällä selaimella, sekä selaimilla mitkä on käytössä työasema/palvelin -käyttöjärjestelmien edellisten julkaisujen selaimilla mitä niissä on valmiina tai saatavilla päivityksistä. Tarkoittaisi tänä päivänä XHTML 1.1 Strict, CSS 2.1, PNG, JPEG ja ISO/IEC 16262 standardin mukaista Javascriptiä. SVG:tä ei voi käyttää koska se ei joka paikassa toimi. Vastaavasti Flashin käyttö tulee rajoittaa vain johonkin videotoistoon tai mainosbanneri animaatioon.

      3) Sivustoa tehdessä pyrit siihen, että taitto on mahdollisimman pitkälle skaalautuvaa, eli vältät pikselimittoja. Käytä em -mittoja missä vain pystyt. Lisäksi tee taittoa niin, että saat sen skaalautuvaan mahdollisimman kapeaksi. Tämä mahdollistaa sivuston käyttämisen pienelläkin näytöllä. Ohjeistan käyttämään leipätekstissä selaimen tarjoamaa oletuskokoa joka on työpöytäympäristöissä yleensä 16px kokoa. Mobiililaitteiden käyttäjät voi sitten pienentää tekstiä johonkin 12px kokoon jolloin sivusto olisi pikseleinä 75% alkuperäisestä. Vastaavasti suosittelen varmistumaan siitä, että sivusto toimisi ainakin 50em levyisellä ruudulla (pystyscrollin kanssa, 52em jos kaikki mahtuu kerralla ruudulle) jolloin saitti näkyisi mitä suurimmalla todennäköisyydellä ilman mitään vaakascrolleja 640px levyisellä näytöllä. Sivuston pitää olla myös käytettävissä tekstimuodossa.

      4) Kun olet saanut sivuston toimimaan sillä Firefox 2.0:lla, ajat W3:n validaattoreilla sen virheiden varalta. Tässä linkit:

      http://validator.w3.org/
      http://jigsaw.w3.org/css-validator/

      Ja sivuston pitää mennä 100%:sti läpi. Luonnollisesti olet määrittänyt merkistöt oikein ja käytät UTF-8:a.

      5) Tämän jälkeen testaat sivuston niillä muilla selaimilla mitä on niissä työpöytä/palvelin -käyttöjärjestelmissä. Eli Firefox 2.0:n jälkeen testaat sivuston toiminnan Internet Explorer 8, Safari 4, Opera 10.10 ja uusimmalla Google Chromella. Syynä ihan se, että näitä on oletuksena nykykäyttöjärjestelmien nykyisissä ja edellisissä julkaisuissa, ja Windowsiin tulee valintaikkuna viikon päästä käyttäjille joista voivat klikata edellä mainittuja selaimia käyttöön.

      Näillä konsteilla sivusto näkyy erittäin suurella todennäköisyydellä lähes 100%:ssa päätelaitteita joko suoraan, tai sitten niin, että asiakas asentaa laitteeseensa päivitykset.

      • webnovice

        Epäilen myös tuota skaalautuvuuden hyvyyttä, eli että sivun leveys olisi esim. 90 % eikä 900 px. Jos sivun leveys on prosentteina, sivuhan näkyy todella suurena isoissa näytöissä.

        Toisaalta, eikö mobiililaitteille voi tehdä oman tyylitiedoston:




        Toimiiko tämä? Tällöin voisi ehkä laittaa sivun leveydeksi px, mutta mobiililaitteille %.


      • webnovice
        webnovice kirjoitti:

        Epäilen myös tuota skaalautuvuuden hyvyyttä, eli että sivun leveys olisi esim. 90 % eikä 900 px. Jos sivun leveys on prosentteina, sivuhan näkyy todella suurena isoissa näytöissä.

        Toisaalta, eikö mobiililaitteille voi tehdä oman tyylitiedoston:




        Toimiiko tämä? Tällöin voisi ehkä laittaa sivun leveydeksi px, mutta mobiililaitteille %.

        koodia, mutta siis kaksi eri css-tiedostoa:

        link href="style_basic.css" media="screen"

        link href="style_mobile.css" media="handheld"


      • webnovice kirjoitti:

        Epäilen myös tuota skaalautuvuuden hyvyyttä, eli että sivun leveys olisi esim. 90 % eikä 900 px. Jos sivun leveys on prosentteina, sivuhan näkyy todella suurena isoissa näytöissä.

        Toisaalta, eikö mobiililaitteille voi tehdä oman tyylitiedoston:




        Toimiiko tämä? Tällöin voisi ehkä laittaa sivun leveydeksi px, mutta mobiililaitteille %.

        Pärjäät yhdellä tyylitiedostolla kunhan varmistat, että vaakascrollia ei tule 50em leveydellä mikäli tarvitset pystyscrollia, tai 52em leveydellä mikäli kaikki sopii 4:3 näytölle kerrallaan. Pidä tuota maksimileveytenä mihin sivusto voi skaalautua ilman vaakascrollia.

        Luonnollisesti sivusto toimii paremmin mitä kapeammaksi se skaalautuu, ja tietysti sivusto voi skaalautua leveämmäksikin jos tilaa on. min-width, max-width yms. ohjailee tuollaisia, voi olla kelluvia elementtejä ja jne. Ideaalitilanteessa sivusto vain venyy ja vanuu eri kokoisille näytöile ilman, että taitto kärsisi siitä.


    • Ja sitten se tärkein asia, että miksi näin. Syynä on se, että WWW-kehittäjillä ei oleellisesti ole helposti saatavana sellaista testausresursseja millä voisi testata kaikki mahdolliset selain, käyttöjärjestelmä ja kännykkä yhdistelmät. Työasemaan on helppo laittaa useita selaimia ja käyttöjärjestelmiä virtuaalikoneisiin ja samoja selainmoottoreita käytetään myös kännyköissä. Et yksinkertaisesti pysty testaamaan sadoilla eri kännyköillä, selaimilla, käyttöjärjestelmillä, konsoleilla, tableteilla ja ties millä härveleillä millä nettiä selataan nyt ja varsinkin lähitulevaisuudessa.

      Oikea tapa saada homma järkevästi tehtyä on tehdä uusimpien standardien ja tekniikoiden mukaisesti jotta sivuston koodi ei mätäne ennen aikojaan, ja jotta homma skaalautuisi mahdollisimman hyvin mobiilikoosta suurelle näytölle asti. Mutta toisaalta pitää välttää käyttämästä liian uutta tekniikkaa mikä ei kaikilla toimi, tai jonka virittäminen toimintaan tarvitsee paljon työtä. Et halua laittaa sivuston kävijää esimerkiksi kääntämään lähdekoodeista uutta selainta, että sivusto näkyisi.

      Sitten kun HTML 5 on valmis, voit nostaa heikoimman lenkin selaimeksi Firefox 3.6:n mikäli teet jotain multimedioita sivustolle tai haluat videota näyttää, sillä se lienee HTML 5:n valmistumisen aikoihin vanhin HTML5:n audio/video -tageja tunteva edelleen tuettu selain.

      Varmaan huomasitkin, että en puhunut mitään mobiililaitteilla testauksesta sen enempää kuin vanhoilla IE:n julkaisuilla testaamisesta. Eri mobiililaitteita voi sitten testailla tämän jälkeen jos aikaa ja resursseja riittää tai joltain asiakkaalta tulee palautetta että ei nyt toimi jossain missä pitäisi. Internet Explorer taas on Windowsin oletusselain. Nykyinen työasema Windows on Windows 7, ja edellinen on Windows Vista, ja molemmiss on IE8 kun päivitykset laitettu. Sen lisäksi IE8 on myös vanhassa Windows XP:ssä kun siihen laittaa päivitykset ajan tasalle. Firefox 2.0 taas on niin vanhaa tekniikkaa, että se on hyvin lähellä IE7:n tasoa ja todennäköisesti Firefox 2:n ehdoilla tehdyt sivustot toimii IE7:lla vielä.

      Entäs sitten piraattiwindowsit joissa IE6:t kun ei uskalleta päivittää tai jotkut Windows 2000 käyttäjät? No, yksinkertaista. Sinä et välitä niistä. Ne ei ole ns. maksavia asiakkaita ja IE6:n ehdoilla säätäminen käytännössä tekisi saman sivuston toimimisen mobiilina lähes mahdottomaksi. Standardien mukaan tehty sivu sitten näkyy hätätilanteessa antiikkiselaimella tai jossain vanhentuneessa mobiililaitteessa tarvittaessa ilman tyylejä mutta toimii edelleen.

      • webnovice

        vastauksista. Muutama kysymys:

        - Eikö tekstissä olisi parempi käyttää em-kokoa kuin px? Olen nyt laittanut tekstin 12px. 16px on mielestäni kyllä ihan liian iso.

        - Miksi ei ISO 8859-1 kelpaa? Mikä vehje ei näytä oikein tekstiä, jos on ISO 8859-1?

        - Mistä saan ladattua vanhan Firefoxin ja IE:n?? Vanhin itselläni tallessa oleva on Firefox 3.5.5.

        PS. En ole asiantuntija, mutta itse vältän javascriptiä ja javaa kuin syöpää:) Kaiken saman voi tehdä php:llä, joka ei ole selainriippuvainen.


      • webnovice kirjoitti:

        vastauksista. Muutama kysymys:

        - Eikö tekstissä olisi parempi käyttää em-kokoa kuin px? Olen nyt laittanut tekstin 12px. 16px on mielestäni kyllä ihan liian iso.

        - Miksi ei ISO 8859-1 kelpaa? Mikä vehje ei näytä oikein tekstiä, jos on ISO 8859-1?

        - Mistä saan ladattua vanhan Firefoxin ja IE:n?? Vanhin itselläni tallessa oleva on Firefox 3.5.5.

        PS. En ole asiantuntija, mutta itse vältän javascriptiä ja javaa kuin syöpää:) Kaiken saman voi tehdä php:llä, joka ei ole selainriippuvainen.

        "- Eikö tekstissä olisi parempi käyttää em-kokoa kuin px? Olen nyt laittanut tekstin 12px. 16px on mielestäni kyllä ihan liian iso."

        em mittoja, kyllä. Ja sillä tavalla, että leipätekstin kokoa ei muuteta. Useinmiten sellainen normaalikokoinen teksti on astettu oletuksena 16px kokoon pöytäkoneiden selaimissa. Mobiililaitteissa on voitu säätää pienemmäksi, tai käyttäjä voi sen tehdä. Mainitsin pikselimitat vain siksi, että hahmottaisi sen miten ihmiset yleensä näkee normaalikokoisen tekstin pöytäkoneen ruudulla mutta kuinka se voi olla pienempi niin, että sopii johonkin mobiililaitteen ruudulle. Jos leipätekstin fonttia muuttaa niin voi tulla ongelmia skaalauksen kanssa.

        Toisin sanoen, älä koske leipätekstin fonttikokoon. Se on se normaalikoko minkä käyttäjä on valinnut. Suhteuta kaikki muu mitä kuvassa näkyy siihen.

        "- Miksi ei ISO 8859-1 kelpaa?"

        Se ei ole enää nykypäivää. Unicodella hommat hoidetaan nykyisin, saa samalla merkistöllä kaikki merkit. Vanhat standardit häviää aikaisemmin pois.

        http://en.wikipedia.org/wiki/UTF-8#Advantages_and_disadvantages

        "- Mistä saan ladattua vanhan Firefoxin ja IE:n?? Vanhin itselläni tallessa oleva on Firefox 3.5.5."

        Vanhaa IE:tä et tarvitse, eikä sitä oikein järkevästi saa mihinkään. Windows XP:stä lähtien on Windowsissa uusin IE8.

        Firefox 2.0:n saat täältä: http://ftp.mozilla.org/pub/mozilla.org//firefox/releases/2.0.0.20/

        Ja vanhempaa Firefoxia et tarvitse. Ei ole järkeä huomioida tuosta vanhempaa ja tuotakin käyttää enää yksi työasema/palvelinkäyttis mitä edelleen käytetään. Tuolla testaamalla saat samalla yhteensopivuutta vanhoihin IE versioihin sen verran mitä on järkevää, joillekin mobiililaitteille joissa on vanha selainmoottori tai näille jotka ei ole jostain syystä päivittäneet selainta (vaikka IE7 tai Firefox 2 käyttäjät).

        Sitten kun reilun parin vuoden päästä haluat tehdä HTML5:n audio/video tageilla sivuja kun se HTML5 tulee silloin standardiksi niin Firefox 3.6 sitten kehitysselaimeksi. Ei ole vielä kiirettä. Firefox 3.6:n selainmoottori edustaa nykypäivän uusinta mobiiliselain tekniikkaa kun tämä olisi N900:ssa joka tuli muutama kk sitten.. Ei kannata mennä liian uudessa tekniikassa, eikä liian vanhassakaan. Liian uudella jos kehittää niin voi tulla ongelmia näille joilla on vanhempi tekniikka mutta jos on liian vanha tekniikka niin sitten tulee enemmän tarvetta ties mille Javalle tai ei skaalaudu kunnolla puhelimeen. Tai sitten käy niin, että sivusto hajoaa ennen aikojaan kun maailma muuttuu ympärillä.

        Sittenkin vaikka HTML5 tulee valmiiksi niin en suosittele tekemään tämän ehdoilla ellei tarvitse, vaan edelleenkin käyttää sitä uusinta selaintekniikkaa mikä tulee päivityksistä nykyisiin ja edellisiin työasema/palvelin -käyttisten julkaisuihin. Firefox 2.0 saattaa olla heikoimpana lenkkinä jopa vuoteen 2015 asti.

        "PS. En ole asiantuntija, mutta itse vältän javascriptiä ja javaa kuin syöpää:) Kaiken saman voi tehdä php:llä, joka ei ole selainriippuvainen."

        Ei pysty tekemään. Koita vaikka Google Mapsia tai Runescapea ja koita sitten tehdä sama PHP:llä..

        Javascript ei selainriippuvainen, eikä kyllä Javakaan mutta Java ei ole oikein web standardi ja tarvii selainlaajennoksen. Se on kuolevaa tekniikkaa kun HTML5 Javascript syrjäyttää sitä. Nykypäivänä sitä käytetään vain silloin kun standardit tekniikat riitä. Vähän sama juttu kuin se. että Flashia käytetään mainoksissa ja video/audio toistossa. Näistä pääsee eroon parin vuoden kuluttua HTML 5:lla.


      • M-Kar kirjoitti:

        "- Eikö tekstissä olisi parempi käyttää em-kokoa kuin px? Olen nyt laittanut tekstin 12px. 16px on mielestäni kyllä ihan liian iso."

        em mittoja, kyllä. Ja sillä tavalla, että leipätekstin kokoa ei muuteta. Useinmiten sellainen normaalikokoinen teksti on astettu oletuksena 16px kokoon pöytäkoneiden selaimissa. Mobiililaitteissa on voitu säätää pienemmäksi, tai käyttäjä voi sen tehdä. Mainitsin pikselimitat vain siksi, että hahmottaisi sen miten ihmiset yleensä näkee normaalikokoisen tekstin pöytäkoneen ruudulla mutta kuinka se voi olla pienempi niin, että sopii johonkin mobiililaitteen ruudulle. Jos leipätekstin fonttia muuttaa niin voi tulla ongelmia skaalauksen kanssa.

        Toisin sanoen, älä koske leipätekstin fonttikokoon. Se on se normaalikoko minkä käyttäjä on valinnut. Suhteuta kaikki muu mitä kuvassa näkyy siihen.

        "- Miksi ei ISO 8859-1 kelpaa?"

        Se ei ole enää nykypäivää. Unicodella hommat hoidetaan nykyisin, saa samalla merkistöllä kaikki merkit. Vanhat standardit häviää aikaisemmin pois.

        http://en.wikipedia.org/wiki/UTF-8#Advantages_and_disadvantages

        "- Mistä saan ladattua vanhan Firefoxin ja IE:n?? Vanhin itselläni tallessa oleva on Firefox 3.5.5."

        Vanhaa IE:tä et tarvitse, eikä sitä oikein järkevästi saa mihinkään. Windows XP:stä lähtien on Windowsissa uusin IE8.

        Firefox 2.0:n saat täältä: http://ftp.mozilla.org/pub/mozilla.org//firefox/releases/2.0.0.20/

        Ja vanhempaa Firefoxia et tarvitse. Ei ole järkeä huomioida tuosta vanhempaa ja tuotakin käyttää enää yksi työasema/palvelinkäyttis mitä edelleen käytetään. Tuolla testaamalla saat samalla yhteensopivuutta vanhoihin IE versioihin sen verran mitä on järkevää, joillekin mobiililaitteille joissa on vanha selainmoottori tai näille jotka ei ole jostain syystä päivittäneet selainta (vaikka IE7 tai Firefox 2 käyttäjät).

        Sitten kun reilun parin vuoden päästä haluat tehdä HTML5:n audio/video tageilla sivuja kun se HTML5 tulee silloin standardiksi niin Firefox 3.6 sitten kehitysselaimeksi. Ei ole vielä kiirettä. Firefox 3.6:n selainmoottori edustaa nykypäivän uusinta mobiiliselain tekniikkaa kun tämä olisi N900:ssa joka tuli muutama kk sitten.. Ei kannata mennä liian uudessa tekniikassa, eikä liian vanhassakaan. Liian uudella jos kehittää niin voi tulla ongelmia näille joilla on vanhempi tekniikka mutta jos on liian vanha tekniikka niin sitten tulee enemmän tarvetta ties mille Javalle tai ei skaalaudu kunnolla puhelimeen. Tai sitten käy niin, että sivusto hajoaa ennen aikojaan kun maailma muuttuu ympärillä.

        Sittenkin vaikka HTML5 tulee valmiiksi niin en suosittele tekemään tämän ehdoilla ellei tarvitse, vaan edelleenkin käyttää sitä uusinta selaintekniikkaa mikä tulee päivityksistä nykyisiin ja edellisiin työasema/palvelin -käyttisten julkaisuihin. Firefox 2.0 saattaa olla heikoimpana lenkkinä jopa vuoteen 2015 asti.

        "PS. En ole asiantuntija, mutta itse vältän javascriptiä ja javaa kuin syöpää:) Kaiken saman voi tehdä php:llä, joka ei ole selainriippuvainen."

        Ei pysty tekemään. Koita vaikka Google Mapsia tai Runescapea ja koita sitten tehdä sama PHP:llä..

        Javascript ei selainriippuvainen, eikä kyllä Javakaan mutta Java ei ole oikein web standardi ja tarvii selainlaajennoksen. Se on kuolevaa tekniikkaa kun HTML5 Javascript syrjäyttää sitä. Nykypäivänä sitä käytetään vain silloin kun standardit tekniikat riitä. Vähän sama juttu kuin se. että Flashia käytetään mainoksissa ja video/audio toistossa. Näistä pääsee eroon parin vuoden kuluttua HTML 5:lla.

        Pieni googletus paljasti, että on mahdollista että Firefox 2.0 on jo päivittynyt joka paikassa, ja että heikoin lenkki olisi näin ollen joku IE8/Firefox 3.0. Laitanpa Solariksen huomenna virtuaaliin ja kerron mikä on tilanne.


      • M-Kar kirjoitti:

        Pieni googletus paljasti, että on mahdollista että Firefox 2.0 on jo päivittynyt joka paikassa, ja että heikoin lenkki olisi näin ollen joku IE8/Firefox 3.0. Laitanpa Solariksen huomenna virtuaaliin ja kerron mikä on tilanne.

        Ääh.. En jaksanu asentaa mutta Youtubekin lopettaa vanhojen selainten tuen joten suurella varmuudella fiksuinta on tehdä IE8:lla, testata uusimmalla Safarilla, Operalla, Chromella sekä FF3:lla. FF3 on varmuudella heikoin lenkki Firefoxissa ainakin vuoden 2011 huhtikuun loppuun saakka, mahdollisesti jopa vuoteen 2015 saakka.


    Ketjusta on poistettu 1 sääntöjenvastaista viestiä.

    Luetuimmat keskustelut

    1. Kotkalainen Demari Riku Pirinen vangittu Saksassa lapsipornosta

      https://www.kymensanomat.fi/paikalliset/8081054 Kotkalainen Demari Riku Pirinen vangittu Saksassa lapsipornon hallussapi
      Kotka
      87
      2362
    2. Olen tosi outo....

      Päättelen palstajuttujen perusteella mitä mieltä minun kaipauksen kohde minusta on. Joskus kuvittelen tänne selkeitä tap
      Ikävä
      20
      2285
    3. Vanhalle ukon rähjälle

      Satutit mua niin paljon kun erottiin. Oletko todella niin itsekäs että kuvittelet että huolisin sut kaiken tapahtuneen
      Ikävä
      19
      1838
    4. Maisa on SALAKUVATTU huumepoliisinsa kanssa!

      https://www.seiska.fi/vain-seiskassa/ensimmainen-yhteiskuva-maisa-torpan-ja-poliisikullan-lahiorakkaus-roihuaa/1525663
      Kotimaiset julkkisjuorut
      76
      1492
    5. Oletko sä luovuttanut

      Mun suhteeni
      Ikävä
      105
      1487
    6. Hommaatko kinkkua jouluksi?

      Itse tein pakastimeen n. 3Kg:n murekkeen sienillä ja juustokuorrutuksella. Voihan se olla, että jonkun pienen, valmiin k
      Sinkut
      161
      1255
    7. Aatteleppa ite!

      Jos ei oltaisikaan nyt NATOssa, olisimme puolueettomana sivustakatsojia ja elelisimme tyytyväisenä rauhassa maassamme.
      Maailman menoa
      257
      1052
    8. Mitä sanoisit

      Ihastukselle, jos näkisitte?
      Tunteet
      70
      971
    9. Onko se ikä

      Alkanut haitata?
      Ikävä
      78
      919
    10. Omalääkäri hallituksen utopia?

      Suurissa kaupungeissa ja etelässä moinen onnistunee. Suuressa osassa Suomea on taas paljon keikkalääkäreitä. Mitenkäs ha
      Maailman menoa
      174
      903
    Aihe