還暦前からのアフィリエイト日記

この広告は30日以上更新がないブログに表示されております。
新規記事の投稿を行うことで、非表示にすることが可能です。

　いままで、パソコンのみの表示の場合はよかったのですが、スマホで見るとなかなかカッコ良くない表示というのも出てきます。

　まあ、あくまでも個人の主観ではありますか・・・・。

　パソコン画面では、画像の幅は320ピクセル、見慣れた程よい大きさとして眺めています。

　でも、それがスマホ表示になると、画面横幅いっぱいになります。

　どこかへ出かけたときの、観光地や、記念の写真なら良いのですが、PRしたい商品画像、言い換えれば広告画像まで大きくなります。

　色々なアフィリエイトの本には、「広告画像は小さいくらいで良い。」とまで書いてあるものまであります。
　さらには、詳細な説明までは必要無いとまで書いてあります。

　それは、クリックしてクッキーを保存してほしいがためです。

　見る側にとってはブログの読み物と思ってきたのに、広告画像が大きいことは、目の前に「これ買ってください。」と不意に差し出されているようなもので、拒否反応が出てしまいます。

　そこで一計。

　パソコンでは普通の大きさ、スマホではスマホ幅の半分の大きさってのはどうでしょうか。

　下の二つの画像は、パソコンではほぼ同じ大きさです。
　でもスマホでの表示は、下側の画像は半分の大きさです。

画像表示


広告画像表示

★Amazon ★楽天市場 ★Yahoo!ｼｮｯﾋﾟﾝｸﾞ

画像表示は
<　img alt="画像のリンク先" "大きさの指定"　>　です。
<　img alt="HTML5＆CSSのe本" src="/affiliatea8x/file/HTML5EFBC86CSSE381AEeE69CAC-thumbnail2.JPG" border="0" >

上側の画像は、ブログでの画像の保存時の指定で320ピクセルで定められています。


下の画像は、タグを追加して、画像の幅を記事幅の半分(50%)に指定しています。
"画像の大きさの指定"　に
<　style="width:50%;height:auto;" 　>　を追加しています。
<　img alt="HTML5＆CSSのe本" src="/affiliatea8x/file/HTML5EFBC86CSSE381AEeE69CAC-thumbnail2.JPG" style="width:50%;height:auto;" border="0" >

　たとえば、通勤電車の中で、スマホ画面に自分のコンプレックスに係わる、薄毛・無駄毛、体臭など、あまり見られたくない大きな画像が表示されたとします。

　画像をクリックする前に、隣の人の視線が気になってサイトを切り替えてしまいますよね。

　アフィリエイトサイトは、あくまでも閲覧者へのPRが目的ですから、閲覧者側になって表示することは大事なことですよね。

　そんなちょっとした気づかいや心遣いが、特に個人のブログサイトでは閲覧者に無意識に伝わるのでは、と思います。　

---

　html、還暦頃の年代になると、覚えられないので、書いておく必要があります。
　
　html、HyperText Markup Language（ハイパーテキスト マークアップ ランゲージ）の略です。
　ハイパーテキスト (hypertext) 、複数の文書（テキスト）を相互に関連付け、結び付ける仕組み。
　マークアップ ランゲージ(markup language)、文書やデータのデザイン、レイアウト、論理構造、意味を記述するたタグを配した記述言語。

　CSS、Cascading Style Sheets（カスケーディング・スタイル・シート、カスケード・スタイル・シート）とは、HTML や XML の要素をどのように修飾（表示）するかを指示するテキストで書いた言語。
　ますます分からなくなってきて、さらに、記憶できるわけでもありません。
　
　爺なりにまとめると、CSSは全体の色やデザイン文字の統一などやスタイルを決めるためテキストで書いたプログラム。
　HTMLは、webページ画面に表示する見せる・説明するための記述した指示言語、ソースとして見える部分。

　本来、ホームページ画面に見える部分を1ページ毎にすべてHTMLで書けばいいのでしょうが、そうなると膨大なHTMLになると思います。

　夫々のページの色やイメージ、テキストの大きさなど、共通する部分をプログラムとして書き起こしたのがCSSでしょうか。

　よって、CSSにより、間違いが少なくなり、プログラムの一部を修正すれば、サイト全体の、色やレイアウトなどを、簡単に修正できるようになります。

　さらに、全体のデータ量も少なくなるなど、いろいろなメリットもあると思われます。

　爺のくどさで書き込んでみましたが、自分で書けるわけではありません。
　ただ、無料ブログの、文字の色や大きさを変更したり、記事内に線を引いたり、画像やバナー広告の表示位置を変更したいため、一応本は持っています。

HTML XHTML ＆ CSS 逆引きハンドブック

　今はこれが重宝しています　良く使う最低限必要な内容です。
　コンパクトで、文字の大きさもほどほど、文字の黒、赤が濃いので見やすいと思います。

★Amazon ★楽天市場 ★Yahoo!ｼｮｯﾋﾟﾝｸﾞ

　この他にもHTML＆ CSSの本はありますが、すべて覚えたら向かうところ敵なしですね。
　こんな記事を書くためのタイトルではなく、まとめないと・・・。

　無料ブログで、デザインやテンプレートは選べるとしても、ブログデザインの編集可能な部分は、CSSや、HTMLを少しでも解読できるに越したことはありません。

　自分の知識として、後々必ず役に立つはずです。
　そして、少し、文字の大きさや色、横線や改行、表示位置の変更などわかってきて、変えてみれば、見栄えが格段に良くなる場合もあります。

　また、毎月、高額な成果を上げている人の中で、CSSやHTMLの知識が無いなんて言う人は、皆無だと確信しています。
　結果的に見る側にとっても、良い影響をもたらして、成果につながるのではないかと思います。
　そう思いながら、検索して調べたり、パラパラ本をめくったりしています。

　本の中身すべては理解できないまでも、言葉に慣れ、少しづつ理解できるようになると思います。

---