Hvordan lage en utskriftsvennlig webside

Skrive ut en Web-side har vært ansett som en "hit eller savner" prosessen, hovedsakelig på grunn av vanlige fallgruver på den delen av web-designere. Med noen enkle regler med Cascading Style Sheets (CSS), kan hele området være trykkeklar uten nødvendigvis å endre innholdet. Denne artikkelen forutsetter at du allerede er kjent med grunnleggende HTML og CSS koding, samt prosessen med å administrere eksterne filer på en web-vert.

Bruksanvisning

1 Bestem den generelle områder av layouten: overskrift, side, bunntekst og kropps. En posisjonen omfatter logoen din og kan også ha navigasjonslenker. Sidene inneholder navigasjonskoblinger og muligens reklame eller spesielle funksjoner. Bunntekster kan inneholde mer detaljert navigasjon, opphavsrett og juridisk informasjon. Body innhold er det som er igjen --- "kjernen" på siden. Når en besøkende skriver ut en side, den delen hun ønsker på papir er kroppens innhold.

2 Identifisere den generelle områder fra trinn 1 med tag attributter, hvis du ikke har gjort det i den opprinnelige design. Bruk "id =" attributt og sørge for at hvert navn er bare tildeles én gang på hver side. Dette gjør dem mer tilgjengelig i stilarket.

3 Start en ny, ren tekst-fil og lagre den som "printer.css" på samme sted som "default" stilark. La det stå tomt for nå. Dette stilark vil ikke erstatte den opprinnelige stil regler unntatt når en besøkende skriver ut en side fra nettstedet ditt.

4 Åpne en eksisterende HTML-sider i editoren og lagre en ny kopi med et annet navn. (For eksempel en side som heter "biography.html" kan lagres som "biografi-print.html"). Inne i <link> -taggen, endre navnet på stilarket til "printer.css", slik at den laster ned filen du nettopp har opprettet. Hvis det er en "media =" attributt, fjern det. For øyeblikket bruker bare "printer.css" style sheet for denne siden.

5 Last opp ny kopi av den siden, sammen med "printer.css" til verten. Åpne en nettleser og skriv inn hele URL --- inkludert hele filnavnet --- for den kopierte, print-only side. Det kan se svært uvanlig, men det vil endre seg.

6 Opprett nye regler for siden din i "printer.css" stilark. Når du legger til nye regler, oppdatere "printer.css" på verten og oppdater siden i nettleseren. For å starte, opprette en regel for overskriften, side (r) og bunntekst ved hjelp av "display: none" for å skjule dem.
Når du er ferdig, kan du prøve å skrive ut siden og kontrollere resultatene på papir. Hold gjennomgå trykte versjoner av siden, og foreta justeringer som er nødvendig før du går videre.

7 Påfør den opprinnelige stilarket sammen med den nye ved hjelp av to <link> tags - en for den opprinnelige stil regler og en annen for "printer.css" stiler. Sett [media = "print"] tilskriver inn koden for "printer.css" og [media = "screen"] inn koden for den opprinnelige stilark. Deretter oppdatere nettstedet. Når brukes på hele nettstedet, vil sidene har samme skjerm utseende som før, og trykte sider som skal vises i henhold til dine utskrifts bare regler.

Hint

• Husk at som en webside på skjermen, sidene er interaktive, akkurat som de var tiltenkt. Som et trykt ark, er imidlertid siden ikke lenger interaktivt. Det kan ikke søkes, med unntak av det menneskelige øyet.
• Denne guiden kan ikke være nyttig på nettsteder som bruker CMS siden mange CMS-pakker allerede inkluderer funksjoner for utskrift optimalisering. I slike tilfeller bør du kontakte CMS plattform dokumentasjon for tips om "printer-friendly" formatering.