CSSで組版!PHPerKaigiパンフレット記事作成

2025-04-03
PHPerKaigi
CSS組版

PHPerKaigi 2025にて、「PHPウェブアプリケーションの脆弱性対応戦略」というテーマでパンフレット記事を入稿しました。この記事では、その過程で学んだCSS組版についての経験共有です。

パンフレット記事の特徴

記事の入稿は、通常のプレゼンテーション作成と異なる特徴があります。入稿という作業が必要になるのです。

具体的には、入稿先の求める形式に合わせてデータを作成する必要があります。執筆の経験がある方は、自分の書いた文章を編集の方々がきれいな雑誌や本に仕立ててくれた経験があると思います。

解決策

自分でやるとしたら、どうやっていいかわからない。自分もどうしていいかよくわからんとなりました。

そんなあたなに紹介したいのがこの本です!「Web技術で「本」が作れるCSS組版 Vivliostyle入門」(株式会社 C&R研究所) 分かりやすい解説と豊富なサンプルで、CSS組版をステップバイステップで学ぶことが出来ます。

組版作業に利用するツールはVivliostyleです。書籍にも書かれていますが、VSCodeのプラグインがあるのでGUIから利用可能です。

私の成果物

実際に作成した入稿データと、その際に利用したCSSスタイルは下記のリポジトリにまとめました。ぜひ参考にしてみてください。CSSスタイルは書籍のサンプルを参考にしつつ、いわゆる技術系雑誌の2段組レイアウトにしました。

PHPerKaigi 2025 パンフレット記事表紙

PHPerKaigi 2025 パンフレット用リポジトリ

良いところ

  • 無料(書籍代くらいはだすんだぞ?
  • VSCodeから簡単に使える
  • いざとなったらインラインスタイルでなんとかなる

悪いところ

あんまり思いつかなかったけど、強いて言うなら…

  • CSSの知識があっても思い通りの形にするのはムズい
  • 書籍のサンプルがなかったら、あんなに上手にできなかった

おわりに

組版ができるという自信があれば、パンフレット記事入稿に自信をもってチャレンジすることができます。ぜひ、次のPHPerKaigiでは、あなたもトライしてみてください!