今回は、待望の正式版がリリースされたBootstrap5の『無料テンプレート』を紹介します。
BootstrapとはTwitter社が提供しているCSSのフレームワークになり、他にはFoundationやUIKit、Bulma、Semantic UI、TailWind CSSなど様々な種類のフレームワークが公開されています。
その中でも最新版が正式リリースされ、注目が高まるBootstrap。
普段からBootstrapを使っている方やこれを機会に使ってみる方などに参考になると思いますよ。
Bootstrap4 → Bootstrap5の変更点
まずはBootstrap5のアップデート情報をいくつか紹介していきます。
機能追加だけではなく、非サポートや逸脱など、理解した上で最新版を使用した方が良さそうです。
脱JQUERY
Bootstrap4まではjQueryに依存する形でbootstrap.jsファイルが動いていました。
jQueryとの依存関係がなくなり、Bootstrap5ではjQueryなしで使用できるようになりました。VueやReactのコンポーネントも開発しやすくなりますね。
INTERNET EXPLORER非サポート
元々ユーザー数が多くなく、Edgeが登場したことで更に利用率が減少したInternet Explorer。
今回のアップデートで対象ブラウザからIEが外れましたが、マイクロソフト社は2022年6月16日にInternet Explorerのサポートを終了させることを発表しています。
ブレークポイント「XXL」追加
Bootstrap4で最も大きなブレークポイントはxl(Extra large≥1200px)。
Bootstrap5では、その上にxxl(Extra extra large≥1400px)が登場しています。
これでWebサイトの構成がしやすくなりますね。
以上です。
主要なアップデートはこれ以外にもありますが、今回の記事に関連するのは上記3点です。
【今回、このような方に向けてまとめています】
● 最短で見栄え良くレスポンシブWEBサイトを作成したい方
● 予算を抑え、効率良く、かつ高品質なWEBサイトを作成したい方
● すぐ使えるテンプレートを知りたい方
どのテンプレートがいいの?
などの悩みもでてくるのではないでしょうか?
今回はおすすめの優良なBootstrapテンプレートを集めてご紹介したいと思います。
無料のテンプレートもありますが、有料でも使い勝手の良いテンプレートをピックアップしてみましたのでぜひ参考にしてみてくださいね。
無料テンプレート
ポートフィリオ、レストランやファイナンス、ランディングページ、フォトグラフィやショップ、ペライチサイトなど100以上のレイアウトを含む多目的で強力なテンプレートです。
Bootstrap社の公式サイトで配布しているテンプレートです。
幅の広いグリッドと画像を利用した, プロダクトにフォーカスした商品ページとなっていて、いい感じのサブヘッダーとApple の製品ページをベースにしたテンプレートになっています。
Soft UI Dashboardはオープンソースとして公開されているBootstrap5ベースの管理画面テンプレートです。
名前通り、柔らかい印象のスタイルで長時間見ていても疲れを感じさせないような配慮を感じます。
カスタマイズする、というよりも基本的にこのまま使うような完成されたテンプレートとなっています。
有料テンプレート
コンサルティング、アドバイザ、カウンセラー、監査会社、その他さまざまなサービスを提供する専門組織や企業向けのテンプレートです。
最後に
いかがでしたか?
Webサイトの目的にあったテンプレートを使うことで、サイトをより有効に活用できます。ぜひこの記事を参考にして、最適なテンプレートを見つけてください!