SVG ファイルをドロップするだけで最適化する (Windows)
Adobe Illustrator で SVG ファイルを書き出すと、次のように作成アプリケーションやレイヤーに関する情報など、余計なデータが含まれている。
<?xml version="1.0" encoding="utf-8"?> <!-- Generator: Adobe Illustrator 16.0.3, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg version="1.1" id="レイヤー_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="60px" height="60px" viewBox="0 0 60 60" enable-background="new 0 0 60 60" xml:space="preserve"> <g> ...
このような不要データを削除するツールとしておすすめなのが、その名も svgcleaner。同じようなツールである svgo や scour よりも SVG が壊れにくく、処理時間も短い。
Linux, macOS, Windows 用のバイナリが配布されており Releases からダウンロードできる。
ためしに手元の SVG ファイル 9 個を最適化したところ、28,306 バイトあったデータが 20,533 バイト（73%）になった。
Windows でドロップレットを作る
最適化するファイル数が少ない場合はタスクランナー等をいちいち設定するより、ドラッグ・アンド・ドロップするだけで最適化を行えるドロップレットを作るのが便利だ。
Windows 版のバイナリはインストーラになっているので、まずはインストールする。そして次の内容の CleanSVG.bat というファイルを作成して適当なディレクトリに置く。
@echo off set executable=C:\Program Files (x86)\SVG Cleaner\svgcleaner-cli.exe set outdir=cleanSVG :start set dir=%~d1%~p1%outdir% if exist %dir% goto clean mkdir %dir% :clean "%executable%" %1 "%dir%\%~n1%~x1" shift if NOT x%1==x goto start
アイコンを変えたい場合は .bat へのショートカットを作るとよい。
また、エクスプローラーで SVG を縮小表示したい場合は svg-explorer-extension を使用するとよい。
