おはよう。
今日はポートフォリオサイトが完成したので自慢しようと思う。
もくじ
完成品
あのハラカズヤが作ったとは思えないほどお洒落なサイトであることに貴方は驚くことになるだろう！！！
URLだよ。はい。
https://kazuya002ex.github.io/displosia
このポートフォリオサイトを作った理由
このポートフォリオサイトはこれからWeb制作会社に営業する際に公開するものである。
これがパートナー契約をさせてもらうことに良いように働いてくれると良いが、
それは営業したWeb制作会社が良いと思ってくれるか次第なので私は何とも言えない。
とりあえず「人事を尽くして天命を待つ作戦」でいくしかないだろう。（要するにWeb制作の営業は運の要素も必要だろうということだ！）
技術面で気をつけたこと
技術的には以下のことを気をつけて制作をおこなった。
flexboxの様々な技法を使用
まずはホームページである「index.html」
このページは、Menuの部分でFlexboxを使用している。
具体的にこの部分で使用したFlexboxは以下のコード。
.menus ul {
display: flex;
justify-content: center;
}
4つのリンクを中央寄せで横並びにするようにしている。
続いて、スキルの紹介ページ。
ここでは、２カラムずつ２列で並べるように指定している。
具体的にこの部分で使用したFlexboxは以下のコード。
------------------------------------------------
親要素
.langs {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
width: 100%;
}
子要素
.langs .column {
width: 50%;
}
------------------------------------------------
このようにすることで「width:50%」で画面に収まるのであれば折り返しで表示される。
そのほかは大体中央寄せのものが多いが、このようにしてFlexboxのさまさまな技法を使うように意識した。
色は統一させてシンプルに見やすく
ヘッダーとフッターの色は統一してグレーにした。
カラーコードで言うと「#999999」
そして、実はホームページとラストのContactページにも共通点を作った。
ホームページ↓
Contactページ↓
おわかりいただけただろうか。
このサイトでは、オレンジのグラデーションを採用しており、なんだか夕暮れや朝焼けを感じさせるようなデザインになっている。
本来の目的はWeb制作なのにも関わらず変にデザインにもこだわってしまったが、おかげで驚くほどお洒落なポートフォリオサイトになった。
暇な方はぜひ１度見ていただきたい。
https://kazuya002ex.github.io/displosia/
外部リンクに飛ばす際は「rel="noopener"」
これは昨日、当ブログで紹介した内容である。
しっかりとこのサイトにもその学びは活かされているのだ！(笑)
終わりに
これを持って私のWeb制作スキル作成、及びポートフォリオ作成は終了となった。
結局、あれこれしているうちに「Web制作で稼ぐ宣言」してから１ヶ月が経ってしまった。
しかし、これで次はWeb制作会社に営業をしてみるだけだ。
ある意味ここからが本番であり、初の試みだ。
この後の営業がうまく通れば後に私のポートフォリオサイトは伝説となるだろう。（多分）
それでは今後もWeb制作の方面で良い成果を上げられるように須く作業を重ねていく。
今後もWeb制作において何かしらの変化や成果があった際は当ブログで更新していくので、読んでいただけると幸いだ。
このように私のブログでは、エンジニアに関する技術のことや精神面のことなどをメインにブログを毎日更新している。
Twitterで更新された記事を毎日チェックできるのでこちらもフォローしていただけると幸いだ。
今日の記事はここで終わりとする。
ここまで読んでくれてありがとう！
また明日お会いしよう！
おすすめ記事
