見出し画像

155日目 サイト完了チェック

WEBデザイン日記155日目です!
本日はチーム制作サイトの最終報告が近いのでちゃんと動くのかチェックを行いました。画像がちゃんと表示されているかなど地道な作業ではありますがとても大切なので丁寧に行いました。

①リンク確認

サイトにはたくさんのリンクが存在しています。
複数ページがあるサイトとなるとなおさら多くのリンクがあります。
コードでリンクを書くと飛ばす先が同じでも、コードが違うことが多々あります。コードが違うということはたとえリンク先が同じでも機能しない可能性があります。

②画像のリンク切れ

画像が正しく表示されているかの確認です。
画像はパスと呼ばれる、保管場所への道筋をしっかり記載しなければ表示されません。画像の名前も同じで、全く同じ名前をコードに書かないと表示されないため、前頁しっかりと確認を行いました。

③動きのある部分の動作チェック

サイトでよく見る三本線のメニューがあり、クリックするとメニューが開きます。そのような動きのある部分もしっかり確認を行います。
三本線メニューであれば、実装しているページ全てでリンクも含めチェックする必要があります。また、ホバーしたときに画像が拡大されたり、色が変わったりする部分も併せてチェックを行います。

④崩れは無いか

ウィンドウに対してサイトが表示されています。
ウィンドウをだんだんと縮めていき、サイトの要素が崩れないことを確認します。ウィンドウが全画面であればほぼ問題はありませんが、だんだんと小さくしていくとボタンが見切れたり、画像がはみ出したり、意図しないデザインの崩れが起きてしまいます。
サイト制作者としてはこの崩れが無いようにするのがとても大切で、いかにしてきれいにサイトデザインを保てるかが腕の見せ所です!

⑤報告

ここまで色々と確認をしてきましたが、今回はチームでの制作となるので見つけただけでは何もなりません。しっかりと報告し、どこがどのように悪かったのかを担当者に報告し修正依頼をかけます。
作業環境によって表示トラブルも考慮し、自分の環境では○○が崩れていたが担当者の環境でもチェックし、崩れの有無を見てもらうということが大切です。

あとがき


なかなか制作のなかでも地味な部分になります。
しかし、いったん完成してしまうと見返すということをおろそかにしてしまいがちなので、時間が許す限り丁寧にチェックしてみました。

リンク切れ、画像切れ、その他、色々と発見することができ、最終報告前に見つけられてよかったなと思い、思っただけでは何もなりませんので修正を行いました。

特に見落としがちだなと感じたのがリンク先指定。
ほとんどはちゃんと機能するリンクですが、ところどころエラーが出たり、意図しない場所に飛んだりと、確認してよかったなと感じました。

こんな感じで今日はここまでです。
時間があれば個人製作をこれから行います!
明日は最終発表前の確認と発表内容調整です。
無事に発表が終わったらいいなと思います。

この枠を自己紹介として使用します! WEBデザインの勉強を2021年12月から始めました! クリエイターズファクトリーというスクールに参加しています(オンライン30期生です)。 自分でHPや記事の装飾、ロゴ等を手掛けたいという思いから始めました。 どうぞよろしくお願い致します!