Mangarel というコミック新刊情報アプリを PWA で出したんですが、そのままではびっくりするくらい Google に登録されず、いろいろ苦労した話です。PWA というより SPA 特有の話が多いかも。 https://mangarel.com/
OGP画像を生成したいな〜と思い、ImageMagickが使えるようなので、いろいろ調べたときの備忘録。 ImageMagickとは 画像を操作したり表示するためのソフトウェアスイート。 コマンドラインでも使えて、バッチ処理とかで一括処理するときに使ったりするやつ。 Cloud Functionsでも使えるらしい。。 やりたかったこと やりたかったことは、以下の2点 ベースの画像に文字を入れたい 文字を入れた画像をCloud Storageにアップロードしたい OGP画像の動的生成で調べると、 HTMLからCanvasを生成してPNG化したり Canvas自体を動的に作ってPNG化したり する記事が多いけど、 ベースの画像が複雑なので、SVGにしにくかったり、 OPG画像としてしか使わず、クライアント側で処理させたくない ので、Cloud Storageだけで完結したかったため、この感じに
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? メタ この記事はNode学園2018にて話した内容を記事として編纂 +その後の変化を加筆修正したものです。 スライドはこちら。 https://speakerdeck.com/kazuyaseki/seo-for-spa-cfb3706f-ae1d-4c6f-a83f-96dc2452f32b 追記 2019/5/8 遂に Google bot が扱うレンダリングエンジンが Chrome 最新版(現時点では 74)相当となりました! https://webmasters.googleblog.com/2019/05/the-new-ev
[レベル: 上級] SEO と相性がいい Lazyload の実装を解説するドキュメントを Google はデベロッパー向けサイトで公開しました。 3つのアドバイス ドキュメントには3つの指針が書かれています。 1. viewport 内で見えるようにする viewport 内にあるコンテンツは、必ず Google にも見えるようにしておきます(viewport は簡単に言えば、スクリーンに表示される領域)。 つまり、重要なコンテンツが viewport に入ったときは確実に読み込ませます。 IntersectionObserver API と polyfill を実装するように Google は指示しています。 2. 無限スクロールでは paginated loading を使う 無限スクロールを採用している場合は、paginated loading を実装します。 paginated
実際私が開発している2サイトの実例出しますよ〜 WEBサイトの開発者に取って常に気になるこの話題について、今回は私が開発している2サイトを実例として、結果をお伝えしようと思います。 ※ 最後の「雑感」の後に、Angular製サイトをGolang化してみた結果を追記しました! 概要 GooglebotはどれくらいのJavaScript処理能力があるか 前提 React製サイト: tree-maps サイトの開設日 PCデバイスでの認識 モバイルデバイスでの認識 サイトマップxmlとインデックスの登録数 Angular製サイト: StringUtility サイトの開設日 PCデバイスでの認識 モバイルデバイスでの認識 本来レンダリングされる筈の画面 サイトマップxmlとインデックスの登録数 botはServiceWorkerのhtmlを取得しているのかどうか サイト上で確認できるServic
HTMLページのhead内に記述する最小限の構成、そしてmeta要素やlink要素、ソーシャルサービス用の要素、デスクトップ・スマホのブラウザ用の要素などがまとめられた「<head> cheatsheet」を紹介します。 <head> cheatsheet 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 去年紹介した以前の版からいろいろと変更されています。 head内に記述する最小限の構成 head内の要素 meta要素 link要素 ソーシャル関連のhead内の要素 ブラウザ・プラットフォーム関連のhead内の要素 メモ head内に記述する最小限の構成 下記はシンプルなWebサイトで必須となるhead内に記述する最小限のタグです。 <meta charset="utf-8"> <meta http-equiv="x-ua-c
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? SPAによるWebサイト開発とSEO 昨今はReactをはじめとするフロントエンドのライブラリやフレームワークの台頭により、比較的多彩な機能を持つWebアプリケーションだけでなく、メディアのようなWebサイトをSPA(Single Page Application)で構築する例も見られるようになってきました。こうしたWebサイトにおいて、SEOは重要な集客手段の1つです。 ところで、SEOに関わっている方や造詣の深い方はディレクターやマーケティング寄りの方が多いようです。そのせいかSPAでサイトを構築する場合のSEOに関する話題はあまり
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? Webエンジニアでも最低限のSEO知識を持っておきたい ferretやferretOneといったウェブマーケティングのメディア、ツールを開発、運営している株式会社ベーシックで働いており、近々ECサイトphocaseにて本格的にSEO施策を行うので、勉強がてらエンジニアが覚えておくべきだと思ったSEO周りの知識をまとめました。 この記事も書いていたら長くなってしまったので知らない部分をピックアップして読んでいただければと思います。 実装方法やSEO施策の詳細は貼ってあるリンクだけではなく、 別途Googleで検索するなどして複数の意見をイ
Googleアドセンスは公式サイトで詳細分析できる環境が整っています。 しかし、Amazonアソシエイトは「注文された商品」「クリックのみで注文のない商品」ぐらいしか分からず、楽天にいたっては「購入された店舗」と「金額」ぐらいしか分かりません。 「これじゃあ分析できねぇじゃん」 ってことで、私が試行錯誤(しこうさくご)して設定した方法を記事にしましたので、みなさんのブログ運営に役立てて頂ければ幸いです。
この記事は、3回に分けてお届けしている。最終回となる今回は、国際的SEOにおけるインバウンドマーケティングやリンクビルディングについて考えてみよう。まず第1回から読んでおく インバウンドマーケティング、リンクビルディング、そして国際的SEOこれで、僕らの多言語/多国向けサイトは最適化された。 しかし、サイトが持つ既存のドメインオーソリティとそのリンク資産のフローを追い風として最初の勢いを付けるためにサブディレクトリという方法を選択したとしても、検索エンジン結果ページ(SERP)で表示されるようにするには、やはりなお、その言語/国をターゲットとするサブディレクトリのオーソリティと信用度を高めなければならない。 ccTLDオプションを選択した場合、このことは一層緊急な課題となってくる。 それなのに、国際SEOのリンクビルディング・キャンペーンの予算総額が、国内市場向けキャンペーンに比べて小規模
こんにちは、らくからちゃです。 ここ最近、Googleより『低品質なコンテンツは検索順位下げるからね!』という大本営発表が出されました。 以前より、Googleの検索順位については『コンテンツの量が長ければ長いほうが良い』、俗に長文SEOと呼ばれる仮説がまことしやかに語られてきました。その真偽はさておき、多くのウェブサイトが内容量の充実によるアクセス増を狙った結果、『ただ長いだけで最後まで読まれることのない駄文長文コンテンツ』が増えてきたのも事実です。 おそらくGoogleは『読むに値するコンテンツか否か?』の判断に、ページの滞在時間も採用しているのでしょう。しかしただ長いだけのコンテンツはむしろ価値のない物として評価されている可能性もあります。ネット上に文章を公開するならば、より多くの人に読まれる=PVが増えることを望むことは自然なことです。しかしPVはあくまで『アクセスがあったかどうか
Outbrainという会社の「WEBコンテンツの見出し(タイトル)」について、15万記事を調査したデータが、おもしろかったので簡単にメモ。 1)8ワードのタイトルがクリック率が最高に。 記事タイトルの長さとしては、8ワード(英語で)のものが一番クリック率が高かった。平均よりも21%高かった。 2)サムネイル画像を入れるとクリック率+27% ほとんどのメディアはやっている気がするが、サムネイル画像を記事タイトルに加えると、クリック率を27%も高めることができる。 たぶん、ソーシャルのOGP画像とかもそうだし、あとはスマートニュースとかにも、多かれ少なかれ、当てはまる話だと思われる。 3)偶数よりも奇数のほうが20%も吸引力がある 偶数よりも奇数のほうがクリック率が20%も高まる。たとえば「デザイン上達8のコツ」よりも「デザイン上達7のコツ」にすべきだと。 感覚的には「3・5・7」あたりの数値
2016 - 10 - 09 初心者でも簡単!人工知能によるアクセス解析が面白い。 お気に入り ブログ関連 こんにちは yamoです。 今回はrinさんがとても面白い事を記事で紹介していたので僕もやってみました。 www.rinsimpl.com 目次 Google Analytics(アナリティクス)を設置したけど... イラスト&人工知能で面白い解析「juicer」 動くイラストで見やすい、リアルタイムアクセス ブログを見に来てくれている企業もわかります。 「juicer」の一番面白いところ!顔写真でわかるユーザー像 設置も簡単!juicer設置の仕方 まとめ Google Analytics (アナリティクス)を設置したけど... 前々から気になっていた Google アナリティクス。パソコン初心者の僕が必至にググりつつ、設置しましたが難しくて、いまいち使いこなせない。なんとか理解で
通常の利用にはなんら問題がないように見えるホームページも、セキュリティの欠陥があったり、動作速度に問題を抱えていることは少なくない。このほかにも、検索エンジンに最適化されすぎていてユーザにとっては使いづらかったり、モバイルへの対応が不十分だったりすることもしばしばだ。ウェブ関連の技術やトレンドの進化によって、これまで問題がなかったサイトも、しばらく経って再度チェックしてみると問題が見つかるケースも多い。 こうした場合に便利なのが、URLを入力するだけでホームページにまつわるさまざまな診断をしてくれるサービスだ。特に最近ではスマホやタブレットといったデバイスやソーシャルメディアへの対応に加えて、セキュリティについてはHTTPSの標準化といった新しいトレンドもあり、こうした診断系サービスもそれらを反映した内容へとリニューアルしつつある。今回は新顔のサービスを中心に、自らが運営するホームページの
私は当サイトとは別にブログサイトを運営しており、先月(2016年8月)のアクセス数が 9万PV以上で、収益は 8万3000円程でした。今月は現時点で 8万2000円程です。 ※ 成果の詳しい内容は「5万円稼ぐサイトの作り方8ステップ」の冒頭で紹介しています。 正直、アフィリエイトだけで生活している方々がお勧めする有料ツールに魅力を感じたこともありました。 ただ月8万円程なら、最低限のGoogle対策の知識と下記9つの無料ツールがあれば可能だと思います。 Google キーワードプランナー 関連キーワード取得ツール WordPressテーマ:Xeory Base WordPress 9つのプラグイン Google Search Console Google アナリティクス 検索順位チェックツール GRC 文字カウントツールnumMoji 無料素材 写真AC おまけ:Google検索エンジン最
アフィリエイト報酬 ブログなどのウェブサイトで収益を上げる方法としていくつかあります。 www.b-chan.jp 今回は、GoogleアドセンスとAmazonアソシエイトと楽天アフィリエイトを使っている人への助言。 Amazonアソシエイトの仕組みって知ってますか? ブログなどにAmazonの商品リンクを貼って、それをクリックした人がAmazonのサイトへ行ってその商品を買ったら報酬が発生します。 そしてもうひとつ。仮にその商品を買わなくても、その人が24時間以内にAmazonで何らかの商品を購入すれば、やはり報酬が発生するんです。 Amazonアソシエイトをやっている人ならわかると思いますが、売れている商品は必ずしも自分が掲載している商品だけでは無いですよね。 つまりそういうことです。 とにかくAmazonのサイトへ誘導できれば、24時間は報酬を受け取る権利があるわけです。 楽天アソシ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く