Stampare con i CSS

Le potenzialità dei CSS (Cascading Style Sheet) vanno ben oltre la formattazione del testo: posizionamenti relativi e assoluti, adattamento a contesti e a media diversi.

Le specifiche 2.0, in particolare, consentono di specificare diversi tipi di css, uno per lo schermo ed uno per la stampante, ad esempio. Ed è proprio utilizzando questa caratteristica dei CSS che è possibile rendere una pagina accattivante a video e semplice ma completa sulla carta.

Una versione per il video e una per la carta

Proviamo a realizzare una semplice pagina Html con supporto per la stampa

Per prima cosa creiamo i due css: video.css e printer.css.

video.css

td {font-family: Verdana, Arial, Helvetica, sans-serif;
   color: #000000; font-size:small;}
.screen {}

printer.css

td {font-family: Verdana, Arial, Helvetica, sans-serif;
   color: #000000; font-size:small;}
.screen {display:none}

L’unica differenza tra i due css è la presenza della regola display:none
per la versione di stampa.

La regola display posta a none nasconde i tag che la usano. Quello che faremo è quindi associare la classe screen a tutte le parti del documento Html che non vogliamo stampare. La versione a video (video.css) non imposta alcuna regola, per cui:

  • I tag con classe screen sono visualizzati a video (perché non usa display:none)
  • I tag con classe screen sono nascosti per la versione di stampa (perché usa display:none)

Questo ha senso. Infatti, la versione di stampa è solitamente simile alla versione a video, senza barre dei menu, dei loghi, ecc. I tag che producono questi elementi sono i candidati ideali per la classe “screen”.

Una pagina, due css

Costruiamo la pagina Html che dimostra come richiamare i due css.

 1 <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>
 2 
 3 <html>
 4 <head>
 5   
 6   <link rel=”stylesheet” href=”video.css” type=”text/css” media=”screen” />
 7   <link rel=”stylesheet” href=”printer.css” type=”text/css” media=”print” />
 8 
 9   <title>Css per stampare</title>
10   
11 </head>
12 
13 <body>
14 
15 <table border=”1″>
16 <tr>
17   <td colspan=”2″ class=”screen”>Qui c’&egrave; il logo che non voglio stampare, ma solo visualizzare</td>
18 </tr>
19   <td>Questo &egrave; il corpo dell’articolo (questo lo voglio stampare)
20   [bla bla bla bla bla bla bla bla]
21   </td>
22   <td class=”screen”>Voce menu 1<br>
23   Voce menu 2<br>
24   Voce menu 3
25   Voce menu 4
26   Voce menu 5
27   </td>
28 </tr>
29 </table>
30 
31 </body>
32 </html>

La pagina è composta da un’intestazione atta a contenere il logo, da una barra di menù a destra e dal corpo:

Pagina in modalità video
Come compare la pagina a video

Non vogliamo stampare l’intestazione e il menù a destra. Per questo abbiamo inserito la classe screen all’interno dei td che non vogliamo stampare.

Non ci rimane che richiamare i css dall’intestazione dell’Html:

 6   <link rel=”stylesheet” href=”video.css” type=”text/css” media=”screen” />
 7   <link rel=”stylesheet” href=”printer.css” type=”text/css” media=”print” />

Nel primo caso, con l’attributo media=”screen” indichiamo qual è il css da caricare per la visualizzazione a video. Con media=”print” quello rivolto alla stampante.

Non ci resta che stampare la pagina (ricordate, funziona con Netscape 6 e Internet Eplorer a partire dalla versione 5): otterrete su carta solo il corpo della pagina.

Conclusione

La stampa con i CSS è semplice se il layout di pagina è studiato con cura: si tratta di indicare le parti della pagina che non vogliamo portare su carta. È una valida alternativa alla versione stampabile creata ad hoc, però non funziona con browser datati.

Vivere con Xhtml

Come abbiamo già detto in un precedente articolo, Xhtml o Html: quale scegliere?, è giunto il momento di fare un salto di qualità e realizzare pagine Xhtml al posto delle normali pagine Html.

Lo sforzo, modesto, verrà ricompensato dalla possibilità di utilizzare il codice anche in periferiche diverse dai browser canonici e di estenderne le funzionalità.

Anche Jeffrey Zeldman, autore e creatore di A List Apart, pensa la stessa cosa. Potete trovare le sue considerazioni nell’interessante articolo Better Living Through Xhtml [nuova finestra].

Leggendolo, si capisce come l’autore abbia speso svariate ore nella conversione e realizzazione di pagine Xhtml, scoprendo anche trucchi e problematiche, tra cui:

  • Html Tidy [nuova finestra] è tra le migliori utility per la conversione da Html a Xhtml, ma va attentamente configurata
  • Il codice e i Css devono essere validati (usando gli strumenti resi disponibili dal W3c, l’HTML Validation Service [nuova finestra] e il CSS Validation Service [nuova finestra]
  • I doctype, le intestazioni delle pagine, possono rappresentare un problema subdolo. Devono essere attentamente verificati
  • Alcuni browser interpretano l’Xhtml e i Css in modi diversi e alterano il risultato della pagina

ASP.NET – Guida per lo sviluppatore

Aggiornamento: Wrox ha pubblicato Professional ASP.NET Special Edition 1.0, la nuova versione del manuale basata sulla versione definitiva del .Net Framework (il testo in italiano si basa invece sull’ultima beta del prodotto). Se l’inglese non rappresenta un problema, meglio acquistare questo testo. FucinaWeb.com ha realizzato una recensione con i migliori 14 manuali di ASP.NET.

Il fatto che Alex Homer, uno dei maggiori esperti di ASP, partecipi alla realizzazione di un manuale, è fonte di sicurezza.
In effetti “ASP.NET – Guida per lo sviluppatore” è un manuale che analizza ASP.NET fino alla realizzazione di applicazioni complesse.

Il manuale non si rivolge al programmatore “in erba”: per capirlo e apprezzarlo dovete aver lavorato con ASP parecchi mesi.
Date le molte novità introdotte da ASP.NET, infatti, sarebbe stato impossible scrivere un unico testo che accontentassi chi
si avvicina alla programmazione Web e lo sviluppatore professionista.

Il codice è scritto utilizzando Visual Basic .NET.

Argomenti

  • Introduzione al .NET Framework e ai linguaggi. I capitolo introduttivi espongono l’importante ruolo del .Net Framework e confrontano i linguaggi utilizzabili per la scrittura di codice ASP.NET (Visual Basic .NET, C# e JScript .NET)
  • Html Server Controls, Web Server Controls e Validator Controls. Leggendo questi capitoli si capisce perché la programmazione web con ASP.NET è davvero orientata agli oggetti
  • Accesso e gestione ai dati. Il ruolo di ADO.NET nella piattaforma Microsoft, l’accesso ai dati su database e la creazione/lettura di documenti XML
  • Configurazione, protezione e tecniche di debugging. Come si proteggono le pagine ASP.NET, come si gestiscono le applicazioni e quali sono le sofisticate tecniche di gestione degli errori

Pro

  • Copre ogni aspetto di ASP.NET con buon approfondimento
  • Gli esempi chiarificano egregiamente i concetti espressi
  • La parte relativa ad ADO.NET fa chiarezza sulle future strategie Microsoft di accesso ai dati. Imperdibile

Contro

  • Sono presenti molti piccoli errori di concetto, soprattutto nel codice. Fortunatamente Hoepli, nel tradurre il testo,
    ha incorporato le Errata Corrige disponibili fino al 30 Settembre 2001
  • Diversamente da altri libri Wrox, il lavoro dei 6 autori è poco lineare. Capita che siano dati per scontati concetti non introdotti o introdotti in seguito.
    Sono presenti anche alcune ripetizioni.

Informazioni

TitoloASP.NET
Guida per lo sviluppatore
Titolo originaleProfessional ASP.NET
LinguaItaliana
AutoriRichard Anderson
Brian Francis
Alex Homer
Rob Howard
Dave Sussman
Karli Watson
Pagine1200
Data2001
PrezzoEuro 55,78
EditoreHoepli [nuova finestra]
Editore originaleWrox [nuova finestra]