カテゴリー: ブログ

以前から、はてなブログの純正のSNSボタンが嫌いだったんですよね。

重いし、かっこ悪し、サイズが違うし・・・

色々試していたのですが、なかなかうまく動作するものが無く途方に暮れていたのですが、やっとこれだ！ってカスタマイズを見つけたので紹介しますね。

ちなみにコピペで簡単にできるので、3分もあれば完了します。

カスタマイズに当たって

私の様にコピペでブログのカスタマイズをしている人は、1点だけ注意してほしいのですが、カスタマイズしまくると「どれがどのカスタマイズか忘れてしまう」ので、必ずPC上のメモに「参考にしたURL・何のカスタマイズか・どこに張り付けたか」を記録しておきましょうね。

またCSSに記述する時、他のカスタマイズと競合してうまく表示されない可能性があります。

その時は、CSSにコピペするものを上の方に入れてみて下さい。

下のスクショは私がカスタマイズした時の物ですが、CSSの402行目に書いたときはボタンが小さく、色も黒だったのですが、CSSの9行目に書いたら下の画像の様にちゃんと表示されました。

もしうまく表示されない場合は、CSSの上の行に入れてみて下さい。

SNSボタンカスタマイズ

今回参考にさてもらったのは、いつもお世話になっているSHIROMAGさんからです。

まずは、「設定」→「詳細設定」→「headに要素を追加」に下記コードを入れます。

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">

このコードがすでにある人は、入れなくてOKです。

次は、ダッシュボードの「デザイン」→「カスタマイズ」から、記事の上にボタンを設置したい場合は「記事上」に。記事の下に設置したい場合は「記事下」に下記のコードを入れてください。

両方に入れたい場合は、「記事上」と「記事下」に。

<!-- ここからシェアボタン -->
<div class="share-btn-type2">
  <a href="http://b.hatena.ne.jp/entry/{URLEncodedPermalink}" data-hatena-bookmark-title="{Title}" data-hatena-bookmark-layout="simple" title="このエントリーをはてなブックマークに追加" class="share-btn__item share-btn__item--hatebu" target="_blank"><i class="blogicon-bookmark lg"></i></a>
  <a href="http://www.facebook.com/sharer.php?u={URLEncodedPermalink}" class="share-btn__item share-btn__item--facebook" onclick="window.open(this.href, 'FBwindow', 'width=650, height=450, menubar=no, toolbar=no, scrollbars=yes'); return false;" target="_blank"><i class="fa fa-facebook-square lg"></i></a>
  <a href="http://twitter.com/intent/tweet?text={Title} {URLEncodedPermalink}" class="share-btn__item share-btn__item--twitter" target="_blank"><i class="blogicon-twitter lg"></i></a>
  <a href="http://getpocket.com/edit?url={URLEncodedPermalink}" class="share-btn__item share-btn__item--pocket" target="_blank"><i class="fa fa-get-pocket"></i></a>
</div>
<!-- シェアボタンここまで -->

最後に「デザインCSS」に以下のコードを入れます。

/**
* シェアボタンここから
*/
.share-btn-type2 {
margin: 1.2em 0;
display: flex;
justify-content: space-between;
}
.share-btn-type2 .share-btn__item {
width: 24%;
height: 40px;
color: #fff;
font-size: 16px;
text-align: center;
line-height: 40px;
border-radius: 4px;
transition: all .3s;
}
.share-btn-type2 .share-btn__item--hatebu {
background-color: #00A4DE;
box-shadow: 0 4px #038ebf;
}
.share-btn-type2 .share-btn__item--facebook {
background-color: #1778F2;
box-shadow: 0 4px #1366ce;
}
.share-btn-type2 .share-btn__item--twitter {
background-color: #1BA1F3;
box-shadow: 0 4px #1280c3;
}
.share-btn-type2 .share-btn__item--pocket {
background-color: #EF4155;
box-shadow: 0 4px #c3293b;
}
.share-btn-type2 .share-btn__item:hover {
transform: translateY(4px);
box-shadow: 0 0 #333;
}
/**
* シェアボタンここまで
*/

先ほども言ったように、他のカスタマイズと競合してうまく表示されない場合は、CSSの上の方に入れてみて下さい。

レスポンシブにしていない人向け

ほとんどの人のブログはレスポンシブと思いますが、レスポンシブを使っていない人はスマホ用に追加のコードを入れます。

