Keskustelu: Nettisivujen teko: Tulostus-nappi kotisivuille?

Miten rakennetaan tulostus-nappi kotisivuille?

ps. ja onko muuten mitään järkeä alkaa rakentelemaan kotisivuille sivustokartta-nappia, palveleeko se yleisesti ottaen ketään?

<button onclick="window.print(); return false;">Tulosta sivu</button>

Mutta mihin tarvitset oman napin, kun selaimessa on jo valmiiksi tulostusnappi? Tuollaiset turhat nappulat ovat sitä ärsyttävämpiä, mitä näkyvämmin ne ovat ja mitä enemmän tilaa ne vievät.

Metabolix: Pystyyhän käyttäjät myös copy/pasteamaan nettisivujen osoitteet mm. Facebookkiin, mutta silti monet käyttävät mieluummin noita sivustoilla näkyviä AddThis -painikketia ja Like -linkkejä.

Ainakin teollisuuden alalle ollaan jokunen Tulosta -nappi jouduttu lisäämään.

Tee linkki, johon sidot JavaScriptillä print sheetin lataamisen ja window.print-kutsun. Fallbackina laita linkki lisäämään URLiin vaikka ?print, jonka voit sitten PHP:llä havaita ja ladata em. print sheetin.

Sivustokartan mielekkyys riippuu sivuston rakenteesta. Jos sivustolla on yksinkertainen, selkeä, hyvin suunniteltu rakenne, en näkisi tarvetta sivustokartalle. Jos sivustolla taasen on hankala navigoida, sivustokartta voi olla tarpeellinen. Sivustokartta auttaa myös hakukoneita indeksoimaan jos satut käyttämään Twitteristä tuttuja hashbang-osoitteita. Summa summarum: hyvä rakennesuunnittelu + toimiva site-search > sivukartta.

Metabolix ja Lebe80 - kummatkin sanoivat tavallaan oikein.
Tulostusnapit ovat ärsyttäviä jos niitä kylvää kaikkialle. Tosin ei nuo AddThis- ja FB Like -nappulatkaan ole kovinkaan kivoja. Vielä ehkä yhden AddThis-nappulan/sivu voisin minäkin kestää. Ja onhan AddThis-nappulassa mukana myös tulostusnappi (nimimerkillä kokemusta on).

jhh kirjoitti:

Onko muuten mitään järkeä alkaa rakentelemaan kotisivuille sivustokartta-nappia, palveleeko se yleisesti ottaen ketään?

Riippuu millaisia sivuja olet tekemässä.
Pienille henkilökohtaisille sivuille en näe mitään tarvetta, mutta Helsingin Sanomien, Aamulehden ja Iltasanomien tyylisien nettisivujen kannattaisi moinen sisällyttää. Joten on ihan kyse siitä paljonko materiaalia sivuille on tulossa.

Lebe80 kirjoitti:

Pystyyhän käyttäjät myös copy/pasteamaan nettisivujen osoitteet mm. Facebookkiin, mutta...

Mutta laskepa, montako klikkausta siinä säästyy, varsinkin Windowsissa, kun kopiointikaan ei tapahdu automaattisesti maalaamalla. Facebookiin vievät nappulat piilottavat siis paljon mutkikkaamman tapahtumasarjan kuin tulostusnappi, jolla tuskin säästää enempää kuin yhden klikkauksen.

Metabolix kirjoitti:

Facebookiin vievät nappulat piilottavat siis paljon mutkikkaamman tapahtumasarjan kuin tulostusnappi, jolla tuskin säästää enempää kuin yhden klikkauksen.

Niin, säästää yhden klikkauksen sinulta tai minulta, mutta varmaan usealle ihmiselle se säästää jopa jokusen puhelinsoiton henkilöltä, jolla on "kotisivunaan se intternet windows".

tsuriga kirjoitti:

Tee linkki, johon sidot JavaScriptillä print sheetin lataamisen ja window.print-kutsun. Fallbackina laita linkki lisäämään URLiin vaikka ?print, jonka voit sitten PHP:llä havaita ja ladata em. print sheetin.

Miksi pitäisi kikkailla näin turhia? Järkevämpää on lisätä sivulle suoraan CSS-tiedosto tulostusta varten. Tällöin selain osaa muokata sivun tulostuskelpoiseen muotoon automaattisesti, kun käyttäjä suorittaa tavallisen tulostustoiminnon. Se ei vaikuta mitenkään siihen, miten sivu näytetään selaimessa.

Lebe80 kirjoitti:

Pystyyhän käyttäjät myös copy/pasteamaan nettisivujen osoitteet mm. Facebookkiin, mutta silti monet käyttävät mieluummin noita sivustoilla näkyviä AddThis -painikketia ja Like -linkkejä.

Näillä kahdella ei olekaan mitään tekemistä keskenään. Linkin jakaminen sosiaalisessa palvelussa ei ole sama kuin valita selaimen valikosta printtaus tai painaa Ctrl+P. Linkin jakamiseksi joutuu ensin menemään kyseisen palvelun osoitteeseen, mahdollisesti jopa kirjautumaan sisään, sitten navigoimaan oikealle sivulle ja vielä syöttämään tietoja johonkin lomakkeeseen.

The Alchemist: ei vaan tarkoitukseni oli ilmaista, että sivuston rakenteja voi tehdä valmiita toimintoja käyttäjilleen, ettei heidän tarvitse tietää "nörttitoimintoja" (perustoimintoja), vaan he voivat suoraan yhtä selkeää nappia painamalla tehdä, mitä olivatkaan tekemässä.

Hieman kokemattomammalle käyttäjälle Facebookin Like-nappi ja Print-nappi ovat aivan saman tasoisia juttuja, eivätkä he välttämättä tiedä, että toinen niistä on selaimen vakiotoiminto.

