はじめに
駆け出しエンジニアの皆さんこんにちは。ひさじゅです。最近の未経験からのエンジニア転職では、実務経験の代わりに学習した成果を提示する方法として「ポートフォリオ」と呼ばれる個人サービスを職務経歴書などに記載する方法が一般的となってきました。私も採用する側としてそういったポートフォリオを見る機会が多いのですが、URLを開くと「会員登録」「メールアドレスとパスワードを登録してください」「ログインしてください」といった、いきなり個人情報を要求するサイトがいっぱいあります。ここで私はいつも以下のように感じています。
個人情報を簡単に手に入れられると思うな！！
そこで今回は、個人情報を預けてもらうための準備であったり、ポートフォリオの素人臭さを簡単に消す方法を書いていきたいと思います。
独自ドメイン・SSL
まずそもそもURLが http://xxx.xxx.xxx.xxx とIPアドレス直であったり、https://xxxxxxx.herokuapp.com とherokuのアドレスであったり、http://xxxxxxx.com とhttpsでなかったりすると怖くて個人情報は預けられません。ここは必ず独自ドメインかつSSL対応（https）で設定しましょう。herokuでも独自ドメインやSSLは課金すれば簡単に出来ますし、AWSでもAWS Certificate Manager を使えば設定は比較的簡単に出来ます。
Metaタグ
こちらはユーザが使い始める手前の入口の設定です。お店でも看板がなかったら怪しくて入りづらいし、気づかなかったりしますよね。それと同じでユーザを引き入れていく為の看板というイメージで設定していきましょう。またRailsの場合、meta-tags というgemを使うと簡単にかつページごとの設定がやりやすくなります。
title、description
googleでの検索結果に出るあれです。
検索結果に何も出てこなかったらつらいですよね。titleにはサイト名と何が出来るかが分かる程度の文言を全角31文字以内、descriptionではそのサービスで何が出来るかの詳細を全角120文字以内で記載しましょう。
OGP
ツイッターやFacebookなど、ソーシャルでシェアした時に表示されるtitle、description、画像です。Twitterの場合Twitter Cardと呼ばれる形式で大きさの指定も出来るので追加で設定してください（個人的にはsummary_large_imageがいいと思ってます）またこちらのシェアされる画像は各SNSでキャッシュされるので、クリアしたい場合や実際の表示を確認する際に以下をご利用ください。
- Facebook シェアデバッガー
- Twitter Card validator
運営元・お問い合わせ
お問い合わせフォームをわざわざ作る必要はありませんが、運営元やお問い合わせ先（メールでもソーシャルアカウントでも可）は明示しておきましょう。皆さんが実際使うサービスでもどこがやってるか分からないサービスだったら怖くて使えないですよね。
利用規約・プライバシーポリシー
利用規約とプライバシーポリシーは必ずページを作っておきましょう。個人情報の取扱いが分からないと怖くて会員登録は出来ません。会員登録のページにもリンクを載せておき、「利用規約に同意して会員登録」というボタンにするか、利用規約に同意のチェックボックスを用意して確認を取ってから会員登録を促しましょう。Webサイトの利用規約サイトを参考に作ってみてください。
最低限のSEO
最低限のSEO設定をしておかないと、サイト名でググっても検索結果に出てこなかったりします。友達に「〇〇でググってみて」と口頭で伝えても探せるくらいにしておけば信用力も上がりますよね。
Google Search Console
Google Seach Console は検索結果に掲載してもらう申請を行ったり検索結果を改善する為のサービスです。こちらに自分のサイトを登録しましょう。
robots.txtとサイトマップ
GoogleSearchConsoleを設定する際にrobots.txtとサイトマップが要求されます。robots.txtはどこまでを検索結果に載せるのかを明示するファイルでサイトマップは検索結果に掲載してほしいページを全て載せるものです。これの作り方はググってもらえればと思いますが、Railsだとsitemap_generator を使うことで簡単にサイトマップを作成することが出来ます。
Google Analytics
PV数、UU数は職務経歴書に書いておくと実際に使われているサービスという認識が出来るので、割と反応がよかったりします。つまりアクセス数などは必ず知っておかないといけない数字となります。ですので、正式リリース前には必ず Google Analytics は設定しておきましょう。ちなみに他のタグを入れることもあるかなと思っている方はGoogle Tag Manager 経由でGoogle Analyticsを導入してみてください。
トップページ
トップページのUIが汚いとそもそも見る気がなくなってしまいます。またよくあるところだと、いかにもbootstrapで作りましたとなっているサイトも多く、割と嫌がられます。今回はこちらについては詳しく書きませんが「bootstrap臭」で検索するとbootstrapの臭いを消すことが出来るので、調べてみてください。
UX
最後にUXです。まずサービスの体験を得られるまでのステップを3ステップに収めるようにしてください。またここまでは会員登録への導線を入れないでください。体験が完了し、このサービスをまた使いたい、今のデータを保存して次に使いまわしたいと思わせ、ここでようやく会員登録へ促していく方法を取ります。これくらいやらないと通常のユーザさんは個人情報を預けてはくれません。
最後に
以上のことはちょっと面倒ですが技術的には難しくないものばかりです。ちょっとした手間をかけることでユーザさんが使ってくれる、触ってみてくれるサイトに大変身するので、手間を惜しまずやってみてください。
