ウェブアクセシビリティ適合レベル「A」「AA」を達成するために！役立つツールをご紹介
こんにちは、webエンジニアのゾノ( @ozonosho )です。 今回の記事ではウェブアクセシビリティへの対応に役立つツールをご紹介いたします。 ウェブアクセシビリティ対応とは、年齢や利用環境の違い、障害の有無などにかかわらずすべての人にとって使いやすいサイトを目指すための対応です。 例を挙げると、下記のような対応が必要になります。 ウェブアクセシビリティ対応例...
View Articleエラー通知を支援技術 (AT) に通知する方法【ValidationEngine例】｜ウェブアクセシビリティ対応
こんにちは、webエンジニアのゾノ( @ozonosho )です。 今回は記事ではウェブアクセシビリティ対応の１つ「エラー通知を支援技術 (AT) に通知する」方法をご紹介いたします。 フォームで入力エラー（例：必須項目の入力が漏れている）が発生した際、フォームを送信させず動的にエラーを表示してあげる挙動のサイトは多いと思います。 しかしながら、AT （スクリーンリーダーなど）...
View Articleスライダーで非表示中のスライドにフォーカスを当てない方法【Swiper.js】｜ウェブアクセシビリティ対応
こんにちは、webエンジニアのゾノ( @ozonosho )です。 今回は記事では人気のスライダープラグイン「Swiper.js」で非表示中のスライドにフォーカスを当てない方法をご紹介いたします。 キーボード操作でサイトを閲覧する方はタブキーを利用してコンテンツを読み進めていくため、サイト制作者は各コンテンツのtabindexを適切に制御する必要があります。...
View Articleモーダル表示時にフォーカスをモーダル内で循環させる方法｜ウェブアクセシビリティ対応
こんにちは、webエンジニアのゾノ( @ozonosho )です。 今回は記事ではモーダル表示時にフォーカスをモーダル内で循環させる方法をご紹介いたします。 キーボード操作でサイトを閲覧する方はタブキーを利用してコンテンツを読み進めていくため、サイト制作者は各要素のtabindexを適切に制御する必要があります。...
View Articleセッション有効期限を非同期に延長させる方法【WordPress】｜ウェブアクセシビリティ対応
こんにちは、webエンジニアのゾノ( @ozonosho )です。 今回は記事ではWordPressでセッション有効期限を非同期に延長させる方法をご紹介いたします。 セキュリティの都合上、一般的なwebサイトはセッションの有効期限（例：ログイン状態のまま放置した際にどれぐらいの間ログイン状態を保持するか）を設定します。...
View Articleプレースホルダーの使い方について｜ウェブアクセシビリティ対応
こんにちは、webエンジニアのゾノ( @ozonosho )です。 今回はウェブアクセシビリティにおけるプレースホルダーの使い方について僕が指摘されたポイントをご紹介いたします。 プレースホルダーはおさまりが良いので下記のように使われているケースをよく見かけますが、ウェブアクセシビリティの観点だと下記はすべてNGです。 ①ラベルの内容を記入しているケース ②説明文を記入しているケース パスワード...
View ArticleWordPressで記事投稿時にタイトル・本文の内容からタグを自動登録する方法
こんにちは、webエンジニアのゾノ( @ozonosho )です。 今回の記事ではWordPressで記事投稿時にタイトル・本文の内容からタグを自動登録する方法をご紹介いたします。 たとえばタグに「WordPress」「SEO」の２つを用意している場合、投稿する記事のタイトルまたは本文の中に「WordPress」「SEO」のキーワードが含まれていれば自動でそのタグを登録させる、みたいな処理です。...
View ArticleWordPressでカスタムフィールドに登録するデータをまとめて圧縮してみる
こんにちは、webエンジニアのゾノ( @ozonosho )です。 今回の記事ではWordPressでカスタムフィールドに登録するデータをまとめて圧縮する方法をご紹介いたします。 大量データを扱っているクライアント企業より「なるべくDBのデータを増やしたくない…」という相談を受けて実装してみました。...
View Article『403 Forbidden』エラーでサイトが表示されない症状を解決｜WordPressエラー復旧
こんにちは、webエンジニアのゾノ( @ozonosho )です。 今回はWordPressエラー復旧サービスの作業ログになります。 症状：サイトにアクセスすると『403 Forbidden』エラー 今回起きていた不具合は『サイトが403エラーで表示されない』というものでした。 サイト内のどのページにアクセスしても「403...
View Articleページ内の画像やデザインが表示されない症状を解決｜WordPressエラー復旧
こんにちは、webエンジニアのゾノ( @ozonosho )です。 今回はWordPressエラー復旧サービスの作業ログになります。 症状：画像やデザインが表示されず、テキストが並ぶだけのページになる 今回起きていたトラブルは『ページ内の画像やデザインが表示されない』というものでした。...
View ArticleWordPress管理画面でユーザーのプロフィール更新時にメールアドレスのエラー判定を外す方法
こんにちは、webエンジニアのゾノ( @ozonosho )です。 今回の記事ではWordPress管理画面でユーザーのプロフィール更新時にメールアドレスのエラー判定を外す方法をご紹介いたします。 よくあるケースとしては「メールアドレス不要で登録できるようにしたい」という理由で使われる方法かもしれません。...
View ArticleWordPress管理画面でユーザー権限を変更した際に強制ログアウトさせる方法
こんにちは、webエンジニアのゾノ( @ozonosho )です。 今回の記事ではWordPress管理画面でユーザー権限を変更した際に強制ログアウトさせる方法をご紹介いたします。 よくある利用場面としては「卒業したユーザーのアカウント情報だけは残したいケース」や「ログインできないブラックリスト権限を作りたいケース」などでしょうか。...
View ArticleClik here to view.
WordPressでログインフォームを独自に実装する方法
こんにちは、Webエンジニアのゾノ( @ozonosho )です。 今回の記事ではWordPressでログインフォームを独自に実装する方法を紹介します。 ユーザーが自由に会員登録できるサイトを作る場合、会員登録フォームやログインフォームが必要になります。...
View Article2023年、ココトモの抱負。
こんにちは、ゾノ( @ozonosho )です。 今日のブログでは新年っぽく「ココトモが2023年に叶えたいこと」を書いてみようと思います。 ※ココトモは僕の会社が運営する無料相談サイトです（HPはこちら）...
View ArticleClik here to view.
WordPressで会員登録フォームを独自に実装する方法
こんにちは、Webエンジニアのゾノ( @ozonosho )です。 今回の記事ではWordPressで会員登録フォームを独自に実装する方法を紹介します。 会員制サイトを作る場合、サイト上からユーザーが自由に会員登録できる仕組みが必要になります。...
View ArticleClik here to view.
WordPressでユーザーが自分で退会できる機能を独自に実装する方法
こんにちは、Webエンジニアのゾノ( @ozonosho )です。 今回の記事ではWordPressでユーザーが自分で退会できる機能を独自に実装する方法を紹介します。...
View ArticleClik here to view.
WordPressでログアウト機能を独自に実装する方法
こんにちは、Webエンジニアのゾノ( @ozonosho )です。 今回の記事ではWordPressでログアウト機能を独自に実装する方法を紹介します。 会員制サイトを作る場合、会員向けにログイン機能やログアウト機能が必要になります。...
View ArticleClik here to view.
WordPressでプロフィール登録機能を独自に実装する方法
こんにちは、Webエンジニアのゾノ( @ozonosho )です。 今回の記事ではWordPressでプロフィール登録機能を独自に実装する方法を紹介します。 会員制サイトを作る場合、ユーザーがサイト上で自由にプロフィール編集したり、他のユーザーのプロフィールを閲覧できたりする仕組みが必要になります。...
View ArticleClik here to view.
WordPressでサイト上（フロント側）に投稿機能を独自実装する方法
こんにちは、Webエンジニアのゾノ( @ozonosho )です。 今回の記事ではWordPressでサイト上（フロント側）にユーザーが自由に投稿できる機能を独自に実装する方法を紹介します。...
View ArticleWordPressで登録ユーザー宛にメールを一定件数ずつ送信する機能実装例
こんにちは、Webエンジニアのゾノ( @ozonosho )です。 今回の記事ではWordPressで登録ユーザー宛にメールを一定件数ずつ送信する機能実装例を紹介します。 たとえば登録者が1万人以上いるような会員サイトの場合、メールを一括送信すると途中で落ちたりサーバーの制約に引っかかったりします。そのため5分おきに500人ずつにメールを送信するような仕組みが必要になります。...
View Article