顯示具有 google 標籤的文章。 顯示所有文章
顯示具有 google 標籤的文章。 顯示所有文章

2016年3月24日 星期四

Google Resizer 工具 測試 RWD 效果

介面簡單,簡單使用,就只有一個搜尋 Bar 可以把你要測試的網址輸進去而已,以後又多一個測試工具摟 :P

Google Resizer: http://design.google.com/resizer/



2015年2月24日 星期二

2015 Google 的數位火星計劃,學生報名只到 3/31

(圖片來源網址: http://www.google.com.tw/landing/ignite/index.html)

好羨慕,看到這活動我都覺得我老了,這麼青春有活力的活動我竟然不能去~ 嗚.. 誰來借我學生證 ><

活動網址

報名限定
國內各大學院校及研究所之應屆畢業生與 2015 年 6 月底前退伍的役男均可報名參加,並需獲得 Google AdWords 認證。

為了讓應試者取得 google adwords 的證照,google 還提供了認證課程,這個真的超棒的,因為之前看 google partners 的 adwords 大部份只有文件可以看,都要哭了... (只看文件是很辛苦的 T_T)

課程的資源有分實體課程跟線上課程,請看。


線上課程網址
*Google 數位火星計劃 | AdWords 廣告基礎課程
*Google 數位火星計劃 | AdWords 廣告進階搜尋課程

2015年2月19日 星期四

Google Tag Manager 體驗記

(此圖截自: http://www.google.com.tw/tagmanager/)

Google Tag Manager  (以下簡稱 GTM) 已經出來好一陣子了,等我用的時候應該已經很多人用得嚇嚇叫了,我還在起跑點上似的...,趁著春節假期有點不知道要介紹什麼,所以就打算寫寫 GTM 的使用心得。

2015年2月16日 星期一

考取 Google Analytics IQ (GAIQ) 心得


現在考 google analytics (以下簡稱 GA) 證照不用報名費,至於如果想要考的話,我想該做的準備自己應該都知道了 (如申請 google partner 帳號等等)。

準備 GA 考試,google 也有提供一些方向讓應考的人做準備,你也可以到 Google Analytics Academy 去看影片學習,這麼完整的影片大概是準備 Analytics 證照才有,嗚~像準備 google adwords 就沒有 (淚)。

2013年1月9日 星期三

google analytics筆記(二)-Tracking Basics

參考網址來源:Event Tracking - Web Tracking (ga.js)

google analytics筆記(二)-關於事件
我第一次看這份文件,都是英文有點麻煩,三番兩次去拜訪這個網站就要再理解一次,所以暫時先用自己看得懂得文字做個筆記,說是翻譯也很奇怪,因為我翻得也不是很好....,我很抱歉...google分析不是我的專業....,如果錯誤敬請煩請糾正or直接看英文版,謝謝。另外asynchronous這個單字,曾經在網路上看到有人翻"異步",但此文我是翻"非同步"。

事件追蹤是一種有用的方法,你可以用他來紀錄使用者跟網站元素之間的互動,例如flash驅動的導航/menu/下拉選單。事件追蹤,採用了面向對象(object-oriented model)的模型,你可以用它來收集和分類不同類型的網頁互動對象。


只要你有嵌入ga.js檔,您將常用的事件追蹤有:
  • Any Flash-driven element, like a Flash website, or a Flash Movie player
    任何Flash驅動的元素,像一個Flash網站,Flash影片播放器
  • Embedded AJAX page elements嵌入式AJAX頁面元素
  • Page gadgets 網頁小工具
  • File downloads文件下載
  • Load times for data加載時間數據

另外你可以....
# 預先確定的所有你要追蹤的元素。
# 採用一貫和明確的命名約定。


設定事件追蹤

在你要查看事件跟蹤結果之前,你必須在你的網站上執行以下的步驟:

1.在您的網站上設置追蹤代碼。請確保您已設置追蹤代碼在你的網站上。有關這方面的設定,請看Tracking Sites
2.在頁面中的要被追蹤的物件,或是widget,或是flash,呼叫_trackEvent()方法。

_trackEvent()的參數有:
_trackEvent(category, action, opt_label, opt_value, opt_noninteraction)

*category (必填)
The name you supply for the group of objects you want to track.
你要追蹤的對象群組名稱

*action (必填)
A string that is uniquely paired with each category, and commonly used to define the type of user
 interaction for the web object.
一個字串,與每個類別成對。

*label (可選)
An optional string to provide additional dimensions to the event data.
可選的字串符,以提供額外的事件數據尺寸。

*value (可選)
一個整數(int),你可以利用它提供的用戶事件的數值數據。
An integer that you can use to provide numerical data about the user event.

*non-interaction (可選)
一個bool值,當設為true時,表示事件點擊將不會被使用在反彈率計算。(the event hit will not be used in bounce-rate calculation.)


3.查看報告。一旦事件追蹤已成立並在您的網站上一天後,可到報告的內容部分並查。


剖析事件追蹤

事件追蹤的數據直接映射到Analytics(分析)報告中的介面,具有以下組件:
  • categories
  • actions
  • labels
  • values
  • implicit count

一個簡單的例子說明如何使用事件追蹤的方法在您的網頁上的視頻播放連結來記錄用戶的互動: <a href="#" onClick="_gaq.push(['_trackEvent', 'Videos', 'Play', 'Baby\'s First Birthday']);">Play</a>



2013年1月8日 星期二

google analytics筆記(一)-Tracking Basics


原文網址來源:Tracking Basics (Asynchronous Syntax)

 Google Analytics的追蹤基礎教學(非同步語法) 
 && 如何架設追蹤代碼在自己的網站 

我第一次看這份文件,都是英文有點麻煩,三番兩次去拜訪這個網站就要再理解一次, 所以暫時先用自己看得懂得文字做個筆記,說是翻譯也很奇怪, 因為我翻得也不是很好....,我很抱歉...google分析不是我的專業....,如果錯誤敬請煩請糾正or直接看英文版,謝謝。

另外asynchronous這個單字,曾經在網路上看到有人翻"異步",但此文我是翻"非同步"。

這份文件(上面的網址來源)包含了如何使用google分析的追蹤語法(非同步追蹤語法)在自己的網站上(主要使用在"Web" Tracking),以及包含了最新的語法。

有了這份版本的追蹤語法,您也可以將Analytics(分析)代碼放在網頁頁面中(他並不會延遲後續頁面內容的渲染),而這些代碼幾乎都是javascript語法。

另外,官方文件也寫道,你可以從 Migration Examples 這個頁面中比較每個步驟的傳統語法(traditional)以及非同步語法(asynchronous syntaxes)的不同。
[恩..雖然我不太懂traditional是指什麼...第一次看這份文件]

內容大綱:
  • 快速開始Tracking Code - Tracking Code Quickstart 
  • 告訴你這個非同步語法是什麼運作的 ? -How the Asynchronous Syntax Works 
  • 追蹤HTML的事件 -Tracking with HTML Event Handlers 
  • 將函數(function)推到佇列-Pushing Functions onto the Queue 
  • 一次push好幾個令命 -One Push, Multiple Commands 
  • 分割的代碼片段 -Splitting the Snippet 
  • 告訴你幾個要避免的陷阱 -Avoiding Common Pitfalls 
  • 禁用/停止追蹤 -Disabling Tracking

快速開始Tracking Code 
google分析的代碼是一段一段小小的js代碼並且複製貼上到你的頁面code,另外你如果要讓你的網站被google分析追蹤到的話,首要任務是你必須埋ga.js這個javascript在你的網站代碼裡面,請複製下面的code,將'UA-XXXXX-X'的字樣換成你的web property ID
(這個需要替換web property ID的地方在很多小範例都會遇到,有些地方就不再贅述,知道要換成自己的web property ID就好了)。 並且把這段放在網頁html標籤的
head標籤結尾之前 before the closing tag。 如果你需要做多其他的追蹤跟方法,你可以參考其他的API或者是看Usage Guide。

 <script type="text/javascript">  
  var _gaq = _gaq || [];  
  _gaq.push(['_setAccount', 'UA-XXXXX-X'/*->這裡要換成你的web property ID*/]);  
  _gaq.push(['_trackPageview']);  
  (function() {  
   var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;  
   ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';  
   var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);  
  })();  
 </script>  

上面的代碼使用_setAccount去設定你的網站web property ID,然後調用_trackPageview送出追蹤的資料到google分析的伺服器。

 [官方網站的重要提示] 如果你是從traditional的代碼改用asynchronous的代碼,你應該先刪掉你現有的追蹤代碼。google不建議這兩種代碼一次使用在同一個頁面, 如果你有這方面的困擾,你可參考Migrating to Async.

告訴你這個非同步語法是什麼運作的 ?
[這一段簡單解說如何運作]
 這個 _gaq 的物件(object)是讓整個非同步語法能夠運做的最大可能what makes the asynchronous syntax possible(可以說一定要有建立這個物件,你才有辦法做追蹤),他所表現的行為是ㄧ個佇列(可上網搜尋什麼是堆疊(Stack)與佇列(Queue)=>簡單來說佇列是一種先進先出(First In first Out)的資料儲存結構),集合API的調用,直到的ga.js準備執行他們時。

想像你要加入一個東西到一列隊伍中,使用_gaq.push這個方法(method)就是這種感覺。 
當你要push一個API呼叫到佇列,你必須將它從傳統的JavaScript語法轉換成命令陣列(Command arrays)。 這個命令陣列(Command arrays)只是一個符合一定格式的javascript的陣列,在這個命令數組(Command arrays)的第一個元素(element) 是你要呼叫的追蹤對象的方法(the tracker object method you want to call),他的型別必須是ㄧ個字串(String),剩下的元素是你想傳遞給追蹤對象方法的參數,這些可以是任意的javascript值。 The following code calls _trackPageview() using the traditional syntax: 下面的代碼採用傳統的語法調用_trackPageview():

 var pageTracker = _gat._getTracker('UA-XXXXX-X'/*這裡要換成你的web property ID*/);  
 pageTracker._trackPageview();  

The equivalent code in the asynchronous syntax requires two calls to _gaq.push. 在非同步語法的代碼必須要呼叫兩個_gaq.push :
 _gaq.push(['_setAccount', 'UA-XXXXX-X'/*這裡要換成你的web property ID*/]);  
 _gaq.push(['_trackPageview']);  

在這個非同步語法,跟踪對象的創建是隱含的(implied),但我們仍需要一個方法去設定我們的web property ID給這個tracker(追蹤器),所以呢~_setAccount這個方法就是提供這種功能,所有其他的追蹤對象方法在傳統與非同步的tracker都是一樣的,只是語法不同。

追蹤HTML的事件

非同步的追蹤語法也可以用於DOM事件處理程序,下面就示範了當一個按鈕被點擊(click)時他產生了一個事件。

 <button onclick="_gaq.push(['_trackEvent', 'button3', 'clicked'])"/>i am button</button><!--這裡官網寫<button>-->  
即使按一下這個按鈕,瀏覽器完成加載ga.js程式(the browser has finished loading ga.js),該事件將被捕獲並最終執行。 如果是使用傳統的追蹤語法,在這種情況下,瀏覽器可能會拋出一個異常。

Pushing Functions onto the Queue- 將函式(function)推到佇列
除了命令陣列(command arrays),你還可以將函式對象(物件)push到_gaq這個佇列上,這個函式可以包含像command arrays的任意javascript, 他們的執行順序會被壓入到_gaq,這種技術是調用(call)追蹤代碼API的返回值(This technique is useful for calling the tracking APIs that return values),比方說下面的語法建立一個連結url而且設置href屬性給連結的結果。
 _gaq.push(function() {  
  var pageTracker = _gat._getTracker('UA-XXXXX-X');  
  var link = document.getElementById('my-link-id');  
  link.href = pageTracker._getLinkerUrl('http://example.com/');  
 });  

上面的例子使用_gaq創見一個追蹤的對象,但是因為它被分配到一個局部變量,在函數外的代碼不能使用它。如果你想要建立一個可以用在很多地方被訪問的對象,您可以使用_gat._createTracker的方法來創建一個永久的,全局可訪問的對象。下面的代碼演示了如何實現這一點。
 _gaq.push(function() {  
  var pageTracker = _gat._createTracker('UA-XXXXX-X', 'myTracker');  
  var link = document.getElementById('my-link-id');  
  link.href = pageTracker._getLinkerUrl('http://example.com/');  
 });  
 _gaq.push(['myTracker._trackPageview']);  

The example above creates an asynchronous tracker inside the function and then references it later by name in the command array. 上面的例子創建一個非同步的追蹤在函數內部,然後引用它的名字在命令陣列。 The opposite use case is also possible. For example, if you need to use an asynchronous tracker object created via a previously pushed command array, use the _gat._getTrackerByName method. The following code demonstrates how it works. 相反的使用情況下也是可能的(語法順序反過來寫的話)。 例如,如果你需要使用非同步語法追蹤透過之前push的命令陣列創建的對象,使用_gat._getTrackerByName方法。下面的代碼演示它是如何工作的。
 _gaq.push(['myTracker._setAccount', 'UA-XXXXX-X']);  
 _gaq.push(function() {  
  var pageTracker = _gat._getTrackerByName('myTracker');  
  var link = document.getElementById('my-link-id');  
  link.href = pageTracker._getLinkerUrl('http://example.com/');  
 });  

一次push好幾個令命 -One Push, Multiple Commands
你可以用以下的方法,取而代之每次調用就要再寫入_gaq.push(...)
 _gaq.push(  
  ['_setAccount', 'UA-XXXXX-X'],  
  ['_setDomainName', 'example.com'],  
  ['_setCustomVar', 1, 'Section', 'Life & Style', 3],  
  ['_trackPageview']  
 );  

這個過程是因為_gaq.push方法模仿Array.push的方法,它允許調用一次推進多個項目。 推到多個追蹤器的命令也是可以運作。Pushing commands to multiple trackers also works.
 _gaq.push(  
  ['_setAccount', 'UA-XXXXX-1'],  
  ['_trackPageview'],  
  ['b._setAccount', 'UA-XXXXX-2'],  
  ['b._trackPageview']  
 );  

分割的代碼片段 
如果你喜歡把Analytics(分析)的語法放在頁面的底部,你應該知道,你不必把所有的片段都放到頁面的底部。 非同步代碼段劈成兩半的頁面可能看起來像這樣:
 <html>  
 <head>  
  <script type="text/javascript">  
   var _gaq = _gaq || [];  
   _gaq.push(['_setAccount', 'UA-XXXXX-X']);  
   _gaq.push(['_trackPageview']);  
  </script>  
 </head>  
 <body>  
  <p>Page Content</p>  
  <script src="some_random_script.js"></script>  
  <p>Page Content</p>  
  <script type="text/javascript"> (function() {  
   var ga = document.createElement('script');   ga.type = 'text/javascript'; ga.async = true;  
   ga.src = ('https:'  == document.location.protocol ? 'https://ssl'  : 'http://www') + '.google-analytics.com/ga.js';  
   var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);  
   })();  
   </script>  
 </body>  
 </html>  


