ウェブ技術が好きjavascriptやcssやHTML5とかサーバーサイド等のウェブ技術全般を好きに書くブログこの広告は、90日以上更新していないブログに表示しています。bjimmy934WEBサイト制作会社やWEBインテグレーション事業にプログラマ・エンジニアとして携わっている方向けに、プログラマの立場から見たSEO対策の要点を説明します。SEOの仕様はGoogleが決めている以下記事の2015年8月時点での情報によると日本国内でのGoogleとYahooの検索エンジンシェアは93.69%です。Yahooの検索結果はGoogleを使っています。日本国内で使われている検索エンジンシェアほぼGoogleの独占状態にあります。業界ランキング」そしてGoogleはウェブマスター向けにガイドラインを案内しており、そこにSEOをサイトに実装する上で必要とする情報が記載されています。ウェブマスター向けモバイルガイドで説明されています。「スマホサイトでSEOしたい」となった時に見るのは上のリンク先ページです。ページ取得速度の改善ページの取得速度(HTMLファイルを返す速度)が検索結果の順位に大きな影響を与えています。そのためページ取得速度を速くする対応を行うのですが、この時にプログラム・エンジニアは以下の6つを明確に分けて高速化の判断をしています。サーバーのネットワーク環境サーバーの性能ミドルウェアアプリケーション本体(プログラム)アプリケーション以外のリソース(画像ファイル/CSSファイルなど)ユーザーの環境(利用ブラウザ・スマホ回線)「サイトが遅い」と現場に相談しに来たディレクターやマネージャと以下のような会話をする事があると思います。現場「だから何処が遅いの?」はい、ここでディレクターにイラっとされましたよね。現場としては「何が」遅いかが重要なので「どの部分が遅いのか教えてもらえませんか?」から始めましょう。中華料理と伝えるのと同じ理屈です。ページ表示速度の改善SEOではページ取得速度が重要ですが、ページ取得後の表示速度(HTML取得後に画像など表示されるまでの時間)もあんまりに遅いサイトではユーザーが直帰してしまいます。するとSEOで大切になるバックリンクの獲得やソーシャルシグナルを得る事が出来ないのでページ表示速度を改善します。ページ表示速度にはレンダリング時間とリソース取得時間の2つが大きく関係します。手短にレンダリングを高速化する方法を説明すると、レンダリングをブロックする要素を減らすか非同期にする事です。この方法についてもGoogleから情報が公開されています。リソース取得の高速化リソース取得を速くする方法を本当に簡単に説明するとリソースの量とリソース取得回数を減らす事です。具体的にはCSS/JSファイルのビルドツールを使ってリソース取得回数を減らす、画像最適化ツールを使ってJPEGを軽量化する等です。compressorQiitaに書いたサーバーサイドで画像最適化する方法を紹介します。Qiita今いち伝わらない方のために、リソース取得の高速化をコンビニ休憩に行く例で置き換えて説明します。コンビニ休憩には毎日行くものとします。晩だけの1日1回×お菓子とパン。RailsにはサイトにSEO機能を組み込むライブラリのmeta-tagsが公開されています。github.com各種メタタグの出力から始まってCanonicalやページネーション、og(オープングラフ)の出力をサポートします。以下記事がmeta-tagsの使い方を日本語で説明しており分かり易いと思います。morizyun.github.io殆どのサイトでこのSEO関連の機能は共通です。毎回サイトに合わせて新しく作るよりもライブラリ使って楽しましょう。必要なケースにてSEO業者には気をつけなさいと説明されている現状があります。野球を知らない人がバッターに「野球は木の棒をボールに当てるだけ」なんだから野球なんて簡単だろ?というネタがありますが、SEOな人たちも同じ事を言います。「そんなに簡単ならお前がやれよ」と言うと波が立つので、やんわりと全ての物事には一定の制約がある事を伝え、必要であれば何故それが的外れなのかを説明するのですが、この何も生み出さないやり取りに時間を取られるのが嫌です。2015年11月時点、サイト実装上で必要な技術的なSEO情報の多くはGoogleが公開しています。Landを追いかけていればほぼ網羅できます。SEOは古い知識が役に立たないため、SEOな人たちには「サイトに足りない部分をGoogleのリファレンスを元にして教えて下さい」と伝えるだけで無駄な時間が減ります。検索結果からページに訪れたユーザーを満足させるには、検索エンジンに表示されるページをランディングページとして機能させる事が重要です。平均PVを増やすためにページの導線修正ページ最適化機能をサイトに追加するには当然費用がかかるのと、以後のメンテナンスコストが掛かるので、それなら最初から「マーケティングオートメーションに月額払った方が良いんじゃないの?」と思う所です。HubSpot(ハブスポット)やMarketo(マルケト)に代表されるマーケティングオートメーションがページ最適化に特化した機能を備えています。ゼロベースの知識から一生懸命勉強してランディングページ最適化の機能を実装するよりも、最初からその機能が組み込まれているツールを使った方が的確に最適化が出来ます。プリレンダリングする場合Ajaxサイトでユーザーにまずプリレンダリングしたページを見せる場合に、サイトクロールしてプリレンダリング結果を出力するツールを自作する場合があります。ゼロから自作するよりも既存のツールを使った方が楽な事が多いので、積極的に以下のようなツールを使いましょう。prerender.iogithub.comまとめ。SEOが大切と分かっているので皆(基本的には)協力したいと思ってる検索エンジンの上位に表示され、たくさんの人にサイトを使ってもらえるのは嬉しいです。そのためにはSEOが必要で各ページにtitle/descriptionが適切に入力される仕組みにしただけでもSEO効果があるのは直ぐに理解できます。今はGoogleからドキュメントが提供されていますし、昔のように要領を得ない話やとんでもない与太話に振り回される事は減ったと思います。ウェブサイト側でSEOの仕組みを入れてもページ内容が充実しない限りは検索結果ページに上位表示されないので、ここを取り違えられて「サイト側にこの仕組みが入れば順位が爆上がり」と勘違いされている場合は例外的ですが協力に躊躇するでしょう。このような場合は誰だって躊躇します。どんなに素晴らしいウェブサイトでもプログラマ・エンジニアの協力が無ければ満足なSEO対策を出来ないのが今のSEOなので、従来のダーティーなSEOのイメージを捨てて、SEOの技術的な部分を勉強してみると面白い発見があると思います。最後に分からない点や気になる事があればコメント欄から質問してもらえればと思います。質問したい方はTwitterに連絡をもらえればと思います。月別アーカイブはてなブログをはじめよう!tkosugaさんは、はてなブログを使っています。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。