Comment faire pour créer une version imprimable d'un site Web

Une chose qui peut vraiment améliorer la convivialité de votre site et vous donner une longueur d'avance sur la concurrence est de créer des versions imprimables des pages de votre site. Heureusement, cela ne signifie pas que vous devez créer deux copies différentes de chaque page que vous créez. La plupart des sites utilisent des feuilles de style ou code CSS pour leurs conceptions, et même si vous ne savez pas comment coder, il est relativement simple de créer un "imprimer" feuille de style qui peut automatiquement créer des versions imprimables de chaque page.

Choses que vous devez

  • Site Web avec une feuille de style existante ou d'un fichier CSS

Instructions

  1. Décidez ce que vous voulez que vos pages imprimables pour ressembler. En général, vous devriez exclure les images inutiles, des menus ou la navigation liaison et d'annonces. Le seul contenu que le lecteur se soucie vraiment, à des fins d'impression, est la pièce principale de la page de contenu et le titre de ce contenu, que ce soit un article, une page de confirmation, une fiche de produit ou quelque chose d'autre.

  2. Regardez à travers vos pages HTML pour avoir une idée de la façon dont ils sont disposés. La plupart des articles sont enfermés dans

    et
    étiquettes- par exemple, votre barre latérale pourrait commencer par . Notez chaque section principale de votre site et les sections ' "ça" des valeurs.

  3. Créez un nouveau fichier texte et nommez- "print.css". Ajouter à votre serveur.

  4. Ouvrir print.css à modifier. Pour chaque section de vos pages que vous ne voulez pas inclure dans la version imprimable, ajoutez la ligne suivante:

    div # sectionname {display: none; }




    Changement "sectionname" avec le "ça" valeur. Par exemple, pour masquer les sections qui commencent par

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

  5. Décidez quelle section vous vous ne voulez inclure dans votre imprimable versions- il sera appelé

    ou
    ou analogue. Sur ce point, définir sa largeur à 100 pour cent comme ceci:

    div # content {width: 100% -}

    C'est très important. Si la largeur d'origine était un montant fixe, il pourrait être trop maigre sur les pages imprimées, ou pire, de fonctionner sur le côté et ne pas être lisible du tout. Fixant à 100 pour cent fera l'article envelopper automatiquement en fonction de la taille de la page.

    Habituellement, la section du contenu est incorporé à l'intérieur de grandes sections qui ont également des valeurs de largeur. Par exemple, de nombreuses pages collent une

    section autour de la page entière dans le but de définir une largeur fixe et tout centrer sur la page. Dans ce cas, vous aurez également à rétablir la largeur à 100 pour cent pour ces sections:




    div # wrapper {width: 100% -}

    Quand vous pensez que vous avez tout couvert, enregistrez et fermez le fichier print.css.

  6. Ouvrez votre page d'accueil à modifier. Le haut de la page sera une section qui commence par et se termine par . Juste avant la fermeture, ajoutez la ligne suivante:

    Vous aurez également à ajouter cette ligne à l'intérieur du HTML de vos autres pages ainsi. Remplacer "print.css" avec le chemin complet vers le file- si elle est dans un sous-répertoire appelé "styles," par exemple, écrire "/styles/print.css."

  7. Enregistrer tout et essayez d'imprimer une page de votre site. Vous êtes susceptible de frapper quelques accrocs le premier Time-il n'y a généralement une section que vous avez oublié d'inclure dans votre "display: none" liste. Bientôt, cependant, vos pages seront impriment pas correctement et vous aurez créé avec succès une version automatique imprimable de chaque page de votre site.

» » » » Comment faire pour créer une version imprimable d'un site Web