白い平屋の家を建てました

~こだわりの蔵がある家~

はてなブログのアイコンとプロフィール画像がぼやけて見えにくい!プロフィール画像を大きくしてみました

新しくなったアイコンに慣れていなくて、自分がつけたスターを探してしまうたよらこです。

「あれ、この記事確か少し前に読んだはずなのにスターつけ忘れてしまったのかな」

あっ💦そうだった、大人のらっこに変身したんだった。

せっかくのステキなアイコンがスターになるとぼやけてしまうことが悔しくて、ここ2~3日もがいていました。

分かったことと、対応策をメモします。

 

画像の保存形式は何通りかある

超初心者のメモです。知っている方はスルーして下さい。

間取り図は PDFとjpeg形式

家の間取り図と外観パースを書いてもらった時に「データ方式はPDFで大丈夫ですか」と聞かれました。

えーと、PDFが分かりません💦

「今後使用されるときに不具合があるといけないので、念のためjpegでもお送りしますね」

蔵のある平屋の間取り図「白い平屋の家を建てました」 - 白い平屋の家を建てましたより

 PDFとjpegの違いが分からないまま両方受け取って「…ま、いいか」と終わりにしていました。

PDFとは?

「Portable Document Format」の略。すべての環境(ソフトウェアやハードウェア、OSに関係なく)でデータを見ることが出来るファイル形式。ファイルの作成・保存には専用ソフトウェアが必要なもののネット上で無料配布されているため、パソコンやスマホがあれば誰でもファイルを見ることが出来る。

jpegとは?

風景写真など色合いにグラデーションがある画像に適しているファイル形式。

一度画像を圧縮してしまうと元に戻せない特徴あり。

jpg(ジェイペグ)とpng(ピング)もある

jpegとjpgは同じ!

pngとは?

色数の多い文字や図形などが含まれる画像に適しているファイル形式。

画質が保てる分、画像容量が大きくなってしまうのがデメリット。

pngの画質が変わらないのなら、全部pngにしちゃえばいいのか!って単純に考えちゃダメなのね。

(参照)初心者でも分かるPNGとGIFの違い | ロゴ作成デザインに役立つまとめ

 

新しいアイコンの画質を上げようと、いくつもの記事を読みました。

試したものの変化なし。

Twitterで呟いたらはなさんがアドバイスをくれました。

 

はなさんからのアドバイス

  • もしもjpgならpng形式に保存する
  • 普通に使うならjpgのまま使っても問題なし
  • 加工する場合はpng形式にする

どうやってpng形式にするの?💦

 

jpg形式からpng形式にする方法 

  • パソコンの画像加工フリーソフト(GIMP)を使う←試していない
  • canvaでデータを読み込ませて、ダウンロードするときにpngを選択する←これは出来た!
  • Windowsに入っているペイント機能でデータを貼りつけてpngで保存する←これも出来た!

はなさんてすごいなぁ。

それともわたしが無知すぎるだけなのかな。

jpg形式とかpng形式とか、常識的に知っていることなの?

 

試行錯誤した結果分かったこと

月来子さんから頂いたデータはpng形式だった。わたしが丸く切り抜いたときにjpg形式に変わってしまった。

記事に貼ったものは、どちらの形式も大きな変化はなかった。

スターやプロフィール画像は、はてなの仕様なのか?どちらの形式にしてもぼやけちゃう…ということが分かりました。

読んだ記事にCSSでプロフィール画像の画質が上がるというものもあり、試したけれど変化はありませんでした。
f:id:tayorako:20190803133519j:image

 

対応策

スターアイコン

画像を拡大して、らっこのアップに代えてみることにしました。

月来子さんが「はっきりさせたいならとこっちがいいかも」と、濃い目の画像を送ってくれました。

本当は切りたくないけれど、何のアイコンなのか分かって欲しいのでガマン💦

スターアイコン変更はアカウント設定→プロフィール画像を変更する→画像を指定→変更するをクリック。

f:id:tayorako:20190803123454j:plain

らっこのアップに変更しました。
f:id:tayorako:20190803131756j:image

記事に押したスターを比べると…

before
f:id:tayorako:20190803131636j:image

after
f:id:tayorako:20190803131657j:image

らっこだって分かりますか?

色合いがはっきりして、インパクトも増したような♡

月来子さんどうもありがとうございます!

 

プロフィール画像

スターを変えると、プロフィール画像も変わってしまう。プロフィール画像は元の画像のままにしたい。

プロフィール画像だけ変えられないかを検索すると、出来るし大きさも変えられるみたい。

色んな記事を参考にはてなフォトライフを使ってあれこれしたものの、なかなか上手く出来ない。

ただ画像を大きくするだけなら出来たのだけれど、画像をクリックしてプロフィールが載っている場所に飛ばせるようにしたい。

f:id:tayorako:20190803123228p:plain

なのに、こんなふうに迷子になってしまう。

1時間くらいもがいた後に「あれ?なんだか前に自分で記事書いた気がする…」と我に返りました…。2記事も書いて忘れるってどういうことだ…(´*ω*`)💦

嫁氏さんに教えてもらったこちら(part2)の方法を使って、アイキャッチ画像を大きくしました。嫁氏さん、改めてありがとうございます。

 

プロフィール画像を大きくする方法

忘れないために復習!

記事の下書きやワードなどを使ってHTMLを作ります。

使う画像を指定して貼る

大きさはドラッグで250×250にしました。大きすぎるとサイドバーに貼りきれなくなるので300以内にした方が良いみたいです。

f:id:tayorako:20190803123853p:plain

右クリックをした状態のままリンクボタンを押します。

f:id:tayorako:20190803123935p:plain

リンクを挿入にジャンプしたいURLを入れる

わたしは自己紹介文と迷って、はてなプロフィールをジャンプ場所に指定しました。

プレビューをクリックすると挿入形式を選べるものが出てくるので、選択範囲をクリックします。

これで画像の中に飛びたいURLが入り込みました。

編集画面をHTML編集に変えて、今作ったものを表示させてコピー

f:id:tayorako:20190803124306p:plain

コピーしたHTMLを設定画面のデザイン→カスタマイズ→サイドバー→HTMLに入れて表示させます。

プロフィール設定の中にある「プロフィール画像表示する」のチェックボタンを外します。画像が2つになっちゃうので。

f:id:tayorako:20190803124642j:plain

適用をクリックするのを忘れずに。

そうしたら、そのHTMLを上に移動させます。

プロフィールより上に設定しました。

before

f:id:tayorako:20190803124754p:plain

after

f:id:tayorako:20190803124803p:plain

こんなふうになりました!

くっきりハッキリ♡嬉しい。

 

まとめ

スターは反映されたり、されなかったりまだ不安定です。

さきほど購読ブログにお邪魔したときには、コーヒーカップに戻っていてびっくりしました。そのうち反映されると思うので、待ちます。

 

はなさんにはh2問題でもお世話になりました。

いつも無知なわたしを助けてくれて、どうもありがとう!

 

無知は恥ずかしいし、回り道が多くて嫌になる。

知らないから失敗する。

調べる。

試行錯誤する。

助けてもらう。

分かったときの喜び。

わたしと同じような人に分かりやすく伝えることが出来る。

回り道で得るものもある。

 

 

実は半年前に捨てた庭ブログの独自ドメインを再取得して、保育ブログにつけました。

呆れるほどの、回り道…。

なぜ解約した独自ドメインをもう一度取得したのか、そして配信が止まっていたアドセンス広告が戻ってきたので、それについても書きたいなと思っています。

 

最後までお読みいただき、どうもありがとうございました