おはようございます^^
簡単アメブロ集客の住福です。
今まで、沢山の画像に関する記事を書いてきましたが、
今日はそのまとめを書いてみます。
多分、保存版になります^^
画像系カスタムまとめ!!
画像を綺麗にアップしよう!
まず、画像を綺麗にアップする方法です。
せっかく頑張って綺麗に撮った写真や、文字を入れた加工画像ですが、どうも綺麗にアップされない。
そんなときは、適切な画像形式になっているかを確認してください。
詳しくはこちらの記事です。
→ 画像を綺麗にアップするには…
私は、画像をアップするときは、サイズが重くなりますが、基本はPNG形式であげます。
一番綺麗にアップできますよ^^
画像形式を変えるには
これは形式を変えたい画像を、画像編集ソフトで開いて、「名前をつけて保存」の際に、形式を変えて選択すれば簡単に出来ます。
Windowsに初めから入っている“ペイント”でも出来るので、チャンレジしてみて下さい^^
ペイントで開く方法は、編集したいの画像の上で「右クリック」→「プログラムから開く」→「ペイント」で開けます。で、左上のタブにある「名前をつけて保存」→「形式を選択する」で出来ます。
画像サイズを変えるには
画像をアップする際は2つの選択肢があります。
・縮小して表示
・オリジナルで表示
まず、この際に画像をオリジナルサイズでアップします。
で、例えば大きいサイズであれば、こんなふうに、完全にはみ出ます!
なので画像サイズを調整してあげないといけません。
この画像のHTMLはこんな感じですが、後半の赤字の部分を少しいじります。
<a href="http://stat.ameba.jp/user_images/20140430/01/next-inv/ea/6f/j/o0800048012924751407.jpg"><img src="http://stat.ameba.jp/user_images/20140430/01/next-inv/ea/6f/j/o0800048012924751407.jpg" alt="テスト" width="800" height="480" border="0" /></a>
「width=」が横幅で、
「height=」が高さです。
横は350~500くらいで、高さはプレビューを見ながら調節してみて下さい。
<a href="http://stat.ameba.jp/user_images/20140430/01/next-inv/ea/6f/j/o0800048012924751407.jpg"><img src="http://stat.ameba.jp/user_images/20140430/01/next-inv/ea/6f/j/o0800048012924751407.jpg" alt="テスト" width="400" height="240" border="0" /></a>
こんな感じに数値を変えると、適切なサイズに変更できます。
画像にリンクを貼る
たとえば上の画像にリンクを貼ります。画像テキスト(HTML)の赤字の部分がリンク先のURLですので、ここをリンク先のURLに変えればOKです。
例として、ヤフーにリンクを貼ってみましょう。
変更前
<a href="http://stat.ameba.jp/user_images/20140430/01/next-inv/ea/6f/j/o0800048012924751407.jpg"> ;<img src="http://stat.ameba.jp/user_images/20140430/01/next-inv/ea/6f/j/o0800048012924751407.jpg" alt="テスト" width="400" height="240"border="0" /></a>
変更後
<a href="http://www.yahoo.co.jp/">;<img src="http://stat.ameba.jp/user_images/20140430/01/next-inv/ea/6f/j/o0800048012924751407.jpg" alt="テスト" width="400" height="240" border="0" /></a>
するとリンク先が変わります。
簡単でしょ?
他にもあるある!ユニークな加工!
主に必要な知識はこの3つなんですが、他にも画像にかんするユニークな加工法があります。
以前記事に書いているので、続きはそちらのブログでご覧いただければと思います^^
・画像を自動的に“アップにする”方法
・画像を動かす方法
以上、画像系カスタムまとめでした。
まだ他にもあれば随時アップしてまいります♪
↓ポチッと応援お願いします!↓