ポートフォリオサイトを制作しました。

Date : 2019. 02. 11.

ポートフォリオサイトを制作しました。

はじめまして。

Web制作を生業としているYoheiといいます。

この度、綴 -つづり- というポートフォリオサイト(簡単な自己紹介をしているサイト)・ブログを制作いたしました。

初回の投稿は、自己紹介も兼ね、このサイトを制作した理由と制作過程について書きました。

自己紹介

  • 90年生まれ、趣味は音楽鑑賞・楽器演奏・写真撮影・サッカー観戦
  • 大学卒業後、都内のWeb制作会社にてコーダーとして勤務、大手サイトの運用や改修・リニューアル・新規制作等で主にフロント側を担当し、二年半年程勤務、後に退職
  • 2018年はフリーでディレクション・デザイン・コーディング・組込み・写真撮影等をこなしていたが、メイン案件のリリース完了と同時に、再度就職希望のため転職活動中
  • 上記案件により、CVR前月比5倍を達成
  • 今後は、制作だけでなくより数字に拘っていける・数字に責任を持つ職務に就きたい
  • ABOUTページRESUMEもよろしければ御覧ください

 

制作理由

  • Web制作を生業として3年〜4年ほど経っており、自分が何をできるか、簡単に自己紹介をできるサイトが欲しかった
  • 転職活動に必要不可欠
  • 自分の思ったことや感じたことを、考えて・纏めて・推敲し・発信する力を養いたい
  • 本を読んだ際にブックレビューを書いていきたい
  • 日常生活で目標を設定した際、目標へ到達するためのプロセスを発信したい
  • WordPress、WYSIWYGで対応しているショートカット(主にMarkdown形式)を参考に記事を書いていきたい
  • 自分のライティング力・語彙力を向上させたい

 

綴 -つづり- の由来

  • 単純に、Web上で公表できる撮影写真や文章、Web制作物等についてオンライン上に残していきたい=綴る?ということ?笑
  • 自分のためでもあるが、何かを残していくことで誰かの役に立ちたい意味のあるものにしていきたい

 

ロゴについて

  • 英名表記にした場合、suzuriという類似名サイトも実在しているため、検索時に差別化されにくそう
  • 日本語なので「綴」がしっくりきたが、読みづらいため、ひらがな表記も追記した
  • ロゴについては、Aiでラフをいくつか描き、現在のものが一番しっくりきたため決定した

 

使った技術・サイト制作の工程

  • Gulp、SCSS、jQuery、Wordpressを駆使して構築し、さくらのレンタルサーバを使用
  • githubでファイル管理
  • Aiでロゴデザインの決定、カンプ等にとくにデザインはおこさず、コーディングからデザイン、一部画像処理でのみAi・Psを利用
  • ロゴ制作からサイトリリースまでは約2ヶ月程
  • 最新Mac OS XのSafari、Google Chrome、Firefoxでのみ動作確認済、IE11非対応

 

苦労した点

  • デザインに関しては、Blogページにて、サムネイルをどう埋め込むか・サイトのトンマナやルールを崩壊させないためにはどうすればいいかとという点で悩んだが、noteやLIGを参考にし、完成させた。当初は全体のフォントに明朝体を用いたが、いざ、Blog等の長文の文章の場合は、デバイスフォント・ゴシック体が読みやすいと感じたため、左記フォントを最終的には使用した
  • 遷移時のモーションが煩わしい可能性もあるが、実装するまでにはaタグクリック判定の処理やコールバックの多用等、ところどころ苦労した
  • ACFやMWWP Form等の世間的には安全と思われているプラグイン以外は極力自作・流用した(このページの目次部分やパンくず等)

 

・・・

 

今回は簡単ではありますが、自己紹介とこのサイトの制作理由について書きました。

自分のサイトを持つと、城を持った気分になり(笑)、自分がWeb製作者であると同時に、ようやくWebの世界で何かできる、という気持ちになります。

正直に言えば、ツッコミどころも多々ありますし、個人的な理由でひとまず必要だったため、制作したいから制作したというのが主な理由です。ただ、Webに携わる者としては、ようやくスタートラインに立てたかな?という気持ちでこのサイトを運営していけそうです。

WordPressやjQueryに頼りっきりである私ですが、今後も様々な方面においてスキルアップを測りたいため、このサイトを更新していきたいと考えています。

どうぞ、よろしくお願いいたします。

このポストをShare!

BACK