Eine druckbare Version einer Website erstellen

October 23

Eine Sache, die wirklich Ihre Website-Usability verbessern und geben Sie ein Bein auf den Wettbewerb kann soll druckbare Versionen der Seiten auf Ihrer Website erstellen. Zum Glück, bedeutet dies nicht, dass Sie zwei unterschiedliche Kopien von jeder einzelnen Seite erstellen, die Sie erstellen müssen. Die meisten Websites verwenden Stylesheets oder CSS-Code für ihre Designs und auch wenn Sie nicht wissen, wie man Code, es ist relativ einfach eine "Druck"-Stylesheet zu erstellen, die automatisch druckbare Versionen jeder Seite erstellen kann.

Anweisungen

1 Entscheiden Sie, was die druckbaren Seiten aussehen sollen. Im Allgemeinen sollten Sie unnötige Bilder, Verknüpfungsmenüs oder Navigation und keine anzeigen ausschließen. Nur Inhalte, die ein Leser wirklich, für Druckzwecke, kümmert sich um ist die Seite wichtigsten Stück Inhalt und Titel für diese Inhalte, sei es, einen Artikel, eine Bestätigungsseite, ein Produkt Inserat oder etwas anderes.

2 Schauen Sie durch Ihre HTML-Seiten bekommen Sie eine Vorstellung davon, wie sie angeordnet sind. Die meisten Abschnitte sind eingeschlossen in < Div > und < / Div > Stichworte; Beispielsweise könnte der Sidebar starten mit < Div Id = "Sidebar" > und enden mit < / Div >. Notieren Sie jeden wichtigen Abschnitt Ihrer Website und in den Abschnitten "Id"-Werte.

3 Erstellen Sie eine neue Textdatei, und nennen Sie es "print.css". Laden Sie es auf Ihrem Server.

4 Print.css bearbeiten zu öffnen. Fügen Sie für jeden Bereich Ihrer Seiten, die Sie nicht in der Druckversion einschließen möchten folgende Zeile ein:

Div #sectionname {anzeigen: none;}

Ändern Sie "Sectionname" mit dem Wert "Id". Beispielsweise zu verstecken-Abschnitte, die mit beginnen < Div Id = "Header" >, < Div Id = "Footer" >, und < Div Id = "Sidebar" >, würden Sie schreiben:

Div #header {anzeigen: none;}Div #footer {anzeigen: none;}Div #sidebar {anzeigen: none;}

5 Entscheiden Sie, welchen Abschnitt Sie in Ihrem druckbaren Versionen einschließen möchten; wird < Div Id = "Inhalt" > oder < Div Id = "main" > oder dergleichen. Legen Sie auf, dass seine Breite auf 100 Prozent etwa so:

Div #content {Width: 100 %;}

Dies ist sehr wichtig. Wenn die ursprüngliche Breite einen festen Betrag war, könnte es werden zu dünn auf gedruckten Seiten, oder schlimmer, Überfahren der Seite und überhaupt nicht gelesen werden. Einstellung zu 100 Prozent machen den Artikel automatisch entsprechend der Größe der Seite umgebrochen.

In der Regel wird der Inhaltsbereich in größeren Abschnitten eingebettet, die auch Breitenwerte haben. Z. B. viele Seiten kleben ein < Div Id = "Wrapper" >< / Div > Abschnitt rund um die gesamte Seite um eine feste Breite einstellen und alles auf der Seite zu zentrieren. In diesem Fall müssen Sie auch die Breite auf 100 Prozent für diese Abschnitte zurückzusetzen:

Div #wrapper {Width: 100 %;}

Wenn Sie, dass Sie alles abgedeckt haben denken, speichern Sie und schließen Sie die Datei print.css.

6 Öffnen Sie Ihre Homepage zu bearbeiten. Oben auf der Seite werden ein Abschnitt, der mit < Head > beginnt und endet mit < / Head >. Kurz vor dem schließenden < / head >, fügen Sie folgende Zeile:

< link Rel = "Stylesheet" href="print.css" Type = "Text/Css" Medium = "Drucken" / >

Sie haben auch diese Zeile in den HTML-Code Ihrer Seiten sowie hinzufügen. Ersetzen Sie durch den vollständigen Pfad zur Datei "print.css"; Wenn sie in einem Unterverzeichnis "Stile" aufgerufen wird, z. B. schreiben "/ styles/print.css."

7 Speichern Sie alles und versuchen Sie auf Ihrer Website eine Seite drucken. Du bist wahrscheinlich ein paar Haken zum ersten Mal getroffen; in der Regel gibt es einen Abschnitt, die Sie vergessen haben, gehören in Ihre "Anzeige: keine" Liste. Bald aber korrekt drucken Ihre Seiten und Sie werden erfolgreich erstellt haben eine automatische Druckversion auf jeder Seite auf Ihrer Website.