改めてこのブログについてとSVGお勧め書籍など
このブログも開設から一年を過ぎ、有り難いことに少しずつアクセスも増えてきました。
それに伴い新規の読者さんも増えてきている（たぶん）と思いますので、改めてこのブログ「週刊SVG」についての説明と、そしてこの機会にSVG関連情報について整理しておきます。
簡易目次
このブログについて
この「週刊SVG」ではScalable Vector Graphics(SVG)に関するニュースや、制作のコツなどをほぼ毎週更新しています。SVGは15年前の2001年にW3C勧告された規格ではあるのですが、長らくブラウザでは標準サポートがされず普及しませんでした。しかしIE8のサポートも2016年1月で終了し、今や主要な環境でSVGに対応するようになっています。
そしてさらに、スマートフォンのディスプレイの画質が向上したこともあり、レスポンシブな表現……つまりベクター形式のSVGが近年再評価されるようになってきました。
このブログの目的について/h5>
しかし、一方でブラウザ間の差異や実装の違い・バグが未だにあるのも事実ですし、SVG特有の仕様に慣れていない人が戸惑う場面も多くあります。そうした問題を共有できる場であったり、そもそもSVGを触れたことがない人にもこんな便利な使い方もあると知ってもらう……などといったところを目的にこのブログを運営しています。
更新日について
できれば、決まった曜日に更新したいのですが、執筆時間がなかなか安定せず更新曜日が不定期になっているのが現状です。というのも組織だった運営を行っているわけではなく、あくまでこれは個人制作のブログなためです。そのためRSSをフィードリーダーに登録するか、更新告知Twitterをフォローするのをお勧めします。
扱う内容について
基本的にはSVGについて、または関連する技術について最新の情報を中心に取り上げていきます。
ただそうはいっても、ジャンルが特化し過ぎるためかSVG関連ニュースがなかなか集まらない週もよくあり、そうした場合には他サイトの情報紹介ではなく、SVG制作のコツやブラウザ差異の問題点と対処法などの技術解説記事も書いています。
扱わない内容について
単なるSVG素材配布サイトなどはきりがないので扱いません、そうした情報を求めている場合コリスさんなどそれらのジャンルに明るい他のブログを参照してください。
SVGの最新情報をチェックするのにお勧めのTwitterアカウント
このブログに興味を持つ方は、おそらくSVG最新情報を積極的にチェックしたい、と考えている人が多いでしょう。そうした人向けに、このブログ以外でお勧めのTwitterユーザー、アカウントを紹介します。
@SVGWeekly
SVG WeeklyはJachin Sheehy（@strangepants）さんが運営されている、毎週更新のSVG関連ニュース紹介サイトです。この「週刊SVG」と全く同じコンセプトですね。
そのため、おそらく読者もかなり重なっているだろうと考えており、SVG Weeklyで先に取り上げているニュースは敢えてこちらでは重複して紹介しない、といったことも良くあります。できるだけこちらはこちらの独自性を出すように違う記事を紹介したり、補足を加えたり関連情報を併記するようにしていますが、なるべくなら両方購読するのをお勧めします。
@SaraSoueidan
Sara SoueidanさんはSVG界隈では最も精力的に活動されている方です。各地のカンファレンスイベントでも多数講演されていますし、ブログもとても参考になります。TwitterでもSVGに関する話題もよくツイートされています。
単著はまだ無いようですが、こちらの書籍ではSVGの項目を担当されていますね。
SVGを利用するにあたって、gzip圧縮などサーバーの設定からレスポンシブな表現のやり方など実践的な技術を解説されています。
@AmeliasBrain
Amelia Bellamy-Roydsさんはオライリーから出版されているSVG関連書籍3冊を手掛けられ、さらに現在策定中のSVG2ではInvited Expertとして参加されています。
TwitterではSVG2についての新機能や議論の話題など、またブラウザのバグ情報・検証例などもよくツイートされていますね。
@chrisgannon
Chris GannonさんはCodePenでSVGを使ったアニメーション作品をよく投稿されています。
独創的で緻密な演出が多く、参考になる部分がたくさんあります。
SVGについて学ぶ：仕様について
SVGの最新情報を追いかけるならお勧めのTwitterユーザーを紹介したわけですが、これらはSVGについてある程度詳しい人向けの情報ですね。もしもSVGにはまだ慣れていない、また一から学びたい……といった人向けの情報もまとめておきます。
SVG 1.1 2nd Edition - W3C
SVG 1.1 2nd Edition - W3C ( 日本語訳 )
SVGは前述の通り、W3Cで仕様が公開されています。現在主要なブラウザで実装されているのはSVG 1.1 2nd Editionです。仕様はSVGを理解する上で基礎となりますので、まずはここから……と言いたいのですが、最初からはなかなか読みにくいと思うので、初心者の人は後ほど紹介する入門書を先に読むのを推奨します。
また先日、次期バージョンであるSVG2が勧告候補(CR)になりました。
Scalable Vector Graphics (SVG) 2 - W3C
SVGに慣れた人ならば、こちらも読んでおいた方が良いでしょう。SVG2の機能が利用できる環境が整うはまだ先になりますが、tref要素など廃止される要素・属性をチェックしておくと制作しやすくなります。
そうしたSVG 1.1との違いがまとまったこのページくらいは目を通しておくと良いです。
SVGについて学ぶ：書籍について
初心者向けの書籍
大黒学さんによるこの電子書籍（PDF/LaTeX版）は初心者向けに書かれているだけでなく、なにより無料で公開されていますから手に取りやすく初心者に最もお勧めです。SVGについてどころか、XMLやCSSの説明からされており、基本から学びやすいです。
こちらも初心者向けの書籍です、この本の特徴はオープンソースのSVGオーサリングツールであるInkscapeの解説も載っている点ですね。
中級者向けの書籍
SVGの仕様自体については、極論を言えばW3Cの文書を読めば理解できるわけですし、そもそも制作するだけなら仕様を知らなくてもAdobe IllustratorやSketchなどのオーサリングツールで容易に作れます。
しかしそのSVGファイルを実際に運用する、となるとそう簡単にいかないこともあります。
ブラウザによって実装が異なったり、バグがあったり、思うように活用できないことも少なくありません。そうしたときにこれらの書籍が役に立ちます。
作者は@DEFGHI1977さんで、Web版のsvg要素の基本的な使い方まとめも運営されています。
SVGの基礎的な面から、ブラウザ毎の実装の違いやバグ、そしてそれらへの対処法など非常に細かく検証して執筆されています。仕様には書かれていない現状のブラウザ実装状況を、一つ一つ自分で調べて試行錯誤していてはとても時間がかかりますから、この書籍を読むことで助けられる場面は多いでしょう。
個人的には一押しの書籍です。
この書籍はAdobe IllustratorとSketchを中心にベクター形式の制作についての内容が主ですが、SVGに関しても多くの紙面を割いて解説されています。
特にAdobe IllustratorからSVGファイルを書き出す際の設定や、SVGを利用する要素（imgやobject要素など）に応じて振る舞いが変わってしまう点など、実際の制作現場で課題になりそうな要点を分かりやすくまとめています。
SVGの章を担当されたのは松田直樹（@readymadegogo）さんで、その松田さんによるこれらのスライドもSVGを学ぶ上でとても役立つでしょう。
まとめ
冒頭でも書きましたが、長らくInternet Explorerが対応してこなかったこともありSVGは普及していませんでした。しかしSVG非対応のIE8以下のサポートも終了し、現在は対応する環境が整っています。
そしてスマートフォンやタブレットの普及、そして画面の高解像度化が進んだこともあって拡大・縮小が容易なベクター形式であるSVGが近年再評価されてきています。その一方でブラウザの差異やバグ、またSVG特有の仕様に慣れず悪戦苦闘する場面もままあります。
そうした苦労を少しでも低減できるよう、今後もこのブログを更新できればな、と考えています。
個人的な思いを言えば、SVGという規格を知ったのが10年以上前でその頃から地味にコツコツと様々なことを試したり・検証していてようやく使える環境が整ってきた喜びをここ数年感じていますし、SVGの魅力や奥深さを皆さんにこの「週刊SVG」を通じて伝えていきたいですね。