0→1のテンプレート設計から大規模改修まで、既存コードを壊さず迅速に適応する自走力が強みです。 直近では企業独自CMSの構築にて、デザイナー・エンジニアと密に連携し4テーマを同時完遂しました。 リモート環境でも仕様の行間を読み解き、保守性の高いコードで貴社の制作ラインを支える即戦力として貢献します。
デザインカンプをもとに、0からWebサイトをコーディングする作業が得意です。デザインの忠実な再現はもちろん、後からの修正や追加対応がしやすいコードを書くことを常に意識しています。 実務では、5名のチームに参画してCMSテンプレートを4テーマ×12ページ分コーディングした案件や、自身のポートフォリオサイトを一から設計・実装した経験があります。デザイナーやディレクターとの連携はチャットや打ち合わせをうまく使い分け、手戻りが発生しないように進めることを大切にしています。
既存サイトへの追加・修正・バグ対応など、保守業務全般を安定してこなせます。「触ってはいけない部分」を見極めながら、既存のコードに影響を与えないよう慎重に実装することを心がけています。 観光・宿泊施設サイト30サイト超を9ヶ月にわたり週5日体制で継続保守した経験があります。複数のディレクターから同時並行でタスクを受け取りながら、大量の案件を正確にこなしてきました。確実な納品が評価され、案件完了直後に別件のご相談をいただいたこともあります。
オリジナルテーマの制作・既存テーマのカスタマイズ・プラグインの設定や改修まで、WordPress案件を一通り対応できます。 デザイナーと共同で構築したWebサイト（animo-web-create.com）では、ブログ機能・カスタム投稿タイプ・お問い合わせフォーム・サイドバーなどを実装しました。管理者がコンテンツを編集しやすいよう管理画面のカスタマイズにも対応しており、「納品して終わり」ではなく運用しやすい状態でお渡しすることを大切にしています。
コーディングの段階から内部SEOを意識した実装を行っています。見出しタグの使い方・構造化データの記述・メタ情報の設定・ソーシャルメディア用のOGP設定・モバイルフレンドリーな実装など、一般的な内部SEO対策に対応できます。 CMSテンプレート開発案件やベーカリーのサンプルサイトなど、複数のプロジェクトでSEOを意識したHTMLの設計・実装を経験しています。
キーボードだけで操作できるか・スクリーンリーダーで正しく読み上げられるかを確認しながらコーディングする習慣があります。WCAG 2.1 / 2.2の基準を参照しながら、特定のユーザーだけでなく幅広い方が使いやすいサイトを目指しています。 CMSテンプレート開発案件では、キーボード操作・自動再生コンテンツの制御・画像の代替テキストなどアクセシビリティ施策を包括的に実施。自身のポートフォリオサイトでも同様の取り組みを行っています。「アクセシビリティ対応は品質の底上げにつながる」という考えのもと、コストとバランスを取りながら実践しています。
Figmaのデザインカンプを正確に読み解き、コードに落とし込む作業に慣れています。スペック・余白・フォントサイズなどの数値を拾うのはもちろん、「このデザインの意図は何か」を考えながら実装することで、細部の再現精度を高めています。 CMSテンプレート開発案件ではデザイナーとFigma上でやりとりしながら実装を進め、コメント機能を活用した仕様確認で手戻りを防いできました。また、ベーカリーのサンプルサイトでは自らFigmaでデザインを作成した経験もあり、デザイナーの目線も理解しています。
楽天トラベルのプラットフォームを通じた宿泊・観光施設サイトのコーディング・保守を、9ヶ月以上の長期業務委託として担当してきました。 セクション/UI単位の新規作成・バナーの差し替え・コンテンツの追加・バグ改善など、高頻度の更新対応を安定してこなしてきました。プラットフォーム独自の仕様・制約を理解した上で実装しており、通常のHTMLサイトとは異なる環境でのノウハウが豊富にあります。
B-CartプラットフォームのECサイト（株式会社ナゴミヤ様）にて、コンテンツの修正・新規追加・機能改修・ページリニューアルまで幅広く担当しました。 既存システムへの影響を考慮して「テスト環境→確認→本番環境」の流れを徹底するなど、安全に改修を進める進め方を習慣にしています。
Webサイトのコーディングで最も土台となる言語であり、日々の業務で最も使用頻度が高いスキルです。見出し・段落・リスト・テーブルなどの要素を意味に沿って正しく使うことで、SEOや検索エンジンへの伝わりやすさを高めることができます。 「divで全部囲む」ではなく、文書の構造を意識したマークアップを心がけており、コードの読みやすさや後からの修正のしやすさにもつながっています。実務案件・自主制作ともに、HTMLの品質をしっかり担保してきた自信があります。
デザインカンプの再現から、レスポンシブ対応・アニメーション・複雑なレイアウトまで、CSSで幅広く対応できます。Sassを使ったファイル分割・変数・Mixinの活用など、保守しやすいスタイル設計も得意としています。 BEMやFLOCSSといった命名設計にも対応しており、プロジェクトのルールや規模に合わせて柔軟に書き方を変えられます。CMSテンプレート開発案件では4つのデザインテーマを共通のコードベースで管理する設計を担当し、スタイルの整理・管理能力を実務で磨きました。
Webサイトに動きをつける実装が得意です。スクロール連動のアニメーション・モーダルの開閉・スライダー・タブ切り替え・フォームのバリデーションなど、Webサイト制作で頻出する動きはひと通り対応できます。 CMSテンプレート開発案件では多階層アコーディオンメニュー・スクロール追従型ナビゲーション・Swiperを用いた多様なスライダーなど複雑なUIを実装。個人制作ではブラウザゲームをJavaScriptだけで作るなど、ライブラリを使わない実装力も培っています。jQueryが使われている既存サイトへの追記・改修にも対応できます。
WordPressのテーマ開発で必要なPHPを実務で使ってきました。記事データの取得・出力・カスタム投稿タイプの設定・テンプレートファイルの分割など、WordPressの仕組みに沿った実装を独力でこなせます。 PHP単体でのバックエンド開発は専門外ですが、WordPressを使ったサイト制作の文脈では設計から実装まで問題なく対応できます。
ブラウザ上でグラフィックを描画するCanvas APIを、個人制作のゲーム開発で活用しています。 テナガザルが主人公のブラウザゲーム（SARUGAME）では、プレイヤーの動き・当たり判定・画面遷移などをCanvasで実装しました。Webサイト制作で使う場面は多くありませんが、インタラクティブなコンテンツ制作などのご要望にも対応できます。
ユーティリティクラスを組み合わせてスタイリングするCSSフレームワークです。通常のCSSと比べてコーディングスピードが上がりやすく、チームでの記法の統一にも役立ちます。 自身のポートフォリオサイト（v4系）やCMSテンプレート開発案件（v3系）で採用しました。特に後者では、引き継ぎ先のエンジニアが扱いやすいよう、TailwindのユーティリティとカスタムCSSの使い分けを意識して実装しています。
既存サイトへの追記・機能追加など、jQueryが使われている環境での作業に対応できます。 宿泊・観光施設サイトの長期保守案件を中心に、jQueryベースのコードを読み解きながら修正・追加を行ってきました。新しい開発で積極的に選ぶ機会は減っていますが、多くの既存サイトで使われているため、「読んで・書いて・影響範囲を把握できる」スキルは実務で重宝しています。
JavaScriptに型を加えることでコードのミスを早期に発見しやすくする言語です。自身のポートフォリオサイトや個人開発のアプリケーションで採用し、実務レベルで扱えます。
Reactをベースにしたフレームワークで、自身のポートフォリオサイトで採用しました。ページの表示速度やSEOの最適化が行いやすく、お問い合わせフォームのサーバー側の処理なども一つの環境でまとめて対応できます。 Web制作の現場での採用はまだ限定的ですが、制作会社のモダンな開発環境や大規模サイトへの対応が必要な際にも活用できるスキルです。
コンポーネントを組み合わせてUIを構築するJavaScriptライブラリです。自身のポートフォリオサイト（Next.js）のほか、個人開発のメモアプリ・作業時間管理アプリ（Google拡張機能）でも採用し、実際に動くものを複数作ってきました。 Web制作の現場でReactが使われる機会はまだ多くないですが、対応できるスキルとして持っています。
CSSだけでは難しい複雑なアニメーションをJavaScriptで実装するためのライブラリです。テキストのアニメーション・スクロール連動の動き・要素のフェードイン演出など、サイトに動きのリッチさを加えたい場面で活用しています。 自身のポートフォリオサイトとベーカリーのサンプルサイトで採用。「動きは見る人の邪魔をしない程度に」という考えのもと、アニメーションの量や速度を丁寧に調整しながら実装しています。
スライダーやカルーセルUIを実装するためのライブラリです。横スライド・縦スクロール・複数枚表示・自動再生・中央強調など、さまざまなパターンを実務で実装した経験があります。 CMSテンプレート開発案件では4テーマそれぞれに異なるスライダーデザインを実装しており、オプション設定・レスポンシブ対応・カスタムスタイルの組み合わせに慣れています。
フロントエンド開発の環境を手軽に整えられるビルドツールです。立ち上げが速く、ファイルを保存するたびにブラウザに即時反映されるため、コーディングのテンポが上がります。 個人開発のChrome拡張機能（React + TypeScript構成）でも採用しており、プロジェクトに合わせた設定ができます。
ビルドツール・タスクランナーの仕組みを理解するために、学習時期に講座や個人プロジェクトで触れました。 現在は主にViteやNext.jsを使うことが多くなっていますが、既存のプロジェクトがWebpack・Gulp構成であっても、設定ファイルを読み解いて対応することができます。
コードのバージョン管理ツールとして、個人で使用しています。ブランチを切って安全に作業する・変更履歴を辿るなど、日常的な操作はひと通りこなせます。
npmによるパッケージ管理やビルドツールの実行など、フロントエンド開発環境の整備で日常的に使用しています。 バックエンド開発での深い経験はありませんが、開発に必要な範囲での扱いには慣れています。
Gemini・ChatGPT・Claudeなどを業務で活用しています。コードのたたき台生成・エラー原因の調査・ドキュメントの整理など、作業の効率化に役立てています。 AIの出力をそのまま使うのではなく、内容を自分で理解・確認した上で採用するようにしています。便利なツールですが過信しすぎず、使いどころを見極めて活用することを意識しています。
メインのコードエディタとして日常的に使用しており、自分なりの作業効率化の設定を積み重ねてきました。 プロジェクトごとにフォーマット設定をファイルで管理し、チームメンバーと共有することでコードの書き方を揃える運用も実践しています。Emmetを使った高速なHTML入力・マルチカーソルでの一括編集など、エディタの機能を活かして作業時間を短縮することを意識しています。
フルリモートでの業務が中心のため、チャットでのコミュニケーションに慣れています。「相手を不安にさせない」「作業の進捗を適切に共有する」ことを意識したやりとりを心がけています。 CMSテンプレート開発案件（Slack）では5名のチームで、定例打ち合わせ・個別相談・チャットなど状況に応じた連絡手段を使い分けながら進めました。宿泊施設サイトの長期保守案件（Chatwork）では複数のディレクターと同時並行でやりとりしながら、大量のタスクを管理してきました。
FTPによるファイル転送ツールとして、宿泊・観光施設サイトの長期保守案件でほぼ毎日使用していました。 9ヶ月のプロジェクト期間中に100か所以上のWebサーバーにファイルを転送・差し替えしてきました。サーバーへのファイルアップロード・既存ファイルとの差し替え・バックアップの管理など、FTPを使った作業を安全かつ確実にこなせます。
ノーコードツールのStudioでデモサイトのトップページを制作した経験があり、基本的な操作は一通り把握しています。 コーダーとして普段からコードを扱っているため、ノーコードツールで意図した表示が再現できないときにも、仕組みを理解した上で原因を切り分けやすいことが強みです。
コーディングスキルの背景にある仕組み・成り立ちの理解を大切にしています。 ブラウザがHTMLをどう処理するか・表示速度に影響する要因は何か・Webデザインの基本的な考え方（タイポグラフィ・余白・配色）など、実装に直結する知識を意識的に積み上げています。こうした理解があることで、デザインカンプを見たときに「なぜこのデザインか」を読み取り、より正確に実装できると感じています。
専門はWeb制作のコーディングですが、バックエンド・インフラ・セキュリティなど周辺領域への関心から、プライベートで継続的に学んでいます。 HTTPの仕組み・サーバーの役割・セキュリティの基本的な考え方など、Webを構成する要素をある程度把握していることで、フロントとバックエンドをまたぐような問題の原因を切り分けやすくなっています。趣味に近い感覚で楽しみながら続けている学習領域です。