告訴你幾個要避免的陷阱
當使用的非同步或傳統的語法,請記住以下幾點:
方法名稱區分大小寫 :
 _gaq.push(['_trackpageview']);  // 不行  
 _gaq.push(['_trackPageview']);  // good  

使用正確的方法名稱 :
 _gaq.push(['_setDomain', 'example.com']);    // 不行  
 _gaq.push(['_setDomainName', 'example.com']);  // good  

只有字串才能放在''(引號)之內
只要傳遞的值不是ㄧ個字串,如一個bool,object literals,functions,arrays(陣列),不能帶引號。 當你傳遞的東西是要被解釋為字串,只能使用引號。
 _gaq.push(['_setAllowLinker', 'false']);  // 不行  
 _gaq.push(['_setAllowLinker', false]);   // good  

確保字串不包含前導或尾隨的空白
 _gaq.push(['_setAccount', ' UA-65432-1']);  // 不行  
 _gaq.push(['_setAccount', 'UA-65432-1']);   // good  

禁用/停止追蹤 Disabling Tracking

在某些情況下,可能需要禁用頁面上的google 分析的追蹤代碼,而無需刪除程式碼片段。例如,你可以這樣做,如果你的網站的隱私政策包括訪問者選擇退出的google分析的追蹤。

ga.js 追蹤程式碼片段包括一個window property屬性,當設置他為true時,禁用將數據發送到google 分析。當谷歌Analytics(分析)設置了一個cookie,或將數據發送回Google 分析服務器,它會檢查是否該屬性設置為true。如果是的話,它會產生同樣的效果如果訪問者在google分析停用瀏覽器安裝插件。 要禁用追蹤,下面的window屬性設置為true:
 window['ga-disable-UA-XXXXXX-Y'] = true;  

