<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>SEO &#8211; 副業の図書館</title>
	<atom:link href="https://manabuonline.com/category/blog/seo/feed/" rel="self" type="application/rss+xml" />
	<link>https://manabuonline.com</link>
	<description></description>
	<lastBuildDate>Tue, 05 Apr 2022 01:02:49 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.8.5</generator>

<image>
	<url>https://manabuonline.com/wp-content/uploads/2021/03/favicon_01-150x150.png</url>
	<title>SEO &#8211; 副業の図書館</title>
	<link>https://manabuonline.com</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>初心者でもできる！ページスピードを改善する7つの方法</title>
		<link>https://manabuonline.com/howto-pagespeed-up/</link>
					<comments>https://manabuonline.com/howto-pagespeed-up/#respond</comments>
		
		<dc:creator><![CDATA[みや]]></dc:creator>
		<pubDate>Mon, 04 Apr 2022 13:00:56 +0000</pubDate>
				<category><![CDATA[SEO]]></category>
		<guid isPermaLink="false">https://manabuonline.com/?p=1795</guid>

					<description><![CDATA[<p><img src="https://manabuonline.com/wp-content/uploads/2022/04/pagespeed-ic.png" class="webfeedsFeaturedVisual" /></p>ページスピードとは、あなたのサイトが表示されるときに読み込みにどのくらいの時間がかかるのか、というものです。 ページスピードは、早ければ早いほど良いといわれていますが、 どうしてページスピードが早い方がいいの？ ページス [&#8230;]]]></description>
										<content:encoded><![CDATA[<p><img src="https://manabuonline.com/wp-content/uploads/2022/04/pagespeed-ic.png" class="webfeedsFeaturedVisual" /></p>
<p>ページスピードとは、<strong><span class="swl-marker mark_orange">あなたのサイトが表示されるときに読み込みにどのくらいの時間がかかるのか</span></strong>、というものです。</p>



<p><span class="sbd-text-red">ページスピードは、早ければ早いほど良い</span>といわれていますが、</p>



<div class="wp-block-group has-border -border04 is-style-stitch has-swl-pale-02-background-color has-background"><div class="wp-block-group__inner-container">
<ul class="is-style-check_list wp-block-list"><li>どうしてページスピードが早い方がいいの？</li><li>ページスピードってどうやって測ればいいの？</li><li>どうやったらページスピードを上げられるのかわからない！</li></ul>
</div></div>



<p>という方もいらっしゃるのではないでしょうか。</p>



<p>この記事では、<strong><span class="swl-marker mark_orange">ページスピードの重要性や遅くなる原因、自分のサイトのページスピードの測り方</span></strong>について解説します。</p>



<p><strong><span class="swl-marker mark_orange">ページスピードが遅い場合の対策</span></strong>についても、初心者ができることに絞って書いてますので、ぜひ最後までごらんください。</p>



<p> </p>



<p class="is-style-balloon_box2">この記事を書いている私自身も、ページスピードを測定してみたら予想よりはるかに数値が悪かったのですが、カンタンな対策でここまで改善できました。</p>



<figure class="wp-block-image size-full is-style-shadow"><img decoding="async" width="800" height="600" src="https://manabuonline.com/wp-content/uploads/2022/04/pagespeed.png" alt="" class="wp-image-1820" srcset="https://manabuonline.com/wp-content/uploads/2022/04/pagespeed.png 800w, https://manabuonline.com/wp-content/uploads/2022/04/pagespeed-300x225.png 300w, https://manabuonline.com/wp-content/uploads/2022/04/pagespeed-768x576.png 768w" sizes="(max-width: 800px) 100vw, 800px" /></figure>



<h2 class="wp-block-heading">ページスピードを上げる重要性</h2>



<figure class="wp-block-image size-full is-style-shadow"><img decoding="async" width="800" height="533" src="https://manabuonline.com/wp-content/uploads/2022/04/s013.jpg" alt="" class="wp-image-1844" srcset="https://manabuonline.com/wp-content/uploads/2022/04/s013.jpg 800w, https://manabuonline.com/wp-content/uploads/2022/04/s013-300x200.jpg 300w, https://manabuonline.com/wp-content/uploads/2022/04/s013-768x512.jpg 768w" sizes="(max-width: 800px) 100vw, 800px" /></figure>



<p>ページスピードが遅いといったいどんな影響があるのでしょうか？</p>



<h3 class="wp-block-heading">ページスピードはSEOにも影響する</h3>



<p>Googleでは、<a rel="noreferrer noopener" href="https://developers.google.com/search/blog/2018/01/using-page-speed-in-mobile-search?hl=ja" target="_blank">ページの読み込み速度</a><a rel="noreferrer noopener" href="https://developers.google.com/search/blog/2018/01/using-page-speed-in-mobile-search?hl=ja" target="_blank">を</a><a rel="noreferrer noopener" href="https://developers.google.com/search/blog/2018/01/using-page-speed-in-mobile-search?hl=ja" target="_blank">ランキング要素に使用する</a>と明言しています。</p>



<p>カンタンに言うと、『<span class="sbd-text-red"><span class="swl-marker mark_orange">読み込みが遅いサイトは順位が上がらない可能性がある</span></span>』ということです。</p>



<p>どんなに内容が役に立つものでも、ベージスピードが遅いために順位が上がらないなんて悔しいですよね。</p>



<h3 class="wp-block-heading">離脱率・直帰率が高くなる</h3>



<p>また、ページスピードは、<span class="sbd-text-red"><span class="swl-marker mark_orange">離脱率・離脱率にも関係</span></span>してきます。</p>



<p>ページを開くのに<a href="https://www.thinkwithgoogle.com/consumer-insights/consumer-trends/mobile-site-load-time-statistics/" target="_blank" rel="noreferrer noopener">3秒以上かかると53％の人が離脱する</a>というデータがあります。</p>



<p>せっかく検索からページをクリックしてくれたのに、ページスピードが遅いために他のサイトに行かれてしまったり、ページを閉じられてしまうのです。</p>



<h3 class="wp-block-heading">読者満足度が下がり売上につながらない</h3>



<p>ページスピードが遅いと、せっかく記事を読んでくれても読者をイライラさせてしまうかもしれません。</p>



<p>記事の内容よりも、ページがなかなか表示されないことの方が気になってしまうのです。</p>



<p>記事を読んでくれた読者の満足度は下がりますし、そんなサイトから商品を買おうと思ってくれる読者もいません。</p>



<p><span class="sbd-text-red"><span class="swl-marker mark_orange">ページスピードは、売上にも直結する問題</span></span>なのです。</p>



<h2 class="wp-block-heading">ページスピードが遅くなる原因</h2>



<figure class="wp-block-image size-full is-style-shadow"><img decoding="async" width="640" height="478" src="https://manabuonline.com/wp-content/uploads/2022/04/s014.jpg" alt="" class="wp-image-1845" srcset="https://manabuonline.com/wp-content/uploads/2022/04/s014.jpg 640w, https://manabuonline.com/wp-content/uploads/2022/04/s014-300x224.jpg 300w" sizes="(max-width: 640px) 100vw, 640px" /></figure>



<p>ページスピードが遅くなる主な原因は以下の通りです。</p>



<div class="wp-block-group has-border -border04 is-style-bg_grid"><div class="wp-block-group__inner-container">
<ul class="is-style-check_list wp-block-list"><li>サーバーのメモリー容量</li><li>画像サイズが大きい</li><li>JavaScriptやcssをたくさん使っている</li><li>外部ファイルの読み込み</li><li>不要なテーマやプラグイン</li></ul>



<p>など</p>
</div></div>



<p>これらを最適化することで、ページスピードを上げることができます。</p>



<h2 class="wp-block-heading">ページスピードを測る方法</h2>



<figure class="wp-block-image size-full is-style-shadow"><img decoding="async" width="800" height="600" src="https://manabuonline.com/wp-content/uploads/2022/04/s015.jpg" alt="" class="wp-image-1846" srcset="https://manabuonline.com/wp-content/uploads/2022/04/s015.jpg 800w, https://manabuonline.com/wp-content/uploads/2022/04/s015-300x225.jpg 300w, https://manabuonline.com/wp-content/uploads/2022/04/s015-768x576.jpg 768w" sizes="(max-width: 800px) 100vw, 800px" /></figure>


<div class="swell-block-balloon"><div class="c-balloon -bln-left" data-col="blue"><div class="c-balloon__icon -square"><img decoding="async" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" data-src="https://manabuonline.com/wp-content/uploads/2021/01/soudansya02.jpg" alt="" class="lazyload c-balloon__iconImg" width="80px" height="80px"><noscript><img decoding="async" src="https://manabuonline.com/wp-content/uploads/2021/01/soudansya02.jpg" alt="" class="c-balloon__iconImg" width="80px" height="80px"></noscript><span class="c-balloon__iconName">相談者さん</span></div><div class="c-balloon__body -speaking -border-none"><div class="c-balloon__text">
<p>ページスピードの重要性は理解できたけど、自分のサイトがどれくらいのページスピードなのかがわからない</p>
<span class="c-balloon__shapes"><span class="c-balloon__before"></span><span class="c-balloon__after"></span></span></div></div></div></div>


<p>ページスピードを測る方法は、『 <strong>PageSpeed Insights </strong>』を使います。</p>



<p>これは、<span class="sbd-text-red"><span class="swl-marker mark_orange">Googleが提供してくれている無料でページスピードを測れるツール</span></span>です。</p>



<div class="swell-block-step is-style-small" data-num-style="circle">
<div class="swell-block-step__item"><div class="swell-block-step__number"><span class="__shape u-col-main" role="presentation"></span><span class="__label">STEP</span></div><div class="swell-block-step__title u-fz-m">PageSpeed Insightsを開く</div><div class="swell-block-step__body">
<p>サイトはこちらになります。&gt;&gt;<a href="https://pagespeed.web.dev/" target="_blank" rel="noreferrer noopener">PageSpeed Insights</a></p>
</div></div>



<div class="swell-block-step__item"><div class="swell-block-step__number"><span class="__shape u-col-main" role="presentation"></span><span class="__label">STEP</span></div><div class="swell-block-step__title u-fz-m">サイトURLを入力</div><div class="swell-block-step__body">
<p>ページスピードを調べたいサイトのURLを入力し『分析』をクリック</p>
</div></div>



<div class="swell-block-step__item"><div class="swell-block-step__number"><span class="__shape u-col-main" role="presentation"></span><span class="__label">STEP</span></div><div class="swell-block-step__title u-fz-m">結果表示</div><div class="swell-block-step__body">
<p>しばらく待つと結果が表示されます。</p>
</div></div>
</div>



<h2 class="wp-block-heading">ページスピードを上げる7つの改善方法</h2>



<figure class="wp-block-image size-full is-style-shadow"><img decoding="async" width="640" height="427" src="https://manabuonline.com/wp-content/uploads/2022/04/s016.jpg" alt="" class="wp-image-1847" srcset="https://manabuonline.com/wp-content/uploads/2022/04/s016.jpg 640w, https://manabuonline.com/wp-content/uploads/2022/04/s016-300x200.jpg 300w" sizes="(max-width: 640px) 100vw, 640px" /></figure>



<p>ページスピードを上げるためにできることをみてみましょう。</p>



<div class="wp-block-group has-border -border04 is-style-bg_grid"><div class="wp-block-group__inner-container">
<ol class="is-style-num_circle wp-block-list"><li>シェアボタンをはずす</li><li>背景に画像を設定しない</li><li>メインビジュアル非表示</li><li>記事スライダー非表示</li><li>ピックアップバナーデザイン</li><li>不要なテーマなどを削除</li><li>画像サイズを圧縮する</li></ol>
</div></div>



<p>初心者でもできるカンタンな対策のみピックアップしてみました。</p>



<h3 class="wp-block-heading">シェアボタンをはずす</h3>



<figure class="wp-block-image size-full is-style-shadow"><img decoding="async" width="800" height="231" src="https://manabuonline.com/wp-content/uploads/2022/04/share-button.png" alt="" class="wp-image-1829" srcset="https://manabuonline.com/wp-content/uploads/2022/04/share-button.png 800w, https://manabuonline.com/wp-content/uploads/2022/04/share-button-300x87.png 300w, https://manabuonline.com/wp-content/uploads/2022/04/share-button-768x222.png 768w" sizes="(max-width: 800px) 100vw, 800px" /></figure>



<p>なにも考えずにSNSのシェアボタンを表示させていませんか？</p>



<p>このボタンからシェアされたことがあるという方はどのくらいいるのでしょう？</p>



<p>もしあなたが「一度もシェアされたことがない」というならはずして大丈夫です。</p>



<p>ちなみに私も3年ほどブログをやっていますが、<strong><span class="swl-marker mark_orange">一度もこのボタンからシェアされたことはない</span></strong>ので、はずしました。</p>



<h3 class="wp-block-heading">背景に画像を設定しない</h3>



<p><span class="sbd-text-red"><span class="swl-marker mark_orange">背景に画像を設定すると、サイトが重くなるので、設定はしない</span></span>ようにしましょう。</p>



<p>WordPressカスタマイズのサイト全体設定→基本デザインをクリックします。</p>



<figure class="wp-block-image size-full is-style-shadow"><img decoding="async" width="644" height="472" src="https://manabuonline.com/wp-content/uploads/2022/04/background01-1.png" alt="" class="wp-image-1836" srcset="https://manabuonline.com/wp-content/uploads/2022/04/background01-1.png 644w, https://manabuonline.com/wp-content/uploads/2022/04/background01-1-300x220.png 300w" sizes="(max-width: 644px) 100vw, 644px" /></figure>



<p>一番下のところに『ページ背景』の設定画面がありますので、もし画像を設定している場合は削除しましょう。</p>



<figure class="wp-block-image size-full is-style-shadow"><img decoding="async" width="629" height="520" src="https://manabuonline.com/wp-content/uploads/2022/04/background02.png" alt="" class="wp-image-1828" srcset="https://manabuonline.com/wp-content/uploads/2022/04/background02.png 629w, https://manabuonline.com/wp-content/uploads/2022/04/background02-300x248.png 300w" sizes="(max-width: 629px) 100vw, 629px" /><figcaption>どうしても入れたい場合は、せめてPCの方だけにしましょう。</figcaption></figure>



<h3 class="wp-block-heading">メインビジュアル非表示</h3>



<p>メインビジュアルとは、トップページの一番最初に目に入る画像のことです。ここにカッコいい画像があると、おしゃれに見えますよね。</p>



<p>ただ<span class="sbd-text-red">画像サイズが大きいと、読み込みが遅く</span>なります。<strong><span class="swl-marker mark_orange">表示させないか、画像サイズを小さく</span></strong>しましょう。</p>



<figure class="wp-block-image size-full is-style-shadow"><img decoding="async" width="646" height="526" src="https://manabuonline.com/wp-content/uploads/2022/04/top-main-visual.png" alt="" class="wp-image-1833" srcset="https://manabuonline.com/wp-content/uploads/2022/04/top-main-visual.png 646w, https://manabuonline.com/wp-content/uploads/2022/04/top-main-visual-300x244.png 300w" sizes="(max-width: 646px) 100vw, 646px" /></figure>



<p>WordPressカスタマイズのトップページ→メインビジュアルから設定できます。</p>



<h3 class="wp-block-heading">記事スライダー非表示</h3>



<p>記事スライダーとは、オススメの記事がグルグル流れていく表示方法のことです。自分の好きなページを表示させることができるので人気ですが、これもページスピードが重くなる原因の一つです。</p>



<p><strong><span class="swl-marker mark_orange">見てほしい記事は、個別にトップページに貼り付けるなどして、記事スライダーは使わない</span></strong>ようにしましょう。</p>



<figure class="wp-block-image size-full is-style-shadow"><img decoding="async" width="646" height="526" src="https://manabuonline.com/wp-content/uploads/2022/04/top-slider.png" alt="" class="wp-image-1835" srcset="https://manabuonline.com/wp-content/uploads/2022/04/top-slider.png 646w, https://manabuonline.com/wp-content/uploads/2022/04/top-slider-300x244.png 300w" sizes="(max-width: 646px) 100vw, 646px" /></figure>



<p>WordPressカスタマイズのトップページ→記事スライダーから設定できます。</p>



<h3 class="wp-block-heading">ピックアップバナーデザイン</h3>



<p>ピックアップバナーのデザインを凝ってしまい、画像が重くなることがあります。私は画像をやめて、単色背景でピックアップバナーを作りました。</p>



<figure class="wp-block-image size-full is-style-shadow"><img decoding="async" width="646" height="526" src="https://manabuonline.com/wp-content/uploads/2022/04/top-pickup.png" alt="" class="wp-image-1834" srcset="https://manabuonline.com/wp-content/uploads/2022/04/top-pickup.png 646w, https://manabuonline.com/wp-content/uploads/2022/04/top-pickup-300x244.png 300w" sizes="(max-width: 646px) 100vw, 646px" /></figure>



<p>WordPressカスタマイズのトップページ→ピックアップバナーから設定できます。</p>



<h3 class="wp-block-heading">不要なテーマなどを削除</h3>



<p><span class="sbd-text-red">不要なテーマやプラグインは削除</span>しましょう。外観→テーマで、入っているテーマを見ることができます。</p>



<figure class="wp-block-image size-full is-style-shadow"><img decoding="async" width="800" height="242" src="https://manabuonline.com/wp-content/uploads/2022/04/delete-theme01.png" alt="" class="wp-image-1837" srcset="https://manabuonline.com/wp-content/uploads/2022/04/delete-theme01.png 800w, https://manabuonline.com/wp-content/uploads/2022/04/delete-theme01-300x91.png 300w, https://manabuonline.com/wp-content/uploads/2022/04/delete-theme01-768x232.png 768w" sizes="(max-width: 800px) 100vw, 800px" /></figure>



<p>デフォルトで入っていた『 Twenty Twenty-Two 』をクリックします。</p>



<figure class="wp-block-image size-full is-style-shadow"><img decoding="async" width="800" height="480" src="https://manabuonline.com/wp-content/uploads/2022/04/delete-theme02.png" alt="" class="wp-image-1838" srcset="https://manabuonline.com/wp-content/uploads/2022/04/delete-theme02.png 800w, https://manabuonline.com/wp-content/uploads/2022/04/delete-theme02-300x180.png 300w, https://manabuonline.com/wp-content/uploads/2022/04/delete-theme02-768x461.png 768w" sizes="(max-width: 800px) 100vw, 800px" /></figure>



<p>詳細画面の右下の『削除』をクリックします。</p>



<h3 class="wp-block-heading">画像サイズを圧縮する</h3>



<p><span class="sbd-text-red"><span class="swl-marker mark_orange">サイトが重くなる原因の一番大きいものが、画像サイズが大きすぎる</span></span>ということです。</p>



<p>最近のカメラは高性能なので、<strong>撮った写真そのままだとサイズが大きい</strong>のです。</p>



<p>画像サイズは小さくしてからサイトにアップロードしましょう。</p>



<p class="is-style-balloon_box2">画像サイズを圧縮するためのツール</p>



<div class="wp-block-group has-border -border04 is-style-bg_grid"><div class="wp-block-group__inner-container">
<ul class="is-style-check_list wp-block-list"><li><a rel="noreferrer noopener" href="https://tinypng.com/" target="_blank">TinyPING</a></li><li><a rel="noreferrer noopener" href="https://www.jpegmini.com/" target="_blank">JPEGmini</a></li><li><a rel="noreferrer noopener" href="https://ja.wordpress.org/plugins/ewww-image-optimizer/" target="_blank">EWWW Image Optimizer</a>（WordPressプラグイン）</li></ul>
</div></div>



<p>私が一番よく使うのは<a rel="noreferrer noopener" href="https://tinypng.com/" target="_blank">TinyPING</a>です。</p>



<figure class="wp-block-image size-full is-style-shadow"><img decoding="async" width="800" height="473" src="https://manabuonline.com/wp-content/uploads/2022/04/tinypng.png" alt="" class="wp-image-1826" srcset="https://manabuonline.com/wp-content/uploads/2022/04/tinypng.png 800w, https://manabuonline.com/wp-content/uploads/2022/04/tinypng-300x177.png 300w, https://manabuonline.com/wp-content/uploads/2022/04/tinypng-768x454.png 768w" sizes="(max-width: 800px) 100vw, 800px" /></figure>



<p>①の枠内をクリックして画像を選択します。すると圧縮が始まります。（②のところに進捗状況が出ます）</p>



<p>③のところでダウンロードをします。</p>



<p class="is-style-balloon_box2">WebP化するには</p>



<div class="wp-block-group has-border -border04 is-style-bg_grid"><div class="wp-block-group__inner-container">
<ul class="is-style-check_list wp-block-list"><li><a rel="noreferrer noopener" href="https://ja.wordpress.org/plugins/ewww-image-optimizer/" target="_blank">EWWW Image Optimizer</a>（WordPressプラグイン）</li><li><a href="https://saruwakakun.com/tools/png-jpeg-to-webp/" target="_blank" rel="noreferrer noopener">サルカワ道具箱</a></li></ul>
</div></div>



<p>WebP（ウェッピー）とは、Google公式の画像形式です。<span class="sbd-text-red">圧縮率が高く、画像サイズを軽量化</span>することができます。</p>



<p>『<a rel="noreferrer noopener" href="https://ja.wordpress.org/plugins/ewww-image-optimizer/" target="_blank">EWWW Image Optimizer</a>』で設定すると、画像のWebP化ができます。これが一番手間がかからずカンタンです。</p>



<p>『EWWW 〜』は、私が使っているテーマSWELLとは相性が良くないようなので、入れていません。</p>



<p>そんな方には『<a rel="noreferrer noopener" href="https://saruwakakun.com/tools/png-jpeg-to-webp/" target="_blank">サルカワ道具箱</a>』をオススメします。一括でカンタンに画像のWebP化ができますよ。</p>



<h2 class="wp-block-heading">まとめ：すぐに対策をしてサイトスピードを改善しよう</h2>



<figure class="wp-block-image size-full is-style-shadow"><img decoding="async" width="640" height="453" src="https://manabuonline.com/wp-content/uploads/2022/04/s017.jpg" alt="" class="wp-image-1848" srcset="https://manabuonline.com/wp-content/uploads/2022/04/s017.jpg 640w, https://manabuonline.com/wp-content/uploads/2022/04/s017-300x212.jpg 300w" sizes="(max-width: 640px) 100vw, 640px" /></figure>



<p><strong><span class="swl-marker mark_orange">ページスピードの重要性や遅くなる原因、自分のサイトのページスピードの測り方</span></strong>について解説してきました。</p>



<p>この記事で書いた<strong><span class="swl-marker mark_orange">ページスピードが遅い場合の対策</span></strong>は、初心者ができるカンタンなことだけにしぼりました。</p>



<p>実際に私自身もこの対策を行なうことで、ページスピードの数値が上がりましたので、ぜひやってみてくださいね。</p>
]]></content:encoded>
					
					<wfw:commentRss>https://manabuonline.com/howto-pagespeed-up/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
	</channel>
</rss>
