制作の背景
echo.cssは、愛知県豊橋市のウェブ制作者「うぇびん」が個人で制作、公開しています。
私は、CMSの組み込みを前提としたコーポレートサイトの制作業務に携わっています。
製作時はデザインカンプ（またはワイヤーフレーム）を受け取って制作しますが、常にいくつかの課題がありました。
課題1: デザイン反映の際の工数
CMSテーマのプロトタイプの段階でコーディングに不備があると、デザイナーの細かい意匠を反映できず、大きな手戻りにつながっていました。
Bootstrap等の既存フレームワークを利用することで改善できないかと考えたこともありました（実際、Bootstrapを採用したCMSテーマは多数あります）。
しかし、どのフレームワークも「スタートアップ等ですぐ使えること」を優先しており、UIなどの外観デザインがしっかりと作られています。そのため、デザインを変更しなければならないときの工数が、一から作成するときよりも多くなってしまう状況でした。
課題2: 納品後の改修
CMSはその特性上、納品後にほぼ必ずコンテンツの改修が行われます。その際、まったく想定外（文字数、色、サイズ等）のコンテンツが追加されることがよくあります。CSS側が変更・拡充に対応できない状況を避けたいところです。
課題3: 文字サイズ
コンテンツの内容やフォントの種類によって、文字サイズを微妙に調整することがあります。基本的には、各オブジェクトの文字サイズはフレームワーク側で適切なものを提供してほしいです。しかし、変更したくなったときに、容易に対応できることが理想です。
課題4: ブロックエディタの普及
WordPressのGutenbergによって、幅を自由に変更できるブロックエディタが普及しました。このため、旧来のCSSフレームワークの定番となっていたコンテナタグでオブジェクトの最大サイズをまとめて固定することができなくなりました。また、色などの豊富なオプションに対応しなければならなくなりました。
このような背景から、いかにこれらの課題を改善するかを考えて制作したのが、echo.cssです。
命名の由来
この単語が好きだから、というのが第一の理由ですが（笑）
- 多くのCMSは、PHPで動作します。必ず使用されるメソッドが、結果を出力する「echo」です。
- 「echo」は日本語で「響く」という意味があります。日本には「打てば響く」ということわざがあります。打てば響くプロダクトにしたいと思います。