人気ブログランキング | 話題のタグを見る

画像アップテクニック・第5回 画像の配置(後編その2)

【テクニック(3)画像の横にテキスト(文字)を配置する】

画像の説明をするときによく使う配置です。「左」配置と「右」配置の例です。

【文章が多いときは画像を小さく】
画像アップテクニック・第5回 画像の配置(後編その2)_d0181824_7165991.jpg説明
左の画像は本文、ロゴ、メモ帳に挿入する画像の横幅を設定する画面です。相談室の設定値です。

【文章が少なく、画像が中心の場合】画像アップテクニック・第5回 画像の配置(後編その2)_d0181824_7211898.jpg



 見事なさくら
   花びら?
    花房?

【ポイント】
①説明文は左配置・右配置に関わらず画像タグの後に入力する。
 改行や改行タグを忘れずに挿入する。
②画像の大きさは画像タグの表示サイズを書き変え、プレビューで確認しながら調整する。
 (アップロードの画像の大きさは横800ピクセルがよい)
③テキスト(文字)エリアを意識して改行やスペースを使って文字を配置する。
 (桜の画像の説明文は改行とスペースで配置を調整しています)
④閲覧者の表示文字サイズはいろいろです。
 (表示文字サイズを「中」にして作成し、「最大」でチェックすれば完璧!)

【自動改行処理について】
ブログの投稿記事は画像、ひらがな・漢字文字、カタカナ文字、英数記号文字で構成されています。
入力をしていく中で、改行したい位置で[Enter]キーを押し、行を改めたいときにり改行タグを挿入して記事を作っていきます。
そんな操作の中で、意識しなくても行幅を超えると自動的に改行してくれる機能があります。これが自動改行機能です。
ワードの入力で意識しなくても行幅一杯になると次の行に移る機能です。
文字サイズを変更しても、自動的に改行位置を変更してくれる機能です。
ブログにおいても自動改行機能があります。その自動改行には決まり事があるのです。
互換表示の設定や表示文字サイズの設定により、ブログの画面が異なるのはこの決まり事によるものなのです。これを理解すればもやもやも解決するでしょう。
お助けマンが発見した決まり事をお知らせしますので、参考にしてください。

【自動改行の決まり事】
(1)漢字、ひらがな、カタカナ等の日本語は1文字単位で自動改行する。
(2)英数記号文字は文字列単位(文字のかたまり)で自動改行する。
   文字列の途中が行末にかかる場合は文字列全体が次の行に移ります。
(3)英数記号の文字列が行幅を超えるときは、はみ出した部分は表示からカットされます。
   文字列の途中で分割されることはありません。
   なお、互換表示がオフの時は最大行幅を越える場合のみはみ出し部分がカットされます。

次の画像と記事は上の画像のソースコードとその説明文です。
互換表示をオン・オフし、文字サイズをいろいろ変えて表示画面を観察してください。
画像タグから最後の・・「フル入力しています」までは改行なしで入力してあります。
上記の決まり事で解析してみてください。

画像アップテクニック・第5回 画像の配置(後編その2)_d0181824_11133842.jpg左は横幅300ピクセルの画像を「左」指定で挿入しています。ABCDEFGHIJKLMNOPQ??画像タグ((((#IMAGE|d0181824_11133842.jpg|201104/21/24/|left|300|114#))))はカッコを削除してフル入力しています。


【英数文字列が設定によってゴチャゴチャになっていることがわかります。記事の中に英数文字列を挿入するときは特に注意が必要なことが分かります、】

【基本的なことを理解するといろいろと応用ができます】
下の画像配置はその1例です。

 左半分
画像アップテクニック・第5回 画像の配置(後編その2)_d0181824_2285216.jpg 中央
画像アップテクニック・第5回 画像の配置(後編その2)_d0181824_2217484.jpg 右半分
画像アップテクニック・第5回 画像の配置(後編その2)_d0181824_22224343.jpg 幹
画像アップテクニック・第5回 画像の配置(後編その2)_d0181824_22133793.jpg 幹と枝
画像アップテクニック・第5回 画像の配置(後編その2)_d0181824_22155238.jpg 花房
画像アップテクニック・第5回 画像の配置(後編その2)_d0181824_22162948.jpg


今日はここまで、
さらに続きます。お楽しみに。
次回投稿は来週の月曜日の予定です。


   

by pc-otasukeman | 2011-04-21 09:05 | Comments(6)

Commented by pckago at 2011-04-22 21:45
おたずねします~~
ジーメルの背景を変えるのに設定からテーマが出ましたが出無くなりましたが、どの様にすれば表示出来ますか?
Commented by パソコンお助けマン at 2011-04-23 06:30 x
★ pckagoさん
ご質問ですが、もう少し詳しくお願いします。
Commented by pckago at 2011-04-23 08:47
お早うございます
グーグルからGメールを見るのに立ち上げます
メールのの所から設定ーを押しますと
メールの一覧の上にテーマの所をクイックしますと
色んな背景が出て変えられるのですが
その箇所が出で無くなりました。
元に戻すにはどのようにすればよいですか?
Commented by パソコンお助けマン at 2011-04-23 13:20 x
★ pckago さん
テーマタブはありますか?
ブラウザはIE8ですか?
今まで背景を変更できたが、急に出来なくなったのでしょうか?

Gメールのヘルプに下記の記述がありました。ご参考迄

Gmail のテーマは、サポートされているブラウザの一部にはまだ対応していません。テーマは Internet Explorer 7.0 以降、Firefox 2.0 以降、Safari 3.0 以降、Google Chrome でご利用いただけます。上記以外のブラウザで新しいバージョンの Gmail を使用すると、[設定] ページに [テーマ] タブが表示されません。Internet Explorer 6.0 をご使用の場合は、[テーマ] タブを使用できません。
Commented by pckago at 2011-04-23 14:24
テーマタブは、見えなくなりました。
ブラウザはIE8です
急に出無くなりました。
無くても、差し支えませんので此のままにして置きます
有難うございました
Commented by パソコンお助けマン at 2011-04-23 17:10 x
★ pckago さん
ん~~~。IE8ですか。
見えるはずの「テーマ」タグ。どうしたのでしょう。
ウイルスの仕業? プログラムの破損? 私も?????です。
しばらく様子をみて、変化がありましたらお知らせください。
名前
URL
削除用パスワード

<< 画像アップテクニック・第6回 ...    画像アップテクニック・第4回 ... >>