「スマホ」→「記事上」もしくは「記事下」。もしくは両方に下記のコードを入れます。

<style>
<!-- ここからシェアボタン -->
<div class="share-btn-type1">
<a href="http://b.hatena.ne.jp/entry/{URLEncodedPermalink}" data-hatena-bookmark-title="{Title}" data-hatena-bookmark-layout="simple" title="このエントリーをはてなブックマークに追加" class="share-btn__item share-btn__item--hatebu" target="_blank"><i class="blogicon-bookmark lg"></i></a>
<a href="http://www.facebook.com/sharer.php?u={URLEncodedPermalink}" class="share-btn__item share-btn__item--facebook" onclick="window.open(this.href, 'FBwindow', 'width=650, height=450, menubar=no, toolbar=no, scrollbars=yes'); return false;" target="_blank"><i class="fa fa-facebook-square lg"></i></a>
<a href="http://twitter.com/intent/tweet?text={Title} {URLEncodedPermalink}" class="share-btn__item share-btn__item--twitter" target="_blank"><i class="blogicon-twitter lg"></i></a>
<a href="http://getpocket.com/edit?url={URLEncodedPermalink}" class="share-btn__item share-btn__item--pocket" target="_blank"><i class="fa fa-get-pocket"></i></a>
</div>
<!-- シェアボタンここまで -->
</style>

これは先ほどのパソコン用とほぼ同じなのですが、styleタグで囲っています。

最後に

パソコンの表示はこんな感じです。

スマホはこんな感じです。

これでみなさんも、上のスクショのようなボタンが設置されたと思います。

見た目がWordpressっぽくなってかっこいいですよね。

これで読者もシェアだったりはてぶしやすくなるので、ページビューも上がりそうですよね。

その他のカスタマイズは、「カスタマイズ」をどうぞ。

以前からはてなブログで、画像遅延読み込みするLazy Loadの導入を考えていて、不具合が多かったのでやってなかったのですが、久しぶりにやってみたらほぼ誤作動なく動いたので、皆さんにも紹介しようと思います。

ちなみに私のサイトは、Innocentですが他のテーマでも動くと思います。

画像遅延読み込みとは？

画像遅延読み込みとは、その名の通り画像の読み込みを遅らせるものになります。

読者が記事をクリックし、ページが表示されたときに全部の画像を一気に読み込むとページの表示速度が落ちます。

なので、目視できない部分にある画像を読み込むのを遅らせるによって、ページの表示速度を上げるんです。

ページの表示速度が上がるのは、SEO的にも良いですよ。

私は今はWordpressを使っているのですが、Lazy Loadを使っていない人はいないと思います。みんな使っていますね。

注意点

Lazy Loadを使うにあたって4点ほど注意点があります。

1. グーグルクローラーが画像を認識しない（可能性があり）
2. 見たまま編集では画像が表示されない
3. 手作業が必要
4. 遅延されていない画像が時々ある

1　Lazy Loadを使うとグーグルクローラーが画像を認識しないらしいので、画像検索から流入がある人はよく検討してから導入するかしないか決めてください。

なぜ「らしい」と言ったかと言うと、WordpressのLazy Loadはクロールに認識されているので、はてなでもされるんじゃないかな？って思っています。

ただしalt属性を入れたら不具合になるので、どちらにしても画像検索から流入が無い人向けになります。

２　見たまま編集では画像が表示されなくなりますが、プレビューでは表示されているので、そちらで確認してください。

３　下で説明していますが、記事内の画像のHTMLを手作業で変えるので、ちょっと面倒です。

４　先ほど「ほぼ不具合が無い」と言ったのですが、「ほぼ」とは、時々遅延読み込みされない画像があるんです。

理由は分かりません。

Lazy LoadのCSS

まずはこちらのテストサイトをどうぞ。最後の写真は2MBの写真ですが、サイトが重くならずに表示されています。

参考にしたサイトは、PhotogLifeさんです。

Lazy Loadのコードの貼り付け場所は、「ダッシュボード」→「デザイン」→「カスタマイズ（レンチマーク）」→「フッタ」です。

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery_lazyload/1.9.7/jquery.lazyload.min.js"></script>
<script>
$('.lazy').lazyload({
effect : 'fadeIn',
threshold :200
});
</script>

ちなみに、jqueryを入れてない人は、下記のコードをフッタの一番最初に張り付けておいてください。でないと動作しないです。

