静岡のHP屋コラム

スマホ向けページが検索順位評価の基準になる？の記事でも紹介しましたが、今後しばらくはスマホ向けページの内容が重要視される傾向にあります。

そんな中、Googleがスマホ対応についてホームページを採点してくれるツール「Mobile Website Speed Testing Tool - Google」を公開しました。

使い方は簡単で、採点したいページのアドレスを入力して、「TEST NOW」ボタンを押すだけ。

すると、採点が始まります。結果が出るまで少し待ちます。

数秒程度待つと、採点結果を表示してくれます。

左の「MOBILE FRIENDLINESS」が、スマホ対応度合
真ん中の「MOBILE SPEED」が、スマホでの表示速度
右の「DESKTOP SPEED」が、パソコンでの表示速度、となっています。

どうやら、緑文字がOK、黄色文字がまぁまぁ、赤文字が改善したほうがいいよ、の様です。
このサイトのセミナーページは、スマホ対応OK、表示速度もとりあえず大丈夫のようです。

ちなみに、Yahoo!JAPANのページの採点結果はこちら。

近年では、来店での購入がメインの店舗でも、「まず、ネットで調べてから」が当たり前の行動になってきており、多くの人が何らかの形で事前にホームページで情報収集する傾向にあります。

実店舗で購入するにしろ、ネットで購入するにしろ、大多数の人がネットで検索して候補を絞り込んでいるのが現状です。ネットショップを運営していないお店であれば、「店頭で買った方がいい理由」をホームページにきちんと記載しておきましょう。

購入後のアフターフォローに関する情報や店内の雰囲気はもちろんのこと、接客するスタッフの顔があらかじめ分かっていたり他のお客様の感想などが見れたりすると、お客様は安心するものです。どんな業種でも「ホームページを見てもらって、購入の最終候補に残る」ことを意識してホームページを見てもらいましょう。

Webサイトを作っていくうえで、欠かせない要素である文字フォント。
どんなフォントを使うかによってサイトの雰囲気は大きくことなります。

Webサイトを見る人の端末は多種多少でありインストールされているフォントも人それぞれです。
そのため、WEBサイトは閲覧する端末によって少しずつフォントが違くなってしまいます。

WebフォントとはWebサーバにフォントデータを設置し、どの端末でみても上記のようなフォントの差異をなくすための同じ技術です。

今回はそのWebフォント(Noto Sans Japanese※)の実装方法を簡単にご紹介します。

※このフォントはGoogleとAdobeが共同開発したフォントです。無料で使用することができ、対応している文字も多いため、Webフォントを使ってみたい人にはおすすめのフォントです。

まずはWebサイトに使うフォントを読み込みます。
今回試すフォントはGoogleのサーバ上で公開されているため、以下の1行をCSSファイルに記載するだけでオッケーです。

※Noto Sans Japanese以外を使う場合

Noto Sans Japaneseと同じようにGoogleが公開しているようなフォントであれば、上記のパスを書き換えてください。
その他のファイルを使う場合はフォントデータをサーバに設置し、そのデータをCSSで読み込むようにしましょう。

ステップ1で読み込んだため、あとは通常のフォント指定と同じように使用したい要素やクラス・IDなどに指定すれば使用できます。

こんな感じ(SampleClassというクラスに指定する場合)

もしくはHTMLに直接以下のように書いてもいいでしょう・

たったこれだけで設置完了です。
上の2ステップを行ってしまえばWebフォントを使うことができます。

上記までで設置方法の説明は終わりましたので、実際に使ってみたいと思います。

以下にNoto Sans Japaneseを使っていない文章と適用した文章の比較を載せてみます。

上記を見比べて頂ければ、フォントが違いが一目瞭然だと思います。
たった2ステップで端末に依存しないきれいなフォントを使うことができますので、使ったことがない方はぜひ試してみて下さい。

インターネットを使っていて「Not Found」または「ファイルが見つかりません」などと表示されたことはありませんか？

これは閲覧しようとしたページがホームページ上にないという意味のエラーで、「404エラー」などと呼ばれます。

404という数字がでましたが、この数字には「HTTPステータスコード」という名前があります。
ホームページを見ようとした場合、PCやスマホからインターネットを通じてWEBサーバに「このURLのページを見たいです」という要求を通知します。
その要求に対してWEBサーバが応答した内容がHTTPステータスコードです。

HTTPステータスコードは3桁の数字でできており、大まかに

• 100番台 = 「処理中」
• 200番台 = 「処理成功」
• 300番台 = 「リダイレクト(転送)」
• 400番台 = 「クライアントエラー」
• 500番台 = 「サーバーエラー」

といった意味があると決められています。普通に閲覧している限りエラー以外を目にする機会はないので、400番台と500番台について簡単に説明していきます。

400番台は「クライアントエラー」、500番台は「サーバーエラー」と説明しましたが、そもそもクライアントエラーとサーバ―エラーと聞いてもピンとこない方も多いと思います。

ここでいうクライアントとはホームページを見ようしたPC(ブラウザ)のことを指しており、サーバとはホームページのデータを保存しているWebサーバを指しています。

