タグ

ブックマーク / www.suzukikenichi.com (14)

  • PWA+TWAでウェブサイトを完全アプリ化、PWAサイトのGoogle Play登録も可能に

    [レベル: 上級] Trusted Web Activity (トラステッド ウェブ アクティビティ) を実装すると、Progressive Web App (PWA) のサイトを Google Play にアプリとして登録することができます。 Trusted Web Activity とは Trusted Web Activity(以下、TWA)を簡単に説明します。 TWA は、アプリの中にウェブページをコンテンツとして表示できる機能です。 2017 年の Chrome Dev Summit で発表されました。 試験的な公開でしたが、AndroidChrome 72 のリリースとともに正式に利用可能になりました。 アプリの中にウェブページを表示させると聞くと、開発に詳しい方は Chrome Custom Tab や WebView を思い出すかもしれません。 どちらもアプリのコンテ

    PWA+TWAでウェブサイトを完全アプリ化、PWAサイトのGoogle Play登録も可能に
    miguchi
    miguchi 2019/12/27
  • iOSのSafariでPWAがいよいよ動くようになった、iOS 11.3ベータ版がService Workerを本格的にサポート開始

    [レベル: 上級] iOS の Safari で PWA (Progressive Web Apps: プログレッシブ ウェブ アプリ) がいよいよ稼働し始めました。 iOS 11.3 ベータ版に搭載の Safari 11.1 で PWA の一部機能が動く iOS が Service Worker をサポートする可能性が浮上したのが昨年の夏でした。 年末には開発版 Safari で Service Worker がデフォルトで有効になりました。 とはいえ、PWA の何らかの機能が実質的に動くようになったわけではありません。 しかしながら、iOS 11.3 ベータ版に搭載されている Safari 11.1 で PWA の一部機能がついに動くようになりました。 AppleのSafariのエンジニア、Ricky Mondello(リッキー・モンデッロ)氏が明らかにしています。 iOS 11.3

    iOSのSafariでPWAがいよいよ動くようになった、iOS 11.3ベータ版がService Workerを本格的にサポート開始
    miguchi
    miguchi 2018/02/05
    “WKWebView”
  • 日本のYahooがついにAMPを正式サポートか?

    [レベル: 中級] Yahoo! Japan のモバイル検索が正式に AMP をサポートしたと思われます。 Yahoo Japan モバイル検索結果の AMP おなじみとなった ⚡ マークと AMP ラベルが付いています。 AMP 結果をタップすると、AMP ビューアで AMP キャッシュが開きます。 検索結果の URL を見ると、オリジナルページではなく AMP キャッシュから返っていることが明確にわかります。 AMP 検索のを正式展開か? Yahoo! Japan の AMP サポート予定は今年3月の AMP Conf で明らかになっていました。 しかし実際にはすぐにはサポートしていなかったようで、しばらく前から試験的に始まっていたと思われます。 こちちらは、このブログの AMP ページに訪れたYahoo! 検索からのトラフィックです。 11 月 20 日から計測されています。 現在は

    日本のYahooがついにAMPを正式サポートか?
    miguchi
    miguchi 2017/11/23
  • Service WorkerをサポートしないiOSでもPWAで成果をあげた世界最大のビューティサイト

    [レベル: 中級] Google Developers サイトに PWA の成功事例が新たにたくさん追加されました。 多くは、Google I/O 2017 でも紹介されていました。 この記事では、特に注目したい事例として Lancôme(ランコム)を紹介します。 Lancôme はコスメやスキンケア、フレグランスなどの美容アイテムを取り扱う世界最大の化粧品会社です。 Lancôme の全体的な成果 PWA による全体的な成果として Lancôme は次のような改善を手にしました ページがインタラクティブになるまでの時間が 84% 減少 ※“インタラクティブ (Interactive)” とはここでは、ページが表示されたり、何らかのアクションをそのページで起こせる状態になったりすることだと考えてください コンバージョンが 17% 増加 直帰率が 15% 減少 モバイルのセッションが 51%

    Service WorkerをサポートしないiOSでもPWAで成果をあげた世界最大のビューティサイト
    miguchi
    miguchi 2017/10/13
  • Google、AMPページの有効性を検証する「AMPテストツール」を公開

    [レベル: 中級] AMPを正しく実装できているかどうかを検証するための新しいツールをGoogleは公開しました。 名称はわかりやすく「AMPテスト」ツールです。 HTMLと構造化データをチェック AMPテストツールは、AMP HTMLと構造化データが正しいかどうかをチェックします。 有効なAMPページのテスト結果 検証したいAMPページのURLをツールに打ち込みます。 HTMLに問題がなければ、「有効なAMPページです」という緑色のメッセージが表示されます。 トップニュース用の構造化データを設定しているページでは、「構造化データが有効なページ」というメッセージも出ます。 ただし、AMPには構造化データは必須ではなくなりました。 構造化データを実装していないときは、「AMPに構造化データを追加してください」というメッセージが推奨する対応として出てきます。 ですが、ニュース系サイトやブログな

    Google、AMPページの有効性を検証する「AMPテストツール」を公開
    miguchi
    miguchi 2016/10/14
  • Google、新バージョンのモバイルフレンドリーテストツールを正式公開

    [レベル: 初〜中級] 限られたユーザーを対象にしたベータテストを経て、インターフェイスを刷新したモバイルフレンドリーテストツールの一般ユーザーへの提供が始まったことを、2週間ほど前にお伝えしました。 Googleは、この新バージョンの公開を公式ブログで正式にアナウンスしました。 スマホからの利用にも対応 新バージョンのモバイルフレンドリーテストツール(以下、MFT)のインターフェイスや使い方は先日の記事で紹介したとおりです。 1つ漏れていたのは、スマートフォン版が提供されている改良点です。 新バージョンのMFTはモバイル対応し、スマホからでも使いやすくなりました。 スマホからアクセスした新MFTのトップページです。 PC版と同様に実行前にはキャプチャを要求されます。 結果が出ます。 検証後のスクリーンショットは、スマホからの場合はポップアップで表示させます。 PC版では、スクリーンサイズ

    Google、新バージョンのモバイルフレンドリーテストツールを正式公開
    miguchi
    miguchi 2016/05/22
  • AMP対応ページは、サブドメインや別ドメインでも公開可能

    [レベル: 上級] AMP対応したページは、サブドメイン、あるいは完全に別のドメインのサイトでさえも公開することができます。 通常のページを公開しているサイトと同じドメイン名を使う必要はありません。 米サンノゼで先日開催されたSMX Westで、GoogleのDave Besbris(デイブ・ベスブリス)氏が説明しました。 AMPページをサブドメイン・別ドメインで公開できる たとえば、WordPressのAMPプラグインを使うと、AMPページのURLは通常ページのURLの末尾に /amp/ を付けたものになります(または、?amp=1)。 したがって、AMPページは通常ページと同じドメイン名での公開になります。 通常ページ ―― https://www.example.com/hoge/ AMPページ ―― https://www.example.com/hoge/amp/ しかしこれはプ

    AMP対応ページは、サブドメインや別ドメインでも公開可能
    miguchi
    miguchi 2016/03/10
  • Googleがウェブマスター向けガイドラインを大幅改定 ―― いったい何が変わったのか?

    [レベル: 初・中・上級] Googleは、ウェブマスター向けガイドラインを大幅に改定しました。 この記事では、主だった変更点を抽出して解説します。 認識しておきたい変更点が数多くあります。 新しいウェブマスター向けガイドラインの主だった変更点 セクション分け 以前は、次の3つのセクションに大きく分かれていました。 デザインとコンテンツに関するガイドライン 技術に関するガイドライン 品質に関するガイドライン 現在は、2つに分かれています。 一般的なガイドライン 品質に関するガイドライン 内容が減ったわけではなく、「デザインとコンテンツに関するガイドライン」と「技術に関するガイドライン」の2つが、「一般的なガイドライン」にまとめられた感じになっています。 「一般的なガイドライン」はさらに次の3つのサブセクションに分かれています。 Google がページを検出できるよう手助けする Google

    Googleがウェブマスター向けガイドラインを大幅改定 ―― いったい何が変わったのか?
    miguchi
    miguchi 2016/02/02
  • モバイルウェブが爆速に! GoogleがAMP (Accelerated Mobile Pages) を立ち上げ

    [レベル: 上級] Googleは、Accelerated Mobile Pages (アクセラレイティッド・モバイル・ページ)という、モバイル端末でのウェブページの表示を高速化するためのプロジェクトを公開しました。 略して、AMP(アンプ)と呼びます。 AMPで策定された仕様に従ってモバイルサイトを構成すると、モバイル検索結果からリンク先ページがまさに“一瞬”で表示されます。 AMPをデモで体験 AMPを使ったページがどのようにモバイル検索から表示されるのかを見てみましょう。 Inside Searchの公式アナウンスに動画があります。 まずこれを見て、何となくでいいので雰囲気をつかんでください。 ただ、見てもどんなだか十分にはわかりませんでしたよね。 実際に試したほうが理解できます。 AMPを体験できるサンプルのリンクもアナウンスに出ていますが、日からでは機能しないので少し細工を加え

    モバイルウェブが爆速に! GoogleがAMP (Accelerated Mobile Pages) を立ち上げ
  • Googleのマイリー・オイェが語るGoogleの大進化 ―― モバイル検索はここまで進んでいる #smxmilan

    [レベル: 中〜上級] この記事では、SMX Milan 2015のレポートとして、GoogleのMaile Ohye(マイリー・オイェ)氏のキーノートスピーチを紹介します。 マイリーさんは、マーケティングからGoogle検索の発展、ウェブの高速化など多岐に渡るテーマについて基調講演しました。 そのなかから、僕たちが特に今注目すべき「モバイル」に密接に関係する部分をまとめました。 知らなかったことや、知っていたけれど再確認することがたくさんあるはずです。 では行ってみましょう! イントロダクション 猿から人へと進化してきたようにコンピュータの世界も進化してきました −− デスクトップ、ラップトップ、スマートフォン、タブレット。 そして、マイリーさんは次のような最新のデバイスに触れます。 Internet of Things(インターネット オブ シングス) Smart Car(スマート カ

    Googleのマイリー・オイェが語るGoogleの大進化 ―― モバイル検索はここまで進んでいる #smxmilan
  • 非公開だった検索品質評価ガイドラインの最新版をGoogleが公開

    [レベル: 中級] 検索結果の品質を評価するためのガイドラインの最新版をGoogleは公開しました。 これまでのものとは変更がない部分がある一方で、新たにモバイルに関する章が加わったことが最新版の最大の特徴となっています。 検索品質評価ガイドラインとは? Googleは、ユーザーのクエリに対して関連性が高くかつ高品質なページを検索結果で返すことができているかどうかを、外部の評価者(Evaluator)に常に評価させています(評価者は普通に求人として募集されているらしい。日でさえも)。 評価者による評価は検索品質の改善のために役立てられます。 直接的にランキングを調整するためには用いられません。 どのように検索結果の品質を評価するかを説明した「General Guidelines」(一般ガイドライン)というマニュアルが評価者に提供されます。 このマニュアルは原則的に評価者だけに配布されます

    非公開だった検索品質評価ガイドラインの最新版をGoogleが公開
  • Interfloraがペナルティを受ける原因になったAdvertorial(アドバトリアル)とは?

    [対象: 全員] 英国の大手フラワーショップ、Interflora(インターフローラ)のサイトが有料リンクを購入したことが理由で検索順位を下げられる手動対応をGoogleに与えられたと2日前の投稿でお伝えしました。 どうして手動対応に至ったのかその原因をもう少し詳しく説明します。��������� Advertorialとは? Googleが問題にしたInterfloraのリンクの大半は、“Advertorial(アドバトリアル)”によるものでした。 Advertorialとは、PR記事・記事体広告のことです。 普通の記事の体裁をなしてはいるけれど実態は広告の記事です。 紙媒体の一般の新聞でもよく見かけますね。 Advertorial自体は何も悪いことはありません。 宣伝であることを隠しておすすめする記事、俗にいうステマは問題になりますが、Interfloraは広告であることを明記した形式

    Interfloraがペナルティを受ける原因になったAdvertorial(アドバトリアル)とは?
  • Google、「リッチスニペットテストツール」を「構造化データテストツール」に名称変更、UIを一新し日本語表示も可能に

    [対象: 中〜上級] Googleはリッチスニペットテストツールを大きく改良しました。 リッチスニペットテストツールは、リッチスニペットに使われる構造化データが正しく構成できているかを検証し検索結果での表示をシミュレーションするためのツールです。 大きな改良点は次の3つです。 名称を「Structured Data Testing Tool」に変更 ユーザーインターフェイスと結果表示を一新 日語を含む英語以外の言語にも対応 名称を「Structured Data Testing Tool」に変更 ツールの名前が「Structured Data Testing Tool」に変わりました。 日語だと「構造化データ テスト ツール」になるでしょうか。 ユーザーインターフェイスと結果表示を一新 UIがガラリと変わりました。 すっきりしていて見やすくなったと僕は感じます。 レシピのリッチスニペッ

    Google、「リッチスニペットテストツール」を「構造化データテストツール」に名称変更、UIを一新し日本語表示も可能に
  • ECサイト運営者のためのショッピングカート最適化 〜 トマト栽培キット通販サイトを勝手に分析

    [対象: 全員] ECサイト運営者のためのショッピングカートの最適化について今日は解説します。 先日、インライン・バリデーションの記事を投稿しました。 この記事を書いたのは、「花くらす*野菜くらす」という野菜や花など植物の栽培キットを販売する通販サイトでトマトの栽培キットを購入したことがきっかけでした。 職業柄のせいか、ショッピングカートで購入手続きを進めていくなかでインライン・バリデーション以外にも良いところ、そして悪いところにいくつも気が付きました。 学ぶところが多いモデルなので勝手に診断させてもらうことにします。 コンバージョン率を上げるだろう要素 まずコンバージョン率アップに貢献していると判断した要素をピックアップします。 一部のキャプチャはクリックすると拡大します。 小さいと感じた画像はクリックしてみてください。 1. ありがちな疑問へのリンク 送料や配送、独自システムのポイント

    ECサイト運営者のためのショッピングカート最適化 〜 トマト栽培キット通販サイトを勝手に分析
  • 1