Flashに重なってしまい隠れるのを防ぐ([Youtube]iframe編)

lightboxなどの浮き上がる拡大画像や、
 
弊社のQgent等の表示の場合、Flashなどのイメージと重なってしまい、表示が隠れてしまうことが多々あると思います。
Youtubeの動画も同じ!
 
そんなときのYoutubeの動画をiframeで貼りつけた際の、重なりの回避方法を紹介!

解決方法

貼り付け用iframeタグののURLに ?wmode=transparent を追加するだけです
 
例)

<iframe width="560" height="315" src="http://www.youtube.com/embed/l9PyFcNvhog?wmode=transparent" frameborder="0" allowfullscreen></iframe>

 
上記のようにするだけ!!簡単ですね。
 
下記のように解決できます!
 

 

テスティモニアルは重要です

私はよく
「中小企業の方向けに、売り上げアップにつながるWebサイト制作をしています!」
なんて中途半端なことを自己紹介で言いますw
 
そのためにどのようなことを心がけているか!
「わかりやすいサイト制作」です。
 
そのサイトが何を売っていて、どのような人がターゲットとなっているのかにもよりますが、
ユーザーが見てわかりやすいサイトとすることが必要です。
(当然なんですができていないサイトは多いと思います。)
 
そこで今回注目すべきは、テスティモニアル。。。。

「ん?なんだかわからない言葉が出てきたぞ!」っと思ったあなた、
「テスティモニアル 【testimonial】 」とはお客様の声だと思ってください。
 
============================================
「テスティモニアル 【testimonial】 」
〔証明書・推薦状などの意〕
広告やマーケティングで,ある商品やサービスに対する消費者や
識者などの推奨意見のこと。

(goo辞書から抜粋) 
============================================
 
皆さんもAmazon等で買い物をするとき、ユーザーのレビューを見たことはあると思います。
カカクコムとか、楽天市場もレビューはたくさんありますね。
 
ユーザーの方々は、その商品を買った人がどのように思ったのか? とても気にしています。
 

http://qgent.jp/voice/ 
 
販促用のサイトには、確実のお客様の声はサイトに整理しておく必要があるページと言えます。
 
さらに写真付き、手書きのアンケート用紙など載せているととても良いですね。
お客様の声を動画で載せるサービスもあります。 →レコメンドインタビュー
 
 
「そんなこと当然やってますが。。。他に何か改善する点はないですか?」
「フォームはとてもわかりやすくできているけど、問い合わせ来ないですけど~」なんて人も多いと思います。

自己満足のサイトになってしまっているということですね!
他に何か改善すべき点があるはずです。 
 
しっかりとアクセス解析などしてサイトを改善しているつもりでも、改善につながっていない。。。 
そんな時は直接ユーザーに聞いてしまいましょう!
 
「アンケート調査なんてする予算はないです!!」何て方に朗報です。
アンケート調査ではターゲットが合わない可能性もあるのに、調査費用は高額になりがち!
 
そこで、Web解析アンケートツール「Qgent」を利用すると、簡単に実際のサイトユーザーの意見を聞くことができます!
「Qgent」について詳しく知りたい方は下記サイトをご確認ください!!

http://qgent.jp/

お問い合わせフォームのユーザビリティ

私はよく
「中小企業の方向けに、売り上げアップにつながるWebサイト制作をしています!」
なんて中途半端な抽象的なことを自己紹介で言いますw
 
そのためにどのようなことを心がけているか!
「わかりやすいサイト制作」です。
 
そのサイトが何を売っていて、どのような人がターゲットとなっているのかにもよりますが、
ユーザーが見てわかりやすいサイトとすることが必要です。
(当然なんですができていないサイトは多いと思います。)
 
そこで注目すべきは、コンバージョン一歩手前のメールフォームですね。
このページを見る人は、ものすごくお客様になる可能性が高い人だと思いませんか?
 