<script type="text/javascript" src="https://cdn.blog.st-hatena.com/js/external/jquery.min.js?version=1.12.3"></script>

これで準備は終わったので、さっそくやってみましょう。

画像のコードを変える

まず、はてなブログに画像をアップロードし、HTML編集で見たら、画像のコードはこんな感じになっています。

<img src=”https://cdn-ak.f.st-hatena.com/images/fotolife/n/your name/20200121/20200121061709.jpg” alt=”f:id:your name:20200121061709j:plain” title=”f:id:your name:20200121061709j:plain” class=”hatena-fotolife” itemprop=”image” />

で、必要な部分は赤文字の部分です。

赤文字の部分を下のコードにコピペし、HTML編集で下記コードを貼り付ければ完成です。

<img class=”hatena-fotolife lazy” data-original=”赤文字部分を貼る“>

この例で言えば、こんな感じになります。

<img class=”hatena-fotolife lazy” data-original=”https://cdn-ak.f.st-hatena.com/images/fotolife/n/your name/20200121/20200121061709.jpg“>

最後に

皆さんは画像をアップロードするときに、リサイズと圧縮をしていると思うので、万が一画像が遅延されなくても大丈夫かと思います。

リサイズ？圧縮？って人は、「画像を圧縮して読み込み速度を上げる方法」を参考にどうぞ。

もし100KB以上の画像を記事に使うなら、記事を投稿後にグーグルのPagespeed Insightで読み込みが遅延になっているか確認してみて下さい。

その他のカスタマイズは、「カスタマイズ」をどうぞ。

はてなブログを始めて収益化を頑張っていると思いますが、調子はいかかですか？

収益上がってない？

離脱率が高い？

ページの読み込み速度ってかなり重要だって知っていましたか？

初心者の方に多いのですが、画像をそのままアップしている人が多いですね。

まずはサイトの表示速度と離脱率の因果関係をご紹介します。

重いサイト＝離脱率が高い

Googleは、モバイルサイトの読み込みが3秒以上かかると53％の訪問者がそのサイトを離脱する、との調査結果を発表しています。

読み込み時間と離脱者の割合はこのようになっています。

読み込み時間1秒で10人離脱したと仮定したら、

• 3秒で13.2人が離脱（32％増）
• 5秒で19人が離脱（90％増）
• 6秒で20.6人が離脱（106％増）
• 10秒で22.3人が離脱（123％増）

そう言われてみたら、皆さんもパッっと表示されないページをクリックしたら戻るボタン押してしまいますよね。

しかも5秒は待てても、10秒待つ人はいないですよね。

まずは皆さんも、自分のページの速度をチェックしてみて下さい。

• Testmysite（Googleの表示速度チェックツール）
• Pagespeed Insight
• Gtmetrix

上のサイトで検索すると落ち込む人もいるかもしれませんが、簡単にポイントを紹介します。

Pagespeed Insightのスコアはそこまで気にせずに、変更しなくちゃいけない点を見て、サイトのスピードアップに役立てましょう。

GtmetrixはAが一番いいですが、BくらいでもOKなのでそこまで気にせずに。

一番重要なのがTestmysiteで、これで平均以上の読み込み時間だったら真剣にブログの高速化をやりましょうね。

読み込み速度を上げる方法

コンサルをしていて一番多いのが、画像をそのままアップロードしている人が多すぎるということです。

「だって旅行ブログだから質が大事だし・・・」

「面倒くさいし・・・」

っていうのは、絶対にダメですよ。必ずリサイズをして、圧縮をしてアップロードします。

リサイズとはサイズ（ピクセル）を小さくして、サイズ（KB）も小さくします。

では今からその方法をご紹介しますね

サイズを小さくする方法

マックもWindowsも、標準機能でサイズの変更が簡単にできます。

マック・「写真を開く→上にあるツールをクリック→サイズを調整」で出来ます。

Windows・「ペイントを開く→貼り付け→ファイルの貼り付け→画像を選ぶ→サイズ変更→ピクセル→最後に好みの画像のサイズにします」

PicasaというGoogleの画像編集ソフトがあり、大したことができないですがリサイズが簡単にできるので私は主にPicasaを使っています。サービスは終了したとの事ですが、まだダウンロードできるので使えます。（ダウンロードPicasa）

Picasaは画像をドラッグして、下にあるエクスポートをクリックして画像のサイズを変更します。

