画像サイズに注意 ～容量オーバーの罠～
携帯サイトを作る際の注意点として、画像ファイルのサイズに注意するというものがあります。
最近は光回線も一般的になってきて、PCサイトでどんな画像でも瞬時に表示できますが、携帯サイトの場合はまだまだ遅いです。
しかも、遅いだけじゃなくて、１ページあたりのサイズの上限が決まっていて、それをオーバーしてしまうと画像が表示されなくなります（;´▽｀A``
特にドコモの場合はサイズ上限が小さいらしく、色んなサイトを見ているとサイズオーバーしちゃっている所が結構あります。もったいないですよね～
なので、画像が多いサイトを作る時には注意が必要です。
サーバーにアップしたら、必ず実機でチェックすることをオススメします。（できれば3キャリアでチェックした方がよい）
まあ、どのくらいでオーバーするかってのはやっていけば何となくわかるようになります。
ただ、あくまで僕の考えですが、携帯サイトでは無駄に画像が多くても見る側にとってはストレスになったりします。
何故なら…
・ページ読み込みに時間がかかる
・ページが縦長になりスクロールが多くなる
・パケット代がかかる
と、いう感じで…画像の使用は必要最小限に抑えた方がいいですね。
本当に必要な画像だけを使いどころを考えて使うことで、ユーザーも画像にしっかり注目してくれます。
その効果はバナー広告などにも応用できるかもしれませんね(^∇^)
【関連記事】
の代わりに画像をラインに使う
最近は光回線も一般的になってきて、PCサイトでどんな画像でも瞬時に表示できますが、携帯サイトの場合はまだまだ遅いです。
しかも、遅いだけじゃなくて、１ページあたりのサイズの上限が決まっていて、それをオーバーしてしまうと画像が表示されなくなります（;´▽｀A``
特にドコモの場合はサイズ上限が小さいらしく、色んなサイトを見ているとサイズオーバーしちゃっている所が結構あります。もったいないですよね～
なので、画像が多いサイトを作る時には注意が必要です。
サーバーにアップしたら、必ず実機でチェックすることをオススメします。（できれば3キャリアでチェックした方がよい）
まあ、どのくらいでオーバーするかってのはやっていけば何となくわかるようになります。
ただ、あくまで僕の考えですが、携帯サイトでは無駄に画像が多くても見る側にとってはストレスになったりします。
何故なら…
・ページ読み込みに時間がかかる
・ページが縦長になりスクロールが多くなる
・パケット代がかかる
と、いう感じで…画像の使用は必要最小限に抑えた方がいいですね。
本当に必要な画像だけを使いどころを考えて使うことで、ユーザーも画像にしっかり注目してくれます。
その効果はバナー広告などにも応用できるかもしれませんね(^∇^)
【関連記事】
の代わりに画像をラインに使う
【２】ジャンルを決める ～アダルトサイト作成実況中～
サイトを作る際、まず先にジャンルを決めると楽かと思います。
その際、自分で制作からやるのであれば、先にジャンルを決めてから、それに沿って作っていく方が効率がいいでしょう。
逆に、素材をメーカーや代理店から提供されている場合は、実際に提供されるまではどんな素材をもらえるのかわかりませんから、素材を実際に手にしてから決めた方が無難かと思います。
僕は今回、第１号のサイトでは熟女サイトを作ろうかと思っていましたが、届いた素材がレズ系が多かったので、予定変更してレズ系のサイトを作ることにしました。
なぜ、先にジャンルを決めるか？
それはジャンルによってサイトの配色が違ってくるからです。
あくまでイメージではありますが、女子校生モノやGALモノを配信するなら白背景、SMやレイプ系であれば黒背景にしたほうが反応がいいようです。
携帯サイトの場合、特に色のイメージというのが重要になってきますから、僕がサイトを作る際は配色にかなり気をつかいます。
大事なのは、全体を見た時に違和感がない配色ということです。
【アダルトサイト作成実況中】
【１】素材の準備
その際、自分で制作からやるのであれば、先にジャンルを決めてから、それに沿って作っていく方が効率がいいでしょう。
逆に、素材をメーカーや代理店から提供されている場合は、実際に提供されるまではどんな素材をもらえるのかわかりませんから、素材を実際に手にしてから決めた方が無難かと思います。
僕は今回、第１号のサイトでは熟女サイトを作ろうかと思っていましたが、届いた素材がレズ系が多かったので、予定変更してレズ系のサイトを作ることにしました。
なぜ、先にジャンルを決めるか？
それはジャンルによってサイトの配色が違ってくるからです。
あくまでイメージではありますが、女子校生モノやGALモノを配信するなら白背景、SMやレイプ系であれば黒背景にしたほうが反応がいいようです。
携帯サイトの場合、特に色のイメージというのが重要になってきますから、僕がサイトを作る際は配色にかなり気をつかいます。
大事なのは、全体を見た時に違和感がない配色ということです。
【アダルトサイト作成実況中】
【１】素材の準備
横幅は240ピクセルに統一すべし ～携帯画面サイズについて～
携帯サイトを作る際、画像の横幅は240ピクセルに合わせるのが、今のところはスタンダードになっています。
横幅240ピクセルというのは、いわゆるQVGA（240x320）とか、WQVGA(240x400)のサイズに合わせて作られているということです。
今、市場に出回っている携帯電話の液晶は、ほとんどがQVGAかWQVGAのサイズです。
もちろん、大きいサイズのもの、小さいサイズのものもありますが、それらも含めてすべての機種に対応しようとすると、それこそユーザーエージェントなどを調べて各機種に合わせたページを表示するとかいった大掛かりな話になってくるかと思います。
基本的にアフィリエイトは量産がキモになりますから、１サイトにそこまで手をかけてやってられないのが現実です。
もちろん、企業サイトなどの場合は話は別ですが、アフィリエイトで携帯サイトを作るなら、横幅240ピクセルに合わせたサイトを量産していった方が効率的です。
魚があまりいない場所で希少な魚を釣ることに力を使うより、魚が多い場所でたくさんの竿を垂らすことに力を使う…結果的にその方がたくさんの魚を釣ることができますよね。
【関連記事】
画像サイズに注意 ～容量オーバーの罠～
横幅240ピクセルというのは、いわゆるQVGA（240x320）とか、WQVGA(240x400)のサイズに合わせて作られているということです。
今、市場に出回っている携帯電話の液晶は、ほとんどがQVGAかWQVGAのサイズです。
もちろん、大きいサイズのもの、小さいサイズのものもありますが、それらも含めてすべての機種に対応しようとすると、それこそユーザーエージェントなどを調べて各機種に合わせたページを表示するとかいった大掛かりな話になってくるかと思います。
基本的にアフィリエイトは量産がキモになりますから、１サイトにそこまで手をかけてやってられないのが現実です。
もちろん、企業サイトなどの場合は話は別ですが、アフィリエイトで携帯サイトを作るなら、横幅240ピクセルに合わせたサイトを量産していった方が効率的です。
魚があまりいない場所で希少な魚を釣ることに力を使うより、魚が多い場所でたくさんの竿を垂らすことに力を使う…結果的にその方がたくさんの魚を釣ることができますよね。
【関連記事】
画像サイズに注意 ～容量オーバーの罠～
【１】素材の準備 ～アダルトサイト作成実況中～
こんにちは、エロサイト職人です。
さて、エロサイトを作ろう！と決起した方にとって、まず一番の疑問は「エッチな素材はどうやって手に入れるのか？」という問題かと思います。
大きな声ではいえませんが、著作権を無視してやっている方も結構いるようです…
しかし、サイトを作って収入をとろうと思っている人が、そんなリスクを侵すというのは、正直オススメできません。
というわけで、考えられる素材の入手方法を挙げてみます。
１）自分で撮影・作成する
２）持っている人に提供してもらう
３）代理店から提供してもらう
４）制作会社に依頼する
という感じになります。
僕の経験上、１→４の順で費用が高くなります。
ちなみに素材は、動画、画像、ゲーム、ボイス、漫画、イラスト、テキスト…と、考えつくだけでも色んな形式があります。
動画は人気がありアクセスが集まりやすい反面、転送量（ネット回線の使用量）が大きくなるのでサーバー費用がかかります。
上記の中では、小説や体験談などのテキスト系が一番、費用がかからずにできるはず。
ちなみに、僕は動画で行くことにして、素材はメーカーと提携して買取る形にしました。
さて、エロサイトを作ろう！と決起した方にとって、まず一番の疑問は「エッチな素材はどうやって手に入れるのか？」という問題かと思います。
大きな声ではいえませんが、著作権を無視してやっている方も結構いるようです…
しかし、サイトを作って収入をとろうと思っている人が、そんなリスクを侵すというのは、正直オススメできません。
というわけで、考えられる素材の入手方法を挙げてみます。
１）自分で撮影・作成する
２）持っている人に提供してもらう
３）代理店から提供してもらう
４）制作会社に依頼する
という感じになります。
僕の経験上、１→４の順で費用が高くなります。
ちなみに素材は、動画、画像、ゲーム、ボイス、漫画、イラスト、テキスト…と、考えつくだけでも色んな形式があります。
動画は人気がありアクセスが集まりやすい反面、転送量（ネット回線の使用量）が大きくなるのでサーバー費用がかかります。
上記の中では、小説や体験談などのテキスト系が一番、費用がかからずにできるはず。
ちなみに、僕は動画で行くことにして、素材はメーカーと提携して買取る形にしました。
<hr>の代わりに画像をラインに使う ～3キャリア共通デザイン～
<hr>は手軽に罫線が引ける便利なタグではありますが、先日の記事でも触れたように、<hr>で表示される罫線の太さはキャリアや機種によって変わってきます。
【参考記事】超簡単な３キャリアの違いのまとめ
PCサイトの場合、size属性で線の太さを調整できますが、携帯サイトでは無効になる場合が多いです。
そうなると、3キャリア共通のページを作成していた場合に、デザインが微妙に変わってきます。
そこで、３キャリアでなるべくデザインを統一させるためのテクニックをご紹介します。
１）ライン画像を使う（その１）
こんな感じで、1x7ピクセルの画像を作り、真ん中に線で使う色で点を入れます。
これをHTMLで表示させる際に、width属性を240などにしてやれば、細い１ピクセルの線を表示できます。
２）ライン画像を使う（その２）
こんな感じで、点線などを使いたい場合は、240x7ピクセルの画像を作成しよう。
３）背景色を使う
これはちょっと上級者向けかな～
XTML限定になりますが、透過GIFの極小画像を使って、<div>の背景色で罫線を引きます。
これを使う利点は、画像が読み込めなくても罫線が表示されるということと、サイズの節約になることでしょうか。
一応、ソースを書いておきます。
<div style="background-color:罫線の色;"><img src="img/spacer.gif" width="1" height="1" alt="" /></div>
【関連記事】
画像サイズに注意 ～容量オーバーの罠～
【オススメ本】携帯サイト コーディング＆デザイン
【参考記事】超簡単な３キャリアの違いのまとめ
PCサイトの場合、size属性で線の太さを調整できますが、携帯サイトでは無効になる場合が多いです。
そうなると、3キャリア共通のページを作成していた場合に、デザインが微妙に変わってきます。
そこで、３キャリアでなるべくデザインを統一させるためのテクニックをご紹介します。
１）ライン画像を使う（その１）
こんな感じで、1x7ピクセルの画像を作り、真ん中に線で使う色で点を入れます。
これをHTMLで表示させる際に、width属性を240などにしてやれば、細い１ピクセルの線を表示できます。
２）ライン画像を使う（その２）
こんな感じで、点線などを使いたい場合は、240x7ピクセルの画像を作成しよう。
３）背景色を使う
これはちょっと上級者向けかな～
XTML限定になりますが、透過GIFの極小画像を使って、<div>の背景色で罫線を引きます。
これを使う利点は、画像が読み込めなくても罫線が表示されるということと、サイズの節約になることでしょうか。
一応、ソースを書いておきます。
<div style="background-color:罫線の色;"><img src="img/spacer.gif" width="1" height="1" alt="" /></div>
【関連記事】
画像サイズに注意 ～容量オーバーの罠～
【オススメ本】携帯サイト コーディング＆デザイン