ここまで来た人を「フォームが使いにくい」という理由で逃がしてしまうのはとてももったいないです。
 
「なるべく項目を減らす」とか「選択項目で分かりやすくする」など考えられるかもしれませんが、
 
まず第一歩としてやるべきはこれ!

http://qgent.jp/entry/
 
このような形で、「入力部分の枠を大きくしてあげる」 「色を付けてわかりやすくしてあげる」などは行った方が良いでしょう。
  
通常サイトを見たユーザーからお問い合わせを頂けるのは、良くても1%程度
ほぼ奇跡に近いのです。
 
そんな奇跡のような行動を起こしてくれるユーザーに、
フォームでストレスを与えてしまっては大変です。 
 
上記は簡単にできますのでぜひ試してみてください。
 
 
 
「そんなこと当然やってますが。。。他に何か改善する点はないですか?」
「フォームはとてもわかりやすくできているけど、問い合わせ来ないですけど~」なんて人も多いと思います。

自己満足のサイトになってしまっているということですね!
他に何か改善すべき点があるはずです。 
 
しっかりとアクセス解析などしてサイトを改善しているつもりでも、改善につながっていない。。。 
そんな時は直接ユーザーに聞いてしまいましょう!
 
「アンケート調査なんてする予算はないです!!」何て方に朗報です。
アンケート調査ではターゲットが合わない可能性もあるのに、調査費用は高額になりがち!
 
そこで、Web解析アンケートツール「Qgent」を利用すると、簡単に実際のサイトユーザーの意見を聞くことができます!
「Qgent」について詳しく知りたい方は下記サイトをご確認ください!!

http://qgent.jp/

販促用のWebサイトには電話番号を載せる!

私はよく
「中小企業の方向けに、売り上げアップにつながるWebサイト制作をしています!」
なんて中途半端ですが、それっぽいことを自己紹介で言いますw
 
そのためにどのようなことを心がけているか!
「わかりやすいサイト制作」です。
 
そのサイトが何を売っていて、どのような人がターゲットとなっているのかにもよりますが、
ユーザーが見てわかりやすいサイトとすることが必要です。
(当然なんですができていないサイトは多いと思います。)
 
その第一歩として「電話番号を載せる」
しかも大きく目立つ場所に載せると良いです。
ホント当然なんですが、皆さんで来ていますか?
 

http://qgent.jp/
 
このサイトではヘッダーに大きく載せています。
 
これだけでユーザーの方々は
 ・あ!何かを注文するサイトなんだ
 ・電話で聞けばよいんだ
 ・困ったら電話しよう
 
っとすぐに思ってくれます。
しかもインターネットのユーザーはせっかちです。
電話ですぐに疑問点を聞きたい!っという方は多いのです。
 
その時にすぐに対応できるように、電話番号を(大きく)載せましょう!
フリーダイヤルですと尚可 ですね
 
  

「そんなこと当然やってますが。。。他に何か改善する点はないですか?」
「電話番号載せてるのに、問い合わせ来ないですけど~」なんて人も多いと思います。

自己満足のサイトになってしまっているということですね!
他に何か改善すべき点があるはずです。 
 
しっかりとアクセス解析などしてサイトを改善しているつもりでも、改善につながっていない。。。 
そんな時は直接ユーザーに聞いてしまいましょう!
 
「アンケート調査なんてする予算はないです!!」何て方に朗報です。
アンケート調査ではターゲットが合わない可能性もあるのに、調査費用は高額になりがち!
 
そこで、Web解析アンケートツール「Qgent」を利用すると、簡単に実際のサイトユーザーの意見を聞くことができます!
「Qgent」について詳しく知りたい方は下記サイトをご確認ください!!

http://qgent.jp/

サイト制作に欠かせない!無料人物写真素材集サイト

本当によくお世話になっています。
人物写真で、商用利用OK、無料の素材集サイト とても重宝しますね。
 