Vaikka meille nämä toiminnot ovat ihan perustoimintoja ja osaamme etsiä niitä jopa selaimesta, jota emme ole koskaan aikaisemmin käyttäneet, niin yllättävän monelle ihmiselle ihan perustoiminnot ovat täyttä hepreaa.

Ei siis ole ollenkaan väärin laittaa sivuilleen linkkiä, josta suoritetaan tulostustoiminto tai Back-nappulan painallus, jos tiedetään, ettei suuri osa sivuston käyttäjistä sitä itse osaa omasta selaimestaan tehdä.

The Alchemist kirjoitti:

Miksi pitäisi kikkailla näin turhia? Järkevämpää on lisätä sivulle suoraan CSS-tiedosto tulostusta varten.

Joo tosiaan, tai jos printtisheetti on pieni niin sen voi lisätä myös sen screenisheetin loppuuun käyttämällä @media print { }. Mietin, että tuolla dynaamisella latauksella säästäis sen printtisheetin latausajan, mutta modernit selaimet (blogipostissa vuodelta 2007 tuskasteltiin ongelmaa) osaa kyllä tehhä tuon päätöksen itekin, ja vaikka ei osaiskaan niin printtisheetin lataus ei kyllä hirveitä hetkauta, varsinkin jos sen lataa samassa normisheetin kanssa.

Itse olen hyvin tyytyväinen siihen, kuinka monet palvelut käyttävät älykkäästi noita css:n mediajuttuja. Esim. monissa verkkopankeissa voi ottaa kuitin näkyville ja painaa vaan ctrl+p ja siitä tulostuu kaunis kuitti ilman ylimääräisiä nappuloita yms., jotka näytöllä näkyvät.

Sihteeri - mummot muistaa yleensä kaikki ctrl + yhdistelmät ulkoa. not.

No sen tulostuksenhan voi toki valita sieltä selaimen valikoista tai sivulla olevasta tulostuspainikkeestakin, jos haluaa. Se ei ollut postaukseni pointti.

Mutta jos nyt halutaan näistä näppäinoikoteistä puhua, niin itseäni ei kiinnostaisi alkaa arpomaan joka kerta, miten tulostetaan, kun ctrl+p toimii suunnilleen kaikissa tulostamista tukevissa ohjelmissa.

Eikä tuossa minusta tarvitse olla mikään muistihirmu tai nörtti että jonkun ctrl+p:n käytön oppii. Monissa ohjelmissa on valikossa tulostuksen yhteydessä se ctrl+p mainittuna, joten luulisi normaalilla muistilla varustetun jo jollain 10. tulostuskerralla alkavan muistaa sen.

Metabolix kirjoitti:

<button onclick="window.print(); return false;">Tulosta sivu</button>

Jos on ihan pakko tehdä tuollainen painike, on parempi tehdä niin, että sivulla ei ole täysin toimimatonta painiketta silloin, kun JavaScript on estetty. Yleensähän kaikki sellainen sivulla näkyvä, jonka toiminta on JavaScriptin varassa, pitäisi tämän takia luoda JavaScriptillä eikä kirjoittaa sivun staattiseksi osaksi. Esim.

<script>
var tulostuspainike = document.createElement("button");
tulostuspainike.innerHTML = "Tulosta sivu";
tulostuspainike.onclick = function () { window.print(); };
document.body.appendChild(tulostuspainike);
</script>

(Painikkeen laittaminen sivun loppuun on tietysti vain esimerkki. Tavallisesti varmaankin laitetaan esim. tyhjä <span> kohtaan, johon painike halutaan, ja sitten kirjoitetaan luotu painike sen sisällöksi.)

(Tässä ei kai return false vaikuta mitään, koska button-elementille ei ole oletustoimintoa.)

Ja sitten olisi hyvä CSS:ssä määritellä, että painike ei tulostu. On meinään vähän hassu sellainen painike paperilla.

lainaus:

Mutta mihin tarvitset oman napin, kun selaimessa on jo valmiiksi tulostusnappi?

Se tarvitaan tietysti käyttäjien hämmentämiseen. :-) Ne, jotka eivät selainten tulostustoiminnoista mitään, alkavat ihmetellä, kun mitään ei tulostu vaan tietokone kysyy jotain ihmeellistä (= yleensä avautuu Tulosta-ikkuna). Ne, jotka tietävät (useimmat?), taas alkavat ihmetellä, onko painikkeen toiminta sama kuin selaimen tulostustoiminnon vai jotain muuta.

Ja toki sillä joskus saa myös parannettua paperiteollisuuden menekkiä, kun siihen klikataan vahingossa ja sitten klikataan OK koska on totuttu siihen, että tietokoneelle pitää vastata OK kun se kyselee jotain hämärää.

Yucca kirjoitti:

(Tässä ei kai return false vaikuta mitään, koska button-elementille ei ole oletustoimintoa.)

Buttonin oletustoiminto on lähettää lomakkeen tiedot, mikäli se on lomakkeen sisällä.

The Alchemist kirjoitti:

Buttonin oletustoiminto on lähettää lomakkeen tiedot, mikäli se on lomakkeen sisällä.

Seison korjattuna; tuo oli päässyt unohtumaan, ehkä siksi, että se on niin omituista (syynähän on se, että button-elementissä on oletusarvona type="submit").

Toisaalta tässä ei kai ollut tarkoitus laittaa button-elementtiä lomakkeen sisälle. Ja jos se siellä olisi (ehkä siksi että sivu on jotain ASPia tms. jossa koko sivu on iso lomake?), niin silloin ongelma poistuu tyylikkäämmin määritteellä: <button type="button"> (tai JavaScriptissä tulostuspainike.type = 'button').