gtag.jsV.S. analytics.js，初談 Google Analytics 的設定方法 — GA系列（1）
隨著大數據口號不知從西元幾年起就被喊得震天作響，企業裡面去導入各種數據分析方式來評估產品表現已經屢見不鮮，但其實數據分析一直都是企業裡面最基本的工作，只是現在可以利用更多工程的力量幫助企業挖掘更大量的數據寶藏了！
以販售產品服務的企業來說，一間公司的產品可能透過業務跑單的方式獲得產品訂單，這些訂單在輸入 ERP 系統後可以產出報表了解產品績效，不過隨著電商服務越來越普及，購物行為數位化已經是基本的消費習慣，但是少了業務作為與客戶銜接的媒介，企業又該如何評估電商網站？這時候我們就可以考慮許多現成的數據分析工具來作為分析橋樑，本次的系列文章就以 Google Analytics 作為起手式，深入了解網站的數據分析方式吧！
在文章的一開頭，我們直接以電商網站作為讀者想像為何要使用網站數據分析工具衡量網站表現的例子，但事實上 Google Analytics 一開始的服務並不是針對電商網站，而是 Universal 的網站類型都可以埋入 Google Analytics 的追蹤代碼進行網站數據分析。因此，不管你是內容傳遞網站類型（部落格或是純圖像介紹網站，不涉及金流、購物車服務）還是電商服務網站都可以使用 Google Analytics 追蹤數據，只是一般來說內容傳遞網站類型著重在 SEO 成效，透過網站的圖文傳遞，提高網站搜尋排名，這時我們會建議客戶使用 Google Search Console 來了解網站的訪客資訊，至於何謂 Google Search Console 之後再向讀者介紹囉！
言歸正傳，系列文章第一篇我們就來介紹企業如何導入 Google Analytics 在自己的電商網站中！
Step 1 : 先確定有工程師可以幫助企業埋入 Google Analytics 的 JavaScript 代碼
聽起來像是廢話，但最主要是要讓讀者了解，整個 Google Analytics 的引入是需要工程力的幫助喔！
工程師可以透過 Analytics.js 或是 gtag.js 兩種 Google 所出的 Library 引入，但強烈建議使用 gtag.js，因為 gtag.js 是 2017 Google 為了整合旗下一堆產品所出的 Library，最重要的目的是假使企業使用了多個 Google 服務，比如： Google Analytics 、Google AdsWord ，過往會需要在資源服務裡同時埋入 Analytics.js （Google Analytics）、Conversion.js （Google AdsWord），但如果使用 gtag.js，就無需引入兩個 Library，僅使用 gtag.js 這個 Library 就可以整合 Google 的服務啦，下一篇系列文章再深入講解這一塊囉！
在上面兩個程式碼片段中，可以清楚看到此段程式碼片段各需要一個參數
(1.) Analytics.js 需要有 UA-XXXXX-Y
(2.) gtag.js 需要有 GA_MEASUREMENT_ID 與 Analytics.js 需要的 UA-XXXXX-Y 為相同參數
UA-XXXXX-Y 這個參數如何找到，我們在 Step 4 說明
Step 2：註冊 Google Analytics 帳號
聽起來又像是第二段廢話，但其實從這一步開始進入 GA 世界每一步的設定都會影響後面數據分析
Step 3：了解 GA 的帳戶（Account）、資源（Property）、資料檢視（View） 三種層級設定概念
在我們上圖的說明中，可以進一步釐清以下幾個重要概念：
- 帳戶（Account）：想像成管理所有資源數據的最上層級，和使用何 Google 帳號註冊 Google Analytics 帳號無關，一個 Account下面可以有很多的 Property （網站、APP）。
2. 資源（Property）：你所想要分析的服務，譬如你同時有電商購物網站、和一個部落格網站，那麼可以在同一個 Account 底下設定兩個 Property，一個 Property 拿來搜集電商購物網站，一個 Property 用來搜集部落格網站數據。
3. 資料檢視（View）：一個資源的數據集中地，可以通過不同的數據篩選，創立不同的 View，方便資料上的檢視分析，未來如何運用 View 進行分析會在日後進行介紹。
釐清 帳戶 （Account）、資源（Property）、資料檢視（View）的關係後，我們進一步分析為何 Google 要如此分層呢？首先 Google 這樣的設計絕對滿足了大部分的企業組織結構，我們用兩種情境來說明：
情境一：
假設你是一間中小型企業，擁有一個電商網站和一個部落格網站，而企業內部有一群人在管理這些網站服務（Property），那麼你可以在 Google Analytics 的 帳戶（Account）中設定一個帳號，並且設定哪些 Google 帳號可以 access 這個 Google Analytics 的帳戶（Account），接下來這些 Google 帳號就可以進行 View 層訪問進行數據分析。不過值得了解的是，Google Analytcis 的 彈性非常強大，企業是可以不賦予某位員工 Google Analytcis 帳戶（Account）的權限，但給予資料檢視（View）的權限的。
情境二：
假設你是一個專門做互聯網服務的公司，你的公司組織分了兩個部門，分別在做 APP 和網站等不同產品，這時候你可以為這兩個部門各設定一個 Google Analytcis 帳戶（Account），並讓部門各自管理他們的底下的服務（Property）。
透過以上兩個情境，有大致了解 Google 為何這樣設計層級嗎？這樣的設計彈性有一定程度可以符合企業組織的各式佈局方式，上述的情境只是簡單的例子，企業可以根據自己的管理方式設定三個層級。
那為何我們花大篇幅在講解 Account、Property 、View 呢？因為對於 GA 證照有興趣的讀者，這三個層級的概念幾乎是必考題啊！（不過，我們不建議為了取得證照死背這些，畢竟 Google 證照的含金量也沒那麽高，證照只是檢視自己是否真的理解運作原理，而不是拿來面試說嘴的喔 🧐）
Step 4：將你的資源（Property）追蹤代碼（Tracking Code）提供給工程師。
在以上 Step 1~ Step 3 我們都還沒有任何一個步驟幫助你把網站資源（Property）的資料傳到 Google Analytics，Step 1 僅是幫助你把 GA Library 引入網站程式碼中，將網站資料送到 GA 需要一個代碼判斷要送到哪個 Property ，這就是要靠 Step 4 完成的！我們有以下的圖示步驟，講解追蹤代碼的位置
將匡起來的 Tracking ID 這段代碼給工程師埋入你的資源（網站）裡，就完成了初步的 Google Analytics 設定囉！
講解到這裡，讀者可能會覺得困惑，看起來 analytics.js 和 gtag.js 做的事沒有差很多啊？！那為何要區分為兩個 jacascript libriary 呢？
眼尖的讀者肯定有嗅到一點不同之處了，我們來對照一下吧！
- analytics.js 的代碼段中，其 javascript 庫的下載來源是來自 https://www.google-analytics.com/analytics.js，而 gtag.js 是從 https://www.googletagmanager.com/gtag/js 下載，一個是僅有 google analyticss 的服務地址，一個則是來自 整合服務 google tag manager 而來的。
- analytics.js 中的 ga() 僅能從事與 GA 相關的指令，但 gtag.js 中 gtag() 可宣告不只 GA 相關的指。比如，我們為了引入 GA 服務，寫了這行 gtag(‘config’, ‘GA_MEASUREMENT_ID’ )，若讀者想要在網站上同時引入 Google Ads 的服務，只需要在同一段程式碼中加入這一行： gtag(‘config’, ‘AW-XXXXXXXXXX’) 即完成了！ analytics.js 的作法則無法讓工程師在同一段代碼中引入 Google Ads。
以上兩個差異就大致說明白了兩種引入方式的差異啦！但對於平常不會寫程式的產品經理來說，這些方法還是要大量依靠工程師啊！別擔心，下一回我們就來介紹一個不需要工程師研究太多 google 服務程式碼就可以開始進行 Google Analytics 設定的方式 — Google Tag Manager
