ブログ

はてなブログからTwitterシェア、最適なアイキャッチ画像サイズはこれだ!

投稿日:2017年4月25日 更新日:

 

事件は会議室で起きているんじゃない!Twitterで起きているんだ!!

ザブローです。こんにちは。
本日もお越し頂き、ありがとうございますm(_ _)m

※本日は、はてなブロガー向けの記事となります。

はてなブログアイキャッチがTwitterで見切れてしまった!そんな経験ありませんか?

アイキャッチ画像

本日は、そうならない為の最適な画像サイズはこれだ!というお話です。

 

おっと、その前に

ちょっとその前に、通信量をおさえるなら「ギガぞうが便利ですよ!

通信制限になりたくないなら!

ギガぞう - 速度制限対策アプリ

ギガぞう - 速度制限対策アプリ
開発元:Wire and Wireless Co.,Ltd.
無料
posted withアプリーチ

ギガぞうは、インストするだけでいつも使っているLTE通信量をキュッと圧縮し、通信料を節約してくれるアプリです。

月末にいつも通信制限で「ギガが足りない」あなたにぴったりのギガ節約アプリ。

また、コンビニやお店などで無料WiFiを捕まえるけど、会員登録・ログインが面倒ですよね。

ギガぞうなら、事前にアプリで登録しておけば、街中で自動ログインしてくれて、いつのまにかWiFi環境に。

あなたは何も気にせずスムーズにWiFiを楽しめて、さらに通信量を節約できますよ。めっちゃ便利です。

→→インストするだけでギガ節約

  • ギガぞう説明の画像

 

 

 

アイキャッチ画像サイズ 見切れ現象

先日、マストドン記事を書いたのですが、問題はそこでおこりました。

※この正方形アイキャッチが見切れるのは、そこまで拡散に影響ないかな、と思っているので、見なかったことにします(笑)

マストドン記事の中で使用した画像はこちら。とくに何も考えず、サイズとレイアウトを決めていました。画像サイズ、横512pixel高さ234pixel。

アイキャッチ画像

はてなブログには、記事投稿と同時にTwitter・Facebookにシェアする機能があります。こちらですね。

アイキャッチ画像

この機能を使ってTwitterにシェアした際、問題は起こりました。その画像がこちら。

アイキャッチ画像

スマホから見ると、見事に画像が見切れてしまっています。画像付きツイートは効果的なのに、これでは効果半減、内容が伝わらない。アイキャッチとして生きていませんよね。

そして、ぼくの場合、昼12時過ぎに予約投稿し、夜の時間帯に手動でTwitterから再度、記事リンクをペーストし、ツイートさせてもらっています。1日に2度もツイートしてごめんなさいごめんなさい。

その画像がこちら。

アイキャッチ画像

はてなブログシェア機能を使った際とは、また違った見切れ方をしました。なんじゃこりゃ。

Twitterの画像サイズについて

Twitterのタイムラインに表示される画像比率は仕様で決まっています。

PC 2:1
スマホ 16:9

です。

PCの場合

PCでは、タイムライン上の画像は、横504×高さ252の2:1で表示されます。画像サイズを測りました。※各環境によってサイズは違うかもしれません。ぼくの場合はこのサイズでした。

アイキャッチ画像

Twitterでは、最低505×252サイズとなるので、これ以上の画像サイズであれば、画像が劣化することなく綺麗に表示できます。

といってもそんなに2:1比率に合う画像の方が珍しいと思います。それ以外の比率だと、画像の上下が切り取られます。これも上下均等ではなく、任意で切られるようです。なるべく中央に情報が集まった画像を選びましょう。

このツイートをスマホからみると、このように左右が切れてしまいます。

アイキャッチ画像

スマホの場合

スマホの比率は、16:9と決まっています。
上のPC表示で縦が切られていないと仮定した場合、448×252となります。

アイキャッチ画像

スマホから見るとこちらです。

width=

素敵ですね。PCから見ても

アイキャッチ画像

うん。素敵ですね。

ということでTwitterからは、16:9サイズ画像を投稿するとPC・スマホで見切れることがありません。

さて、はてなブログからはどうでしょうか。

はてなブログから画像サイズ検証

先ほどの、448×252で検証です。

はてなブログからシェア機能でツイート

はてなブログに画像を配置し、ブログ更新・シェア機能を使いました。PCから見ると

アイキャッチ画像

よしよし。素敵です。スマホから見ても、

アイキャッチ画像

うんうん。オッケーオッケー。

TwitterにURLリンクをペーストしてツイート

次にURLをペーストしてツイートした場合をPCから見ると、

