
コピペでできるHTMLとCSSの背景と基本のデザインテンプレ
要素にCSSの background を使って要素の背景を色々いじることができますが、使いこなして出来た背景のパターンを見るだけでも圧倒されます。 上記のようなゴリゴリの背景の作り方ではなく、基本的な部分とコピペでできる …

コピペでできる左右に固定表示されるバナーとソーシャルブロック
WEBサイトを見ていると、記事投稿者のソーシャルアカウントへのリンクや、広告が固定で表示されるサイトを見かけます。 固定表示される為、ユーザーの可読性を阻害するリスクがありますが必ずと言っていいほど目に入るので、見せたい …

条件分岐タグ
WordPressには、条件によって処理を変えたり、値によって処理したりしなかったりするための「条件分岐」のタグがたくさん用意されています。 目次単一の条件に合う場合出力単一の条件に合った場合と合わない場合にそれぞれ出力 …

jQueryライブラリFotoramaのコピペでできるYouTubeや画像のギャラリースライダー
Fotoramaは、比較的昔からあるjQueryの画像ギャラリーのライブラリです。 WEBサイトのスライダーは、同じjQueryライブラリのslickが汎用性が高く、よく使われているのをよく見ますが、Fotoramaも簡 …

コピペでできるテーブルにソート機能を実装するjQueryライブラリtablesorter
XHTML・CSSが普及するまではテーブルレイアウトが一般的でした。 テーブルレイアウトは、tableタグを使って格子状にレイアウトしていく手法で、自分もWEBデザインを始めたての2000年頃はこのレイアウトで組む事が一 …

フォームのEFOの基本とデザイン
フォームは資料請求などを行うページで、氏名や住所を記入してもらうために用いられます。 このフォームが入力しにくいことで、ユーザーはストレスを感じページの離脱に繋がるため注意が必要で、CV(コンバージョン)をしてもらう為に …

コピペでできる空白の場合背景色が変わるPardotのフォーム
Pardotには、ドラッグ・アンド・ドロップでフォームやキャンペーンのなどの専用ページを簡単に作成できる機能が備わっており、HTMLやCSSなどの知識がない人でも簡単にフォームを作成できます。 フォームの作り方は、フォー …

全ての固定ページの一覧を出力
固定ページをリンク付きで一覧表示させることができます。 任意の形やスタイルで固定ページ一覧を出力するには、必要に応じてwp_list_pages か、 get_pages の関数(テンプレートタグ)を使います。 …

HTMLとCSSとJSのコピペでできるカルーセル・スライダーのデザイン3種_その2
カルーセルは、画像などの複数の項目をスライドさせることで、メインで表示する項目を切り替えることができる仕組みで、限られたスペースで展開するのに便利なUIです。 今回は、HTMLとCSSとJSのコピペでできるカルーセル・ス …

A/Bテストが気軽に無料でできるGoogle Optimizeの特徴と設定方法
A/Bテストは、WEBサイトや広告の画像をAとBの2つを用意して「どちらの方が良い成果を出せるのか」ということを目的として実施をし、その得られたデータを基にユーザーがCVしやすいLPや、広告の最適化を行います。 具体的に …