Keskustelu: Nettisivujen teko: Sivutaitosta ja termistöstä

Toivottavasti teen nyt järkevästi kun eriytän vihdoin viimein tämän keskustelun Ohjelmointiputkan viisivuotiskeskustelusta...

Eli keskustelun tarkoituksena keskustella sivun taittamisesta, sen ongelmakohdista ja oireista (mm. taulukkotaitto ja divitismi) ja samalla vähän suomenkielisistä alan termeistä (jotka ovat valitettavan vakiintumattomia).

Blaze kirjoitti:

Selain voi pitää ulkoisen CSS-sivun välimuistissaan, jolloin sitä ei tarvitse joka sivunlatauksen yhteydessä noutaa uudelleen palvelimelta.
Renderöintinopeuden kanssahan tuolla ei ole mitään tekemistä, eikä varsinaisesti taulukko vs. div -sodan kanssakaan.

Josta aasinsilta valitukseen siitä, miten divien käyttö ("divinismi") on ihan yhtä väärin kuin taulukkotaittokin. Kun homma tehdään oikein, käytetään semanttisesti oikeita elementtejä, diviä vain siis silloin kun mitään parempaa elementtiä ei HTML-speksistä löydy.

Edit: löytyhän se linkki, ois pitäny heti tajuta kattoa Googlella: http://dev.merri.net/index.php?page=div-vs-table

Korjasin hieman tuota artikkelia: englanninkielinen termi on divitis, joten suomennoksen tulee (ilmeisesti) olla ennemminkin divitismi eikä divinismi. Kumpikaan ei tosin ole vielä vakiintunut suomenkielisessä termistössä. Selvintä olisi varmaankin puhua divien liikakäytöstä.

Muita vastaavia ongelmia on sitten classitismi ja positismi: luokkien ylikäyttö ja (absoluuttisen) asettelun ylikäyttö. Etenkin monet WYSIWYG-ohjelmat suoltavat ulos tuota jälkimmäistä. Luokkia taas käytetään hyvin usein silloinkin kun niitä ei varsinaisesti tarvita. Poikkeuksena sitten ovat tosin mikroformaatit, jotka nimenomaan standardoivat mm. luokille yleisiä merkityksellisiä nimiä.

Mikä onkaan parempi tapa aloittaa threadi kuin offtopic jo ensimmäisessä vastauksessa!

Merri kirjoitti:

Korjasin hieman tuota artikkelia: englanninkielinen termi on divitis, joten suomennoksen tulee (ilmeisesti) olla ennemminkin divitismi eikä divinismi. Kumpikaan ei tosin ole vielä vakiintunut suomenkielisessä termistössä. Selvintä olisi varmaankin puhua divien liikakäytöstä.

Ismit ovat aatteita, divitis puolestaan viitannee enemmän tautien (vai pelkkien tulehdusten?) nimiin: tonsillitis, cholecystitis, cellulitis... Divikuume voisi olla siis tarkempi suomennos. Jos on kuitenkin päädyttävä nasevuuden nimessä johonkin ismiin, niin divismi riittäisi ihan hyvin :)

On kiinnostavaa nähdä, miten nettisivujen tekeminen muuttuu lähivuosina. Nykyisellään sivujen laatiminen on liian vaikeaa, kun HTML:n ja CSS:n määrittelyt ovat hyvin monimutkaisia (ja silti puutteellisia) ja eri selaimet tulkitsevat niitä eri tavoin.

Yksi vaikeus sivujen suunnittelussa on myös, että sivujen tulisi sopeutua käyttäjän selaimen kokoon ja asetuksiin. Tämä johtaa siihen, että tekstirivin leveys on usein liian suuri, mikä huonontaa luettavuutta. Tekstin ulkoasuun ei muutenkaan voi juuri vaikuttaa: pitkät sanat katkaisevat rivin rumasti, sanojen tavutus on mahdotonta, yhdelle riville tarkoitettu teksti voi jakaantua jne.

Joku voi sanoa, että käyttäjä tietää parhaiten itse, miten hän haluaa sivunsa katsella - mutta moni käyttäjä ei tiedä.

Luulen ennemminkin että kyseessä on puute (CSS:n) perusteiden oikein ymmärtämisessä kuin siinä, että HTML ja CSS olisivat vaikeita, tai että sivujen laatiminen olisi niiden takia vaikeaa. Tosin tietysti selainten tulkintaongelmat ovat merkittävä vaikeuttava tekijä: jos kaikki selaimet toimisivat lähes aina samalla tavalla, olisi ongelmia paljon vähemmän. Tämä ei kuitenkaan poista sitä tosiseikkaa, että jos perusteet eivät ole kunnossa, niin ei ole pohjaa ymmärtää mistä ongelmat johtuvat. Ja tästä syntyy kuva siitä, että HTML ja CSS olisivat vaikeita.

Tästä innostuneena aloinkin nyt kirjoittaa Devveen artikkelia elementtien asettelusta: etenkin tämän kanssa tuntuu monilla olevan paljon ongelmia, joten vedän nyt siitä kasaan semmoisen peruskurssin, että sen sanoma toivottavasti menee artikkelin lukijalle kaaliin.