Webサイトは、コンテンツが充実していても文字ばかりではとても見にくいものになってしまします。
やはりなるべく多く写真を入れたいところ(できれば女性の方がやさしいイメージのページになります)。
 
しかし人物写真は、有料のものが多く、購入したりするのは手間だし無料がいいし、、、となりますよね。
 
そこで!これまで利用させて頂いた無料人物写真素材集サイトを、自分でも今後使うのでメモとして残しておきたいと思います。
 
 
・写真素材 足成(あしなり) http://www.ashinari.com/ 
 
・モデルピース http://www.modelpiece.com/
 
・無料写真素材 フォトストック http://photo-stock.website-design.jp/
 
・ビジトリーフォト http://www.busitry-photo.info/
 
・無料人物写真素材の model.foto (モデルドットフォト) http://model.foto.ne.jp/

コンバージョン後の行動(2)ワンタイムオファー

こちらもWeb解析にも絡みつつ、一度コンバージョンに至ったにさらに有益な情報を与える方法。ワンタイムオファー
 
まず、アージェンシーマーケティングをご存じですか?アージェンシーマーケティングとは、期間限定販売、期間限定割引、一定期間毎の値上げ、数量限定販売、先着特別ボーナスなど様々な方法でオファーに緊急性を持たせて成約率をアップさせる効果的な方法として知られています。
 
その中でもワンタイムオファーと言われているものは、一度しか表示させないWebページを作成し、サイト訪問者がページを更新したり、再訪した場合には別のページが表示されるという仕組みを使って、購入するかしないか一度きりの判断を訪問者にさせる事で成約率を飛躍的にアップさせるビジネスモデルです。
 
 
ワンタイムオファーのページを更新したり閉じたりしてしまうと、そのページには再度アクセスする事ができなくなります。
訪問者は一度しか見る事の出来ないWebページでの判断を迫られるんですね。「今だけ!」っといわれると購入したくなりますよね^^

 
通常の販売サイトの成約率が数%なのに対して、ワンタイムオファーページでの成約率は20%以上という結果も出ています。
 
 
とても効果があるマーケティング手法なのですが、
あまりWebに詳しくない人にとっては、一度しか見せないページなど作るのは大変ですね。
どのように作ってよいか見当もつかないかもしれません。

また、あるコンバージョンに至った人に対して、「さらにこちらも今なら!キャンペーン中」と一押しするような形で、緊急性のあるオファーを一押しするだけでも、成約率がアップするといわれています。
 
 
そして、なぜ私がこのようなことをブログで書いたのか。
現在、Webの初心者でも簡単に緊急性のあるオファーを一押しすることができるようになるツールを構築中なんですね^^

今後構築したら、無料モニターを募集する予定です。
下記のグループページでモニターを募集するので、気になる方はチェックしてくださいね。
https://www.facebook.com/groups/webanaylst/

==========================================
「Web解析レポート」を無料公開中です。
ぜひ下記よりダウンロードして見て頂ければ幸いです。
https://www.facebook.com/seeds.create
==========================================

「2011年 ウェブ閲覧環境分析レポート」を発表


 
株式会社環が、運営すアクセス解析ツール「シビラ」を元に、ユーザがウェブサイトを閲覧する際に使用する閲覧環境についての分析・考察を2012年1月25日に発表しました

 
2011年の閲覧ユーザーの特徴として整理されていたのが、
(1)「横長ディスプレイ」の流れ
(2)スマートフォン及びタブレット端末環境での閲覧ユーザー拡大傾向
(3)画面高さ(縦の解像度)の800px以下シェア拡大傾向
 
が見られました。

それぞれの項目の特徴について、下記をご参照下さい。
http://www.sibulla.com/column/report_website_analize_2012_01/
 
 
要約すると
ここ数年、ユーザのウェブサイトの閲覧環境は大きく変わっていて、
ノートPCの「横長ディスプレイ」や、使用ブラウザの分散化などが目立っていたようです。
 
