さて、すでにGDPRが施行されたわけだが、「なにをしたらいいかさっぱりわからん」という方も多いのではないだろうか。 通常のWordPress利用だとユーザー情報を保存するケースは少なく、デフォルトではコメントフォームぐらいだ。こちらはプラグインなどで対応されているはずなので、特に問題ないだろう……と思いきや、Capital Pで利用しているJetpackコメントには同意ボタンがないようだ。Akismetの注意書き（外部サービスがどのようにデータを利用するか）が日本語訳されないまま表示されている。 同意のチェックボックスとかなくていいのか…… まあ、ここら辺はおいおい改善されていくだろう。 それよりも今回取り上げたいのは、海外のWordPressブログでも雨後の筍のごとくチュートリアル記事が湧いている「フォームのGDPR対応」である。 フォームに必要な同意チェックボックス どんなWebサイト
Conversions@Google 2017 での「Mobile in the Future 」というルーク・ロブルースキー氏のプレゼンにすごく感銘を受けたので、ここでもシェアします。ルーク氏はモバイル・ファースト を提唱した、そう、あの人です。 ちなみに、2017年11月にダブリンで行われたイベントだそうですが、アップされてる動画の中でルークさんのプレゼンが圧倒的に再生回数が多い です。さすが。 プレゼンの内容やスライドのデザインはもちろん、Q & A まですべて素晴らしい内容でした。話も上手で出てくる情報やデータの量も半端なくて説得力があるんですよね。本当にすごい。 ところどころ彼のテクノロジーオタクっぽいところが出ているんですけど、それも含めて好きなプレゼンです。自分の考えとシンクロすることも話していて、すとんと腹落ちしました。 3つのポイント 僕がこのプレゼンを見て最も重要だと思
作成する予約システム 画面構成は次のようになります。 作成するシステム 日付選択 --- 予約する日付を選択します。 時刻選択 --- 選択した日付で任意の時刻を選択します。 お客様情報入力 --- お客様の名前や連絡先を入力します。 確認画面 --- 入力・選択内容を確認します。 予約完了 --- 予約が完了します。管理者とお客様に確認メールが送信されます。 このようなシステムをプログラミングせずにDIY感覚で組み立てるイメージで作成できます。さっそく始めましょう。 始める前に：WordPressの準備 事前に、システムを組み込むWordPressを準備しておいてください。3.5以降のバージョンが必要です。使用中のWordPress、業務で使い込んでいるWordPressでも構いませんが、テスト用にWordPressをインストールしていただいた方が無難です。 さくらインターネットをお使い
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 私的なメモです。WordPressで個人的にWebサイトを構築したり、受注した際の手順リストをメモ。自分用のチートシートです。いつも何かしら忘れている気がするのでいつもやる事をぱっと見で分かりようにリスト化しておきます。※個人的な主観が入っています。 Todoソフト等はあまり使わないので本当に私的なメモですが、これが誰かのお役に立てたら幸甚です。プラグインなども好みが有ると思いますのでご参考までに。。 [note]情報が古くなったので改正版としてアップデートしました。[/note] インストール DB作成 WP最新版をダウンロード wp-config.phpをDBに合わせて変更 接頭語も変える（wp_ → example_） FTPソフトでサーバーにインストール ロ
Foremost, forms are about task completion. I’m sure I’m one of only a handful of people in the world who actually check out forms for fun; every other (reasonable) person just wants to fill out the form to get their car registered or buy those shiny new shoes. With content, however, finishing a task isn’t always a priority. Sometimes, we just want to browse without a specific end point in mind. (W
入力フォームって、基本的に忌み嫌われるもの。項目がたくさんあると、そっとタブを閉じたくなる。 旅行に行くときに、いろいろな旅行会社の入力フォームを見たけど、あまり使いやすくなかった。というか、見た瞬間に入力する気が失せてしまうような入力フォームが多かった。 入力フォームの多いページに関わることがあるので、入力フォームに関する資料をいろいろ読んだ。タブを閉じられないように、使いやすい入力フォームを考えたい。 入力フォームについて読んだもの 参考になったのはこれらの資料。どの資料も新しいものではないけど、参考になることはたくさんあった。 僕は英語が苦手で、そんな僕が読んだ感想を書くので間違いがあるかも。間違っていたら教えてください。詳細は原文を読んでください。 RIAC：RIAコンソーシアムユーザビリティガイドライン LukeW | Web Form Design Best Practices
NAVERアカウントの会員登録フォーム、新しく作成するアカウントのためのパスワードを入力していくと、そのパスワードの安全性強度が示されるので、複雑なパスワードでありつつも自分では覚えやすいものとかっていうように、確認しながらアカウントを作成できるので、親切な機能であるといえる。 とりあえず8文字くらいアルファベットを入れていくと、強度「低」と表示された。 数字を追記していくと、強度「中」になった。 さらにピリオドやびっくりマーク（エクスクラメーション）など記号を挿入していくと、強度「高」、やったね！ ちなみに記号を含めないと「高」の称号はゲットできませんからね！ よしよし、これで安全なアカウントが作成できそうだと、満足して「アカウント登録」を押すと… パスワードには半角英数で入力してください。 ……。 アホなのだろうか？ いや、安全性強度が中くらいのアカウントなので、定期的にパスワードを変
調べる。 備忘録としてwebやデザインについて調べたり 新しく知ったことなどを書き残していくカテゴリです。 datalist要素とは HTML5で新しく加わったdatalist要素は、list属性で紐付けられたinput要素にユーザーが入力する際に、datalist要素内に置かれたoption要素の値をその入力候補として表示させる為の要素です。 datalistタグ内に入力候補としたいワードをvalue属性に持つoptionタグを複数記述します。 <form method="get" action=""> <input type="text" list="tools"> <datalist id="tools"> <option value="手裏剣"> <option value="まきびし"> <option value="煙玉"> </datalist> <input type="s
![[HTML5]datalist要素の基本的な使い方・応用(WordPressで全タグを検索の入力候補にしたりする)](https://cdn-ak-scissors.b.st-hatena.com/image/square/f4ef54e535052d579510001081bf0d6592bcfcbc/backend=imagemagick;height=288;version=1;width=512/https%3A%2F%2Fproxy.goincop1.workers.dev%3A443%2Fhttp%2Fwebcre8.jp%2Fwordpress%2Fwp-content%2Fuploads%2F2013%2F04%2Fhtml5-tag-datalist-01-150x150.png)
公開日 : 2013年3月9日 (2014年5月26日 更新) カテゴリー : アクセシビリティ / ユーザビリティ プレースホルダー (placeholder) とは、入力フォームの記入欄 (テキストボックスやテキストエリア) の中に記述される、入力に関するヒントを示したテキストです。 HTML5 以降は、<input> 要素と <textarea> 要素で placeholder 属性が使えるようになり、HTML の標準仕様として、あらかじめ入力フォーム (記入欄) にプレースホルダーを書き入れておくことができます。 プレースホルダーの例 (Facebook)。検索キーワード入力欄に「友達、スポット等を検索」、投稿入力欄 (近況アップデート) に「今どんな気持ち？」という記述がある。 プレースホルダーをラベル代わりに使わない ところでこのプレースホルダー、記入欄のラベル (項目名) を
Facebookなどでフォーム入力中にページを移動（離脱）しようとすると警告が表示されます。 この仕組みをjQueryで実装する方法を紹介します。jQueryは投稿時点の最新バージョン1.9.1を利用しています。 １．ページを移動するときに警告を出す ページを移動するときに警告を出すには、onイベントにbeforeunloadイベントを設定します。 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script> $(function(){ $(window).on('beforeunload', function() { return '投稿が完了していません。このまま移動しますか？'; }); }); </script> <form method="post" acti
会員登録制サイトに欠かせないログインボタン。ヘッダーの右上に設置されていることが多いですが、購入などのアクションを起こした時点でログインフォームを表示するようにしておけば、ユーザーにわざわざ「ログインボタン」をクリックしてもらう必要性は薄れます。 ユーザーが明示的にログアウトしない限り、ログイン状態を維持しておくのも有効です。後日再訪問したときには「ようこそ○○さん」などと表示し、ログイン状態が続いていますが、購入や登録情報の閲覧など高いセキュリティが必要なアクションでは再度認証を求めます。わざわざログインしないでもパーソナライズされた情報が表示されるので、ユーザーにとって利便性が高く、運営側にも「会員の行動履歴を取得しやすい」「ターゲティングによりコンバージョン率が上がる」などのメリットがあります。 このように、「ログイン」「ログアウト」ボタンはどの程度目立たせればよいのでしょうか？ 今
Totally taming form elements is impossible due to the lack of detail in the CSS specification and because of the default styles applied by Web browsers. However, Gabriele Romanato shows us that, by following some common practices, reducing (though not eliminating) the differences and achieving good visual results is possible. Before 1998, the birth year of CSS Level 2, form elements were already w
企業・文化・コミュニティのために、新たな展開につながる創造的なコミュニケーション・ツールをつくります。お問い合わせ
DXディライトは、見込み客の獲得から顧客化、受注後の業務フローの構築など、Salesfoceを中核にあらゆる部門の業務環境・フローの構築をご提案いたします。Salesforceの認定パートナー。
UXやユーザビリティという観点で、海外の記事を中心にサマリーと併せてご紹介していきます。第1弾の今回は、ユーザー登録時のパスワード入力画面についてです。 U-Site編集部 2012年12月10日 こんにちは。U-Site編集部です。 今まではニールセン博士と黒須教授の記事のみを配信して参りましたが、編集部でも、UXやユーザビリティという観点で記事を配信していくこととなりました。海外の記事を中心にサマリーと併せてご紹介していければと思っております。どうぞ、よろしくお願い致します。 さて、早速第1弾の投稿ということで、今回はユーザー登録時のパスワード入力画面に関する記事をご紹介します。 #パスワード入力画面についてはニールセン博士も2009年の段階で言及しております。その当時の記事はこちら。 ユーザー登録フォームにおける、よりよいパスワードの隠し方 ご紹介記事：Better Password
CSSでoption要素を非表示にするときの不具合について紹介します。 タイトルでは「不具合」としていますがブラウザの仕様かもしれません。認識誤りでしたらどこかでつぶやいてください。 １．option要素を非表示にするケース フォームの動作によっては、option要素の一部を非表示にしたい場合があると思います。 たとえばフォームに2つのselect要素があり、1つめのselect要素を選択した結果によって2つめのselect要素のoptionの表示を変更したいときなどです。 このエントリーでは事象の紹介だけにとどめ、解決方法は別エントリーしたいと思います。 ２．サンプル 事象を発生させるサンプルを作りました。 サンプル サンプルでは次のHTMLマークアップを用いています。 <select name="foo"> <option value="" selected="selected">-選
世間が彼を見捨てても、私はキムタクの月9を見続けます。 どうもこんばんは Latin です。 今回はエントリーフォームの最適化についてです。 フォームって、ウェブサイトをローンチした後は、メンテナンスが全然されていない･･･って事は結構多いのではないしょうか？ 仕様が思いの外複雑であったり、分析・改善に費やす時間がなかったりと、理由は様々だと思うのですが、今回は最低限把握しておくべき項目をまとめてみました。 フォームの初期実装時やリニューアルなどに少しでもご参考になればと思います。 【入力サポート】 選択項目は、デフォルト値に配慮する 例えばですが、都道府県のプルダウン選択なら、メインターゲット層の多い都道府県にするというヤツです。「東京都」をデフォルトにしているところを良く見かけますよね。 必須アイコン「必須」の表記で目立つ色で配置する 「※」や「*」は不親切だし、伝わりづらいようです。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