Monen sivunikkarin tiedoissa on toki puutteita, mutta tietääkseni tähän mennessä ei ole kyetty edes tekemään selainta, joka ymmärtäisi kunnolla HTML:n ja CSS:n sovittuja määrityksiä. En ole toisaalta myöskään tavannut laajaa nettisivustoa, jonka jokainen sivu noudattaisi määrityksiä. Nämä asiat viittaavat siihen, että kokonaisuus on melko monimutkainen.

(Urgh, tästä tuli pitkähkö viesti...)

Ihminen on eläin, ei kone: ihminen tekee aina virheitä. Validointi ei ole yhtä tärkeää kuin se, että sivut toimivat. Tärkeintä olisi vain käyttää elementtejä oikeaan tarkoitukseen, ja niin voi tehdä siitä huolimatta että sivut eivät mene validaattorista lävitse. Ja sivut voivat siitä huolimatta toimia niin kuin niiden pitääkin, selain kun osaa paikata suoraan jotkin virheet. Validaattorista lävitse pääseminen ei ole niin tärkeää kuin monet ovat aikojen saatossa väittäneet: se on kiva lisä ja hyvä juttu, mutta ei välttämättömyys.

Tällä hetkellä monet selaimet kyllä osaavat noudattaa HTML:n ja CSS:n määrityksiä varsin pitkällekin, ongelma tulee siitä etteivät ne noudata aivan kaikkea mitä CSS:n eri versioissa lukee ja toisaalta joissakin kohdin on bugeja. Pidän esimerkiksi Firefoxista juuri siksi, että siinä on kaikista selaimista vähiten perustason bugeja: se toimii lähes poikkeuksetta juuri niin kuin standardeissa lukee ja sen kanssa törmään vähiten kehitettäessä selaimen bugeihin. Monet ongelmat taas voi kiertää tekemällä asiat hieman toisella tavalla ja CSS:n nykytuesta jo löytyy kylliksi varaa tehdä näin.

Opetteleva/aloittelija voi sivuja tehdessään ja Firefoxia käyttäessään olettaa, että hän tekee asioita oikein ja selain näyttää asiat niin kuin ne pitää näyttää. Se käy hyvin CSS:n oppikoulusta. Sivujen toteuttamisen haaste syntyy muiden selainten taivuttelusta. Minun sivujentekotaitoni ovat osittain itseasiassa Firefoxin hyvän CSS-tuen tulos: en jaksa lukea paljoa teoreettista tekstiä ja olen visuaalinen ihminen, siis opin näkemällä, joten se että Firefox osaa renderöidä sivut lähes täydellisesti CSS:n (perus)sääntöjen mukaan on ollut huomattavasti avuksi CSS:n oppimisessa.

Opin kolmessa vuodessa sivujen teon tekniseltä puolelta enemmän kuin kuutena niitä edeltäneenä vuonna.

tkarkkainen kirjoitti:

Ismit ovat aatteita, divitis puolestaan viitannee enemmän tautien (vai pelkkien tulehdusten?) nimiin: tonsillitis, cholecystitis, cellulitis... Divikuume voisi olla siis tarkempi suomennos. Jos on kuitenkin päädyttävä nasevuuden nimessä johonkin ismiin, niin divismi riittäisi ihan hyvin :)

Jatkan minäkin sitten offtoppailua.

Divitiitti olisi oikea muoto tuosta suomeksi, jos tautien mukaan mennään. Ismejä ei tosiaan kannata tuosta vääntää :)

Mutta epäilen että Suomi muuttuu trooppiseksi alueeksi ennen kuin jokainen mainostoimisto ja veppisivulafka alkaa tehdä edes validia koodia, puhumattakaan semanttisesta oikeudesta.

Jos CSS:n käyttö olis yhtä helppoa ku tällä hetkellä taulukkotaittosten sivujen teko, se yleistys mainostoimistoissa ja verkkosivuja tekevissä yrityksissäki huomattavasti. Samalla sivujen päivittämisestä tulis helpompaa, ku ulkoasu ois erillisessä tiedostossa. Dreamweaver tuntuu olevan tällä hetkellä yleisin ohjelmisto sivujen tekoon. Jos siihen sais paremman CSS-ulkoasun suunnittelun, tilanne vois olla paljonki parempi. Nyt uudenlaisten sivujen tekoon tarvittais kursseja. (Tai no tarvittais kyllä varmaan sittenkin, jos sivuja alettas tehä oikein urakalla "oikeaoppisesti")

Kunhan CSS kehittyy tarpeeks, saadaan toivottavasti yhtenäisempi semanttisista sivuista koostuva verkko. Tällä hetkellä wrapper-divien eli sellasten divien, jotka kääräsee sisäänsä muita divejä, käyttö on ainaki vielä pakollista tietynlaisissa ulkoasuissa. Tällaset ulkoasut on ainaki nykysellään helpompi ja nopeampi saada toimimaan taulukoilla. Eri selainten renderöintiongelmat ja -eroavaisuudet on tällä hetkellä huonoimmat puolet semanttisesti kunnollisissa sivuissa: sivuston ulkoasun toimintaan saaminen jokaisella selaimella edes suunnilleen halutulla tavalla on liian vaikeaa.

Ite suosin kyllä nykyisin XHTML Strict 1.0:aa (tai Transitionalia) ja CSS:ää sivuilla. Useiden erilaisten ulkoasujen tekeminen ja yleensäkki sivuston päivittäminen on helpompaa, ku sisältö ja ulkoasu on erillisinä.