簡単なのにかっこいい！ポートフォリオサイトが作成できる、HTMLベースのテンプレート -Dev Portfolio Template

Post on:2017年3月23日

sponsors

自分の職歴や関わったプロジェクト、スキルなどをプレゼンするポートフォリオを0から作ろうとすると面倒かもしれません。ポートフォリオに必要なコンテンツをコンポーネント化し、追加や削除も簡単に行えるHTMLベースのテンプレートを紹介します。

Dev Portfolio Templateの特徴

デザインは縦長ページで、ポートフォリオとしてうるさくない程度の気持ちいいインタラクションが備えられています。

テンプレートにはポートフォリオに必要なさまざまなコンテンツが用意されており、モジュール式なので簡単に移動・削除が行えます。

大きなヘッダ画像、ナビゲーションとアクションボタンのシンプルな構成です。スクロールを促すアイコンは、細かい演出ですね。

自己紹介のコンポーネントは、テキストベースのシンプルなデザインです。

職歴のコンポーネントは年表のデザインで、スマホで表示するとレイアウトが変更されます。

学歴のコンポーネントは職歴とはデザインが異なり、非常にシンプルです。

プロジェクトのコンポーネントはカード状のデザインです。テキストが中央揃えになっているので、左寄せにした方が読みやすいかもしれません。

SkillsとContact

スキルはタグを使ったデザインで、シンプルなコンタクトフォームも用意されています。