アイキャッチ画像

むむっ!
スマホから見ると、

アイキャッチ画像

むむむっ!!!
多少ではありますが、上下が切れてしまいました。どういう影響なのでしょうか。。。

いろいろ調べてみましたが、google先生からも解決は見当たりませんでした。

アイキャッチ画像 最善策

現状での最善策は、はてなブログでアイキャッチ画像にしたい画像サイズは、

448×252(16:9)

となりました。これ以上のサイズでも16:9であれば構いません。

画像サイズを簡単に変更するには?

画像サイズが決まったのはいいですが、そんな都合のいい画像はありませんよね。

画像サイズを変更するには、photoshopなどの画像ソフトがあれば簡単ですが、それ以外の方は、こちらのサイトが大変便利です。

ブラウザ上で画像サイズ、トリミングなどが楽に出来ます。

画像サイズ変更ツール

1、立ち上げた画面

サイトにアクセスするとこのような画面になります。

アイキャッチ画像

2、画像を開く

赤枠の開くから任意の画像を開きます。

アイキャッチ画像

開くとこのようになりますね。あらカワイイ。タイプです。

アイキャッチ画像

3、画像のサイズ変更

こちらの画像のサイズ変更から、まずサイズを変更します。

アイキャッチ画像

目指したい448×252にしたいのですが、とある理由からWを449としてください。縦横比固定のチェックは入れたままです。勝手にHを決めてくれます。

アイキャッチ画像

4、画像のトリミング

つぎに画像のトリミングです。赤枠を選びます。

アイキャッチ画像

次にこのように画像をドラッグし、数値を見ながら448×252でOKするとトリミングします。ちょうどの数値にならない場合は、画面上の表示倍率を+で拡大すれば簡単に合わせれます。

画像サイズで449にしたのは、なぜか画像サイズを448にすると、トリミングでは447×252になってしまうからです。

アイキャッチ画像

5、画像を保存

最後に画像保存で完成です。

アイキャッチ画像

 

【PR】アイキャッチ制作ならCanvaがおすすめ

以上のように地道につくるのもいいのですが、今ならCanvaがおすすめです。

→→→ Canva公式サイトはこちら

Canvaなら、ログインするとフリー画像・フリーフォント・フリー素材がすでに用意されていて、一つ一つ探すことがなく、すぐアイキャッチが作れます!

 

デザインも「Twitterの投稿」用のサイズがあり、とても簡単です。

 

このように、フリー素材・フリーフォント・フリー画像が用意されているので、とても楽。

完成したアイキャッチは、右上からダウンロード。

 

これで完成です。

どうですか?とても簡単ですよね!
ザブロー

こちらのページを参考に試してみてくださいね。

■目を引くアイキャッチ画像作成:https://www.canva.com/ja_jp/learn/create-eye-catch/
■SNS投稿用:https://www.canva.com/ja_jp/create/social-media-graphics/

Canvaは無料で使用することができます。

また、ダウンロードして使うソフトではなく、ブラウザ上で使用が可能なので、ぜひ気軽に使ってみてくださいね。

→→→ Canva公式サイトはこちら

 

まとめ

いかがでしたでしょうか。

これで画像が見切れることなく、アイキャッチとして機能してくれますね。

ぜひ、お試しあれ!!

今日はここまで!

ご視聴ありがとうございました!!

よろしければ、フォローお願いします。

follow us in feedly

こんな記事も書いています。

 

 

【PR】誰でも4ヶ月間、無料動画をタダで見れます!

ザブロー
合計4ヶ月も無料で見れるネット配信動画サービスをまとめました。
サービス名
(通常月額)
特徴 無料期間
DMM見放題chライト
(540円)
・月額が安い
・バラエティ系
・アイドル系が多い
・動画7000本

H系が2000本!
全部無料で見れる♡
14日間

FODプレミアム
(888円)
・フジテレビ系
・映画ドラマが多い
・オリジナル番組も
人気雑誌100詩の最新号も読み放題
・15万冊以上の漫画も!
30日間

U-NEXT
(1990円)
・最新映画が多い
・最新アニメも多い
動画見放題 14万本
・書籍漫画ラノベ、合計42万冊
雑誌読み放題70誌
31日間

Hulu
(933円)
海外ドラマが多い
・海外映画も多い
動画見放題 5万本
14日間

Amazonプライムビデオ
(400円)
・松本人志ドキュメンタル
・バチェラージャパン、ジャックライアンなどオリジナルが豊富
・月額費用が最安
・動画見放題 2.6万本
30日間





Copyright© ムビログ , 2019 All Rights Reserved.