collecting best practice web standards design examples
Piepmatzel.de etsin.org

Suomen kielen sääntöjen mukaan listan alkion loppuun ei tule mitään välimerkkiä, kuten pilkkua, ellei alkio sisällä kokonaista virkettä. (...) Tällainen rakenne tuntuu monista hiukan alastomalta, eikä pilkkujen käyttöä alkioiden lopussa voi pitää suurena virheenä. (...) Joka tapauksessa välimerkit kirjoitetaan itse tekstisisältöön; selaimet eivät niitä lisäile.
Web-suunnittelu, s. 89

Siis WTF?! Miltä vuosisadalta tämä kirja oikein on? Tiedän kyllä, viime vuoden alusta ja siksikin luulin että tässä nyt olisi luotettavaa tietoa mutta ei sitten näköjään.

Kehottaisin parivaljakkoa K&L tutustumaan W3C:n listojen ja muun automaattisesti tuotettavan sisällön dokumentointiin ennen kuin menee moisia suustaan päästelemään.

• Korhonen
• Linjama
• Korhonen
• Linjama
• Vieläkö mä jatkan?

<style type="text/css">
<!--
li.korohonen:after {
  content: ",";
}
-->
</style>

<ul>
  <li class="korohonen"> Korhonen </li>
  <li class="korohonen"> Linjama </li>
  <li class="korohonen"> Korhonen </li>
  <li class="korohonen"> Linjama </li>
  <li> Vieläkö mä jatkan? </li>
</ul>

K&L voivottelee leveyden asettamisen vaikeuksia. Ehdottaa ratkaisuja:

• Ei puututa leveyteen, vaan jätetään käyttäjän säädettäväksi selainikkunan kokoa säätämällä.
  -Ei ikinä!


• Asetetaan leveys käyttämällä taulukkoa.
  -Olen sanaton. Web-suunnittelua käsittelevä kirja vuodelta 2003 ehdottaa taulukoiden käyttöä muotoilussa! Itsekin sitten heti peruu sen että oikeastaan ei kannata edes harkita tätä vaihtoehtoa.


• Määrätään leveys CSS:llä käyttäen em-yksiköitä.
  Ok.


• max-width-määräyksen käyttö.
  Myös ok, joskin käsittääkseni IE tyrii tämänkin ja siihen tuossa kai viitataankin (useat selaimet jättävät säännön huomiotta) mutta ei tarkenneta sen tarkemmin että minkä selaimen neronleimauksesta tässäkin on kysymys.

Web-suunnittelu

Juuri näitä pikku jippoja poimiakseni tämän kirjan otinkin. Umpiossaeläjän koodissa on varmasti kaiken maailman itsekehitettyjä toimivia, mutta jossakin mielessä huonoja tapoja, jotka johtuvat vain siitä, että ei ole tullut muuta tapaa ajatelleeksi, eikä koskaan tulisikaan, jos ei niistä lukisi tällä tavalla jostakin.

Tässäpä kanssa näitä attribuutteja sarjassamme olen kyllä nähnyt ja ymmärrän sen merkityksenkin jotakuinkin, mutta en tarkoitusta. Nyt kun ymmärrän tarkoituksenkin, niin voi vain todeta, että tämähän on siisti! Tämä on siis samalla tavalla kuvattavaa tekstiä abstraktilla tasolla määrittelevä attribuutti kuin vaikkapa <em> ja <strong>. Pitää ruveta käyttämään tuota kielimäärittelyäkin kun suhteellisen usein kuitenkin käytän vieraita kieliä näissä merkinnöissäni.

Lisäksi pitäisi tehdä se mitä jo pitkään olen suunnitellut, eli etsiä jostain tuommonen puheselain (lieköhän sellaisia vapaiden ohjelmien joukossa?) ja kokeilla sivujani sillä.

p {
 margin-top: 0;
 margin-bottom: 0;
 text-indent: 1.5em;
}
h1+p, h2+p, h3+p, h4+p, h5+p, h6+p {
 text-indent: 0;
}
Web-suunnittelu
rivitys ja muotoilu omani

Tämä oli ensimmäinen ja tyylikkäin esimerkki, jonka bongaaminen sieltä sun täältä alkujaan mulle alkoi kieliä CSS:n esiinmarssista. Siis sellainen, joka sai aikaan sen kuinka ne ton on tehneet -reaktion ja johti CSS:ään tutustumiseen. Kyllähän vastaavaa oli nähty klassisen HTML:n keinoilla kikkaillen toteutettunakin, mutta varsinainen villitys tästä tuli tietysti vasta kun se saatiin aikaisesti noin nätisti ja helposti.

