WordPressテンプレート「Western」レビュー1回目

初期設定について

テンプレートのインストールがサーバーのphp.ini設定のファイルサイズ上限を越えるためインストールできません

レンタルサーバーなどでは、こういったことはよく起こります。(レンタルサーバーの場合、php.iniがいじれない事が多々あります)
相手の環境で問題なくインストールできるよう、前もって「こういった事が起こる可能性があるので、この手順で設定を変更してください」と伝えましょう。
(今回はこちらでやってしまったのでいいですが、実際のお客さんだと絶対に分かりません)

画像がインストールできません

インポート時にダウンロードする画像は「オンライン上にある」のが前提でダウンロード出来ますので、オンライン上に用意しておくか、お客さんの環境で設定を変更してもらうよう「手順」を前もって伝えましょう。
インストールの時点でスムーズに出来ないと相手のあなたへの評価がどんどん下がってしまいます。

外観メニューの設定が不明

外観→メニューの設定は何をどうするのでしょうか?
これは「試験」です。技術素人のお客さん相手に納品をしている意識をもってください。

機能レビュー

HOME

メニューリンクの押せる範囲が狭い

メニューリンクや予約ボタンが「文字部分」しかクリックできないため、aタグのpaddingを広げてクリックできる範囲を広げてあげましょう。ユーザビリティが向上します。

ヘッダーの電話番号の箇所をタップすると電話できるようにする

電話がすぐ書けられるように

<a href="tel:12345678901">123-4567-8901</a>

といった記述をしましょう。

ボタンが窮屈

ボタンが細長すぎて不恰好になっています。
もっと上下にpaddingを取りましょう。

リンク先がおかしい?

ヘッダーメニューの「MENU」「DRINK」を押すと「BLOG LIST」ページに遷移してしまいます。
またHOMEのニュースセクションにある「全てのNEWSを見る」リンクがベタ書きです。

「フロア」など各ボタンのリンク先がhtmlになっている

これではテンプレートとして使用できません。必ず納品前に確認しましょう。

FLOOR

アイキャッチ画像がベタ書きされている

これでは、お客さんの環境で表示させることはできませんね。

ACCESS

問題なし

CONCEPT

問題なし

CONTACT

marginやpaddingを使い余白を意識する

仕事では細かい部分が出来なければ小銭しか稼げません。

ソースコードレビュー

HTML

タグの基本的な使い方:問題なし
タグの構造:問題なし
h1、h2、TDKなどSEOを意識したタグの選定:問題なし(TDKはwordpressのため対象外)

CSS

クラス名の付け方:問題なし
保守性を考えたクラス名:問題なし
SASSの理解:対象外

レスポンシブ対応

Bootstrapの理解:問題なし
メディアクエリの理解:対象外

js

jsの基本的な書き方:問題なし
jQueryの基本的な書き方:問題なし
$('.memu__link').on$('.js-toggle-sp-menu').onの中にわざわざ書く必要はありません。同列で書きましょう。

また、css()を使って複数スタイルをつけたい場合は
https://qiita.com/kazTera/items/ab5dd9fb5b2579b25c4d
など参考に

$('要素').css({'プロパティ':'値','プロパティ':'値'});

と1行で複数スタイルが設定できます。
同じメソッドをいくつも実行してしまうと無駄に処理に時間がかかるためjsの処理を高速化させるためにも一回のメソッドで済ませられる方がいいですね。
(今回のようにこれだけ少ないコード量であれば処理時間は関係ないほど微々たるものですが、コード量が多くなり処理が多ければ多いほどこういった部分の書き方が重要になっていきます)

php

phpの基本的な書き方:問題なし
wordpressの構造の理解と書き方:問題なし

デザイン観点

細かな箇所はありますが、全体的によく出来ています。

レビュー総合結果

デザインがなかなか良く出来ていますね。
その他、プログラミング言語の理解と書き方も問題ありません。
ですが、全体的にテストが不十分なのと相手の環境を想定しての「案内」が不足しています。
初心者と稼げるエンジニアとの違いは「不具合の数」「先回りした案内」でもあります。
それだけ「確認」を怠っているか、確認の「見るべきポイント」が備わっていない。ということになります。
最初からいきなり出来るわけではもちろんありませんが、初心者のうちは嫌になるほど「確認」を徹底し、相手の環境を想定して1からWPをインストールして設定するといったテストをしましょう。

次回また再度自分でテストを行なった上で納品してください。
ただし、再度納品するにもお客さんは1から検品しなければならず、お客さんの時間を奪い無駄な時間を使わせている(お客さん側からすると必要以上にお金がかかっているということです)という意識をもつようにしてください。
次回のレビューがこの納品物の最終レビューとなります。

WordPressテンプレート「Western」レビュー2回目

全体的に見てヘッダーメニューなどサイズ感に対して、カテゴリー名やメニュー名が大きすぎるためチグハグ感が出てしまっています。
大きなフォントサイズは「高級感」が出ないので注意しましょう。

カスタム投稿が全て「自動下書き」になっていて、どれがどれだかわからない

自分で使っていて使いづらくありませんでしたか?
そういったところはお客さんも使いづらいため、お客さんに気づいて指摘される前に自分で気づいて改善していきましょう。
メニュー名はカスタムフィールドを使わずに「投稿名」で入力させて表示させた方が一覧での表示でどれがどのメニューだか分かるのでいいですね。

サイトロゴがかなり荒い

今回そこまで重要視していませんが、それでもシャギーがかなり目立っていて「醜い」状態になってしまっています。せっかくの全体のデザインが出来ているため納品時にそこが目立ってしまうとお客さんが受けるイメージが大分下がってしまいます。
起業部でもやったように「商品」を売っている以上、「商品の見た目」は常に意識しましょう。
実際に個人受注をする際にはこういった部分のデザインが自分で出来る必要があります。
PhotoShopを使って最低限のデザインが出来るようにしておきましょう。

FLOORページのSPで余分な余白がある

文字数が少ない時に余分な余白が文字下に出てしまいます。
メディアクエリを使ってエリアのmin-heightを調整しましょう。

レビュー総合結果

ちゃんと指摘の箇所が潰せていますね。
デザインがもう1歩欲しいところですが、そこに関してはあと4,5サイトも作っていくと慣れていくでしょう。
スマホ対応も概ね問題ありません。
WordPressテンプレート作成のスキルは問題なくついています。
お疲れ様でした。

Expand allBack to topGo to bottom