Canvaも使っている人が多いですが、私は基本的にアイキャッチ画像に編集する時のみ使っています。

ちょっと前置きが長くなりましたが、どんなソフトを使ってもいいので、リサイズしてみて下さい。

＜画像はリサイズ前リサイズ後です＞

ブログ初心者の方は126KBは小さいって思うかもしれませんが、これってめちゃくちゃ大きいんですよね。

なので次に、画像を圧縮します。

画像を圧縮する方法

画像の圧縮はいたって簡単で、無料ですので必ずやってください。

私が昔から使っているのは、compressjpeg.comで、最近使いだしたのはiloveimgです。

iloveimgは圧縮率が高いのですが、自分で調節できないのがちょっと不満ですが悪くない程度に圧縮してくれます。

CompressjpegはアップロードするだけでOKですが、自分でも圧縮率を調整できるので、下の画像の様にやってみて下さい。

＜圧縮後のサイズ＞

私は記事内に入れる写真や画像は、50KB以下になるように圧縮しています。（最高で70KBまででやっています）

WordPressではLazy loadという画像遅延読み込みをするものを使っているのですが、はてなでもLazy loadができるカスタマイズがあります。

はてなブログでも使えるLazy Loadの詳細は、「はてなブログでLazy Loadを使う方法！コピペで簡単に使える！」をどうぞ。

最後に

ブログのトップページやヘッダーに画像を入れるとどうしても大きいサイズの画像が必要になって来るのでお勧めしませんが、ユーザビリティが損なわれないならデザイン優先でもいいかと思います。

ちなみに一つ情報ですが、私はアイキャッチ画像は1200X800の大きなサイズを使っています。それでもサイズは70KB以下にしています。

グーグル砲を狙うなら、このサイズですよ。

他にもこちら「今スグできるはてなブログの高速化・9つの対処法」で高速化について紹介しているので、参考にどうぞ。

みなさんは内部リンクをどうやって表示していますか？

こんな感じ↓で、ブログカードを使ってませんか？

最強最速サーバーConoHa WINGの登録方法を画像付きで紹介

これって重いし、あんまり効果が無いんですよね。

一般的に私たちはテキストリンクを使っています。

こんなやつですね。↓

例）ブログのカテゴリー

青くなったリンクで、クリックしたら指定のページに移動するものです。

しかもこのリンクは使い方によっては、すっごく効果があるので使い方を紹介します。

はてなブログでテキストリンクを使う方法

1　まずは入れたいリンクをコピーします。

2　文字をタイプして、リンクを入れたい部分を指定し、Ctrl+V（Windows）かCommand+V（Mac）でURLを貼り付けます。

3　リンク挿入のポップアップが出てくるので、この例で言うと「ここに」というものを選びます

ちなみに緑カッコの「URLを貼り付けた時にこのウィンドウを開く」にチェックが入っていない場合は、右上の「リンク」ボタンを押すと、このポップアップが出てきます。

リンクが付いたら「ここに」の様に青文字で表示されます。

テキストリンクを効率良く使う方法

さて、このリンクを有効に使う方法ですが、内部リンクはもちろん、アマゾンのリンクも場合によっては効果的です。

良い例

一概にブログカードがダメとは言えないのですが、記事に合うリンクを貼る場合には文章の中で紹介してリンクを貼る方法が、一番スムーズに読者を誘導できます。（スクショは、当ブログの他の記事より引用）

上の例のように文中にリンクを入れることによって、記事にフィットするし、興味が湧いてクリックされる確率も上がります。

とは言っても、中には「うまくフィットしない」、もしくは「リンクをフィットさせるために文を足したいが長くなりすぎる」なんて時もあります。

その時は、このようなものを使っています。

基本的に関連している記事を紹介しますが、時々関連が薄いものも紹介していますね。

また、アマゾンのリンクも、このようにテキストリンクを使うときも多いです。（Linkerも併用しています）

例）

こんな感じの↓リンカーもいいですが、文脈によってはテキストリンクが抵抗なくクリックされると思います。

悪い例

ブログカードは良し悪しあるのですが、私はあまり使わないし、↓このような使い方は良くないです。

誰もこれをクリックしないとは言いませんが、多くの人がクリックするかというと、首をかしげざるを得ないですね。

上の例を使えば、こういう風に書いた方がクリック率は上がります。

