Google関連の記事一覧



20161022-Google-Fontsでフォントが見つからなかったときの顔文字-00



●Google Fontsのページがリニューアル

Google Fontsのページがリニューアルされ、モダンな感じのサイトに変わりました。

Google Fontsのサービスは、ウェブページで使えるフォントを提供しているページで、指定の通りにHTMLやCSSを角だけで、様々なフォントが使用できるサービスです。


日本語のWebフォントも試験的に何種類か追加され、9種類から選べることが話題になっていますね。

閲覧者のPCにフォントがインストールされていなくても指定したフォントを表示できるウェブフォントは、閲覧者の使用環境にウェブサイトのデザインが左右されないため非常に便利なのですが、アルファベットとは違い文字の種類が多いため日本語に対応したウェブフォントが少ないのも事実。そんな中、Googleが日本語フォント9種類をウェブフォントとして試験的に無料公開しています。

(略)

ウェブフォントとして利用できるようになったのは以下の9種類。もともとGoogleは独自開発したフォント「Noto Sans Japanese」を日本語フォントとして公開していましたが、今回はそれに加えて、「M+ FONTS」や「はんなり明朝」といった日本語フォントがウェブフォント化されています。

無料で使える日本語ウェブフォント9種類をGoogleが公開中(GIGAZINE)
記事の続きを読む




20160428-Google検索で「ページがモバイルフレンドリーではありません。」-00

●Googleはモバイル対応を促進している

Googleがモバイル対応を促進していることは以前から知っていました。

昨年(2015年)の4月にモバイルでの検索結果のランキング要素として、モバイル対応している(=モバイル フレンドリー)ページかどうかということが重要になりました。

Googleの公式ブログでも書かれていますね。

今年の 2 月に発表したように、本日より、Google は全世界でモバイル フレンドリー アップデートを開始します。これにより、モバイル版の検索結果では、モバイル フレンドリーなページの掲載順位が引き上げられ、検索ユーザーは、小さなスクリーン上でも読みやすい、高品質で関連性の高い検索結果をより簡単に見つけることができるようになります。

モバイル フレンドリー アップデートを開始します(Google ウェブマスター向け公式ブログ)


そして、今年(2016年)の5月にも、検索結果のランキング要素にモバイル対応しているかどうかを、更に強めて採用するアップデートを行うことがGoogleの公式ブログに掲載されています。

どんな端末を使用していても、的確で関連性の高い検索結果が表示されるべきだ、と Google は考えています。スマートフォン、パソコン、タブレットのどれを使用していても、検索結果は的確で見やすいものであるべきです。そこで、Google では昨年より、サイトがモバイル フレンドリーかどうかをモバイル検索でのランキング要素の一つとして使用し始めました。この 5 月からは、当該ランキング要素の効果を高めるアルゴリズムのアップデートを段階的におこなっていきます。このアップデートにより、モバイルでも見やすいページが検索結果でさらに多く表示されるようになります。

ウェブをさらにモバイル フレンドリーにするための取り組み(Google ウェブマスター向け公式ブログ)


会社のウェブサイトはPCから見ている方が多いので、別に慌ててモバイル対応しなくてもいいかな…なんて思っていたのですが、PCからGoogle検索してみてビックリ!!

え? アドレスの下に何か書いてあるよ!?

20160428-Google検索で「ページがモバイルフレンドリーではありません。」-01

記事の続きを読む



ウェブ解析を頼まれたときに、いきなりGoogle Analyticsの画面を開いてしまう方(ウェブ担当者)に向けて、考えておきたいポイントを書いてみました。


●目次


●ウェブ担当者の悩みは「どこを改善すべきかわからないこと」

ウェブ担当者として、より良いウェブサイトを作ろうとして、まず悩むことは「どこを改善したら良いかがわからない」ことではないでしょうか。

改善のヒントとなるものとして、ウェブアクセスの解析ツールがあります。これはウェブサイトを閲覧した人がどのような行動をしたかを調べることができるので、ウェブ担当者であれば使っている人も多いでしょう。


●Google Analyticsを使っていればウェブの改善点がわかるのでは?

