\documentclass[12pt,a4paper,oneside]{scrartcl}
% generated by Docutils <http://docutils.sourceforge.net/>
% rubber: set program xelatex
\usepackage[no-sscript]{xltxtra} % loads fixltx2e, metalogo, xunicode, fontspec
% \defaultfontfeatures{Scale=MatchLowercase}
\usepackage{ifthen}

\setcounter{secnumdepth}{5}
\usepackage{tabularx}
\newcommand{\DUfooter}{
Generated on: 2016-07-23  22:29:28 GMT.
Generated by \href{http://docutils.sourceforge.net/}{Docutils} from \href{http://docutils.sourceforge.net/rst.html}{reStructuredText} source.

}

%%% Custom LaTeX preamble


%%% User specified packages and stylesheets
\usepackage{RST_Palatino_OpenSans_12pt}

%%% Fallback definitions for Docutils-specific commands

% providelength (provide a length variable and set default, if it is new)
\providecommand*{\DUprovidelength}[2]{
  \ifthenelse{\isundefined{#1}}{\newlength{#1}\setlength{#1}{#2}}{}
}

% docinfo (width of docinfo table)
\DUprovidelength{\DUdocinfowidth}{0.9\textwidth}

% subtitle (in document title)
\providecommand*{\DUdocumentsubtitle}[1]{{\large #1}}

% hyperlinks:
\ifthenelse{\isundefined{\hypersetup}}{
  \usepackage[]{hyperref}
  \urlstyle{same} % normal text font (alternatives: tt, rm, sf)
}{}
\hypersetup{
  pdftitle={juhtolv-css},
  pdfauthor={Juhapekka “naula” Tolvanen}
}

%%% Title Data
\title{\phantomsection%
  juhtolv-css%
  \label{juhtolv-css}%
  \\ % subtitle%
  \DUdocumentsubtitle{Cascading Style Sheet -files of WWW-pages of Juhapekka Tolvanen}%
  \label{cascading-style-sheet-files-of-www-pages-of-juhapekka-tolvanen}}
\author{}
\date{}

%%% Body
\begin{document}
\maketitle

% Docinfo
\begin{center}
\begin{tabularx}{\DUdocinfowidth}{lX}
\textbf{Author}: &
	Juhapekka “naula” Tolvanen \\
\textbf{E-Mail}: &
\texttt{juhtolv (at) iki (dot) fi}
\\
\textbf{Homepage}: &
\url{http://iki.fi/juhtolv/css-download/}
\\
\textbf{Author’s homepage}: &
\url{http://iki.fi/juhtolv}
\\
\end{tabularx}
\end{center}

\phantomsection\label{table-of-contents}
\pdfbookmark[1]{Table of contents}{table-of-contents}
\renewcommand{\contentsname}{Table of contents}
\tableofcontents



\section{Files%
  \label{files}%
}
%
\begin{itemize}

\item \texttt{fonts.css} : CSS-file: Webfonts

\item \texttt{index.css} : CSS-file: Green text on black.

\item \texttt{imported.css} : CSS-file: Imported by index.css (except when using MSIE)

\item \texttt{indexbw.css} : CSS-file: Black text on white

\item \texttt{indexbwserif.css} : CSS-file: Black serif text on white

\item \texttt{latex.css} : CSS-file: Black (La)TeX font text on white

\item \texttt{importedbw.css} : CSS-file: Imported by indexbw.css, indexbwserif.css
and latex.css (except when using MSIE)

\item \texttt{printbw.css} : CSS-file: For mediatype called print.

\item \texttt{dsl.txt} : License text of Design Science License

\item \texttt{fdl.txt} : License text of GNU Free Documentation License

\item \texttt{pelle.html} : HTML-file for testing purposes.

\item \texttt{cssfonts/*} : CSS-fonts that are used in \texttt{fonts.css} and their licenses.

\item \texttt{pix/*} : Images for pelle.html

\item \texttt{js/styleswitcher.js} : javascript-code to implement styleswitching with
javascript/DOM. Only way to switch style under Microsoft Internet
Explorer. It can save your stylesheet setting to cookie.

\end{itemize}


\section{Licenses%
  \label{licenses}%
}

Copyright (c) 2002-2016 Juhapekka “naula” Tolvanen
%
\begin{quote}

\texttt{juhtolv (at) iki (dot) fi}

\url{http://iki.fi/juhtolv}

\end{quote}

These styleshees are free, but come WITHOUT ANY WARRANTY; you can copy,
redistribute and/or modify these stylesheets under the terms of either
of these two licences:

the GNU Free Documentation License, Version 1.2 or any later version published
by the Free Software Foundation; with no Invariant Sections, with no
Front-Cover Texts, and with no Back-Cover Texts

OR

the Design Science License.

I also enact these two (2) amendments:

1)
Document using one or more of these files as its stylesheet can be under
any licence (or under no licence at all). So, you do not need to release
your WWW-page or other document under GNU FDL and/or DSL, if it uses one
or more of these files as its stylesheet.

2)
Any Stylesheet is allowed to include these stylesheets via
import-mechanism, no matter what is its licence. So, you do not need
to release your stylesheet under GNU FDL and/or DSL, if it uses one
or more of these files as its imported stylesheet.

A copy of the GNU FDL  is available here:
%
\begin{quote}

\url{http://www.gnu.org/copyleft/fdl.html}

\end{quote}

A copy of the DSL is available here:
%
\begin{quote}

\url{http://www.dsl.org/copyleft/dsl.txt}

\end{quote}

Local copies are available in these places:
%
\begin{itemize}

\item \url{http://iki.fi/juhtolv/licenses/dsl.txt}

\item \url{http://www.gnu.org/licenses/dsl.html}

\end{itemize}

License of that js/styleswitcher.js is unknown to me:
I found that file via \textquotedbl{}A List Apart\textquotedbl{}:
%
\begin{itemize}

\item \url{http://www.alistapart.com/}

\item \url{http://www.alistapart.com/articles/alternate/}

\item \url{http://idontsmoke.co.uk/2002/ss/}

\end{itemize}

Eric Meyer enhaced it with font size form:
%
\begin{quote}

\url{http://web.archive.org/web/20021201230559/www.meyerweb.com/ui/setup.html}

\url{http://web.archive.org/web/20021201232036js\%5F/www.meyerweb.com/ui/styleswitch.js}

\end{quote}

Images \texttt{ryppy.jpg}, \texttt{ryppy\_black.jpg} and \texttt{nimmari\_red.png} are
created by me, myself and I and they are public domain. They have no
warranty.

Test file pelle.html is created by me, myself and I and it is public domain
and it has no warranty.

Fonts in that directory called \texttt{cssfonts} are not created by me. See
their copyright-information and licenses in that sub-directory called
\texttt{000LICENSES}.


\section{Usage example%
  \label{usage-example}%
}

When you load stylesheets this way, Netscape 4.* won't load them. I do not
bother to provide Stylesheet for Netscape 4.* . It is so hard to create
stylesheet that do not crash it and still looks good.

Note: Do not use attribute “\texttt{title}” in that tag that loads stylesheet for
mediatype called “\texttt{print}”.
%
\begin{quote}\begin{verbatim}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
  "http://www.w3.org/TR/xhtml11/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fi">
  <head>
    <link rel="stylesheet" href="indexbw.css"
      type="text/css" media="screen,projection,tv" title="indexbw" />
    <link rel="alternate stylesheet" href="index.css"
      type="text/css" media="screen,projection,tv" title="index" />
    <link rel="alternate stylesheet" href="indexbwserif.css"
      type="text/css" media="screen,projection,tv" title="indexbwserif" />
    <link rel="alternate stylesheet" href="latex.css"
      type="text/css" media="screen,projection,tv" title="latex" />
    <link rel="stylesheet" href="printbw.css"
      type="text/css" media="print" />
    <script type="text/javascript" src="js/styleswitcher.js" defer="defer">
    </script>
    <meta http-equiv="Content-Type"
      content="text/html;charset=UTF-8" />
(Clip)
    <p class="styleswitch">
    <strong>You can change stylesheet here:</strong> (Javascript/DOM):
    <a href="#" onclick="setActiveStyleSheet('indexbw'); return false;">
        Default: indexbw (Black text on white background)</a>
    <a href="#" onclick="setActiveStyleSheet('index'); return false;">
        index (Green text on black background)</a> |
    <a href="#" onclick="setActiveStyleSheet('indexbwserif'); return false;">
        indexbwserif (Black serif font text on white background)</a> |
    <a href="#" onclick="setActiveStyleSheet('latex'); return false;">
        latex (Black L<sup>A</sup>T<sub>E</sub>X-like font text on white
        background)</a>
    </p>
(Clip)
    <h1 class="ahem">
        This site looks much better in a
        <a href="http://www.browsehappy.com/">WWW-browser</a> that supports
        <a href="http://www.webstandards.org/">web standards</a>, but
        information it provides is accessible to any WWW-browser or
        Internet device.
    </h1>
\end{verbatim}

\end{quote}

I also advice to use this piece of Javascript-code very soon after
\texttt{<body>} . It loads a javscript-code, that is MIT-licensed. But I do not
dare to use that javascript before “\texttt{<div class=\textquotedbl{}navbartop\textquotedbl{}>}” .
%
\begin{quote}\begin{verbatim}
<script type="text/javascript">
  var $buoop = {c:2};
  function $buo_f(){
  var e = document.createElement("script");
  e.src = "//browser-update.org/update.min.js";
  document.body.appendChild(e);
  };
  try {document.addEventListener("DOMContentLoaded", $buo_f,false)}
  catch(e){window.attachEvent("onload", $buo_f)}
</script>
\end{verbatim}

\end{quote}

If somebody is reading your web page with outdated browser, he will
get friendly reminder to upgrade web browser and to go to these web
pages:

\url{http://browser-update.org/}

\url{http://www.browsehappy.com/}

\url{http://www.webstandards.org/}

You may need to edit that file called \texttt{js/styleswitcher.js} at least
this line:
%
\begin{quote}\begin{verbatim}
document.cookie = name+"="+value+expires+"; path=/~juhtolv/";
\end{verbatim}

\end{quote}

Remember to write \texttt{<p>}-tags, \texttt{<blockquote>}-tags, \texttt{<ul>}-tags
and friends like this:
%
\begin{quote}\begin{verbatim}
<div class="chapter">
  <p>
    Blah blah blah
  </p>

  <p>
    Foo bar baz qux
  </p>

<ul>
  <li>Foo</li>
  <li>Bar</li>
  <li>Baz</li>
<ul>

<blockquote>
  “Omnia dicta fortiora si dicta latina.”
</blockquote>

</div>
\end{verbatim}

\end{quote}

That way you will not see that background pic between every paragraph.
At least other people found that kind of “skip” annoying and I wanted
do something for it. But do not use \texttt{<div class=\textquotedbl{}chapter\textquotedbl{}>}-tags inside
these tags and their ending tags:
%
\begin{itemize}

\item \texttt{<div class=\textquotedbl{}author\textquotedbl{}>}

\item \texttt{<div class=\textquotedbl{}navbartop\textquotedbl{}>}

\item \texttt{<div class=\textquotedbl{}nav\textquotedbl{}>}

\item \texttt{<div class=\textquotedbl{}vertspace\textquotedbl{}>}

\item \texttt{<div class=\textquotedbl{}sarakkeet2left\textquotedbl{}>}

\item \texttt{<p class=\textquotedbl{}styleswitch\textquotedbl{}>}

\item \texttt{<div class=\textquotedbl{}oikea\textquotedbl{}>}

\item \texttt{<div class=\textquotedbl{}vasen\textquotedbl{}>}

\item \texttt{<p class=\textquotedbl{}huijaus\textquotedbl{}>}

\item \texttt{<table>}

\item \texttt{<form>}

\item \texttt{<pre>}

\end{itemize}

If you want to pressure users of M\$IE version 7.* or older to switch
to some web browser, you can define stylesheet loading with charset:
%
\begin{quote}\begin{verbatim}
<link rel="extra-keyword stylesheet" href="index.css" type="text/css;
  charset=UTF-8" media="screen,projection,tv" title="index" />
\end{verbatim}

\end{quote}

This is completely valid HTML according to W3C, but poor little M\$IE
can not follow standard very well and style sheet is not loaded at all.
IIRC, that CSS-bug is still present even in M\$IE 7.

You can use these stylesheets with RSS/RDF-aggregators called
AmphetaDesk and Sage, too:
%
\begin{itemize}

\item \url{http://www.disobey.com/amphetadesk/}

\item \url{http://iki.fi/juhtolv/configs/AmphetaDesk/}

\item \url{http://sagerss.com/}

\item \url{http://iki.fi/juhtolv/configs/Sage/}

\end{itemize}


\section{Related WWW-resources%
  \label{related-www-resources}%
}

Do not use title-attribute, when loading stylesheet for mediatype called
”print”:
%
\begin{quote}

\url{http://www.w3.org/TR/html4/present/styles.html\#h-14.3}

\end{quote}

”max-width” is cool!:
%
\begin{quote}

\url{http://www.svendtofte.com/code/max\%5Fwidth\%5Fin\%5Fie/}

\end{quote}

Check out these to learn how to hide CSS-files from certain buggy browsers:
%
\begin{itemize}

\item \url{http://w3development.de/css/hide\%5Fcss\%5Ffrom\%5Fbrowsers/}

\item \url{http://html.conclase.net/pruebas/hacko5.html}

\item \url{http://www.uta.fi/~jm58660/jutut/seitti/ns-css.html}

\item \url{http://www.phoenity.com/newtedge/hide\%5Fcss\%5Fie/}

\end{itemize}

Information about font choosing and availability in CSS can be found
in these WWW-pages:
%
\begin{itemize}

\item \url{http://www.codestyle.org/css/font-family/index.shtml}

\item \url{http://www.clagnut.com/blog/266/}

\item \url{http://realworldstyle.com/fonts.html}

\item \url{http://www.visibone.com/font/tests.html}

\item \url{http://www.microsoft.com/typography/web/fonts/fonts03.htm}

\item \url{http://www.microsoft.com/typography/fonts/unix.htm}

\item \url{http://www.microsoft.com/typography/fonts/mac.htm}

\item \url{http://www.will-harris.com/webtype/}

\end{itemize}

This guy has really much information and links about fonts:
%
\begin{quote}

\url{http://luc.devroye.org/}

\end{quote}

Information about the legendary Palatino-font and its clones can be found
here:
%
\begin{quote}

\url{http://luc.devroye.org/palatino2.html}

\url{http://www.mindspring.com/~fez/palatino/palfaq1.0.txt}

\end{quote}

Article about Arial, cheap plastic copy of Helvetica:
%
\begin{quote}

\url{http://www.ms-studio.com/articles.html}

\end{quote}

Other rip-offs by Monotype:
%
\begin{quote}

\url{http://www.ms-studio.com/articlesarialsia.html}

\end{quote}

Good way to see how different fonts look like, is this WWW-page:
%
\begin{quote}

\url{http://www.myfonts.com/}

\end{quote}

Equivalent PostScript fonts of GhostScript (Adobe -> URW):
%
\begin{quote}

\url{http://luc.devroye.org/ghostscriptfonts.txt}

\end{quote}


\section{Fonts and suggestions for their order%
  \label{fonts-and-suggestions-for-their-order}%
}


\subsection{Principles%
  \label{principles}%
}
%
\begin{itemize}

\item Use free fonts and clones of fonts before non-free

\item Try to avoid bitmap-fonts under X Window System: For example using plain
“helvetica\textquotedbl{} may give you just some lousy bitmapped version of it Helvetica.
If you install fonts of GhostScript, clones of 35 standard PostScript
fonts become available for X Window System in some Linux-distributions;
For example “URW Nimbus Sans L” is good clone of Helvetica in Type1 format,
so you'd better try it out first. In some installations substitution
mechanisms take care of using URW Nimbus Sans L as Helvetica, though.
Therefore, don't use those Lucida fonts provided with XFree86. They are
just bitmapped crap. You just can't get fonts of Lucida family that would
be \emph{both} scalable outline format \emph{and} free (in the sense of freedom or
price).

\item Try to use scalable outline fonts as much as possible.

\item Try rip-offs last (Book Antiqua, Monotype Century Gothic,
Monotype Corsiva, Arial etc.).

\end{itemize}


\subsection{Fonts%
  \label{fonts}%
}

Palatino and its lookalikes etc. in order of importance:
%
\begin{quote}

\url{http://luc.devroye.org/palatino2.html}

\end{quote}

Probably the best-looking clone:
%
\begin{quote}

\textquotedbl{}FPL Neu\textquotedbl{},

\end{quote}

Clones by GUST (Polish TeX-users group):

\textquotedbl{}TeX Gyre Pagella\textquotedbl{},\textquotedbl{}TeXGyrePagella\textquotedbl{},

Other Palatino clone (Based on URW Palladio L):
%
\begin{quote}

\textquotedbl{}Free Paladin\textquotedbl{},

\end{quote}

Palatino clones from URW++:
%
\begin{quote}

\textquotedbl{}URW Palladio L\textquotedbl{}, \textquotedbl{}URWPalladioL\textquotedbl{}, \textquotedbl{}URW Palladio\textquotedbl{}, \textquotedbl{}URWPalladio\textquotedbl{}, Palladio,

\end{quote}

Originals:
%
\begin{quote}

\textquotedbl{}Linotype Palatino\textquotedbl{}, \textquotedbl{}Palatino Linotype\textquotedbl{}, Palatino, \textquotedbl{}Palatino 2\textquotedbl{},

\end{quote}

Palatino clones from Bitstream:
%
\begin{quote}

\textquotedbl{}Zapf Calligraphic 801\textquotedbl{}, \textquotedbl{}Zapf Calligraphic 801 BT\textquotedbl{}, \textquotedbl{}Zapf Calligraphic\textquotedbl{},

\end{quote}

Palatino rip-off that made Hermann Zapf upset:
%
\begin{quote}

\textquotedbl{}Book Antiqua\textquotedbl{},

\end{quote}

Faithful to original:
%
\begin{quote}

\textquotedbl{}PalazzoOriginal\textquotedbl{},

\end{quote}

Not-so-important clones of Palatino:
%
\begin{quote}

\textquotedbl{}Zapf Renaissance\textquotedbl{}, Parlament, PalmSprings, \textquotedbl{}CG Palacio\textquotedbl{}, \textquotedbl{}Paladium\textquotedbl{},
Palisade, Patina, Pontiac, \textquotedbl{}Palation Werk\textquotedbl{},  QTPalatine,
Andover, \textquotedbl{}Andover II\textquotedbl{}, Malibu,  Atlas,  Elegante,  Marathon,

\end{quote}

Bitstream Charter and its clones:
%
\begin{quote}

\textquotedbl{}Bitstream Charter BT\textquotedbl{}, \textquotedbl{}Bitstream Charter BT Roman\textquotedbl{}, \textquotedbl{}Charter BT Roman\textquotedbl{},
\textquotedbl{}Bitstream Charter\textquotedbl{},  \textquotedbl{}CharterBT\textquotedbl{},  \textquotedbl{}Charter BT\textquotedbl{}, \textquotedbl{}ITC Charter\textquotedbl{}, Charter,
\textquotedbl{}Charis SIL\textquotedbl{},

\end{quote}

Other serif-fonts in order of importance:
%
\begin{quote}

\textquotedbl{}DejaVu Serif\textquotedbl{}, \textquotedbl{}Arev Serif\textquotedbl{}, \textquotedbl{}Bitstream Vera Serif\textquotedbl{}, \textquotedbl{}Vera Serif\textquotedbl{},
\textquotedbl{}Droid Serif\textquotedbl{}, \textquotedbl{}Junicode\textquotedbl{}, \textquotedbl{}Gentium\textquotedbl{}, \textquotedbl{}Gentium Alt\textquotedbl{},

\end{quote}

Serif fonts not so well suited for screen (except titles):

Bookman and its clones:
%
\begin{quote}

\textquotedbl{}Free Bookman\textquotedbl{}, \textquotedbl{}TeX Gyre Bonum\textquotedbl{}, \textquotedbl{}TeXGyreBonum\textquotedbl{},
\textquotedbl{}URW Bookman L\textquotedbl{}, \textquotedbl{}URWBookmanL\textquotedbl{}, \textquotedbl{}ITC Bookman\textquotedbl{}, Bookman,

\end{quote}

Schoolbook and its clones:
%
\begin{quote}

\textquotedbl{}Free Schoolbook\textquotedbl{}, \textquotedbl{}TeX Gyre Schola\textquotedbl{}, \textquotedbl{}TeXGyreSchola\textquotedbl{},
\textquotedbl{}CenturySchL\textquotedbl{}, \textquotedbl{}Century Schoolbook L\textquotedbl{}, \textquotedbl{}URW Century Schoolbook L\textquotedbl{},
\textquotedbl{}Century Schoolbook SWA\textquotedbl{}, \textquotedbl{}Monotype Century Schoolbook\textquotedbl{},
\textquotedbl{}Century Schoolbook\textquotedbl{}, \textquotedbl{}New Century Schoolbook\textquotedbl{}, \textquotedbl{}New Century Schlbk\textquotedbl{},
\textquotedbl{}Schoolbook\textquotedbl{},

\end{quote}

Times and its clones:
%
\begin{quote}

Freeserif, \textquotedbl{}TeX Gyre Termes\textquotedbl{}, \textquotedbl{}TeXGyreTermes\textquotedbl{}, \textquotedbl{}Liberation Serif\textquotedbl{},
\textquotedbl{}Free Times\textquotedbl{},
STIX, STIXGeneral, XITS,
Thryomanes, \textquotedbl{}Nimbus Roman No 4\textquotedbl{}, \textquotedbl{}NimbusRomNo9L\textquotedbl{}, \textquotedbl{}Nimbus Roman No 9 L\textquotedbl{},
\textquotedbl{}Nimbus Roman No 9\textquotedbl{}, \textquotedbl{}Dutch SWA\textquotedbl{}, \textquotedbl{}Dutch 801 Roman BT\textquotedbl{}, \textquotedbl{}Dutch
801 BT\textquotedbl{}, \textquotedbl{}Dutch 809 BT\textquotedbl{}, Dutch, Times, Times Roman, Times New Roman,
\textquotedbl{}Doulos SIL\textquotedbl{}, \textquotedbl{}TITUS Cyberbit Basic\textquotedbl{}, \textquotedbl{}Bitstream Cyberbit\textquotedbl{},
\textquotedbl{}Bitstream Cyberbase\textquotedbl{},

\end{quote}

Non-free serif-fonts:
%
\begin{quote}

\textquotedbl{}Lucida Fax\textquotedbl{}, \textquotedbl{}Lucida Bright\textquotedbl{}, \textquotedbl{}Lucida Serif\textquotedbl{},
LucidaBrightWest, LucidaBrightCE, LucidabrightCyr, Lucidabright,
\textquotedbl{}Luxi Serif\textquotedbl{},
\textquotedbl{}Minion Web Pro\textquotedbl{}, \textquotedbl{}Minion Web\textquotedbl{}, \textquotedbl{}Minion Pro Disp\textquotedbl{}, \textquotedbl{}Minion Pro\textquotedbl{} \textquotedbl{}Minion\textquotedbl{},
\textquotedbl{}Adobe Serif MM\textquotedbl{}
Georgia,

\end{quote}

Zapf Chancery and its clones in order of importance:
%
\begin{quote}

\textquotedbl{}Free Chancery\textquotedbl{}, \textquotedbl{}TeX Gyre Chorus\textquotedbl{}, \textquotedbl{}TeXGyreChorus\textquotedbl{},
\textquotedbl{}URW Chancery\textquotedbl{}, \textquotedbl{}URW Chancery L\textquotedbl{}, \textquotedbl{}URWChanceryL\textquotedbl{},
\textquotedbl{}URWChanceryLMed\textquotedbl{}, \textquotedbl{}ITC Zapf Chancery\textquotedbl{}, \textquotedbl{}Zapf Chancery\textquotedbl{}, \textquotedbl{}Monotype Corsiva\textquotedbl{},
Corsiva, Chancery,

\end{quote}

Other calligraphic fonts (all non-free):
%
\begin{quote}

Arioso, Freeform, Shelley,

\end{quote}

Sans-serif fonts in order of importance:
%
\begin{quote}

\textquotedbl{}DejaVu Sans\textquotedbl{}, \textquotedbl{}Arev Sans\textquotedbl{} \textquotedbl{}Bitstream Vera Sans\textquotedbl{}, \textquotedbl{}Vera Sans\textquotedbl{},
\textquotedbl{}Droid Sans\textquotedbl{}, Cantarell, Roboto,

\end{quote}

Helvetica and its clones in order of iportance:
%
\begin{quote}

Freesans, \textquotedbl{}Free Helvetian\textquotedbl{}, \textquotedbl{}TeX Gyre Heros\textquotedbl{}, \textquotedbl{}TeXGyreHeros\textquotedbl{},
\textquotedbl{}URW Nimbus Sans L\textquotedbl{}, \textquotedbl{}Nimbus Sans L\textquotedbl{}, NimbusSanL, URWNimbusSanL,
Swiss, \textquotedbl{}Swiss 721 SWA\textquotedbl{}, \textquotedbl{}Swiss 721\textquotedbl{}, \textquotedbl{}Swiss 721 BT\textquotedbl{},
Helvetica, Arial, \textquotedbl{}Arial Unicode MS\textquotedbl{}, \textquotedbl{}Microsoft Sans Serif\textquotedbl{},
\textquotedbl{}MS Sans Serif\textquotedbl{}, Helvetic, Helv,

\end{quote}

Non-free wide sans serif fonts (good for titles):
%
\begin{quote}

\textquotedbl{}Gill Sans MT\textquotedbl{}, \textquotedbl{}Gill Sans\textquotedbl{}, \textquotedbl{}Trebuchet MS\textquotedbl{},

\end{quote}

Other non-free sans serif fonts:
%
\begin{quote}

Optima, \textquotedbl{}URW Classico\textquotedbl{}, \textquotedbl{}URWClassico\textquotedbl{},

\textquotedbl{}Lucida Grande\textquotedbl{}, \textquotedbl{}Lucida Sans Unicode\textquotedbl{}, \textquotedbl{}Lucida Sans\textquotedbl{}, \textquotedbl{}Lucida\textquotedbl{}, \textquotedbl{}Myriad\textquotedbl{},

Verdana, Tahoma,

\end{quote}

Avant Garde and its clones in order of iportance:
%
\begin{quote}

\textquotedbl{}TeX Gyre Adventor\textquotedbl{}, \textquotedbl{}TeXGyreAdventor\textquotedbl{},
\textquotedbl{}Free Avant Garde\textquotedbl{}, \textquotedbl{}URW Gothic L\textquotedbl{}, \textquotedbl{}URWGothicL\textquotedbl{}, \textquotedbl{}URWGothicLDem\textquotedbl{},
\textquotedbl{}Avant Garde Gothic\textquotedbl{}, \textquotedbl{}ITC Avant Garde Gothic\textquotedbl{},
\textquotedbl{}Monotype Century Gothic\textquotedbl{}, \textquotedbl{}Century Gothic\textquotedbl{}

\end{quote}

Monospace fonts in order of importance:
%
\begin{quote}

\textquotedbl{}DejaVu Sans Mono\textquotedbl{}, \textquotedbl{}Bitstream Vera Sans Mono\textquotedbl{},
\textquotedbl{}Droid Sans Mono\textquotedbl{},
\textquotedbl{}TeX Gyre Cursor\textquotedbl{}, \textquotedbl{}TeXGyreCursor\textquotedbl{},
Freemono, \textquotedbl{}Free Courier\textquotedbl{}, \textquotedbl{}URW Nimbus Mono L\textquotedbl{}, \textquotedbl{}URW Nimbus Mono\textquotedbl{},
\textquotedbl{}Nimbus Mono\textquotedbl{}, \textquotedbl{}Nimbus Mono L\textquotedbl{}, \textquotedbl{}NimbusMonL\textquotedbl{},
\textquotedbl{}Courier SWA\textquotedbl{}, Courier, \textquotedbl{}Courier New\textquotedbl{},

\end{quote}

Non-free monospace fonts:
%
\begin{quote}

\textquotedbl{}Lucida Sans Typewriter\textquotedbl{},
\textquotedbl{}LucidaSansTypewriter\textquotedbl{}, \textquotedbl{}LucidaType\textquotedbl{},
\textquotedbl{}LucidaTypeWest\textquotedbl{}, \textquotedbl{}LucidaTypeCe\textquotedbl{}, \textquotedbl{}LucidaTypeCyr\textquotedbl{},
\textquotedbl{}Lucida Console\textquotedbl{}, \textquotedbl{}Lucida Serif Typewriter\textquotedbl{},
\textquotedbl{}Lucida Mono\textquotedbl{}, \textquotedbl{}Lucida Typewriter\textquotedbl{},
\textquotedbl{}LucidaTypewriter\textquotedbl{},

\textquotedbl{}Luxi Mono\textquotedbl{},

\textquotedbl{}Andale Mono\textquotedbl{}, \textquotedbl{}monotype.com\textquotedbl{},
\textquotedbl{}Letter Gothic\textquotedbl{}, Monaco,

\end{quote}


\section{Fonts of LaTeX available for WWW-stylesheets%
  \label{fonts-of-latex-available-for-www-stylesheets}%
}


\subsection{Serif%
  \label{serif}%
}
%
\begin{quote}

\textquotedbl{}Latin Modern Roman 12\textquotedbl{}, \textquotedbl{}Latin Modern Roman 10\textquotedbl{}, \textquotedbl{}Latin Modern Roman 9\textquotedbl{},
\textquotedbl{}Latin Modern Roman 8\textquotedbl{}, \textquotedbl{}Latin Modern Roman 7\textquotedbl{}, \textquotedbl{}Latin Modern Roman 6\textquotedbl{},
\textquotedbl{}Latin Modern Roman 5\textquotedbl{},

\textquotedbl{}LMRoman10 Bold\textquotedbl{}, \textquotedbl{}CM Roman Bold\textquotedbl{}, \textquotedbl{}Computer Modern Roman Bold\textquotedbl{},
\textquotedbl{}Universal Modern Bold\textquotedbl{},

\textquotedbl{}LMRoman10\textquotedbl{}, \textquotedbl{}CM Roman\textquotedbl{}, \textquotedbl{}umb10\textquotedbl{}, \textquotedbl{}Universal Modern Roman\textquotedbl{},
\textquotedbl{}Computer Modern Roman Regular\textquotedbl{},

\end{quote}


\subsection{Sans Serif%
  \label{sans-serif}%
}
%
\begin{quote}

\textquotedbl{}Latin Modern SanSerif 8\textquotedbl{}, \textquotedbl{}Latin Modern SanSerif 9\textquotedbl{}, \textquotedbl{}Latin Modern SanSerif
10\textquotedbl{}, \textquotedbl{}Latin Modern SanSerif 12\textquotedbl{},

\textquotedbl{}LMSans10 Bold\textquotedbl{}, \textquotedbl{}CM Sans Bold\textquotedbl{}, \textquotedbl{}Computer Modern Sans Bold\textquotedbl{},

\textquotedbl{}LMSans10\textquotedbl{}, \textquotedbl{}CM Sans\textquotedbl{}, \textquotedbl{}Computer Modern Sans Regular\textquotedbl{},

\end{quote}


\subsection{Monospace%
  \label{monospace}%
}
%
\begin{quote}

\textquotedbl{}Latin Modern Typewriter 8\textquotedbl{}, \textquotedbl{}Latin Modern Typewriter 9\textquotedbl{}, \textquotedbl{}Latin Modern
Typewriter 10\textquotedbl{}, \textquotedbl{}Latin Modern Typewriter 12\textquotedbl{},

\textquotedbl{}LMTypewriter10\textquotedbl{}, \textquotedbl{}CM Typewriter\textquotedbl{}, \textquotedbl{}Computer Modern Typewriter Regular\textquotedbl{},
\textquotedbl{}Universal Modern Typewriter\textquotedbl{}, \textquotedbl{}umtt10\textquotedbl{},

\end{quote}

Computer Modern Bright (only in CM-Super):
%
\begin{quote}

Computer Modern Bright

\end{quote}

Concrete (only in CM-Super):
%
\begin{quote}

Computer Modern Concrete

\end{quote}


\section{Availability of LaTeX-fonts for screen%
  \label{availability-of-latex-fonts-for-screen}%
}

All are in Type 1 format except
%
\begin{itemize}

\item Universal Modern is TrueType, only

\item Latin Modern can be converted to many formats. Also OpenType is
available.

\end{itemize}

Latin Modern:

Debian users can install package called \textquotedbl{}lmodern\textquotedbl{}
%
\begin{itemize}

\item \url{ftp://ftp.gust.org.pl/pub/GUST/contrib/fonts/lm/}

\item \url{ftp://bop.eps.gda.pl/pub/lm}

\item \texttt{CTAN: fonts/lm/}

\item \texttt{CTAN: fonts/ps-type1/lm.zip}

\end{itemize}

cm-lgc:
%
\begin{quote}

\texttt{CTAN: fonts/ps-type1/cm-lgc}

\end{quote}

Universal Modern:

These fonts are in True Type format
%
\begin{quote}

\url{http://www.truetex.com/}

\end{quote}

CM-Super:

This bunch of fonts is really big. You'd better take only Computer Modern
Bright and Concrete fonts from them.
%
\begin{quote}

\texttt{CTAN: fonts/ps-type1/cm-super}

\end{quote}

hfbright is a bunch of fonts that were left out from the original cm-super
fonts. But don't install them so, that X Window System and fontconfig will
see them, because they break things. But if you want to install them for
LaTeX, here they are:
%
\begin{quote}

\texttt{CTAN: fonts/ps-type1/hfbright}

\end{quote}

Users of Windows without Type 1 support need ATM (Adobe Type Manager):
%
\begin{itemize}

\item \url{http://www.adobe.com/}

\item \url{http://www.adobe.com/products/atmlight/main.html}

\end{itemize}


\section{Installation of own fonts for X Window System by hand%
  \label{installation-of-own-fonts-for-x-window-system-by-hand}%
}

If you are lazy, just put your font files to \texttt{\textasciitilde{}/.fonts} . That way
has just few drawbacks:
%
\begin{itemize}

\item Only modern software that uses technology called ”fontconfig”,
will use those fonts.

\item Other users of that computer can not use those same fonts.

\item Those fonts are not yet cached by fontconfig.

\end{itemize}

If you follow these steps, also legacy software will use your fonts and
they are cached by fontconfig and they are usable for all users of that
computer. Everything after this point must be done as root.

Create directory \texttt{/usr/local/share/fonts} and create subdirs
\texttt{Type1}, \texttt{TrueType} and \texttt{OpenType} there.

Your config of X.org (\texttt{/etc/X11/xorg.conf}) must have those font
paths:
%
\begin{quote}\begin{verbatim}
Section "Files"
  FontPath    "unix/:7100"    # local font server
  # if the local font server has problems,
  # we can fall back on these
  FontPath  "/usr/lib/X11/fonts/Type1"
  FontPath  "/usr/lib/X11/fonts/TrueType"
  FontPath  "/var/lib/defoma/x-ttcidfont-conf.d/dirs/TrueType"
  FontPath  "/var/lib/defoma/x-ttcidfont-conf.d/dirs/CID"
  FontPath  "/usr/local/share/fonts/Type1"
  FontPath  "/usr/local/share/fonts/TrueType"
  FontPath  "/usr/local/share/fonts/OpenType"
  FontPath  "/usr/lib/X11/fonts/Speedo"
  FontPath  "/usr/lib/X11/fonts/misc"
  FontPath  "/usr/lib/X11/fonts/100dpi/:unscaled"
  FontPath  "/usr/lib/X11/fonts/75dpi/:unscaled"
  FontPath  "/usr/lib/X11/fonts/100dpi"
  FontPath  "/usr/lib/X11/fonts/75dpi"
EndSection
\end{verbatim}

\end{quote}

Your X.org needs modules \texttt{freetype} and \texttt{type1}:
%
\begin{quote}\begin{verbatim}
Section "Module"
    Load    "bitmap"
    Load    "dbe"
    Load    "ddc"
    Load    "dri"
    Load    "extmod"
    Load    "freetype"
    Load    "glx"
    Load    "int10"
    Load    "record"
    Load    "type1"
    Load    "vbe"
EndSection
\end{verbatim}

\end{quote}

Configuration file of fontconfig (/etc/fonts/fonts.conf) must have that
path, too:
%
\begin{quote}\begin{verbatim}
<dir>/usr/share/fonts</dir>
<dir>/usr/X11R6/lib/X11/fonts/Type1</dir>
<dir>/usr/local/share/fonts</dir>
<dir>~/.fonts</dir>
\end{verbatim}

\end{quote}

There is no need to mention subdirs in that config.


\subsection{Installation steps for Type 1 fonts%
  \label{installation-steps-for-type-1-fonts}%
}
%
\begin{itemize}

\item Put those Type 1 fonts to \texttt{/usr/local/share/fonts/Type1}
Each font consists of two files: one of them has ending ”.atm” and one
of them end either ”.pfa” or ”.pfb”

\item Run these commands in that directory:

\end{itemize}
%
\begin{quote}\begin{verbatim}
rm -f fonts.cache-1 fonts.dir fonts.scale Fontmap fonts.scale.bak Fontmap.bak
type1inst
chown -R root: .
chmod -R ugo+rX,go-w .
\end{verbatim}

\end{quote}


\subsection{Installation steps for True Type fonts%
  \label{installation-steps-for-true-type-fonts}%
}
%
\begin{itemize}

\item Put those True Type fonts (filenames ending ”.ttf” to
\texttt{/usr/local/share/fonts/TrueType}

\item Run these commands in that directory

\end{itemize}
%
\begin{quote}\begin{verbatim}
rm -f fonts.cache-1 fonts.dir fonts.scale
ttmkfdir -o fonts.scale
mkfontdir
chown -R root: .
chmod -R ugo+rX,go-w .
\end{verbatim}

\end{quote}


\subsection{Installation steps for Open Type fonts%
  \label{installation-steps-for-open-type-fonts}%
}
%
\begin{itemize}

\item Put those OpenType fonts (filenames ending ”.otf” to
\texttt{/usr/local/share/fonts/OpenType}

\item Run these commands in that directory

\end{itemize}
%
\begin{quote}\begin{verbatim}
rm -f fonts.cache-1 fonts.dir fonts.scale
mkfontscale ; mkfontdir
chown -R root: .
chmod -R ugo+rX,go-w .
\end{verbatim}

\end{quote}


\subsection{Procedures after installation%
  \label{procedures-after-installation}%
}
%
\begin{quote}\begin{verbatim}
fc-cache -s -r -v
chown -R root: /usr/local/share/fonts
chmod -R ugo+rX,go-w /usr/local/share/fonts
\end{verbatim}

\end{quote}

After this point you must give commands as normal user (non-root).

You don't need to restart X to see those new fonts in non-fontconfig-supported
programs. You can add font paths to X on the fly like this:
%
\begin{quote}\begin{verbatim}
xset fp+ /usr/local/share/fonts/Type1
xset fp+ /usr/local/share/fonts/TrueType
xset fp+ /usr/local/share/fonts/OpenType
\end{verbatim}

\end{quote}

To find new fonts from paths you already using, give this command:
%
\begin{quote}\begin{verbatim}
xset fp rehash
\end{verbatim}

\end{quote}

Give this command in order to update your fontconfig-cache:
%
\begin{quote}

fc-cache -r -v

\end{quote}


\section{Suggestions for order of fonts in <hX>-tags%
  \label{suggestions-for-order-of-fonts-in-hx-tags}%
}


\subsection{Principles%
  \label{id1}%
}
%
\begin{itemize}

\item Serif fonts are very readable when printed on paper. When reading from
screen, your serif fonts of body text must be carefully designed for
screen, you must have good resolution in your monitor and your operating
system must have good antialiasing and (auto)hinting support for fonts.
In most cases you'd better stick with sans serif fonts, when reading text
from screen.

\item To distinguish body text from title text they need some contrast.
Traditional way is to use bold and big font for titles. But don't use
same font for titles and body text. It is not enough: If serif font is
used for titles, then sans serif font must be used for body text. That way
you do not need so big fonts for titles. This principle can be used vice
versa only in printed documents except if you have good resolution and
antialiasing. See also KOMA-script document classes for LaTeX to see this
principle in use.

\item The more well suited font is for screen, the smaller it can be: Use
calligraphic or chancery fonts only for the biggest titles, like <h1>,
if you use them at all. Then use some serif fonts for smaller titles.
Finally, if you use sans serif fonts for titles, use them only for the
smallest titles, like <h5> and <h6>.

\item The closer to body text we get, the more we can use sans serif font.
This principle can be used vice versa only in printed documents.

\item Don't try to put monospace fonts to titles or all body text. It looks
stupid. Use it only in such text that can be put between <tt>- or
<pre>-tags.

\item Not everybody have fonts of Bitstream Vera family. But if they are
installed, use them! They rule! Put also their enhaced versions
DejaVu and Arev.

\item Try to avoid Times and Helvetica. They are so overused. Also Schoolbook
and Bookman are overused.

\item Palatino is very readable even on paper of bad quality. Therefore it
works well on screen, too. Bitstream Charter was originally designed
for screen, even for low-resolution screen. Fonts of Bitstream Vera family
are even newer fonts designed for screen. Bookman, Schoolbook, Times and
their clones are not good for screen.

\item When bolded, Bookman looks darker, wider and thicker than Schoolbook and
Schoolbook looks darker, wider and thicker than Times

\end{itemize}


\subsection{Orders%
  \label{orders}%
}


\subsubsection{Basic order%
  \label{basic-order}%
}
%
\begin{itemize}

\item Zapf Chancery and clones

\item Bookman and clones

\item Schoolbook and clones

\item Times and clones

\item Palatino and clones

\item Bitstream Charter and clones

\item Bitstream Vera Serif and enhanced version

\item Avant Garde and clones

\item Bitstream Vera Sans and Helvetica and clones

\end{itemize}


\subsubsection{A little bit artistic and calligraphic%
  \label{a-little-bit-artistic-and-calligraphic}%
}

Suggestion 1a: Not-so-official and artistic styles:
%
\begin{itemize}

\item <h1> Zapf Chancery and clones

\item <h2> Bookman and clones

\item <h3> Schoolbook and clones

\item <h4> Bitstream Vera Serif, Times and clones

\item <h5> Palatino and clones

\item <h6> Bitstream Charter and clones

\end{itemize}

Suggestion 1b: variation of the above: More sans serif used:
%
\begin{itemize}

\item <h1> Zapf Chancery and clones

\item <h2> Bitstream Vera Serif, Bookman and clones, Schoolbook and clones,
Times and clones

\item <h3> Palatino and clones

\item <h4> Bitstream Charter and clones

\item <h5> Avant Garde and clones

\item <h6> Bitstream Vera Sans and Helvetica and clones

\end{itemize}

Suggestion 1c: variation of the above: More chancery used:
%
\begin{itemize}

\item <h1> <h2> Zapf Chancery and clones

\item <h3> Bitstream Vera Serif, Bookman and clones, Schoolbook and clones,
Times and clones

\item <h4> Palatino and clones

\item <h5> Bitstream Charter and clones

\item <h6> Avant Garde and clones, Bitstream Vera Sans and Helvetica and clones

\end{itemize}


\subsubsection{Official and formal style%
  \label{official-and-formal-style}%
}

Suggestion 2a: More official and formal styles:
%
\begin{itemize}

\item <h1> Bookman and clones

\item <h2> Schoolbook and clones

\item <h3> Bitstream Vera Serif, Times and clones

\item <h4> Palatino and clones

\item <h5> Bitstream Charter and clones

\item <h6> Avant Garde and clones, Bitstream Vera Sans and Helvetica and clones

\end{itemize}

Suggestion 2b: variation of the above: More Palatino used:
%
\begin{itemize}

\item <h1> Bitstream Vera Serif, Bookman and clones, Schoolbook and clones,
Times and clones

\item <h2> <h3> Palatino and clones

\item <h4> Bitstream Charter and clones

\item <h5> Avant Garde and clones

\item <h6> Bitstream Vera Sans and Helvetica and clones

\end{itemize}

Suggestion 2c: variation of the above: All hail Palatino and Charter!:
%
\begin{itemize}

\item <h1> Bitstream Vera Serif, Bookman and clones, Schoolbook and clones

\item <h2> <h3> Palatino and clones

\item <h4> <h5> Bitstream Charter and clones, Times and clones

\item <h6> Avant Garde and clones, Bitstream Vera Sans and Helvetica and clones

\end{itemize}

Suggestion 3: More sans-serif used:
%
\begin{itemize}

\item <h1> Bookman and clones, Schoolbook and clones

\item <h2> Bitstream Vera Serif, Times and clones

\item <h3> Palatino and clones

\item <h4> Bitstream Charter and clones

\item <h5> Avant Garde and clones

\item <h6> Bitstream Vera Sans and Helvetica and clones

\end{itemize}

Suggestion 4: Try to avoid Times, Schoolbook and Bookman:
%
\begin{itemize}

\item <h1> <h2> Palatino and clones

\item <h3> <h4> Bitstream Charter and clones, Bookman and clones,
Schoolbook and clones, Times and clones

\item <h5> Bitstream Vera Serif, Avant Garde and clones

\item <h6> Bitstream Vera Sans and Helvetica and clones

\end{itemize}


\subsubsection{For mediatype called print%
  \label{for-mediatype-called-print}%
}

Suggestion 5a: For printing: Use sans-serif as much as possible for titles:
%
\begin{itemize}

\item <h1> Avant Garde and clones

\item <h2> Bitstream Vera Sans and Helvetica and clones

\item <h3> <h4> Bitstream Charter and clones, Bookman and clones

\item <h5> Bitstream Vera Serif, Schoolbook and clones, Times and clones

\item <h6> Palatino and clones

\end{itemize}

Suggestion 5b: Variation of above:
%
\begin{itemize}

\item <h1> Avant Garde and clones

\item <h2> Bitstream Vera Sans and Helvetica and clones

\item <h3> <h4> Bitstream Vera Serif, Bitstream Charter and clones,
Bookman and clones

\item <h5> <h6> Palatino and clones,
Schoolbook and clones, Times and clones

\end{itemize}

Suggestion 5c: Variation of above:
%
\begin{itemize}

\item <h1> <h2> Avant Garde and clones

\item <h3> <h4> Bitstream Vera Sans and Helvetica and clones

\item <h5> Bitstream Vera Serif, Bitstream Charter and clones,
Bookman and clones

\item <h6> Palatino and clones

\end{itemize}


\section{Todo%
  \label{todo}%
}
%
\begin{itemize}

\item I do not believe all those aforementioned principles and ordering of fonts,
anymore. I really do not follow them in my CSS-stylesheet. Hence, I should
update them.

\item Tell how to obtain all those free (in the sense of freedom) fonts. Tell
URLs.

\item Add information about these clones:
%
\begin{itemize}

\item Fonts of TeX Gyre

\item Fonts of VnTeX or urwvn

\item FPL Neu

\end{itemize}

\item Tell how to unpack .bz2- and .tar.bz2-files.

\item Create also these Stylesheets:
%
\begin{itemize}

\item Palatino: Just like indexbwserif, but uses Palatino very much

\item indexwb: Just like indexbw but has white text on black

\item indexwbserif: just indexbwserif but has white text on black

\end{itemize}

\item All stylesheets have same monospace fonts. Include that from one file
(except color). Don't use hiding techniques, though.

\end{itemize}

\end{document}