例）

ブログの収益を上げるには、アドセンスの配置の見直しや、アフィリエイトの紹介が一般的ですね。

アドセンスで収益を上げるならページビューがとにかく必要ですが、アフィリエイトであれば、1クリックで1万円も可能です。

まだASPに登録していない人は、「おすすめASP4社を紹介！ブロガーなら登録していないと損だよ」で詳しく各社の特徴を紹介しているので、こちらも参考にどうぞ。

どのリンクがクリックされているか調べる方法

実際は内部リンクすらない人が多いのですが、もしブログカードを多用してるのなら、リンクに変えてクリック率が上がるかどうかテストをしてみてください。

「テストしてと言ってもどうやって？」

Google Chromeの拡張機能でPage Analyticsがあるので、これを使います。

こちらのウェブストアに行き、Page Analyticsと検索して無料でダウンロードできます。

私はもうダウンロード済みなので「評価する」となっていますが、通常は「Chromeに追加」となっているので、クリックしてダウンロードします。

ちょっと見にくいですが、ウィンドウの右上にPage Analyticsのアイコンがでているので、調べたいページを開きアイコンををクリックします。（アナリティクスのページを開いていないと見れないときがあるので、そちらを別タブで開いておきましょう）

黒矢印のすぐ左に赤黄緑のアイコンがあるのでこれをクリックすると、内部リンクが色分けして表示されます。

これはサイドバーの人気記事ランキングですが、こちらもかなりクリックされています。

こちらは記事の中のテキストリンクですが、12％の人がこのリンクをクリックしています。 当然クリックされていないリンクには何も表示がされないので、１か月ほど様子を見て、リンクの張替えをやりましょう。

最後に

ブログによって差はあると思いますが、私はテキストリンクにして回遊率も上がったし、アマゾンの売り上げも上がったので、是非やってみてください。

ブログをこれからはじめる方、もしくはもう始めていてパソコンを買い替えようと思っている方に、どのパソコンが良いのかご紹介します。

ブロガーと言えばMacというイメージがあるかもしれませんが、予算が付けばそれもそれでいいと思います。

それでは、ブロガーのタイプ別に紹介していきます。

ブロガー必須機能

ブロガーが執筆作業で使う機能と言えば、以下のものでしょう。

• スクショ
• WordPressなどのブログ
• CanvaやPhotoshopなどの画像加工サイト
• 画像圧縮

これだけの機能を使うのであれば、高いパソコンじゃなくても大丈夫ですが、動画編集をする人は少し高めのパソコンが必要です。また、WordPressが快適に動作する程度の性能があった方がいいですね。

それでは、主なパソコンのスペック名と意味を紹介します。

CPUとはパソコンの頭脳になり、CPUに安いものを使っていると動きが遅くなります。ただし、2024年に購入する新品PCであれば、Core i3/Ryzen 3以上で十分です。

メモリは言わば、テーブルです。作業をするのに小さなテーブルでするか、大きなテーブルでするかという違いになります。ここ最近は8GBが標準になっていますが、長く使うことを考えると16GBモデルもよいですね。

ストレージは収納庫です。小さければこの収納庫がいっぱいになり、身動きが取れないので作業しにくい（遅い）ですが、大きければより多くのもの（データ）を収納できるので作業がしやすいです。OnedriveやGoogle Photoなどのクラウドを使用したら、256GBあれば十分です。

それでは以下にて、タイプ別に分けてご紹介します。

ブログ執筆のみで安く抑えたい人

この項目では、とにかく安くてぼちぼちの性能の機種を紹介します。長く使うには不便かもしれませんが、安いです。

HP 15-fc

こんなに安いのに、意外にしっかりとしたスペックで、Athlonモデルも意外に使いやすかったです。しかも意外に軽く、バッテリーも最大10時間あります。時々持ち運ぶ人にも合います

レビュー

公式サイト

IdeaPad Slim 170 15.6型 (AMD)

低価格モデルのSlim 1シリーズですが、筐体も小さく軽量、ベゼル（画面の黒い枠）も細く、外観は安っぽく見えません。性能は旧スペックを搭載していますが、Ryzen 5000/7000シリーズ搭載で、快適に使えます

レビュー

公式サイト

IdeaPad Slim 3 Chromebook Gen 8