這個window屬性必須設定在追蹤代碼被呼叫之前(before the tracking code is called.)。 此屬性必須被設置在每一頁你想禁用google分析的追蹤頁面上。如果屬性未設置或設置為false,那麼就會照常追蹤。


END.(終於看完...

2012年3月6日 星期二

GOOGLE MAP 的API使用(Javascript API)


GOOGLE MAP API的使用 
在網頁上內嵌GOOGLE MAP好像也不是一件很難的事情,
就先到Google map 然後指定地點,複製他產生的<iframe>標籤或是href貼到網頁程式碼就可以了。  不過我現在看的這本書是在講如何在網頁中內嵌地圖的API


(以下說明來自GOOGLE MAP API說明) 

Google Maps API 提供開發人員數種將 Google 地圖嵌入網頁的方式,可以簡單使用或再自行大幅修改。我們目前提供數種 API:
1.Google Maps Javascript API
2.Google Maps API for Flash
3.Google Static Maps API
 這些 API 可以單獨使用或加以組合,滿足您的各種需求。
 如果您是經營企業或商業網站的使用者,您可能也想瞭解 Google Maps API Premier。


可以到官網去參考他的使用方式。http://code.google.com/intl/zh-TW/apis/maps/faq.html#whatis


1.Google Maps Javascript API
就是用javascript內嵌google map API到網頁裡。
目前已經發展到第三版,並且支援行動裝置。
顧名思義第二種API for Flash就是用actionscript API 



在網頁中顯示google map API的步驟 : 


更多詳情請見 Google Maps Javascript API 第 3 版地方資訊程式庫 (實驗性)




1. 在<head>標籤裡內嵌 Maps JavaScript API -->
<script type="text/javascript" src="../jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?libraries=geometry&sensor=false"></script>
2. 建立一<div>標籤顯示google地圖  -->

<div id="mymap" style="width:500px; height:500px;"></div>


3. 設定相關選項 -->
var latlng 設定經緯度
var myOptions  設定縮放比例.中心的經緯.顯示類型
var map 定義單一地圖
4. 載入 。
詳見下方說明



說明: 
1. 在<head>標籤裡內嵌 Maps JavaScript API

根據google的說明 
 首先必須內嵌這個javascript的檔案:


<script type="text/javascript" src="http://maps.google.com/maps/api/js?libraries=geometry&sensor=true_or_false"></script>

請不要直接把這一整具貼上去html文件裡,因為你必須去設定後面的sensor
,否則會出現錯誤。






後面所帶的  sensor=true_or_false  
這裡的sensor 顧名思義就是感應器,例如GPS定位器
如果你希望在行動裝置去判斷使用者的位置
那請將sensor設定為true。還有很重要的一點,來自於 google網站說明: 
請注意,即使您的應用程式沒有使用位置感應器,您仍必須設定 sensor 參數 (在此情況下,請設定為 false)。



2. 建立一<div>標籤顯示google地圖 
<!DOCTYPE html>
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
<script type="text/javascript" src="jquery-1.6.2.min.js"></script><!-- 匯入jquery-->
<script type="text/javascript" src="http://maps.google.com/maps/api/js?libraries=geometry&sensor=true"></script>
</head>

<body>
<!-- 測試一個區塊-->
<div style="width:500px;height:500px;background-color:green">綠綠的</div>
</body>
</html>


3. 設定相關選項 

這裡所說的相關選項只是地圖的一些設定。
我看了一下官方的說明文件,這裡的選項不外乎就是一些你必須去初始畫的東西。比方說,你必須在使用地圖的時候一開始就要去設定最初的經緯度是多少。
看一下google的地圖選項說明:
「為了初始化地圖,我們會先建立 Map options 物件以納入地圖初始化變數。我們不會建構這個物件,而會以物件實字形式建立這個物件。因為我們想將地圖中心鎖定在特定的點,所以也會建立 latlng 值來存放這個位置」

  • 緯度是 lat (變數)
  • 經度是 lng(變數)


用latlng存放這個位址就是這樣: (jquery寫法)
 <script>
 $(document).ready(function(){
  var latlng = new google.maps.Latlng(22.732709,120.287507);
 });
</script>


  • Map options物件的建立:


map option 幾個常用的就是zoom .center mapTypeld 。
zoom: 地圖顯示的比例,總共有18個 從0~17
center: 顧名思義就是地圖中心。值就是經緯度設定的 latlng
mayTypeld : 請看google說明




mapTypeId 支援的類型如下:
·         ROADMAP 顯示 Google 地圖的正常、預設 2D 地圖方塊。
·         SATELLITE 顯示圖形地圖方塊。
·         HYBRID 會顯示圖形地圖方塊和特殊圖徵 (道路、城市名稱) 地圖方塊圖層的混合圖。
·         TERRAIN 會顯示實際起伏的地圖方塊,以展現地形高度和水域圖徵 (山嶽、河流等)。



*第 3 版沒有預設地圖類型。您必須具體設定初始地圖類型


var myOptions = {
 zoom: 12,
 center: latlng,
 mapTypeId: google.maps.MapTypeId.ROADMAP
};


4. 載入 

載入應該是最容易忘記的步驟吧xd 以我來說是這樣
 前面弄了老半天狂按F5也不會有結果的xdd

載入地圖的話必須建立這個物件 (一樣貼自於Google)
google.maps.Map - 基本物件

var map = new google.maps.Map(document.getElementById("map_canvas"),
    myOptions);
此類別的物件會定義網頁上的單一地圖 (這個類別可以讓您建立實例,每個物件會在網頁上定義個別的地圖)。我們使用 JavaScript new 運算子來新增此類別的實例。
建立新的地圖實例時,您必須在網頁中指定 HTML 元素 <div> 做為地圖的容器。

就是說 getElementById("map_canvas") 
裡面的map_canvas原本是只建立一個div物件去設定他的canvas
不過我這裡是直接設定div的style長寬
無論如何這裡的map_canvas是要填入div 的id名稱。



測試
 <!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>


 <script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?libraries=geometry&sensor=false"></script> <script type="text/javascript"> $(document).ready(function(){ var latlng = new google.maps.LatLng(22.732709,120.287507); //變數是小寫latlng, new後面的LatLng 的L是大寫!!! var myOptions = { zoom: 15, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP }; //建立google.maps.Map - 基本物件,定義網頁上的單一地圖 var map = new google.maps.Map(document.getElementById("mymap"),myOptions); }); </script> </head> <body> <!-- 測試一個區塊--> <div id="mymap" style="width:500px; height:500px;"></div> </body> </html>


顯示結果

相關連結 :
參考書目 :
  • jQuery 網頁設計範例教學 - 德瑞工作室- 松崗出版
  • google API 大全 

2011年11月27日 星期日

android,序

Google在2005併購android,當時的android才成立22個月。google在07發表android第一個版本,當時還沒有非常受到矚目。現在好像已經出到4.多了吧?! 而且每個版本都是用甜點命名。
android,droid是機器人的意思,an一個,android中文就是"機器人",android他本身就是個作業系統,以Linux為核心,主要的陣營非常多,像台灣的HTC就是android其中的一個陣營,LG. 三星也都是。簡單來講,現在最為人知的兩大智慧型手機作業平台,一個就是iphone的,另一個就是google的android,兩者的差異就在於,iphone的開發應該算是封閉式的,而android完全免費而且開放,即便如此,iphone在全世界的市占率,仍然很高。


由智慧型手機的崛起,軟體的開發與創新逐漸變成主流。大家會發現,其實呢智慧型手機的外觀設計,各家廠商的設計其實沒有差多少,消費者的重點雖然還是會注重手機本身的設計,但是其實購買手機的重心與欲望越來越越往手機本身的作業平台為選擇目標。 重點不在於手機的外觀設計,而是手機所使用的作業平台,使用者介面設計的好壞。

這麼說來,台灣應該更注重設計人才的培養,我所指的設計是泛指所有種類的設計師...。台灣的教育習慣將藝術與科技分開,這樣的走向若要培養了解視覺設計和軟體的工程師是很困難的,若一直代工下去.....,似乎沒有多大的好處.....,所以我們要改變。



chapter 1 .2  筆記 :
android的主流開發環境是 eclipse + ADT + android SDK 
在電腦要開發android: JDK+Eclipse+Android sdk+ ADT
(看起來很複雜,沒錯!我也看不懂xd)



main.java 是android應用程式的主程序檔,相當於web程式的主頁面
main.xml在layout子選單裡,是一個XML的佈局檔,這個檔案指定了程式中顯示的元件還有相關的資訊。通常我們在手機裡看到的按鈕,就是一種元件,所以說...要加入按鈕,就必須打開main.xml進行配置
(ps: xml檔案中的標籤指定id時必須是這樣的格式: @+id/somestringvalue (somestringvalue表示id的值,以數字表是),而@+語法表示如果ID值在R.id類別中不存在,則新產生一個與ID同名的變數


android開發的資源全放在apk檔案裡,
在一個專案的子目錄中,我們會看到res這個子目錄
res裡又包含了drawable. layout. values
這三個子資料夾又包含icons.png main.xml. string.xml
由icons.png暗示著我們drawable這個資料夾是來放圖片的(影像檔)
而layout從字面上就可以知道這個資料夾是用來設定佈局,有點像是在配置畫面
values資料夾裡的xml檔可見是用來保存字串資源的(這個我也沒看懂xddd )



上面已經得知了三種資源,複習一下分別是res子資料夾drawable. layout.values
重點是,資源,不只這些。總之,不管是甚麼樣的資源檔案,都會被放到res這個子資料夾中
(注意,在drawable不能放同名的影像檔,就連apple.jpg與apple.png這樣就不行。這是因為在生成ID的時候本來的設計就沒有考慮到附檔名的問題)




android有四種元件 :
1.活動元件(activity)
2.服務元件(service)
 3.廣播接收者(Broadcast receivers)
4.內容提供者(content providers)

活動元件(activity) 這是android最核心的類別,全名android.app.Activity 
Activity相當於表單(form)或是web程式頁面 每個activity提供一個視覺化的區域,在這個區域可以放任何的android元件,像是button~ 所以才說~activity真的是開發android最核心的類別!
一個具備介面的android可以是由好幾個或一個的activity組成,比方說,我們最常的看的典型設計,就是用一個activity做為主activity(相當於首頁(主表單))經由這個actovity夠過功能表或是按鈕轉到其他的activity,每個activity都有一個小視窗,通常都是布滿整個螢幕的





Vue multiselect set autofocus and tinymce set autofocus

要在畫面一進來 focus multiselect 的方式: 參考: https://jsfiddle.net/shentao/mnphdt2g/ 主要就是在 multiselect 的 tag 加上 ref (例如: my_multiselect), 另外在 mounted...