Tero Linjama, Jukka Korpela: Web-suunnittelu
Kirjan perustavoite on sivujen tavoitteiden, sisällön, rakenteen ja ulkoasun hallittu, tasapainoinen suunnittelu ja toteutus. Läpikäyviä periaatteita ovat sivujen sisältölähtöisyys, luotettava toimivuus, helppokäyttöisyys ja esteettömyys. Ulkoasun suunnittelussa käydään läpi sekä sommittelun, värien käytön ja kuvituksen perusteita että niiden toteuttamista Web-sivuilla, ensisijaisesti tyylisäännöstöjen avulla.
Docendo

Lähikirjastosta lainasin Aalto-kirjastot nyt kun sattui olemaan vapaana. On tämä jotakuinkin semmoinen kuin olin alun perin silmäiltyäni toivonutkin, eli enemmän korkean tason periaatteita kuin yksityiskohtia, joskin niitä yksityiskohtakin kyllä löytyy (kerään muutamia itselleni hyödyllisiä vinkkejä tästä talteen tänne Nuudelisoppaan), ja välillä tämäkin on kuitenkin minulle vähän turhan tekninen. Ei siis tietenkään siinä mielessä ettenkö sitä tajuaisi, vaan siinä mielessä että teknistä tietoa kaivatessani sitä kyllä löydän Netistä. Hyvä suomenkielinen suunnittelutason tieto on se mitä kaipaan.

Täältä löytyy mm. se Magic Mushroomsin biisi.



15:10: Ja update: tämän kirjoitushetkellä ne ite biisit siellä on toimimattomien linkkien takana (Forbidden). Juha

Kumpi on parempi, Linux vai Windows? Tätä kysyimme nettikansalta ja se vastasi häpeämättömän rehellisesti. Kyselyn tulokset julkaisimme MikroBitissä 9/2004. Lisää lukijoidemme kommentteja voit lukea tältä sivulta.
Nettijatkot Mikrobitti 9/2004

Varsin kiinnostavia kommentteja.

No nytpä luulen, että nyt on tehty semmoinen kannettava joka on minun makuuni. Ei paina! Ei kuumene! Ei ole iso! Ei pakollista Microsoft-veroa!

Perfect Disk oli optimoimassa Isoa Partitiota kun päähäni pätkähti, että valokuvia näytti viimeisimmässä laskennassa olevan yli maagisen 700 megatavun rajan, joten on aika polttaa ne talteen. Päätin kuitenkin vielä järjestää C:n sitä ennen.

Virhe.

Aihio oli sisällä ja 701Mt kuvia ladattuna valmiiksi polttoa varten, kun C:nsä optimoinnissa olevasta 120Gt:n Samsungista alkoi kuulua:

TIKKA-TOKKA-TIKKA-TOKKA-TIKKA-TOKKA

(hiljaisuus)

TIKKA-TIKKA-TOKKA-TOKKA-TIKKA-TOKKA-TOKKA-TIKKA

(haudanhiljaisuus)

TIKKA-TOKKA- ... ad infinitum.

Perfect Diskiä pyysin keskeyttämään optimoinnin mutta ei se enää reagoinut — tai tarkemmin sanottuna reagoihan se kyllä, mutta sen kiintolevylle lähettämä pyyntö operaation keskeytyksestä ei enää mennyt perille vaan se jatkoi tikka-tokka-mantraansa.

Annoin sen jatkaa sitä vielä kymmenen minuuttia siltä varalta, että jos olisi edes pienenpieni toivonkipinä että se saisi sen operaation keskeytettyä ennen kuin lyön reset-nappia. Ei se sitä kuitenkaan lopettanut, joten kuuntelin tikka-tokkaa niin kauan että pääsin rytmistä perille, odotin tuota hiljaista hetkeä (jonka aikana myöskään kiintolevyn merkkivalo ei palanut) ja napsautin sitten reset-nappia.

Buutissa IDE-levyn tunnistus aiheuttaa saman tikka-tokka-laulun eikä yritäkään buutata siltä vaan jatkaa muilla tarjolla olevilla vaihtoehdoilla (cd-aseman sisältö ja Nforce2:n ethernet-buutti).



Sen mukana meni siis mm. 730Mt+ valokuvia joista vanhimmat olivat viime vuoden lopusta.

Kaivoin heti kuitin esiin ja totesin että kolmen vuoden takuu sillä on, eli jotakuinkin puolet siitä ajasta se kesti.