2023年発売のLenovoノートパソコンで、一番コスパが高いんじゃないかと思う機種です。14インチで約1.3㎏と軽く、バッテリー駆動時間は最大約13.5時間、そしてWi-Fi 6にも対応です。ディスプレイはFHD IPS液晶で、なんとsRGB 100％の広色域です

レビュー

公式サイト

普段使いモデル

ここからはWordpressなども快適に作業ができるパソコンで、7万円前後からになります。

IdeaPad Slim 3i Gen 9 16

6万円台からと低価格ですが、16インチの大画面でアスペクト比が16:10と縦に長く、17インチ並みの情報が表示されます。指紋センサーやWi-Fi 6、そしてFHD Webカメラが搭載と、6万円台のPCとは思えないスペックです

レビュー

公式サイト

IdeaPad Slim 5 Light Gen 8(AMD)

IdeaPadの新シリーズで、Slim 5 Lightになります。ライトと言う名前から分かるように、14型で1.17㎏～と軽いんです。しかも、軽いだけじゃなくバッテリーも最大約17時間と長く、MILスペックに準拠した堅牢性もあるので、持ち運びにピッタリの機種です

レビュー

公式サイト

HP Pavilion Aero 13-be

今までのPavilionシリーズとは違い、プロ向けのスペックです。筐体にはマグネシウム合金を採用、画面の縦横比が16:10と縦に長く、Ryzen 7000シリーズが搭載です。総合的に見ても「欠点がない機種」で、一つ上のランクのPCをお探しの人におすすめです。

レビュー

公式サイト

Pavilion 15-eg

13世代CPUのCore i7が選べる本機種は、飛びぬけて高い性能になります。Iris Xe＋メモリ最大16GBなので動画・画像編集もやりやすいし、画面が大きいので作業がやりやすいです。また、テンキーも付いているので、エクセルを使った資料作成も快適です。理系の大学生や社会人にお勧めです。

レビュー

公式サイト

動画・画像編集をする人向け

以前であればグラフィックボードは必須でしたが、インテル14世代CPUが搭載した機種はかなりグラフィック性能が高いので、重たいゲーミングPCなどを持ち運ぶ必要もありません。

ただし、本格的なYouTuberや動画編集をメインにやっている人は、「動画編集用おすすめパソコン」も読んでみてください。

ThinkPad E14 Gen 6インテル

インテル14世代CPU搭載で最大でCore Ultra 7 155Hが選択できるハイスペックモデルです。メモリとストレージはスロットが2つずつあり、増設も可能です。インターフェイスが高品質で、USB4、USB 3.2 Gen 2×2、Gen 2とGen 1があります。1.42㎏と平均的な重量で最大約9.2時間のバッテリー駆動時間。半日ほど外出先で作業をする人にちょうど良いスペックです。本機はビジネスPCなので、ビジネス系のブログをやっている人だと合うと思います

レビュー

公式サイト

Yoga 7i 2 in 1 Gen 9

インテル14世代CPU搭載でグラフィック性能が高くディスプレイも業務用モニターレベルのスペックで、一つ上の快適さがあるPCです。14インチで1.49㎏と軽量じゃない点が欠点ですが、それ以外はハイスペックです。

レビュー

公式サイト

IdeaPad Pro 5i Gen 9

Lenovo一発目の14世代PCは普段使い用のIdeaPadからで、Proモデルのハイスペック機種です。ディスプレイが特に高品質で2.8K OLED（IPSもあり）、高色域のDCI-P3 100％＋10bit表示で業務用スペックです。全体的に欠点がない機種で、持ち運び兼据え置き用に合うクリエイターPCです

レビュー

公式サイト

IdeaPad Slim 5i Gen 9

普段使い用のPCとは思えないスペックで、インターフェス以外は全体的にハイエンドモデルです。特にグラフィック性能が高く、計測したベンチマークは、GTX 1650 Max-Qよりもすべて高かったです。ディスプレイは最高でOLED＋DCI-P3 100％を選べるので、クリエイターにも合う機種です

レビュー

公式サイト

旅行系のブロガーにおすすめ

旅行が多い人は「頑丈で持ち運び重視」の小型機種がいいです。パソコンが大きいと重いしカバンがかさばるし、あまりいいことないですね。

もっと詳しく計量モデルを見たい方は、20機種以上紹介している「1㎏以下のノートパソコン特集」も読んでみてください。

ASUS Zenbook S 13 OLED

