Hvordan lage en utskriftsvennlig versjon av et nettsted

February 5

En ting som virkelig kan forbedre nettstedets brukervennlighet og gi deg en etappe opp på konkurransen er å skape utskrivbare versjoner av sidene på nettstedet ditt. Heldigvis betyr ikke dette at du trenger å lage to forskjellige eksemplarer av hver enkelt side du oppretter. De fleste nettsteder bruker stilark eller CSS-kode for sin design, og selv om du ikke vet hvordan å kode, er det relativt enkelt å lage en "print" stilark som automatisk kan lage utskrivbare versjoner av hver side.

Bruksanvisning

1 Bestem hva du vil at utskriftsvennlige sider for å se ut som. Generelt bør du utelukke eventuelle unødvendige bilder, noen link menyer eller navigering, og noen annonser. Den eneste innhold som en leser virkelig bryr seg om, for utskrift formål, er sidens viktigste del av innholdet og tittelen for innholdet, det være seg en artikkel, en bekreftelsesside, et produkt oppføring eller noe annet.

2 Se gjennom HTML-sider for å få et inntrykk av hvordan de er lagt ut. De fleste deler er vedlagt i <div> og </ div> tagger; for eksempel kan sidefeltet starte med <div id = "sidebar"> og avsluttes med </ div>. Noter ned hvert store delen av nettstedet og avsnittene ' "id" verdier.

3 Lag en ny tekstfil og gi den navnet "print.css". Last det opp til serveren din.

4 Åpne print.css å redigere. For hver del av sidene som du ikke ønsker å inkludere i utskriftsvennlig versjon, legg til følgende linje:

div # section {display: none; }

Endre "section" med "id" verdi. For eksempel, for å skjule deler som begynner med <div id = "header">, <div id = "footer"> og <div id = "sidebar">, vil du skrive:

div # header {display: none; }
div # footer {display: none; }
div # sidebar {display: none; }

5 Bestem hvilken seksjon du ønsker å inkludere i de utskrivbare versjoner; det vil bli kalt <div id = "innhold"> eller <div id = "main"> eller lignende. På det, sette bredden til 100 prosent slik:

div # innhold {width: 100%; }

Dette er meget viktig. Hvis den opprinnelige bredden var et fast beløp, kan det være for tynn på utskrevne sider, eller enda verre, kjører over på siden og ikke være lesbare i det hele tatt. Å sette den til 100 prosent vil gjøre artikkelen automatisk vikle i henhold til størrelsen på siden.

Vanligvis er innholdet delen innkapslet i større deler som også har breddeverdiene. For eksempel, mange sider stikke en <div id = "wrapper"> </ div> -delen rundt hele siden for å sette en fast bredde og midt alt på siden. I dette tilfellet vil du også nødt til å tilbakestille bredde til 100 prosent for disse delene:

div # wrapper {width: 100%; }

Når du tror du har dekket alt, lagre og lukke print.css filen.

6 Åpne din hjemmeside redigere. Øverst på siden vil være en del som begynner med <head> og avsluttes med </ head>. Like før den avsluttende </ head>, legge til følgende linje:

Du vil også legge til denne linjen i HTML-koden på andre sider også. Erstatt "print.css" med hele banen til filen; hvis det er i en undermappe kalt "stiler", for eksempel skrive "/styles/print.css."

7 Lagre alt og prøve å skrive ut en side på nettstedet ditt. Du er sannsynlig å treffe noen snags første gang; vanligvis er det en del du glemte å inkludere i "display: none" -liste. Men snart sidene dine skal skrive ut på riktig måte, og du vil ha opprettet en automatisk utskriftsvennlig versjon av hver side på nettstedet ditt.