教育機関の学費収納用ページのUI部分をBootstrapでコーディングました

1

0

ヤマザキタカヒロ アクセシビリティ強化中

某教育機関の学費収納用ページのUI部分をBootstrapでコーディングしました。
*クライアントの事情によりURL、スクリーンショット等の掲載NGとなっております。

全9ページ。

デザインカンプあり。

主にBootstrapのフォームテンプレートパーツをカスタマイズしていくコーディングがメインでした。

顧客データの呼び出し、表示、ログイン機能等に関する部分は担当しておりません。

テキスト入力フォームは各項目ごとに、独自のバリデーションを実装しております。

実装後のループ処理を考慮して、お知らせ項目などをコーディングしています。

必要な部分以外は基本Bootstrapでコーディング。

先方にはかなり高評価をいただきました。

クライアントとのやりとりはチャットのみで完了できております。

カテゴリー
HTML・CSSコーディング
業種
大学・学校
制作期間

7日

参考価格

80,000 円

最終更新日

2023年9月17日

制作者

ヤマザキタカヒロ アクセシビリティ強化中
ヤマザキタカヒロ アクセシビリティ強化中 (boz_create)

Webアクセシビリティ対応強化中。一人でも多くの方に利用していだだけるサイトを一緒につくりませんか?

プロフィールをご覧頂きありがとうございます。
フリーランスwebコーダーのヤマザキタカヒロと申します。

【できること】
・デザインカンプを基に、HTML、CSS、JavaScriptを利用したHP、LP等のコーディング、修正など。
・デザインカンプを基にしたWordPressのオリジナルテーマ作成、及びWordPressサイト構築。

ウェブアクセシビリティ対応強化中です。
現在国内で400万人以上がウェブアクセシビリティの確保によって恩恵を受けるとされていますが、ウェブアクセシビリティの確保は障がいのある方々の役に立つだけでなく、健常者のユーザビリティ向上にも繋がります。また、利用者が利益を受けるだけでなく、運営者としても隠れた需要にリーチできるチャンスにも繋がります。

しかしながらJIS X 8341-3に基づいたウェブアクセシビリティの規格への適合度合い「準拠」「一部準拠」「配慮」を表記する為には設計段階からの施策が重要であることや、適合度合いによっては試験の実施とその結果の公表など工数とコストの問題も避けられません。

そこで「まずは現状のデザイン、または必要最低限のデザイン変更で出来るだけアクセシブルにしておきませんか?」というのが私からのご提案です。

私にコーディングをお任せいただければ、コーディングで対応できる範囲でアクセシブルにいたします。具体的には以下の通りです。
1.キーボートのみで操作できるようにいたします。
2.スクリーンリーダー使用時でも大きな支障なく操作できるようにいたします。
3.ブラウザの表示拡大200%まで表示崩れのない様にいたします。
*一部ツールチップなど実装が難しいものもございます。

その他 ユーザビリティ向上の為、Google ChromeのLighthouseを使用してコアウェブバイタルの指標をチェックしつつ、以下の施策をご提供いたします。
・画像ファイルは基本的にwebpを使用
・imgタグの適切な設定
・日本語フォントのサブセット化とセルフホスティング
・ファーストビューの背景画像のpreload等
・vanillaJSで記述
・JavaScript CSSファイルの圧縮(非圧縮ファイルも付属)
いずれもご要望に添います。
どうぞお気軽にご相談ください。

稼働時間
午前9:00〜午後4:00
土日稼働可

このポートフォリオを通報する