HTML5 ja CSS3, miten toimivat?

Jojo888

Näin aloittelijana kyselen, että kuinka HTML5 ja CSS3 toimivat nykyisillä selaimilla, eli kannattaako tehdä/suunnitella sivustoja vielä näiden mukaan?

11

310

    Vastaukset

    Anonyymi (Kirjaudu / Rekisteröidy)
    5000
    • Ihan hyviä kysymyksiä. Kummastakin voisi kirjoittaa kirjan. No HTML5:stä olenkin jo kirjoittanut: http://www.docendo.fi/tuote/951-0-38137-3

      Täällä Suomi24:ssä tekstin maksimimäärä on 5 000 merkkiä, eikä tänne ehkä muutenkaan kannata kirjoittaa kovin laajaa vastausta. Lyhyt vastaus taas on joko väärä tai ylimalkainen. Tässä se ylimalkainen vastaus:

      Riippuu ihan siitä, mitä piirteitä käytät. Sekä HTML5 että CSS3 sisältää sekä piirteitä, jotka toimivat kuin junan vessa kaikissa selaimissa, että piirteitä, joita yhteenkään selaimeen ei ole toteutettu alkuunkaan. Lisäksi kumpikin on luonnosasteella ja pysyy luonnoksena, joka voi muuttua milloin tahansa, todennäköisesti vuosia – eikä ainakaan CSS3 varsinaisesti valmistu koskaan, koska CSS3 on vain kattonimitys kaikelle, mitä CSS:ssä on CSS 2.1:n lisäksi.

      Melko hyvä yleiskatsaus on http://caniuse.com

      • LukiJa

        Millos kirjasta tulee upgrade / 2. painos?

        BTW. Ihan hyvä kirja. Mukaana voisi olla media jossa monimutkaisempia esimerkkejä, noi simmpelithän kyllä toimii mutta kun niitä alkaa modaamaan niin saattaa huomata olevansa keskellä suota.


      • LukiJa kirjoitti:

        Millos kirjasta tulee upgrade / 2. painos?

        BTW. Ihan hyvä kirja. Mukaana voisi olla media jossa monimutkaisempia esimerkkejä, noi simmpelithän kyllä toimii mutta kun niitä alkaa modaamaan niin saattaa huomata olevansa keskellä suota.

        Jaa-a. Kun tietäisi. Mitään kovin isoa ei ole tapahtunut, joka vaatisi päivittämistä. Mutta tällaiset asiat tuppaavat riippumaan lähinnä siitä, milloin painos alkaa loppua.

        Erilaisia cd:itä on aikoinaan paketoitu kirjoihin mukaan, mutta aika vähän niitä taidetaan käyttää. Laajoja esimerkkejä löytyy yleensä parhaiten netistä, etenkin kun ottaa huomioon, että kiinnostukset ja tarpeet ovat monenlaisia.

        Oikeastaan isoimpia ongelmia on se, että esimerkiksi näyttäviä HTML5-esimerkkejä on paljonkin (tosin niissä usein HTML5-osuus on aika pieni, enemmän demotaan todellisuudessa usein CSS:ää ja skriptikirjastoja), mutta ne ovat liian hienoja – liian laajoja, ja keskitytään näyttämään miten hienosti toimii, sen sijaan, että kerrottaisiin, miten se rakennettiin jne.


    • NoseBeens

      Kannattaa ehdottomasti. Kun kattelet kaikkien "pro" sivutekijöiden omii sivuja ja artikkeleita, nii ihan yleisesti jo tehdään noilla. Moni ei viitti edes ie kasia ottaa huomioon enää yhtään millään lailla. Kaikki kännyt ja tabletit on suvereeneja html viitos ja css kolmos koneita :D.
      HTML5 ja CSS3 toimivat nimenomaan nykyisillä selaimilla moitteetta. Suurennuslasin kans saattaa löytyä jotain vain koodareiden huomaamaa pilkkua jolla ei oikeesti ole vaikutusta yhtään mihinkään ;D.

      • Tuo oli varmaankin trollaus. Yksikään selain ei tue HTML5:tä eikä CSS3:a ”suvereenisti” eli kokonaan. Tämähän ei tietenkään haittaa, kunhan tajuaa, että ei tarvitsekaan, eli että riittää, että se mitä käytetään toimii tarpeeksi hyvin.


    • Ei kannata

      niinkään kiinnittää huomiota, onko joku elementti tai määritys html5 tai css3:a. Kannattaa kokeilla miten mikäkin toimii ja onko joku uusi ominaisuus oikeasti tarpeellinen tekemälläsi sivustolla, etenkin jos selaintuki on puutteellinen. Jos jokin ominaisuus ei toimi näiden muutaman valtavirtaselaimen uusimmalla versiolla, harvemmin sellaista otan käyttöön.

      Viimemmäksi olen itse ottanut käyttöön mm. elementtien kulmien pyöristyksen ja varjot. Aika hyvin tuntuisi pelaavan. IE8:lla ne eivät toimi, mutta johonkinhan se on raja vedettävä. Sinänsä kyllä edelleen teen IE8 fiksauksen (yleensä se ei paljoa lisätyötä vaadi), syystä että paljon on käytössä vielä XP-koneita, johon ei saa asennettua IE8 seuraavia versioita.

      • Kulmien pyöristys on hyvä esimerkki asetuksesta, jota voi mainiosti käyttää, vaikka kaikki selaimet eivät sitä tukisikaan. Maailma ei kaadu siihen, jos kulmat ovatkin teräviä. Sama koskee varjoja (sekä tekstin että elementtien varjoja). Mutta esimerkiksi CSS3:n ruudukot (grid) ovat eri juttu: jos ne eivät toimi, koko taitto menee ihan erilaiseksi kuin on tarkoitus.

        Esimerkiksi kulmien pyöristyksellä on tietysti silloin merkitystä, jos sivuston tilaaja vaatii sitä – kaikille selaimille.


      • CSS[N]
        Yucca kirjoitti:

        Kulmien pyöristys on hyvä esimerkki asetuksesta, jota voi mainiosti käyttää, vaikka kaikki selaimet eivät sitä tukisikaan. Maailma ei kaadu siihen, jos kulmat ovatkin teräviä. Sama koskee varjoja (sekä tekstin että elementtien varjoja). Mutta esimerkiksi CSS3:n ruudukot (grid) ovat eri juttu: jos ne eivät toimi, koko taitto menee ihan erilaiseksi kuin on tarkoitus.

        Esimerkiksi kulmien pyöristyksellä on tietysti silloin merkitystä, jos sivuston tilaaja vaatii sitä – kaikille selaimille.

        Juurikin näin. Myös gradientteja voi käyttää, kun laittaa myös tavallisen taustavärin tai -kuvan ennen gradientteja eli näin:

        background: #vari;
        background: -webkit-linear-gradient(top, #vari1 ,#vari2);
        ... muiden selainten gradientin prefixit ja prefixitön versio


    • mistä tämä puute?

      Kirjastosta en löytänyt yhtään kirjaa joka tietäisi jotakin HTML5:stä. Katsoin myös JavaScript-kirjoja koska tarkoitus olisi piirrellä sillä Canvas-elementtiin.

      • Taitaa olla pieni kirjasto. Esimerkiksi Helsinkin seudun kirjastoista (ks. http://www.helmet.fi) löytyy muutama HTML5-kirja. Niissä on sen verran Canvas APIsta, että piirtämisen alkuun pääsee. Siinä tarvittava JavaScript on aika yksinkertaista, ja sen oppii melkeinpä esimerkeistä, jos ne ovat hyviä


    • 4ebgfccdmyu

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

    Luetuimmat keskustelut

    1. Kannattaako suomalaisen duunarin enää äänestää vasemmistopuolueita

      sillä eivät ne tunnu kovasti ajavan suomi-duunarin etuja. Jos katsotaan Vasemmistoliittoa, niin sehän on ihan feministi
      Maailman menoa
      175
      5625
    2. Jaaha, sitä on vasemmistoryhmä käynyt häiriköimässä Purran kodin vieressä

      On näköjään iso lakana levitetty puiden väliin, jossa lukee mm. "Haista vi*** Riikka Purra". Tunkekaa leikkaukset pers..
      Maailman menoa
      103
      5574
    3. Professori: Maahanmuuttajien rikollisuutta hyssytellään - hävytöntä

      Kriminologi Jukka Savolaisen mukaan ikä ja vaikeat olosuhteet eivät riitä selitykseksi. – Tutkitun tiedon valossa sanoi
      Maailman menoa
      180
      4548
    4. Mistä kummasta voi johtua se, että vasemmistolaiset usein häpeää itseään

      voiko se johtua esim. köyhyydestä? Ja tästä on siis ihan suomalainen tutkimus olemassa. "Suomalainen tutkimus osoittaa
      Maailman menoa
      51
      4013
    5. Sanna-kulttilaiset hehkuttaa edelleen Marinia, vaikka esim. Sote oli susi jo syntyessään

      mutta kulttilaiset eivät ole järjen jättiläisiä, ja sanoihin Lasse Lehtinenkin, että Suomessa on pohjoismaiden tyhmimmät
      Maailman menoa
      61
      3890
    6. Marin teki sen mihin muut eivät pystyneet, vei susi-Soten maaliin

      ja sitten hävittyjen vaalien jälkeen lähtikin vastuuta pakoon...... "Professori: sote-uudistus on täysi susi. Sosiaali
      Maailman menoa
      30
      3548
    7. Saatoin tehdä elämäni isoimman virheen

      Otsikko kertoo kaiken. Miksei kaikki voi olla yksinkertaisempaa?
      Ikävä
      127
      1264
    8. Jotenkin tämä

      tilanne taas eskaloitui ja saat mut roikkumaan täällä palstalla. Turhaan. Ei nämä tekstit sua koskaan tavoita. 😭
      Ikävä
      33
      940
    9. Kova ikävä parittelukumppania täällä korvessa

      Mutta muuten kyllä on rauhallista.
      Ikävä
      17
      938
    10. Kivitippu Forenomille

      Ei tiedä itkeäkö vai nauraa kun taas joukolla vakuutetaan kansainvälisten turistien ryntäystä kivitippuun, ja vielä rake
      Lappajärvi
      102
      898
    Aihe