Sovitus eri tarkkuuksiin

Leksa.

Moro taas!
Miten nettisivun sovitus erilaisiin resoluutioihin onnistuu? esim. 1280x800 näkyy mun sivu paljon pienempänä ja eri fontitkin näkyy oleen.. Mikä ratkaisu tämmöisiin?

15

1267

    Vastaukset

    Anonyymi (Kirjaudu / Rekisteröidy)
    5000
    • "Miten nettisivun sovitus erilaisiin resoluutioihin onnistuu? esim. 1280x800 näkyy mun sivu paljon pienempänä ja eri fontitkin näkyy oleen.. Mikä ratkaisu tämmöisiin?"

      Ota mittayksiköksi em. Älä käytä pikselimittoja. em yksikössä koko lasketaan fontin m kirjaimen koon mukaan ja selain skaalaa sitten jutut sen mukaan. Palstojen leveydet yms. voi toki vaihdella mutta voit laskea homman niin, että 50em leveys sopii koko näytölle eri resoluutioissa. Luonnollisesti palstojen ja kuvien kokoa voit määrittää prosentteina ikkunan leveydestä tai skaalata koko ikkunan leveydelle.

      50em sääntö toimii kyllä toisellakin tavalla, sillä ikkunan leveys voi olla enemmän kuin 50em mutta älä anna minkään palstan leveyden kasvaa yli 50em, sillä riveistä tulee liian pitkiä, että olisi mukava lukea.

      Jos pitää tekstiä tallentaa kuvina tai jotain käppyröitä niin silloin käytä pikselimittoja näissä kuvissa sillä näiden skaalaus ei käy mukavasti. Älä käytä ikinä näissä 16px pienempää fonttikokoa.

    • Jaska Perusjaska

      Periaatteessa ei mitenkään. Kuulostaa siltä, että jossain näytössä ei ole ollut näytön natiiviresoluutio, jolloin pikseleitä käytännössä suurennetaan. Oikeasti sivut ja tekstit eivät muutu miksikään vaikka resoluutio olisi 1680x1050. Tilaa vain tulee ympärille enemmän.

      Eri fontti johtuu siitä, että käyttäjän koneelta ei löydy samaa fonttia, jolloin se korvataan joko vastaavalla tai ei vastaavalla. Se ei liity resoluutioon mitenkään. Käytä fontteja, jotka löytyvät suurella todennäköisyydellä lähes kaikilta koneilta, Arial, Verdana, Times New Roman, Geneva, Tahoma, yms. Periaatteessa kaikki fontit, mitä windows xp:n mukana tulee.

      Tai sitten suunnittelet ja testaat sivusi niin, että ne toimivat hyvin myös vaihtoehtoisilla fonteilla. Niitä voi antaa css:llä käytännössä niin paljon kuin haluaa. Jos käyttäjän koneelta löytyy ensisijainen fonttisi, käytetään sitä. Jos ei, kokeillaan seuraavaa jne.

      Se että pitääkö kaiken sisällön skaalautua resoluution ja selainikkunan koon mukaan, on vähän ristiriitainen asia. Itse inhoan sivuja, jotka venyvät muodottomaksi esim. 22" laajakuvanäytöllä. Tekstirivit ovat niin pitkiä, ettei tulisi mieleenkään yrittää lukea.

      Mielestäni parempi ratkaisu on hallitusti kiinteään kokoon suunniteltu sivusto, joka toimii myös pienemmillä näytöillä hyvin, eikä näytä kammottavalta isommillakaan. Osa sivusta voi skaalautua, kunhan sen tekee hyvin, mutta esim. tekstille tuo aikaisemmin mainittu 50em on hyvä mitta. Se voi olla myös 60-70, jos fontti on helposti luettava ja riviväliä on riittävästi.

      • "Se ei liity resoluutioon mitenkään. Käytä fontteja, jotka löytyvät suurella todennäköisyydellä lähes kaikilta koneilta, Arial, Verdana, Times New Roman, Geneva, Tahoma, yms. Periaatteessa kaikki fontit, mitä windows xp:n mukana tulee."

        Ei ole mitään erityisiä yleisfontteja jotka toimivat joka paikassa. Oikea tapa on valita fontit korkeammalla tasolla. Eli joku pääteviivallinen fontti, pääteviivaton fontti tai tasalevyinen fontti. Tarkempi määrittely on turhaa tai jos tämä on kriittistä niin sitten tallentaa kuvana jos tarvitsee johonkin johtaan jotain kaunokirjoitusta tms. tunkee. Ota huomioon, että käyttäjällä saattaa myös olla omat preferenssit mitä fontteja käyttää ja joku Windows XP fontti on ihan naurettavaa kun Windows XP:tä ei ole kuin reilulla puolella porukasta.


      • Leksa.
        M-Kar kirjoitti:

        "Se ei liity resoluutioon mitenkään. Käytä fontteja, jotka löytyvät suurella todennäköisyydellä lähes kaikilta koneilta, Arial, Verdana, Times New Roman, Geneva, Tahoma, yms. Periaatteessa kaikki fontit, mitä windows xp:n mukana tulee."

        Ei ole mitään erityisiä yleisfontteja jotka toimivat joka paikassa. Oikea tapa on valita fontit korkeammalla tasolla. Eli joku pääteviivallinen fontti, pääteviivaton fontti tai tasalevyinen fontti. Tarkempi määrittely on turhaa tai jos tämä on kriittistä niin sitten tallentaa kuvana jos tarvitsee johonkin johtaan jotain kaunokirjoitusta tms. tunkee. Ota huomioon, että käyttäjällä saattaa myös olla omat preferenssit mitä fontteja käyttää ja joku Windows XP fontti on ihan naurettavaa kun Windows XP:tä ei ole kuin reilulla puolella porukasta.

        Toi fonttihomma vähän nyt vit...aa! Oon keltanokka hommis, mut tarviiko mun joka sivulle vaihtaa joku yleinen fontti, vai mitäkä? Voinko sivun lähdekoodin metatageihin kirjoittaa jonku fontin, joka olis sit koko sivulla? Help Me! :/

        Fontti joka mulla on "arial ms unicode".


      • Leksa. kirjoitti:

        Toi fonttihomma vähän nyt vit...aa! Oon keltanokka hommis, mut tarviiko mun joka sivulle vaihtaa joku yleinen fontti, vai mitäkä? Voinko sivun lähdekoodin metatageihin kirjoittaa jonku fontin, joka olis sit koko sivulla? Help Me! :/

        Fontti joka mulla on "arial ms unicode".

        "Oon keltanokka hommis, mut tarviiko mun joka sivulle vaihtaa joku yleinen fontti, vai mitäkä? Voinko sivun lähdekoodin metatageihin kirjoittaa jonku fontin, joka olis sit koko sivulla?"

        Siis fonttihan määritellään siinä .css tyylitiedostossa. Ja font-family on se mikä toimii:

        http://www.w3.org/TR/CSS21/fonts.html#font-family-prop

        Noista käytettäviä on serif, sans-serif ja monospace ja ne saa näyttämään joka paikassa jokseenkin samalta. Fontin nimeä jos käyttää ja jos sitä ei ole niin selain sitten varmaan renderöi oletusfontilla mikä voi olla ihan erinäköinen kuin mitä on tarkoitus.


      • Leksa.
        M-Kar kirjoitti:

        "Oon keltanokka hommis, mut tarviiko mun joka sivulle vaihtaa joku yleinen fontti, vai mitäkä? Voinko sivun lähdekoodin metatageihin kirjoittaa jonku fontin, joka olis sit koko sivulla?"

        Siis fonttihan määritellään siinä .css tyylitiedostossa. Ja font-family on se mikä toimii:

        http://www.w3.org/TR/CSS21/fonts.html#font-family-prop

        Noista käytettäviä on serif, sans-serif ja monospace ja ne saa näyttämään joka paikassa jokseenkin samalta. Fontin nimeä jos käyttää ja jos sitä ei ole niin selain sitten varmaan renderöi oletusfontilla mikä voi olla ihan erinäköinen kuin mitä on tarkoitus.

        laittaa tohon font-family kohdalle? Nyt siinä on.. Verdana, Arial, Helvetica, sans-serif


      • Leksa. kirjoitti:

        laittaa tohon font-family kohdalle? Nyt siinä on.. Verdana, Arial, Helvetica, sans-serif

        Jos haluat merkkeihin ne väkäset sinne viivojen päihin niin laita font-familyksi serif, sans-serif jos haluat ilman väkäsiä ja monospace jos haluat tasalevyistä tekstiä.


      • Leksa.
        M-Kar kirjoitti:

        Jos haluat merkkeihin ne väkäset sinne viivojen päihin niin laita font-familyksi serif, sans-serif jos haluat ilman väkäsiä ja monospace jos haluat tasalevyistä tekstiä.

        Eli ku mä muutan jonkin noista tohon css tiedostoon, niin vaihtaako se autom. koko sivuston tyylit kerralla? Millon tota monospacea kandee käyttää?


      • Leksa.
        M-Kar kirjoitti:

        Jos haluat merkkeihin ne väkäset sinne viivojen päihin niin laita font-familyksi serif, sans-serif jos haluat ilman väkäsiä ja monospace jos haluat tasalevyistä tekstiä.

        Ku mulla tuol css:ssä on näin..
        Verdana, Arial, Helvetica, sans-serif
        Mitä toi järjestys meinaa?


      • M-Kar
        Leksa. kirjoitti:

        Ku mulla tuol css:ssä on näin..
        Verdana, Arial, Helvetica, sans-serif
        Mitä toi järjestys meinaa?

        "Eli ku mä muutan jonkin noista tohon css tiedostoon, niin vaihtaako se autom. koko sivuston tyylit kerralla?"

        "Ku mulla tuol css:ssä on näin..
        Verdana, Arial, Helvetica, sans-serif
        Mitä toi järjestys meinaa?"

        Siis CSS tiedostossa saa määritettyä eri elementeille ja luokille sen tyylin, että se nyt riippuu ihan siitä miten olet nyt tehnyt niitä sivuja.

        Varmaankin kannattaisi nämä speksit lukea kannesta kanteen niin että ymmärtää lukemansa:

        http://www.w3.org/TR/CSS21/
        http://www.w3.org/TR/html4/
        http://www.w3.org/TR/xhtml1/
        http://www.w3.org/TR/2001/REC-xhtml11-20010531/

        Siellä on kerrottu ihan kaikki.


      • Leksa.
        M-Kar kirjoitti:

        "Eli ku mä muutan jonkin noista tohon css tiedostoon, niin vaihtaako se autom. koko sivuston tyylit kerralla?"

        "Ku mulla tuol css:ssä on näin..
        Verdana, Arial, Helvetica, sans-serif
        Mitä toi järjestys meinaa?"

        Siis CSS tiedostossa saa määritettyä eri elementeille ja luokille sen tyylin, että se nyt riippuu ihan siitä miten olet nyt tehnyt niitä sivuja.

        Varmaankin kannattaisi nämä speksit lukea kannesta kanteen niin että ymmärtää lukemansa:

        http://www.w3.org/TR/CSS21/
        http://www.w3.org/TR/html4/
        http://www.w3.org/TR/xhtml1/
        http://www.w3.org/TR/2001/REC-xhtml11-20010531/

        Siellä on kerrottu ihan kaikki.

        Eikö ole mitään yksinkertaista neuvoa suomeksi? Ei mitään semmosta vastausta että riippuu millälailla olet tehnyt sivuston.. :/ Kerro joku yksinkertainen jutska, millä mä saan näkymään suht normaalina kaikil koneil ton tekstin. Niin kuin mä sanoin, niin mulla on sivuilla yleisin fontti toi "ms unicode" jotain.. Sikskö toi sivu ei näy kunnol muilla, koska mul on tommonen fontti, mitä kaikkien koneet ei tue? Jos vaihdan kaikki tekstin vaik arialiin, niin näkyykö se muissa koneis miten? Mikä fontti/tyyli on paras laittaa? Sori vaivasta, mut on vähän kiire ja jos oisit yksinkertaisesti voinu selvittää.. :(


      • Leksa. kirjoitti:

        Eikö ole mitään yksinkertaista neuvoa suomeksi? Ei mitään semmosta vastausta että riippuu millälailla olet tehnyt sivuston.. :/ Kerro joku yksinkertainen jutska, millä mä saan näkymään suht normaalina kaikil koneil ton tekstin. Niin kuin mä sanoin, niin mulla on sivuilla yleisin fontti toi "ms unicode" jotain.. Sikskö toi sivu ei näy kunnol muilla, koska mul on tommonen fontti, mitä kaikkien koneet ei tue? Jos vaihdan kaikki tekstin vaik arialiin, niin näkyykö se muissa koneis miten? Mikä fontti/tyyli on paras laittaa? Sori vaivasta, mut on vähän kiire ja jos oisit yksinkertaisesti voinu selvittää.. :(

        "Eikö ole mitään yksinkertaista neuvoa suomeksi?"

        No ei oikein. HTML:ssä merkataan class ja CSS:ssä sitten eri luokille voi laittaa sen font-familyn kuten linkissä kerrottiin.


    • lommo otassa

      hyvin harva nykyään edes avaa selain ikkunaa kokoruudun kokoiseksi, itse en ole läväyytänyt selain ikkunoita koko ruudun kokoon enää sen jälkeen ku uuden konepaketin hankin, mukana tullut näyttö oli jo sen verran iso "23 laajakuva" et nettisivut näyttää todella hölmöiltä koko ruudun kokoon läväytettynä

    • www-maailma

      on nyttemmin mennyt senverran monimuotoiseksi
      että miltei parhaan lopputuloksen saa kun ei edes
      yritä "pakottaa" loppukäyttäjää johonkin muottiin.

      Jätä täysin määrittelemättä fontit, resoluutiot
      ja sensemmoiset ja teet vain järkevänoloiset sivut
      jollekin perustarkuudelle vaikkapa 1024 x 768.

      Lopputulento on paras mahdollinen kaikille, kun et
      kuitenkaan voi sen paremmin optimoida asiaa.

      • "Jätä täysin määrittelemättä fontit, resoluutiot
        ja sensemmoiset ja teet vain järkevänoloiset sivut
        jollekin perustarkuudelle vaikkapa 1024 x 768."

        Ei hyvä. Ei sovi millään esim. mobiililaitteille, toisaalta on naurettavan pieni jollain FullHD:llä.

        On oikein olla suunittelematta milleen tietylle laitteelle mutta jotain rajoitteita olisi hyvä laittaa. Esimerkiksi se, että sivuston pitäisi näkyä 50em leveydellä ilman vaakascrollia ja sitten tekee palstat skaalautumaan niin, että näillä voi olla jokaisella leveyttä maksimissaan 50em. Pikselimitoilla tehdyt kuvat (ne missä tekstiä ja kaavioita) pitäisi tehdä sen mukaan, että näytön koko olisi vain 640x480 (sitten ei ole paljoa scrollattavaa kännykässä eikä tarvitse skaalata mössöksi pikkukoneissa) mutta tekee sitten kaikki muut kuvat skaalautumaan.


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

    Takaisin ylös

    Luetuimmat keskustelut

    1. Epäily: Räppäri yritti tappaa vauvansa.

      https://www.mtvuutiset.fi/artikkeli/epaily-mies-yritti-tappaa-vauvansa/9300728 Tämä on erittäin järkyttävä teko täysin p
      Maailman menoa
      47
      5465
    2. Räppäri kuoli vankilassa

      Ei kuulemma ole tapahtunut rikosta. Sama vahinkohan kävi Epsteinille. https://www.hs.fi/suomi/art-2000011840869.html "
      Maailman menoa
      61
      2326
    3. Välillä kyllä tuntuu, että jaat vihjeitä

      Mutta miten niistä voi olla ollenkaan varma? Ja minä saan niistä kimmokkeen luulemaan yhtä sun toista. Eli mitä ajatella
      Ikävä
      18
      1860
    4. Onko Sanna menossa Ukrainaan viettämään vuosipäivää?

      Kun on bongattu Varsovan lentokentältä?
      Maailman menoa
      145
      1761
    5. Aleksi Rytilä

      Räppäri saa haluamaansa julkisuutta.
      Kotimaiset julkkisjuorut
      17
      1585
    6. No kyllä te luuserit voitte tehdä mitä vaan keskenänne, sitä en ymmärrä miksi pelaat,nainen

      Pisteesi silmissäni, edes ystävätasolla tippui jo tuhannella, kun sain selville pelailusi, olet toisen kanssa, vaikka ol
      Ikävä
      33
      1513
    7. Kulukusuunnat

      Eikö kuhmolaiset iha oikiasti tiiä kumpi o vasen ja kumpi oikia? Tuolla ku liikennemerkissä näkyy nuolet ylös ja alas, v
      Kuhmo
      5
      1378
    8. 81-vuotias Frederik avoimena - Ei omasta mielestä kelpaa tästä syystä realityihin: "Veemäinen..."

      Junttidiscon kuninkaana tunnettu Frederik, 81, on esiintymislavoilla suvereeni tekijä. Mies on viihdyttänyt ympäri Suome
      Suomalaiset julkkikset
      17
      1117
    9. Muusikko yritti tappaa kaksiviikkoisen vauvan

      Karu epäily: Muusikko, 32, yritti tappaa kaksiviikkoisen vauvan Oulussa. IS:n selvityksen perusteella miestä ei ole syy
      Maailman menoa
      77
      1088
    10. Joutuuko Suomi24-palvelu taas oikeuteen ?

      Nämä Purraa ja Perussuomalaista johtoa pedofiilian suojeliana pitävän kirjoittajan viestit eivät vain poistu täältä. Se
      Maailman menoa
      222
      1008
    Aihe