Onneksi olen jo varautunut näihin jatkuviin ongelmiin varatietokoneella. Mutta tietenkin joku yliopistoverkon admin on taas poistanut tämän Ergopron verkkokortin taulusta, eikä tässä tämän kirjoitushetkellä toimi verkko, vaan taas on raahauduttava kirjastoon tai yliopistolle ruinaamaan että se voitaisiin sinne lisätä vain sitä varten, että taas parin viikon päästä Shuttlen verkkokortti pitää palauttaa sinne.

This non-security critical update helps resolve an issue where a limited number of systems running a BIOS without production support for Intel Pentium 4 and Intel Celeron D processors based on Prescott C-0 stepping can potentially hang on Windows XP Service Pack 2 installation. After you install this update, you may have to restart your computer.
MS websec

Käyttöjärjestelmästä on löydetty ongelma, jonka vuoksi luvattomalla käyttäjällä on mahdollisuus ottaa Windows-käyttöjärjestelmällä varustettu tietokone täysin hallintaansa.
MS websec

Yleistä
Asenna tämä päivitys, jos ohjelma antaa Merkkijono on liian pitkä -virheilmoituksen avattaessa ryhmäkäytäntöobjektia tietokoneessa, jossa on Windows XP -käyttöjärjestelmä. Päivitystä ei voi poistaa.

Tuetut käyttöjärjestelmät: Windows XP Service Pack 1
MS websec

Eli se ei sitte toimi SP2:ssa vai onko se SP2:ssa integroituna vai kuivvaimitähä.

Pinserin uutuuslistan [1] kautta löytyi lyhytikäiseksi jääneeltä näyttävä Metsästäjän Blogi, joka edelleen johdatteli tutustumaan minulle ennestään tuntemattoman blog-palveluntarjoajan, regerin ominaisuuksiin. Niillä on harrastuskeskeisiin blogeihin erikoistuneena kivoja ominaisuuksia kuten GPS-koordinaattien kirjaaminen merkinnän yhteyteen. Sehän tietysti koskettaa lähinnä niitä joilla on kannettava tai sitten blogaavat kännykällä jostakin korvesta.

reger

• Hungarian
• Norwegian (Bokmål)
• Polish
• Turkish

Toteamme täten Microsoft Suomen näistä maailmankolkista jälkeenjääneeksi.

MS websec

Kiitos, Google, kun valitsit juuri keltaisen värin korostaaksesi hakemani sanan!

En tiedä täyttääkö tuo lisenssi Open Source -liikkeen avoimen lähdekoodin lisenssin määritelmän, ja ainakaan tätä lisenssiä ei niiden listalta löydy. OSI

No joka tapauksessa, olin hyvin kiinnostunut tästä koska Blogger taikinoi eikä taivu riittävästi minun tarpeisiini. Tiedän kyllä, että paljon parempiakin itseajeltavia blogtyökaluvaihtoehtoja on, mutta niiden ongelmana minun kannaltani on, että ne vaativat SQL-tietokannan, jollainen ei nykyiseen webhotellipakettiini louhi.net kuulu vaan siitä pitäisi maksaa ekstraa. Greymatter (tästedes GM) ei tarvi SQL:ää toisin kuin kaikki muut tähän asti näkemäni ratkaisut.

Läksin asennukseen mm. Greymatter Installation for Dummies -oppaan freebies.wiccked.com greymatterforums.com avustamana ja kaikki sujuikin melko hyvin, lukuunottamatta otsikossakin mainittua virheilmoitusta you don't have access to log in, johon törmäsin heti siinä vaihessa kun koitin lisätä itselleni uudet tunnukset; niin tehtyäni GM heitti minut heti ulos enkä sen jälkeen enää päässyt sisälle. Tutkin vähän koodia ja totesin, että jostakin syystä GM murjoo oman käyttäjätunnustietokantansa toimimattomaksi heti kun vakiokäyttäjän (Alice) lisäksi koetti tehdä tunnukset. Tarkemmin sanottuna se jätti kahden rivin väliin ilmiselvästi kuuluvan enterin pois ja pani tunnukset ja niiden tiedot pötköön, jonka jälkeen se ei itse enää osannut lukea tietokantaansa. Ongelma ratkesi, kun lisäsin sen puuttuvan enterin tietokantaan Alicen rivin perään.

