TSUTAYA TVなどの事例からみる、成果を出すためのLPOのプロセス
LPO（ランディングページ最適化）と言うと、情報量が多く派手なLPを作るようなイメージもあるかも知れませんが、今はいかにユーザーの心理を汲み取り、彼らのニーズに合わせた情報を提供できるかという方向にシフトしています。 今回は国内売上No.1のLPOツール「DLPO」を提供するDLPO株式会社の方に同社の具体的な事例を交えつつ、LPOの極意について聞いてみました。 DLPOとは ― まずはDLPOについてお聞きしたいのですが、どのようなツールなのでしょうか？ 「DLPO」はLPOや、もっと広義でいうとCRO（コンバージョンレート最適化）のために、各ユーザーに最適なページを出すことのできるツールです。ページ最適化の手段としてはLPOでの定番とも言える「A/Bテスト」「多変量テスト」に加えて、独自な機能として「パーソナライズ機能」があります。 パーソナライズ機能は、ユーザーの閲覧データや環境デー
2017年に注目されたインターフェイスデザインのトレンドを解説
2017年はインターフェイスデザインにとって多様性の一年でした。中でもユーザーフレンドリーに注目された年と言えるでしょう。 2018年これからのWebサイト、スマホアプリのデザインで押さえておきたいインターフェイスデザインのトレンドを紹介します。 Review of Popular Interface Design Trends in 2017 by Marina Yalanska 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 機能的なミニマリズム ブルータリズム 画像に統合されたタイポグラフィ アニメーションするヒーローイメージ オリジナルのイラスト 枠線がないレイアウト さまざまなインターフェースのアニメーション UIに優しいブランディング 単色のUI 進化した暗い背景の使い方 文字を読ませるためのスペース コントラストを
CSS書きたくなさすぎ問題2017 - DRYな備忘録
css書きたくない。できればjsも書きたくない。js必要なの嫌。軽くやりたい。という個人の日記です。 参考 Best CSS Frameworks of 2017 | Three29 10 Free Lightweight CSS Frameworks for a Fast Start 2017年にチェックしておきたい、CSSの軽量フレームワークのまとめ | コリス ググれ。 lightweight css framework - Google 検索 Gridだけやりたいやつは除外した。 Bootstrap Materialize mui （追記）UIkit （追記）Semantic UI Pure Bulma Skelton Spectre.css Kube Vuetify Fictoan avalanche Beuter Vanilla Milligram InvisCSS Look
日本野球機構オフィシャルサイト
Copyright (C) 1996-2024 Nippon Professional Baseball Organization. All Rights Reserved. 掲載の情報、画像、映像等の二次利用および無断転載を固く禁じます。
オープンソースのNotoSansはたった5分でWebフォントになる
オープンライセンスの日本語フォントNotoSansCJKをウェブフォントとして導入する2種類の方法をご紹介します。手持ちのフォントをWebfontとして使う際の注意とやり方も書きました。 このたびGoogleとAdobeが共同開発した日本語フォント NotoSansCJK は、太さが7種類もあって異字体にも対応してる上にオープンソースとあって非常に面白いことになりそうです。 でも、コメントを追っかけてたら「なんだ、Webフォントじゃないのか」って反応の人を随分見ました。 確かに Notoフォントファミリーの一部は既に CDN化された Google fontsで簡単に使えるようになってますけど、 NotoSans CJK も OpenType(.otf)形式だからネットにアップすれば即Webフォントになりますよ？(・∀・)？ 【 memo 】 本稿はNotoSans のWebフォント導入方法
クソ酷いウェブサイト
他に何がほしいってんだ、クソ野郎 お前はウェブサイトを作ってその糞サイトを最高だと思ってるんだろ？ お前は13MBに及ぶパララックスエフェクト付きのクソ重いページがアホらしいグッドデザイン賞をとるとでも思ってるんだろ？ お前は20kgあるjQueryファイルと83個のpolyfilがIE7をまともに動作させると思ってるんだろ？ どアホ、お前は間違っている。俺様が俺の考える最強のウェブページを教えてやる。 クソ軽量でクソ速いページ 全てのデバイス幅に対応できる どんなうんこブラウザでも見た目が一緒 お前のサイトに訪れるどんな糞野郎でもアクセス可能 読みやすく伝えたいことが明確（もっともお前が5MBサイズのシャレオツなコーヒー写真ではなくて伝えたいことがあればの話だがな） よく聞け、糞野郎ども お前らはハッキリ言ってオーバー・デザインだ。この史上最強のウェブサイトを見てみやがれ。俺がごみコンテ
三本線のメニューアイコンから×マークに変化するアニメーションいろいろ - Qiita
<div class="menuWrapper"> <a href="#menu" id="menuButton"><span>MENU</span></a> </div> .menuWrapper { position: relative; z-index: 0; border: 1px solid #ccc; width: 50px; height: 50px; } #menuButton { overflow: hidden; display: block; position: relative; z-index: 0; width: 50px; height: 50px; cursor: pointer; } #menuButton span, #menuButton::before, #menuButton::after { display: block; position: a
もう、レスポンシブでいいんじゃない？
先月末、藤井さん の働く株式会社ザッパラスさん にお邪魔して、レスポンシブWebデザインの基本のキ的なお話しをさせていただきました。 題して「もう、レスポンシブでいいんじゃない？」 いま、改めてレスポンシブWebデザインについて考えるきっかけになれば、という視点で内容をまとめてみました。 4年前に「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック 」という本を執筆したんですけど、そのころからウェブ制作のデフォルトはとりあえずレスポンシブでいいんじゃない？と思っていたのですが、最近、その思いがより強くなっています。職場のウェブサイトをレスポンシブでリニューアルしてから約5年が経ちますが、やっぱり、あの時レスポンシブを選択しておいてよかったとつくづく感じています。おかげで、Googleさんがモバイルインデックスを優先するという昨今のニュース にもあまり翻弄されなくてすんでいます
日本で働く外国出身UXデザイナーが考える、日本のUXやITが遅れている理由 | UX TIMES
はじめまして、ZILMOO株式会社(www.juusando.com)のUXUIデザイナーのハフィドと申します。私はモロッコ出身で、日本への留学、大手制作会社をへて現在の会社を立ち上げました。子供の頃からロゴデザインやグラフィックデザインの活動をしており、大学では哲学・心理学を学んでいました。現在は、UXUIデザインなどに携わっています。 また、東洋美術学校・日本電子専門学校でUX/UIデザイン講師としても活動しています。 2014年からコミュニティ(UXUI Designers)を主宰し、イベントや勉強会などを定期的に開催しています。 Twitter：https://twitter.com/hafidbourhim Dribbble：https://dribbble.com/juusando UUDコミュニティ：http://uuds.peatix.com/ , https://www.
グラフィックデザイナーやディレクターがhtmlコーディングの指示に関して注意すべきこと / Shiro Kuro Inc.
友人の広告企画制作会社で、Webサイトのコーディング指示に関する注意すべきことを話しました。
UIデザインにおけるボタン:スタイルの進化とベストプラクティス | POSTD
ボタンはごく普通の、インタラクションデザインの日常的な要素です。ボタンはとてもシンプルなUI要素に見えますが、過去数十年間でそのデザインはかなり変わってきました。しかし今でもボタンのUXデザインは認識しやすさと明確さについて言及されています。 この記事ではボタンデザインの発展を辿りながら、有効なボタンを作るために何が最も重要で最適なのかを見つけて行きたいと思います。 スタイルの発展 3Dボタン 初期からオペレーティング用のボタンは、周りのコンテキストと区別するために、浮き彫りと影に依存していました。この設計の解決策は枠、グラデーション、ドロップシャドウを使用して、要素を背景やコンテンツから目立たせ、クリック可能な要素だと簡単に認識できるようにするといった単純な原則に基づいていました。 ボタンが浮かび上がっているように見えます。 このWindows95のダイアログボックスは、濃い影とハイライ
実装を引き受ける前に詰めておくべきWebフロントエンドの想定漏れチェックシート - Qiita
リキッドレイアウトのように幅が常に変動するレイアウトのデザインは、動かないカンプからは実際の挙動が読み取れず、デザイナーの意図が汲み取りきれないことが多い。また、複雑化するアニメーションの実装においても、カンプだけではコミュニケーションに不備が生まれてしまう。ほかにも、CMSを使った案件ではデザインカンプと実際のデータの間に齟齬がある可能性もある。 実装効率を高めてスケジュール通りに仕事を終わらせるには、とにかく事前に仕様を固めることが大事だ。ワイヤーフレームやデザインの途中の段階からなるべくデザイナーとコミュニケーションを重ね、想定外の要件が発生しないように気をつけるべきだろう。 この記事では、デザイナーやフロントエンドエンジニアが見落としがちなWebフロントエンドの課題について列挙していく。 ホバー表現を後から指示される ツッコミ 後から仕様追加されると困るから先に決めて! メモ 最近
シニア層をガッチリつかむECサイト構築術 「SFO」のススメ コーナーの記事一覧 | Web担当者Forum
このコーナーについて 本連載では、「シニア対策・高齢者層対策」について、「SFO＝Senior Friendly Optimization」という視点をしっかり持って、どのように行えばよいかを全6回にわたって解説します。 私たちマミオンは、シニアが多く通うパソコン教室を10年以上にわたって運営するとともに、シニアを対象としたマーケティング調査やユーザビリティ調査を数多く実施・分析してきました。また、2002年からは、サイトのシニア対応コンサルティング事業を行っています。今回の連載は、その知見をまとめたものの一部です。 人口構成比のなかでシニア層の割合が上昇するにつれ、その消費パワーも無視できなくなってきています。それはECサイトでも同じです。顧客のなかにシニア層が占める割合は、今後も上昇すると思われます。その一方で、本当に「シニアが使いやすいサイト」「シニアを逃がしていないサイト」は、実は
Twitterのブランドガイドライン | about.twitter.com
<path opacity="0" d="M0 0h24v24H0z" /> <path d="M17.207 11.293l-7.5-7.5c-.39-.39-1.023-.39-1.414 0s-.39 1.023 0 1.414L15.086 12l-6.793 6.793c-.39.39-.39 1.023 0 1.414.195.195.45.293.707.293s.512-.098.707-.293l7.5-7.5c.39-.39.39-1.023 0-1.414z" /> </svg>" data-icon-arrow-left="<svg width="28px" height="28px" viewbox="0 0 28 28" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://ww
Badge Guidelines - Partner Marketing Hub
Is this content up to date? Your content is due for an audit — please review.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ウェブ初心者も安心して作成できる、無料HTMLテンプレート素材24個まとめ - PhotoshopVIP
ウェブ初心者も安心して作成できる、無料HTMLテンプレート素材24個まとめ - PhotoshopVIP
[JS]最近のWebサイトで見かける気持ちいいアニメーションや便利な機能が実装できる、使いやすいスクリプトのまとめ![[JS]最近のWebサイトで見かける気持ちいいアニメーションや便利な機能が実装できる、使いやすいスクリプトのまとめ](https://cdn-ak-scissors.b.st-hatena.com/image/square/fe7aba32b3039602901d0b81d414d66c71a445ea/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201601%2F2016031405.png)
機械彫刻用標準書体フォント
Brand Resource Center
