日本製で日本語に対応したCSSフレームワークをまとめてみた
NES.cssが話題だ。
nostalgic-css.github.io
公式サイトは英語だが、作者は日本人。
kuroeveryday.blogspot.com
個人的に使うならファミコン風のデザインだけいただいてドット絵は不要…と思いきやドット絵はCSSで描かれているという驚きの展開。
qiita.com
さて日本製のCSSフレームワークといえばOnsen UIやBasisなどが代表的だが、これらは特に日本語の扱いに長けているというわけではない。
ja.onsen.io
sass-basis.github.io
最新のCSSフレームワークを検索しても、どの記事も似たりよったりで、日本人が作ったCSSフレームワークを目にする機会はほとんどない。
そこで過去にはてブしてあったものを中心に、日本製で日本語に対応したCSSフレームワークをまとめてみることにした。
MUSUBii
musubii.qranoko.jp
Yaku Han JP作者による日本語サイト向けに最適化されたシンプルなCSSフレームワーク。
echo.css
cms-skill.com
札幌のWebbingStudio制作の、CMSサイト制作に最適化された、マルチバイト言語対応のCSSフレームワーク。
デモサイト
Arakawa Template
arkw.net
愛知県岡崎市の高校生が制作したオープンソースのCSSテンプレート。
レスポンシブデザイン対応、3種類のカラーテーマ、2カラムのウェブサイトも制作可能なところが主な特徴と思われる。
作者サイトには学生ならではのユニークなプロジェクトが多数。
- TriEditor LE(普通科高校で採用実績のあるHTML/CSS用のテキストエディタ)
- Katamuki.js(body要素を僅かに傾けることで文字にアンチエイリアス処理をかけるJavaScript)
Honoka
honokak.osaka
日本語も美しく表示できるBootstrapテーマ。最新バージョンはBootstrap4に対応。ラブライブ!の高坂穂乃果をイメージし「honokak.osaka」というユニークなドメインでも話題に。数多くの派生テーマが作成されているが、アップデートは個別に行われており一部はBootstrap3のままとなっている。以下、Enpediaの記事を参考にまとめた。
- Umi(ラブライブ!の園田海未をイメージ。Bootostrap4対応)
- Nico(ラブライブ!の矢澤にこをイメージ。Bootostrap4対応)
- Rin(ラブライブ!の星空凛をイメージ。ドメインも「rinhoshizo.la」となっている。Bootstrap3対応)※私が使っているのはコレ
- Frandre(東方Projectのフランドール・スカーレットをイメージ。Bootstrap3対応)
- Alice(東方Projectのアリス・マーガトロイドをイメージ。Bootstrap3対応)
- Kanata(元ネタ不明。Bootstrap3対応)
- Shiro(元ネタ不明。Bootstrap3対応)
- Ayame(天誅の女性主人公「彩女」をイメージ。詳しくは作者ブログ参照)
jpn.css
kokushin.github.io
BootstrapなどCSSフレームワークを適用させた際、日本語だと不格好に見えてしまう問題を解消するためのスタイルシート。フォントには美しくデザインされた「游ゴシック」を採用し、最新バージョンであるBootstrap4に対応。タイポグラフィ周りだけ最適化されるので、他要素への影響はない。
作者サイトには他にも魅力的なプロジェクトが多数。
Fivee-base
plain-web.com
日本製のかゆいところに手が届くダッシュボードUIデザイン用CSSフレームワーク。作者は企業向けサポートや完全オリジナルのCSSフレームワーク制作も行っているとのこと。
印 INCSS
web.archive.org
(公式サイト閉鎖のためインターネットアーカイブへのリンクです)
株式会社インブランディングによるIE7/8対応、日本製の軽量CSSフレームワーク。Q&A用のテンプレートが用意されているなど、ホームページテンプレート的なデザインが特徴的。
mikan.js
github.com
CSSフレームワークではないが、日本語改行問題の解決策として取り上げる。これを使うことで単語の途中で改行されていたものが、単語区切りでの改行になる。以下の記事に詳しい。
suin.io
Saetl.net
saetl.net
CSSフレームワークではないが、日本製なので取り上げる。
レスポンシブデザインに対応し、著作権表示不要の無料ホームページテンプレート。CSSにはすべてコメントがつけてありわかりやすい。
JS CMS
www.js-cms.jp
CSSフレームワークではないが、日本製なので取り上げる。DB不要のCMS、静的サイトジェネレータ。
520種類のデザイン・レイアウトがあらかじめ用意されており、企業サイトを金太郎飴方式で大量に作る必要がある人向け。
ダッシュボードUIはとてもよくできているので、テンプレートのカスタマイズ次第ではWordPressの代用になるやもしれず。
OneThird CMS
onethird.net
CSSフレームワークではないが、日本製なので取り上げる。福岡県のSpiQe Softwareが開発した軽量CMS。
同社サイトが作例となっており、無料HPも開放。これである程度自力で構築させて保守契約するというビジネスモデルらしく、それでも1サイト12000円は驚異的な低価格だと思う。