Tämän jälkeen kaikki meni kuin tanssi kun palastelin Nuudelisopan Bloggerin-templaten GM:lle sopiviksi klönteiksi ja julkaisin siitä koeversioita. Olin erittäin tyytyväinen GM:n tarjoamaan valinnanvapauteen, eli lähes joka asian pystyi halutessaan viilaamaan juuri niin tarkkaan kuin tahtoi — se mitä Blogger ei todellakaan anna tehdä. Myös pari puutetta havaitsin, eli merkintöjä ei pystynyt tallentamaan vedoksina, niitä ei pystynyt kerran tehtyään poistamaan, eikä niiden päivämäärää tai kellonaikaa pystynyt muuttamaan. Lisäksi otsikkolinkit puuttuivat, mikä oli kuitenkin lähinnä vain Bloggeriin tottuneelle aluksi hieman ärsyttävä ominaisuus, enkä tiedä, mitä mieltä tästä otsikoiden linkkinätoimimiskäytännöstä ollaan Netissä laajemmin (eli että onko se hyvä vai huono käytäntö).

Olin jo sitten tekemässä isoa pläjäystä koemerkintöjä, kun törmäsin ongelmaan: kaikkien tiedostojen julkaisu ei onnistunut enää, vaan arkistolokien rakentaminen jäi jumiin. Onneksi kuitenkin GM antoi tässäkin vapauden julkaista hyvin rajatun osan sivustoa uudelleen, ja tekemällä niin jokaisen osan kohdalla erikseen julkaisu toimi yhä. Tätä ongelmaa en ehtinyt ratkaista ennen kuin törmäsin toiseen, joka oli jo niin vakava, että jouduin hylkäämään koko tähän asti kokonaisuutena hyvin edenneen hankkeen.

Havaitsin, että GM varastoi arkistokansioonsa (siis sinne, mihin vanhojen merkintöjen arkistot aikaa myöten kertyisivät) gm-token.cgi-nimisen tiedoston. Ensin jätin sen rauhaan siinä pelossa, että sen sorkkiminen sotkisi koko systeemin, mutta uteliaisuudesta kuitenkin kurkkasin sen sisältöä.

Kauhukseni totesin sen sisältävän GM:iin luomani käyttäjätunnuksen ja salasanan, vieläpä selkokielisinä molemmat!

Läksin siitä paikasta etsimään tietoja tästä kyseisestä tiedostosta ja syistä, joiden vuoksi GM oli sen laittanut julkisesti luettavana tiedostona julkisesti luettavaan web-hakemistoon. Löysin GM:n foorumeilta surullisen julistuksen:

In short, yes. Greymatter is doomed. I look at the code, the amount of memory this must take up to compleate it's jobs, the uncontrolable insecurity of the token.cgi file, the insecurity in general. The security of greymatter relies on servers masking cgi files, not all do and if they don't your stuff is wide wide open. Greymatter is now on hiatus, until someone comes and picks it up again like Flipped and his crew did with the original version we arn't going anywhere.
G:greymatterforums.com G

Tämä oli lopullinen naula GM:n arkkuun omalta osaltani. Ohjelman kuolleus ei sinänsä olisi haitannut koska se toimi kuitenkin ihan hyvin, eikä näin räikeä turva-aukkokaan jos siihen olisi ollut tiedossa pikainen korjauspäivitys, mutta turva-aukolla varustettu kuollut ohjelma on kuin vanhaan latoon heinien alle varastoitu puolilaho mutta umpikuiva ruutitynnyri joka vain odottaa kesän hellepäiviä.

Vaihtoehtojen metsästys jatkuu. Saa nähdä joutuuko lopulta kuitenkin investoimaan siihen SQL-tietokantaan kun siihen tuntuvat tosiaankin nojaavan kaikki muut, vielä nykyisinkin päivitettävät vaihtoehdot.

Soneran sähköpostiyksikkö kehitti tietokoneohjelman avuksi henkilöiden sähköpostiviestinnän seuraamiseen, käy ilmi poliisin tekemästä Soneran teleurkintaa koskevasta esitutkinnasta.
YLE24

Ettei tämä vain ollut niihin samoihin aikoihin, kun niillä asiakaspuolen sähköposti oli niin sotkussa, että ne lopulta joutuivat siitä maksamaan hyvityksiä? Kyllä siinä puljussa on asiat niin nurinkurisessa tärkeysjärjestyksessä, että voisi kuvitella kyseessä olevan jonkinlainen diktatuurissa elävä pikkuvaltio omine salaisine poliiseineen eikä suinkaan nykyaikaa eläväksi itseään väittävä länsimaalainen telealan suuryritys.

Post Scriptum: Kylläpä on tuo YLEn uutiskuvakin taas väkisinväännetty ja täysin turha.

Edit your 13x19-inch enlargements at full size on the 30-inch Apple Cinema HD Display. Boasting impressive 2560 x 1600-pixel resolution, it’s the largest high-resolution LCD for the personal computer.
pcphotomag.com Juha