そのため、クライントエラーはブラウザ側が原因で起こっているエラー、サーバエラーとはWebサーバ側が原因で起こっているエラーです。

今回はこの中でもよくみるHTTPステータスコードを3つ解説します。

撮った写真がなんとなく暗い…くすんでしまった…
そんな写真も「Pixlr Editor」を使えば、明るく綺麗な写真に変身させることが出来るかも？

※「Pixlr Editor（ピクセラエディタ）」とは、インターネットにつながっていればブラウザ上で画像編集ができる無料のwebサービスです。

今回の修正は・・・
今回はこちらの写真！
少し空が暗く富士山がぼんやりしているので鮮やかになるよう修正していきます。

手順

1.Pixlr Editor（https://pixlr.com/editor/）にアクセスし
「コンピューターから画像を開く」より修正したい画像を選びます。

2.上部にあるメニューより「調整」をクリックし、その中の「明るさとコントラスト」を選択します。

3.「明るさとコントラスト調整ウィンドウ」が表示されます。
画像を確認しながらバーを動かして調整してください。

4.調整が完成したら画像を保存します

上部のメニューより「ファイル」をクリックし、その中の「保存」から保存を進めてください。

★画像が出来ました！★

写真が暗い・ぼんやりしてしまった時は、PixlrEditorでこんな風に修正することが出来ます！

彩度を調整する

メニュー「調整」の中から「色調と彩度」を選び、【彩度】を変更すると、こんな風に鮮やかな写真にすることや白黒写真にすることも出来ます！

いつもの写真にちょっと手を加えて、お気に入りの1枚に変身させてみてはいかがでしょうか？

ホームページの運用に携わっている人は多かれ少なかれSEOについて気にされていると思います。

この記事を読んでいる人の中にもSEOについてGoogleやYahoo検索などで調べたことがある人は多いのではないでしょうか。実際に調べたことがある人はわかると思いますが、Web上にはSEOの記事が驚くほど大量にヒットします。

そんな大量の記事の中には、正しい情報だけではなく、以前は正しかったが今は正しくない情報や根も葉もないような嘘の情報など入り混じっています。

今回はそんな中でよくでてくる都市伝説のようなSEOのテクニックについて紹介します。

[補足]
「実際にクリックしたら順位が上がったんだけど」と言われることがありますが、これは検索結果のパーソナライズ化によるものです。Googleはサイトを見た履歴を覚えており、一度見たサイトが次回以降の検索結果で少し上にあがります。

ただし、これはその人のPCだけで起こる話ですので他の人が見た順位には全く影響がありません。

これもよく聞く話なのですが、「Yahoo」や「楽天」、「Wikipedia」など有名なサイトにリンクをたくさん張ると自分のサイトの順位が上がるという話です。

「SEOはリンクが大事」という話を勘違いして有名なサイトにリンクを張ればいいと思っている方が多いのですが、「SEOはリンクが大事」という言葉のリンクは被リンク(他サイトから自分のサイトにリンクを張ってもらうこと)を意味しています。

逆に自分のサイトから他のサイトにリンクを張ることを発リンクといい、これはSEO的な効果があるものではありません。

これははてなブログ、アメーバブログなどに代表される無料でブログを作れるサービスを利用すると検索結果で上位表示されないというものです。

なぜこんな話になっているのかわかりませんが、これは完全に間違いです。
はてなブログでも良質な記事をたくさん書いていればもちろん検索で上位表示されます。
もしこれが、本当なら今あるたくさんのブログサービスは廃れてしまうでしょう。

念のため書きますがこの「www」は爆笑ではなく「world wide web」の方です。

Webサイトというと、http://www.○○○.comのようなイメージを持っている方が多いと思います。そのイメージから「wwwは必ず付くもの」、「wwwが付かないはおかしい」というように連想されてできたのではなかと思われる都市伝説です。
確かにwwwが付くサイトは数多くあり、付いているのが一般的という気持ちもわかりますが、これは検索順位には影響ありません。

wwwについてはあった方がいい、ない方がいいというものではなくどちらかに統一しておけば問題ないでしょう。
(Googleが提供しているSearchConsoleというツールにwww有無を設定する項目がありますのでそちらを利用するようにしましょう)

Google AdWordsとは、Googleが提供している有料の広告出稿サービスのことです。
Googleで何かを検索すると、最上部に「広告」とラベルが付いた候補が表示される場合があります。この候補は通常の検索結果とはことなり、Google AdWordsというサービスを利用すること有償で上部に表示されています。

基本的にGoogle AdWordsを利用するとこのように広告として上部に表示されるのですが、Google AdWordsを利用すれば広告枠以外の検索結果(自然検索やオーガニック検索といいます)にも影響を与えるのではないかという都市伝説です。

これも都市伝説でありGoogle AdWordsは広告枠にしか効果がありませんので、Google AdWordsを使う場合に「これで自然検索もあがるぞ」といった変な期待はしないようにしましょう。