ウェブアクセスの解析ツールとして有名どころはGoogle Analyticsです。
無料で使用できるので、とりあえずウェブサイトに入れてある人も多いと思います。

「これがあればウェブ解析も簡単なはず! ここにヒントがあるはずだ!」ということで、Google Analyticsのレポートページを開くと様々な指標が踊っています。

この数字だらけのレポートページに戸惑ってしまうのではないでしょうか。

20151220-ウェブ解析入門を読んで-01

記事の続きを読む



20150909-BootstrapとGoogleカスタム検索のCSS-00

みなさん、Bootstrap使っていますか?

私はこれがないともうWeb制作ができないほど毎回使っています(笑)。



●BootstrapとGoogleカスタム検索は相性が悪い?

Bootstrapは非常に便利なのですが、Googleカスタム検索(Custom Search Engine:CSE)を使うと、こんな表示になりませんか?

20150909-BootstrapとGoogleカスタム検索のCSS-01

入力フォームは崩れ、虫眼鏡アイコンが入った検索ボタンは縦に潰れてアイコンが見えない…!


今回はこうした表示のトラブルを解消する方法を紹介します。

記事の続きを読む



Illustratorの線幅ツールを除いて(先に書いておく)。



●新しいGoogleのロゴは線だけで表現ができる…? すごい!

というわけでGIZMODOにこんな記述がありました。

他のユーザーさんの指摘では、新ロゴはフィル(fill、塗り)ではなくストローク(stroke、線)でも作ることができるそうです。これも旧ロゴではありえなかった特徴の1つ。

グーグルの旧ロゴは14,000バイトもあったのに、新ロゴはたった305バイトなのはどうして?(ギズモード・ジャパン)

そうなのか?と新しいGoogleのロゴを改めて見てみました。

20150907-Googleの新しいロゴは線だけで表現できない-01

画像出典:Evolving the Google Identity(Google Design)



しかし、どうも線(ストローク)だけでは難しそうに感じました。

上記画像のあるGoogleのページには、こんな説明もあるので、見てみると、確かに線(ストローク)だけでGoogleの新しいロゴは描けそうです。

20150907-Googleの新しいロゴは線だけで表現できない-02

画像出典:Evolving the Google Identity(Google Design)

記事の続きを読む



20150601-Google-Photosの1600万画素のピクセル数-01

画像出典:アプリのダウンロード(Google フォト)


スマートフォンやデジカメで増え続ける写真をどこに保存するのかは悩ましい問題です。

以前であれば、自分のパソコンや外付けのハードディスクドライブ(HDD)に保存していたのでしょうが、時代が変わってクラウドに保存することが増えてきました。

クラウドに保存されていればどこの端末からも写真を見ることができて便利ですし、自分のパソコンやHDDでは壊れる心配もあります。

そんな中、Googleが新しい写真向けサービスを開始しました。

その名はGoogle Photos。

開発者イベント Google I/O 2015より。Googleは1600万画素までの写真と1080pまでの動画を無料で無制限に保存できる「Google Photos」を発表しました。特徴は枚数無制限の保存、共有、編集機能など。本日より利用可能。
「Google Photos」発表。1600万画素までの写真を無制限に保存。Android / iOS / WEBで本日提供開始 - Engadget Japanese

1600万画素まで無料で無制限に保存できるのは枚数を気にしなくてもいいので心強いですね。

とはいえ、1600万画素といわれても、縦横が何ピクセル(ドット)なのか全然ピンと来ないので、計算してみました。

記事の続きを読む



20150417-Google-Codeの終了でhtml5shivがロードできなくなる-01

画像出典:Google Code


Google Codeがスパムや悪質なプロジェクトのために2016年1月25日に終了するというニュースが3月にありました。

 米Googleは3月12日(現地時間)、開発者向けにAPIなどを提供したり、オープンソースプロジェクトをホスティングするサービス「Google Code」を来年1月に閉鎖すると発表した。同日、新たなプロジェクトの作成はできなくなった。
「Google Code」、2016年1月25日に閉鎖へ GitHubへの移行を奨励 - ITmedia エンタープライズ


