An example of hanging punctuation.
From the XeLaTeX code copied below, I generated a PDF, then added vertical coloured lines to the PDF in macOS Preview 10, then cropped and converted to SVG in Inkscape, then halved the file size with SVGO.
The intermediate stage with Preview was because I was initially just going to make a PNG screenshot, before deciding that I could keep it as vectors.
% !TEX program = xelatex
\documentclass[a4paper, 12pt]{letter}
\usepackage{fontspec}
\usepackage[left=60mm, right=60mm, top=30mm, bottom=40mm]{geometry}
\usepackage[latin]{babel}
% Expansion is good, but doesn't work with XeLaTeX yet.
\usepackage[protrusion=true, expansion=false, factor=1000]{microtype}
\SetProtrusion{encoding={*},family={*},series={*},size={12}}
{
{“}={1000,1000}, {,}={1000,1000}, {-}={1000,1000},
{.}={1000,1000}, {*}={1000,1000}, {;}={1000,1000},
{(}={1000,1000}, {)}={1000,1000}
}
\begin{document}
``Nam dui ligula, fringilla a, euismod sodales, sollicitudin vel, wisi.
Morbi auctor lorem non justo.
Nam lacus libero, pretium at, lobortis vit\ae, ultricies et, tellus.
Donec aliquet, tortor sed accumsan bibendum, erat ligula aliquet magna, vit\ae\
ornare odio metus a mi.
Morbi ac orci et nisl hendrerit* mollis.
Suspendisse ut massa. Cras nec ante. Pellentesque a nulla.
Cum sociis natoque penatibus;
(et magnis dis parturient montes, nascetur ridiculus) mus.
Aliquam tincidunt urna.''
\end{document}
I hereby release the above source code into the public domain.
The XeLaTeX code uses the Microtype package, which improves typography and allows fine control of it. By default, Microtype wouldn't be as zealous as this, but instead allow characters to hang into the margin only as much as they need to in order for the edges to feel straight. I, however, pumped the setting up to 1000.
, which was a raster image, small, only showing one hanging punctuation mark (only on the left), poorly justified on the right-hand side, &c.