01
税理士事務所デモサイト
DesignCodingWordPressAccessibility
企画・構成・デザインからコーディング、WordPress実装まで行った自主制作サイトです。制作工程ではAIツールも活用しています。公開後はWebアクセシビリティの観点から再検証し、セマンティックなHTML、見出し構造、キーボード操作、フォーカス表示などを見直して改修しました。
Live Site
Works
制作実績
2016年からこれまで、観光・運輸・伝統工芸・小売など幅広い業種のWebサイトを制作してきました。その一部を掲載しています。いずれの案件でもHTML / CSS / JavaScriptによるコーディングとWordPress実装を担当しています。担当範囲は案件ごとに異なり、デザインカンプの支給を受けて実装のみを担当したもの、構成・要件整理やデザインから関わったもの、他の担当者と分業で進めたものがあります。業種や体制が変わっても、同じ品質で安定して仕上げることを心がけています。
なお、クライアント案件については、社名・URLを伏せて掲載しています。
Skills
できること
HTML / CSS / JavaScriptによるコーディングを軸に、WordPress実装まで含めて多くのWebサイトを制作してきました。実装にあたっては、プラグインを使うか自分で書くかを、実装の手間ではなく「公開後に長く運用していけるか」で判断しています。軽量で設定も簡潔、引き継ぐ人もメンテしやすいプラグインは積極的に採用します。一方、表示が重くなる場合や要件に対して過剰になる場合は、JavaScriptやPHPで必要な範囲のみを実装するよう心がけています。
01
フロントエンド実装
HTML / CSS / JavaScriptによるコーディングを主軸としています。デザインカンプの忠実な実装から、要件整理・ワイヤーフレーム作成を含めた制作まで、案件の体制に応じてどの工程からでも対応しています。レスポンシブ対応・クロスブラウザ対応は標準とし、CSSはSCSSで記述しています。CSSフレームワークに頼らずにHTML / CSSを直接書いて組み上げるのが基本で、BootstrapやElementorが前提の案件ではその仕様に合わせて実装します。クラス名は規則を統一して命名し、BEMなど案件で指定された規約がある場合はそれに合わせます。ソースのバージョン管理はGitで行っています。
02
アクセシビリティへの配慮
画像の代替テキスト、見出しレベルによる文書構造、文字と背景のコントラストは、制作時に必ず確認しています。見た目の大きさのためだけに見出しの順序を崩さないこと、装飾目的の要素は読み上げの対象から外すことを基本とし、このサイトでも装飾用SVGの読み上げ除外や、アニメーションを控える設定を選んでいる環境で動きを止める対応を入れています。
03
動きの実装
スライダー・タブ・スクロールアニメーションなどの動きを実装しています。jQueryをはじめとするライブラリを使うほか、既製のプラグインが重い場合や要件に合わない場合は、JavaScriptで必要な範囲だけを実装し、軽量に仕上げています。
04
WordPress実装
コーディングしたHTMLから組み上げるオリジナルテーマ実装を行っています（クラシックテーマ中心）。カスタム投稿タイプやACFを使った入力項目の設計、絞り込み検索や会員限定ページなどを要件に応じて実装します。プラグインで対応できない部分は、必要に応じてPHPで実装します。
05
表示確認・改修・保守
公開前は各デバイス・各ブラウザでの表示確認と動作検証を行っています。公開後も、一部の案件では更新やプラグインの管理、不正ログイン・不審なアカウントのチェック、既存サイトの改修を継続して担当してきました。他の担当者との分業で進める体制にも対応しています。
About
わたしについて
2016年から、業種も規模もさまざまなWebサイトを作ってきました。HTML / CSS / JavaScriptによるコーディングとWordPress実装が主な仕事で、案件の体制に応じて、デザインや構成・要件整理、クライアントとの調整、公開後の保守にも対応しています。
仕事で大切にしているのは、まず求められた要件をきちんと満たすことです。そのうえで、クライアントがそのサイトをどのように使いたいか、公開後どのように運用されていくのかを考えて作ります。大事なのは、自分の手が離れた後のことです。運用する人が困らないよう、できるだけ表示を軽く保ち、長く使い続けられる形を選びます。
あわせて意識しているのが、運用や管理を担当する人が引き継ぐことです。自分以外の人がコードを見て、無理なく手を入れられるように、読みやすさを心がけて一つずつ組み上げています。
今後は、これまで積み重ねてきたコーディングと実装の経験を活かし、フロントエンド実装を中心としたWeb制作に携わっていきたいと考えています。