技術・開発

WrapBootstrapでホームページを作成してみた話

WrapBootstrapBootstrapポートフォリオホームページ制作

注記(2021年当時の記事です) この記事で紹介しているホームページはwrapbootstrapのテンプレートを使用して制作したものです。現在のサイトはそのテンプレートとは異なり、Next.jsを用いて一から作り直しています。

はじめに

フリーランスエンジニアとして働いていくためにエージェントを活用するにしろ、自分で営業するにしろ、その人がどんな人なのかわかってもらうことは必須だと思います。

なぜなら、今の世の中は信頼できる人のところに仕事なりお金が集まってくるからです。

そこでホームページという手段があります。

しかし、デザイン初心者のわたしには魅力的なデザインのホームページを1から作成することは時間がかかると思いました…

デザインのことをある程度学びながらホームページを作成していくよりは、まずは見せれるものを作り、それから自分でデザインを作成したホームページを作成しようと思いました。

そのため、デザインテンプレートを使用してホームページを作成することを決意しました!笑

そこからどんなデザインテンプレートがいいのかなと探しているとwrapbootstrapというものを見つけました。

bootstrapテンプレートはいろんな人が使用していて、そのまま使うとテンプレートを使用しているってことがわかるなと思いましたが、このテンプレートサイトはあまり使用されていないように感じたため導入することにしました。

wrapbootstrapとは

bootstrapを用いたデザインテンプレートを販売しているサイトです。

👉 https://wrapbootstrap.com/

wrapbootstrapでの購入の仕方

wrapbootstrapではおよそ4〜20$ぐらい(円にして約400円から2000円ぐらい)でテンプレートを購入することができます。

まずはテンプレートサイトから自分の好きな、または自分のポートフォリオサイトに合いそうなテンプレートを探し出します。

わたしはポートフォリオサイト兼ホームページにしたかったため、次のテンプレートを使うことにしました。

https://wrapbootstrap.com/theme/svjaman-responsive-portfolio-template-WB083840G

購入するテンプレートが決まったらBuy now >>のボタンを押して購入しますが、この時購入したテンプレートを再販等するつもりでなければSingle Licenseで大丈夫です。(ほとんどの人がSingle Licenseでいいと思います。)

詳しくはこちらのライセンスページに書いてあります。(英語のみ)

アカウントを作成し(無料)、テンプレートを購入すればそのテンプレートをダウンロードすることができ、自由にカスタマイズして使うことができるようになります。

自由にカスタマイズ

あとは購入したテンプレートを自分のホームページにあった文言や画像に差し替えていけば自分でデザインを考えなくてもホームページを作成することができます。

そのようにしてわたしが作成したホームページがこちらになります。

https://xtimmune.com/

ほとんど一緒なのは言わないでください(笑)

むしろ一緒でいいと思います。よほどのテンプレートマニアでない限りこれはテンプレートだ!とは思いません。笑

終わりに

いかがだったでしょうか?

デザイン初心者でもそれなりのホームページをテンプレートを使えば作成することは可能です。

ただテンプレートを使用する際の問題点としてはやはりテンプレートなのでカスタマイズできる範囲が限られてくることです。

しかしそれがあったとしてもテンプレートを使用してホームページやポートフォリオサイトを作ることにメリットはあると思います。

今回わたしはテンプレートを使用しましたが今後はデザインのことを学びながら自分でデザインしたホームページを作成していくつもりです。

ぜひ皆さんもデザインを学びながらwrapbootstrapのテンプレートを使用して素敵なホームページやポートフォリオサイトを作ってみてください♪