その時は「開発者向けのページが閉鎖か、別に開発者ではないし…(プロジェクトをアップしているわけでもないし)」という位にしか思っていなかったのですが、実はWeb制作者に影響があるかもしれません!(というか私は影響がありました(汗))


●IE8対応で…

Internet Explorer 8(IE8)でHTML5対応するために、こんなコードをheadタグ内に書いていませんか?

<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->


そう、IE8はHTML5の新しい要素に対応していないので、スクリプトで対応するようにしてくれる優れもの「html5shiv」です。ファイルを自分で用意しなくてもホスティングしてくれているので簡単ですよね。

老舗のサイト「TAG index」のページでもそう書かれています。


私も使っています。というか、このブログのPC版は現在そうなっています。


この素晴らしいスクリプトのhtml5shivですが、ホスト名をよく見てみると「html5shiv.googlecode.com」。

そう「html5shiv.googlecode.com」です。


ダメですね…。

2016年1月25日を過ぎたら、html5shivのファイルがロードできなくなって、IE8では体裁が崩れます。

記事の続きを読む



●ページの公開時間や更新時間はGoogleの検索結果に表示される

早速本題ですが、ページの公開日時や更新日時をHTMLタグでページ内に書いておくと、Googleで検索する際に表示されますよ、というお話。

パッと見で、新しい情報か、古い情報かがすぐ分かって便利ですね。


以下の画像は「授与品袋」で検索した結果。

スニペットの部分に「2010/50/21」と日付が表示されています。

20150227-HTML5のtimeタグでページの更新日時-01


これは、授与品袋・手提げ紙袋・たとう紙(吉田印刷所)のページのフッター部分にある「公開時間」が反映されています。横に更新時間もありますが、そこの日時はGoogleの検索結果では出てきていません。

つまり、検索結果をコントロールすることができるのです。

20150227-HTML5のtimeタグでページの更新日時-02


そのために使うのが、HTML5のtimeタグです。

timeタグは日付を表す際に使用します。それだけで特に公開日時や更新日時を表すものではありません。


細かなtimeタグの話は上記ページをご覧頂くことにして、記事タイトルにある「ページの更新日時をHTML5のtimeタグを使用して表現」してみましょう。

記事の続きを読む



Googleはモバイルファーストを強力に薦めている証拠かもしれません。

Googleのウェブマスターツールから「モバイル ユーザビリティ上の問題が検出されました」と題した警告とも受け取れるメッセージが届きました。(今見ているこのブログページの話ではないです)

20150116-Google-ウェブマスターツール-モバイルフレンドリーではない-01

Google のシステムは、貴サイトの 848 ページをテストし、そのうちの 100% に重大なモバイル ユーザビリティ上の問題を検出しました。この 848 ページの問題の影響で、モバイル ユーザーは貴サイトを十分に表示して楽しむことができません。これらのページは Google 検索でモバイル フレンドリーとは見なされないため、スマートフォン ユーザーにはそのように表示、ランク付けされます。

「重大な問題」だそうです。

記事の続きを読む



20141112-Google-Inbox-only-works-in-Google-Chrome-01

画像出典:Inbox by Gmail(Google)


新しいメールシステムのGoogle Inboxですが、スマートフォンのアプリでは少し前から使っていたので、Firefoxでウェブ版を開いてメールを確認しようとしたら、

Inbox only works in Google Chrome.

More browsers coming soon.

Download Google Chrome

Inbox by Gmail

と表示されて、Firefoxで閲覧できませんでした。

「Chromeブラウザー以外では動きません。他のブラウザーはもう少し待って。」とChromeブラウザーのダウンロードを促されます。

記事の続きを読む



ブログ著者

名前:(Google+のプロフィール)

ケータイ好き。ガジェットが好きでiPhoneやらAndroidなどを所有。Surface Pro 2も持っている。

お仕事は印刷会社で営業・広報活動・DTPオペなどをしています。要は何でも屋さんです。最近は印刷関連より、自社のウェブサイトを制作するお仕事がほとんど。使用しているCMSはMovable Type。

ブログ著者について

サイト内検索