13,3インチで1㎏、しかも2.8K解像度にOLED液晶を搭載して、バッテリー駆動時間は最大約14.1時間と長いです。キーピッチも大きく、リフトアップヒンジを採用しているので、タイピングがしやすいです

レビュー

公式サイト

ThinkPad X1 Carbon Gen 12

旧モデルから大きく変化したGen 12です。第14世代CPU搭載で、メモリやストレージなども最新スペック満載です。キーボードには感圧クリックパッドを選べたり、コミュニケーションバーが搭載したりと、中も外も大きな変化があります。必要な機能は何でもあるんじゃ？というくらい最先端で快適に使えるPCです。また、Evo Editionプラットフォーム認証にも準拠しています

レビュー

公式サイト

dynabook GZ/HW

IGZOの液晶パネルを搭載した超軽量ハイエンドモデルです。重量も軽くバッテリー駆動時間も24時間と長いですが、13.3型なら画面縦横比を16:10にしてほしかったのが本音。軽さを追求したためにこうなったと思います。ただし、13インチでLANポート搭載は貴重ですね。オニキスブルーとパールホワイトの二色あります

公式サイト

ThinkPad X1 Nano Gen 3

13インチで最軽量モデルが966.5gからと、ThinkPad最軽量モデルです。軽いだけじゃなくパワフルなスペックで、MILスペックに準拠した堅牢性もあります。バッテリー駆動時間も長く、毎日PCを持ち運ぶ人にピッタリの機種です

レビュー

公式サイト

最後に

こちら「Lenovoおすすめノートパソコン11選」では、ブロガー向けと言うわけじゃないですが多くの機種を紹介しているので、こちらも併せてどうぞ。

PC各社、セールも多くやっているので併せてどうぞ。

・PC各社のセール情報

数ヶ月前にはてなブログからwordpressに変更したのですが、はてなProの解約がうまくできていなかったので、使ってもないサービスに８４３４円が引き落とされていました。

そこそこいるようですね、こういった人たち。

解約するボタンもすっごくわかりにくいですもんね。

なぜ私が解約できていなかったのかを紹介しつつ、解約方法をお伝えしますので、みなさんはこんなヘマをしないように！

解約できていなかった理由

いくつか要因はあるのですが、まずは解約のページに「解約は期間が終了後」などの注意書きなど何もなかったので、今解約したらすぐに解約になると思ったんです。

しかも、下のスクショを見て欲しいのですが、「引き落とし時点でカードが無効になっている場合は解約になる」と書いてあるんですね。なので、同じページにある「カード情報の更新」から、カード情報を消せばいいと思ったんです。

なので、同じページの「カード情報の更新」からクレカの情報を消そうと思ったんですね。

ただ、クリックするとクレカの情報は何も書いてないので、「もう情報を消したんだ」と思い、そのままにしていました。

上記のように色々な要因があって、解約に至ってなかったのでお金が引き落とされたんです・・・。ってゆーか、なんでクレカの情報を消すことができないんでしょうね？解約させたくないんでしょうね。

一応はてなの運営に上記のことを伝え返金を求めましたが、返金は無理でしたね(笑)。

それでは、今から解約方法をご紹介します！

はてなPro解約方法

まずはダッシュボード画面で、左の一番下にある「アカウントの設定」をクリックし、次に「はてなブログProの利用状況を見る」をクリック。

すると下の画像のページに行きます。

このページには、ご利用に当たってや、よくある質問など解約させたくないが為に無駄にコンテンツを入れたようになっていますが、一番下までいくと小さく「はてなブログProを解約」とあるので、これをクリックします。

この文言だけを見ると今すぐ解約しそうな勢いですが、契約期間が終わってからの解約です。

クリックすると、アンケートが出てくるのでこれに答えて、最後に「送信して進む」を押します。

するともう一度確認のページが出てくるので、最後の最後に「はてなブログProの解約を申し込む」をクリック。

これで完了です！下の画像のような画面に行くので、そこに「解約申し込みを受け付けました」とあれば、バッチリです。

最後に

これで迷わずに解約できると思います。

お疲れ様でした。

今後はwordpressでブログをする方もいると思うので、それならばこちらの記事も一緒にどうぞ。

• 使ったからおすすめするwordpress有料テーマ8選
• 完全マニュアル！はてなブログからWordpressに引越し後にやらないといけないこと
• WordPressに移動後、関連コンテンツが表示されない人必見の対処法