以上、勘違いされていそうな都市伝説を5つ紹介しましたがいかがでしたでしょうか？
これ以外にもSEOにはよく勘違いされている施策や昔は有効だったが、今は無効になっている施策が数多くあります。

間違った情報施策に対してがんばって取り組んでいると、下手したらサイトに対してマイナスの効果となる場合もあるので、自分がやっている施策が不安な方はぜひ専門の方に聞いてみてください。

※本記事は2016年10月の情報となりますので、今後上記の都市伝説が本当になる可能性もありますのでご了承ください。

先日、国内外のSEOニュースサイトを騒がせるある発表がありました。それは、
「数か月以内に、モバイル(スマホ)向けページが検索順位評価の基準になる」というものです。

まだ出たばかりの情報なので、色々な情報が錯綜しているようですが、私たちなりに今出ている情報をまとめてみました。

まだ新しい情報ですので、不確定要素が多いですが、今後の動向としては以下の2つのどちらかの対応が行われることが有力なようです。

具体的な実施内容や時期、影響度は不明なものの、今後の動きとしてスマホ向けページが重要な要素になっていくことは間違いなさそうです。スマホ向けページに対応していなかったり、スマホ向けページでページや内容を大幅に割愛しているサイト等は今後の対応を考えておいた方がよさそうですね。

アーティスティックスの松倉です。
先日のお休みにお天気がよかったので山梨まで遊びに行ってきました。
メインは気になっていた東京屋製菓さんの新商品「最中アイス」を食べに行くことです!!

日本各地の希少価値のあるおいしい食材をつかった自家製アイスクリームを、パリパリの最中で挟んだ、ここでしか食べられない東京屋製菓さんオリジナルの和スイーツ。

味は和三盆糖・黒糖・小倉・レーズン・抹茶と、四季で変わる季節のアイスの６種類から選ぶことが出来ます。（季節のアイスは、秋は栗・冬は苺・春は桜・夏は地元のブルーベリーになるそうです。）

今回は、季節限定の栗アイスと、和三盆糖アイス＋黒糖のトッピングを頼みました。
黒糖ときな粉は無料で、あんこは＋20円でトッピングができるそうなのでお得です。

耳より情報

店舗でどら焼きを焼いている時に限り、裏メニューで「どら焼きアイス(250円)」にできるとのこと。今回は残念ながらそのタイミングを外してしまいましたが、次回はどらやきを焼いている時間を聞いてから行こうと思います！

商品の「味」「品質」を第一優先と考え、味が少しでも落ちると判断した機械は採用せず、昔ながらの製法や旧式の機械を使うという、妥協しないお菓子づくりをされている和菓子屋さんです。2016年店舗を新しくリニューアルされ、絶品の「最中アイス」などの新食品も続々と店頭に並んでいます！

Aレコードはアドレス(Address)の頭文字からきており、その名の通りドメインをIPアドレスに置き換えるレコードです。
一番基本的なレコードなので覚えたおくと役に立つかもしれません。

書き方は以下のような形式です。

上記のように記載した場合、1行目がho-plus.comのIPアドレスは192.168.0.1ですという意味になります。
2行目がwww付きでアクセスした場合も、IPアドレスが192.168.0.1であることを意味します。

MXレコードはメールエクスチェンジ(Mail Exchange)の略でメールサーバのホスト名を記載するレコードです。
ドメインに紐づいたメールを使用する際は不可欠なレコードです。
最近ではメールサーバにGoogleAppsを使用している会社も多く、その場合はこのレコード設定で独自ドメインとGoogleAppsを紐づける形になります。

書き方は以下のような形式です。

上記のように記載した場合、○○@ho-plus.comというメールアドレスはmail.ho-plus.comが処理(配送)しますというような意味になります。

数字の10は優先度を意味しており、多くの場合はひとつめは「10」ふたつめは「20」というように10ずつ増やしていきます。

10ずつにする必要性はありませんが、1ずつだと間に入れることができないから10なのかなぁと個人的には考えています。

CNAMEレコードはキャノニカルネーム(Canonical NAME)の略でドメインを別のドメインに置き換えるレコードです。特定のドメインを別のドメインに転送する場合に使用します。

この説明だけ読むとあまり使うことがないような気もしまいますが、Aレコードの例として記載したようにwww有り無しで同じIPアドレスにアクセスする場合は以下のように書くこともできます。

上記のように書いておくと仮にho-plus.comのIPアドレスが変更となった場合でも修正する箇所がひとつで済みます。

TXTレコードはテキスト(TEXT)の略でドメインに関連するテキスト情報を記載するレコードです。
このレコードは上記までのレコードとは少し毛色が違います。

よく使われる要素としては送信ドメイン認証の認証情報（SPFレコード）などに使われます。
それ以外にもドメインの所有者であることを明示するために特定の文字列を記載するなどといった使い方もあります。

書式としては上記のようになるのですが、SPFレコードだと独自の書き方があったりと用途によってさまざまです。
(SPFレコードのについては「SPFレコードの書き方メモ」をご参照ください)

今回はよく使うレコードを一部記載しました。
上記以外にもDNSレコードの種類はいろいろありますので興味のある人は調べてみてください。