また、いろいろなところで言われています通り、今後はスマートフォンです。
まだ2011年では、シビラで認識したものでは全体の5%程度のシェアですが、
今後はさらに拡大することは間違いないですね。
 
 
やはり、PC用とスマートフォン用のサイトは今後分けて構築していくのが主流となっていくと思いますが、
PC版とスマートフォンを同じものとする場合は、そのサイトの横幅や縦の高さなどをどうするのかなどが、課題となっていくと言う事のようですね。
 
Webサイト構築の際に、閲覧するユーザの閲覧環境を把握しておくことは、運営する組織にとって大切なことですので、この環境の変動についてはしっかりと把握しておきたいですね。

============================================

Web解析に関する情報を、こちらで更新中!
ご不明な点があれば、こちらで情報収集を!

https://www.facebook.com/groups/webanaylst/
 

また私がまとめた、
Webサイト改善に活用できる「Web解析入門レポート」は、
「いいね!」を押して、こちらから無料ダウンロードできます^^

https://www.facebook.com/seeds.create

【メモ】 iframeアプリページが無い!Facebookページにiframeアプリを追加する方法

2011年12月の上旬にFacebookページへの「iframe」の追加方法が変わってしまったようで、以前2日ほど悩みました^^;

そんなiframeアプリのFacebookページへの追加方法について、
今後使うことは多いと思うので、忘れないようにメモとしてブログに残しておこうと思います。

(1)まずはiframeアプリを作ります。
https://developers.facebook.com/apps

(2)その後作ったアプリのID(YOUR_APP_ID)およびページのセキュアなURL(YOUR_URL)を置き換えて下記のアドレスにアクセスします。
https://www.facebook.com/dialog/pagetab?app_id=YOUR_APP_ID&display=popup&next=YOUR_URL
 
そうすると下記の様なページが表示されるので、追加したいページを選んで追加します!

 
簡単ですね~
私はこの仕様変更で、2日悩みましたが、これでもう安心ですね^^
 
また何も告知なしに仕様が変更される可能性もありますが、、、

【WordPressを使う際によく入れるプラグイン】カッコイイ拡大画像を表示『wp-jquery-lightbox』

なぜこのプラグインを入れるか。だってカッコイイから~

挿入した画像の拡大画像が、自動的にLightboxのように表示されるし、その動きがカッコイイ。
Wordpressで簡単にLightbox的な表示をしたいならおススメのプラグインですよ。
 
使い方、インストール方法はこちら

(1)まずはインストール

管理画面の「プラグイン」>「新規追加」で『wp-jquery-lightbox』と検索。
検索結果に表示される『wp-jquery-lightbox』をインストールしちゃいます。
【WordPressを使う際によく入れるプラグイン】カッコイイ拡大画像を表示『wp-jquery-lightbox』
 

(2)有効化します。

インストールが完了したら「プラグイン」一覧の画面に表示される『wp-jquery-lightbox』を有効化します。
【WordPressを使う際によく入れるプラグイン】カッコイイ拡大画像を表示『wp-jquery-lightbox』
 
そして。。。。それだけでした。
超簡単ですね。

ここまでの作業をして、普通に投稿記事に画像を追加すれば、下記の様なLightbox風の拡大画像表示が可能となります。
【WordPressを使う際によく入れるプラグイン】カッコイイ拡大画像を表示『wp-jquery-lightbox』

HTMLのチェック

最近おろそかにしていたけど、W3Cの基準はやはり重要らしい。
いろいろな情報を基に、今後も見直していきたいです。
 
HTMLチェックはこちら
http://cetus.sakura.ne.jp/htmllint/htmllint.html

このサイトでチェックして最初はマイナスになる事が多いと思いますが、そこから徐々に改善して100点満点になると嬉しいですよね^^「よくできました」なんて言われちゃって^^

HTMLのチェック