Nessun risultato. Prova con un altro termine.
Guide
Notizie
Software
Tutorial
  • Lezione 38 di 41
  • livello principiante
Indice lezioni

Definire il layout solo per lo schermo

Un primo metodo per ottenere buone stampe
Un primo metodo per ottenere buone stampe
Link copiato negli appunti

Abbiamo presentato una buona quantità di layout, ma c'è ancora una questione
da trattare: come preparare una pagina per la stampa. Provate a fare un anteprima
di stampa dei siti web che visitate abitualmente. Risulterà che una buona percentuale
di siti viene stampata decisamente male. È un aspetto importante e che
merita un approfondimento.

Il punto centrale da considerare è che la larghezza sicura per la stampa
di una pagina web è 560 pixels. Ciò significa, per fare un esempio, che una pagina
realizzata con layout fisso largo 760pixels rischia di essere tagliata da uno
o entrambi i lati. In questa prima sezione vedremo velocemente come preparare
il layout alla stampa. Per ulteriori approfondimenti vi rimando agli articoli
Css
design: going to print (in inglese)
di Eric Meyer e all'articolo "Stampe
perfette di pagine web con i CSS".

Ci sono diversi modi per definire le regole per la stampa, li vedremo nel dettaglio spiegando come applicarli.

Definire il layout solo per lo schermo

Il modo più semplice per consentire una buona stampa è non definire regole per la stampa, e cioè lasciare
che il foglio di stile venga usato solo a schermo. Ecco come fare:

<head>
    <title>Html</title>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
    <style type="text/css" media="screen">
        @import url("stilisito.css");
    </style>
</head>

Specificare il foglio di stile in questo modo ha due vantaggi fondamentali:

  • i browser moderni applicheranno il foglio di stile solo a schermo;
  • la pagina di stampa verrà quindi resa senza stili associati.

Per la stampa verranno usati gli stili di default del browser. Uno degli svantaggi
di questa tecnica è che gli elementi della pagina verranno quindi stampati tutti,
e nell'ordine di codice HTML.

Ti consigliamo anche