<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	xmlns:georss="http://www.georss.org/georss" xmlns:geo="http://www.w3.org/2003/01/geo/wgs84_pos#" xmlns:media="http://search.yahoo.com/mrss/"
	>

<channel>
	<title>烏托比亞</title>
	<atom:link href="http://hsinyu00.wordpress.com/feed/" rel="self" type="application/rss+xml" />
	<link>http://hsinyu00.wordpress.com</link>
	<description>還不知道在上帝的棋盤上，我是哪一顆棋子。所以通通寫在這裡吧。</description>
	<lastBuildDate>Sat, 30 Apr 2011 10:37:56 +0000</lastBuildDate>
	<language>zh-tw</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.com/</generator>
<cloud domain='hsinyu00.wordpress.com' port='80' path='/?rsscloud=notify' registerProcedure='' protocol='http-post' />
<image>
		<url>http://s2.wp.com/i/buttonw-com.png</url>
		<title>烏托比亞</title>
		<link>http://hsinyu00.wordpress.com</link>
	</image>
	<atom:link rel="search" type="application/opensearchdescription+xml" href="http://hsinyu00.wordpress.com/osd.xml" title="烏托比亞" />
	<atom:link rel='hub' href='http://hsinyu00.wordpress.com/?pushpress=hub'/>
		<item>
		<title>Mobile Web 前端技術筆記(五): 觸控事件與滑鼠事件大不同</title>
		<link>http://hsinyu00.wordpress.com/2011/04/30/mobile-web-events/</link>
		<comments>http://hsinyu00.wordpress.com/2011/04/30/mobile-web-events/#comments</comments>
		<pubDate>Sat, 30 Apr 2011 10:33:50 +0000</pubDate>
		<dc:creator>hsinyu00</dc:creator>
				<category><![CDATA[Mobile Web]]></category>
		<category><![CDATA[學習筆記]]></category>

		<guid isPermaLink="false">http://hsinyu00.wordpress.com/?p=418</guid>
		<description><![CDATA[我一直想搞清楚手機的事件，quirks mode的iPhone events這篇文章有很好的解說。作者的中心概念是，觸控裝置與滑鼠的事件模型完全不同，互相比擬不是個好想法。就連蘋果官方的Safari Web Content Guide for iPhone也含糊其辭，堪稱有最爛說明文件的最好產品。 根據作者的測試，觸控裝置的實際情形是： 手指單點時，觸發mouseover, mousemove, mousedown, mouseup 和 click events，也將套用CSS的:hover樣式 (而且你可以為這些事件加上event handler) 當user focus離開某元件，觸發mouseout event, 並移除:hover樣式 我們最常利用的mousedown/mouseup/click或mouseenter/mouseout/mousemove事件，和:hover樣式，在觸控裝置上都不能以桌機的概念來看。不同之處在於： 手指滑動(touch event)和連點兩下(double tapping)都被保留為系統事件，所以在瀏覽器裡並不會被解讀成mousemove或double click 桌機mouse的移動是連續的，游標一直存在於畫面上；但手機上是不連續的，手指可能在一處點擊，中途消失，然後又點了另一處。 進一步解釋，在桌機上一個滑鼠點擊可被看成三位一體的mousedown/mouseup/click，但在手機上未必會被分解成三個動作。又手指的移動被看作是不連續的，你不能像桌機一樣，在一處按下滑鼠，拖曳到另一處放開，這在手機會被解讀成touch event，而不是mousemove；許多手機browser對mouseover動作根本無動於衷，mousemove也不具意義。既然手機沒有如此多樣的互動，套用傳統的滑鼠事件來解釋觸控行為並不適當，我們也無需再企圖操控手指移動的事件了。 作者提出了一個新觀念: User focus/de-focus，在手機上只有這兩種情況。舉個明顯的例子，填表單時，把手指停在一個欄位上編輯就是focus，移到別的欄位就是de-focus。說穿了，利用“click”事件來引發動作是最好的方法，因為所有系統都支援click，click毫無疑問的是使用者確認的信號，利用click引發動作的application也將成為未來的主流。 而mouse雙擊和mouse右鍵event就不用談了，雙擊是iphone的系統事件(zoom)，而由右鍵觸發contextmenu這種互動在iphone上根本不存在。 《資料來源》 作者還把幾種桌機和手機瀏覽器的測試結果整理成表，可作為寫javascript的參考： Touch Table ：各大手機系統支援的event整理 Event compatibility tables ：用javascript的event如change、click來列表，看各大桌機和手機瀏覽器的支援度 分類:Mobile Web, 學習筆記<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=hsinyu00.wordpress.com&amp;blog=4879661&amp;post=418&amp;subd=hsinyu00&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
		<wfw:commentRss>http://hsinyu00.wordpress.com/2011/04/30/mobile-web-events/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="" medium="image">
			<media:title type="html">hsinyu00</media:title>
		</media:content>
	</item>
		<item>
		<title>Mobile Web 前端技術筆記(四): 不能播Flash時怎麼辦？ &#8212; Flash與HTML5 video的相互替代</title>
		<link>http://hsinyu00.wordpress.com/2011/04/05/mobile-web-flash-html5-video/</link>
		<comments>http://hsinyu00.wordpress.com/2011/04/05/mobile-web-flash-html5-video/#comments</comments>
		<pubDate>Tue, 05 Apr 2011 13:36:32 +0000</pubDate>
		<dc:creator>hsinyu00</dc:creator>
				<category><![CDATA[學習筆記]]></category>
		<category><![CDATA[Mobile Web]]></category>
		<category><![CDATA[html5]]></category>
		<category><![CDATA[mobile]]></category>
		<category><![CDATA[flash]]></category>

		<guid isPermaLink="false">https://hsinyu00.wordpress.com/?p=383</guid>
		<description><![CDATA[只要Steve Jobs還沒轉念，iPad和iPhone上的browser就難有支援flash的機會吧！但現在有新希望 &#8212; HTML5的&#60;video&#62; tag。當然兩者都只有部分瀏覽器支援，我們能做到的最好方式，就是fall back，或有人說fall forward，因為Flash與HTML5很難有孰高孰低之分。Vimeo 很努力的設計它的fall back機制，順序是這樣： flash &#62; html5 video &#62; place holder 其中place holder的內容包括了圖片、文字、要求升級或加裝套件的訊息，或下載到本機觀看的連結，總之就是要想盡辦法引導user看到影音內容。 也有的網站是以html5優先的： html5 video &#62; flash &#62; place holder。 《用法》 fall back基本的訣竅有點像俄羅斯娃娃，一層包一層，有開發者甚至想出了用HTML就能達成的超基本做法，類似這樣： 1: &#60;video&#62; 2: &#60;source ...aaa.MP4".../&#62; 3: &#60;source ...bbb.OGG"... /&#62; 4: &#60;object ... data="ccc.SWF"&#62; 5: &#60;param... /&#62; 6: &#60;img src="__IMAGE__.JPG" alt="__TITLE__" title="No video playback" /&#62; 7: &#60;/object&#62; [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=hsinyu00.wordpress.com&amp;blog=4879661&amp;post=383&amp;subd=hsinyu00&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
		<wfw:commentRss>http://hsinyu00.wordpress.com/2011/04/05/mobile-web-flash-html5-video/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="" medium="image">
			<media:title type="html">hsinyu00</media:title>
		</media:content>
	</item>
		<item>
		<title>Mobile Web 前端技術筆記(三): User Agent Sniffing</title>
		<link>http://hsinyu00.wordpress.com/2011/04/05/mobile-web-user-agent-sniffing/</link>
		<comments>http://hsinyu00.wordpress.com/2011/04/05/mobile-web-user-agent-sniffing/#comments</comments>
		<pubDate>Tue, 05 Apr 2011 12:24:47 +0000</pubDate>
		<dc:creator>hsinyu00</dc:creator>
				<category><![CDATA[Mobile Web]]></category>
		<category><![CDATA[學習筆記]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[mobile]]></category>
		<category><![CDATA[user agent sniffing]]></category>

		<guid isPermaLink="false">https://hsinyu00.wordpress.com/?p=371</guid>
		<description><![CDATA[User Agent Sniffing 《基礎》 行動版網站和桌機版網站，使用的情境和需求都不同，現在大部分網站傾向把兩者分開，將使用行動裝置的user儘早redirect到行動版。用user agent string來分流不算是最好的方法，一來user agent的字串有可能是假的，二來瀏覽器和行動裝置日新月異，每當有新型號出品時，都有可能產生前所未見的user agent string。 單單使用media queries應付五花八門的裝置尺寸，在某些情況下會變得相當複雜(就像我雖然蠻喜歡7吋的Galaxy Tab，但它在開發上鐵定會成為一個頭痛的東西)，這時User Agent Sniffing就成了目前少數有效的幾個方法之一。 Mobile Browser會將所有與 User Agent相關的資訊包含在User Agent String裡（平台、OS、瀏覽器、版本等），前端的User Agent Sniffing通常用javascript來做，藉由javascript偵測User Agent String裡的關鍵字眼，來做相應的處理，如redirect到行動版網站、指定特定的CSS、或在javascript做DOM操作時執行不同的動作。 目前熱門行動的裝置的User Agent String: iPad: 有兩個，擇一使用 (1)&#160; Mozilla/5.0 (iPad; U; CPU OS 3_2 like Mac OS X; en-us) AppleWebKit/531.21.10 (KHTML, like Gecko) Version/4.0.4 Mobile/7B334b Safari/531.21.10 (2) Mozilla/5.0(iPad; U; CPU iPhone OS [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=hsinyu00.wordpress.com&amp;blog=4879661&amp;post=371&amp;subd=hsinyu00&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
		<wfw:commentRss>http://hsinyu00.wordpress.com/2011/04/05/mobile-web-user-agent-sniffing/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="" medium="image">
			<media:title type="html">hsinyu00</media:title>
		</media:content>
	</item>
		<item>
		<title>Mobile Web 前端技術筆記(二): Media Queries 與 CSS</title>
		<link>http://hsinyu00.wordpress.com/2011/04/05/mobile-web-media-queries/</link>
		<comments>http://hsinyu00.wordpress.com/2011/04/05/mobile-web-media-queries/#comments</comments>
		<pubDate>Tue, 05 Apr 2011 08:56:25 +0000</pubDate>
		<dc:creator>hsinyu00</dc:creator>
				<category><![CDATA[Mobile Web]]></category>
		<category><![CDATA[學習筆記]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[media queries]]></category>
		<category><![CDATA[mobile]]></category>

		<guid isPermaLink="false">https://hsinyu00.wordpress.com/?p=356</guid>
		<description><![CDATA[Media Queries 《基礎》 media queries的作用在偵測device的尺寸和方向等，指定相對應的CSS檔。使用情境粗分為兩種，一種是用於mobile compatible的網頁，也就是桌機版與行動版共用一份html文件，但要套用不同的排版；另一種是做行動版專用網頁，但想要依照不同的行動裝置給予適當的版面設定。 《用法》 HTML &#60;link rel="stylesheet" media="screen and (min-width: 400px) and (max-width: 700px)" href="example.css" /&#62; CSS @media screen and (min-width: 400px) and (max-width: 700px) { .selector1{...} .selector2{...} } 意思就是在視窗寬度大於400px但小於700px時，套用example.css這個CSS檔。 CSS檔中，@media後面列的條件就是對應HTML&#60;link media=“&#8230;..”&#62; 引號內的東西。在@media{}大括號之內，就如往常一樣撰寫此media條件下的CSS設定。 import CSS的寫法也一樣： @import "screen.css" screen and (min-width: 400px) and (max-width: 700px) query條件的用法 @media [media type] and [(media feature)] 單一條件 [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=hsinyu00.wordpress.com&amp;blog=4879661&amp;post=356&amp;subd=hsinyu00&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
		<wfw:commentRss>http://hsinyu00.wordpress.com/2011/04/05/mobile-web-media-queries/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="" medium="image">
			<media:title type="html">hsinyu00</media:title>
		</media:content>
	</item>
		<item>
		<title>Mobile Web 前端技術筆記(一): Viewport的設定</title>
		<link>http://hsinyu00.wordpress.com/2011/04/05/mobile-web-viewport/</link>
		<comments>http://hsinyu00.wordpress.com/2011/04/05/mobile-web-viewport/#comments</comments>
		<pubDate>Tue, 05 Apr 2011 07:17:14 +0000</pubDate>
		<dc:creator>hsinyu00</dc:creator>
				<category><![CDATA[Mobile Web]]></category>
		<category><![CDATA[學習筆記]]></category>
		<category><![CDATA[mobile]]></category>
		<category><![CDATA[viewport]]></category>

		<guid isPermaLink="false">https://hsinyu00.wordpress.com/?p=347</guid>
		<description><![CDATA[Viewport的設定 《基礎》 viewport的作用是告訴瀏覽器，目前裝置有多寬(或多高)，以便在縮放時有個基準。尤其當設定頁面寬度需自動調整時，如寬度100%或螢幕由垂直轉為水平，viewport大小是一個根據。 《用法》 &#60;meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"&#62; (這個例子中的maximum-scale也設為1，其實就是不讓使用者縮放，以維持頁面的設計，行動裝置專用的網頁常有必要這樣做。) 《屬性和值》 根據W3C草案，在meta tag中viewport有以下屬性可設定 width:[數字] 或 device-width height:[數字] 或 device-height initial-scale:最小0.25，最大5 minimum-scale:最小0.25，最大5 maximum-scale:最小0.25，最大5 user-scalable:1 或 0 (yes 或 no) 雖然是W3C文件，但還在草案(Editor&#8217;s Draft)階段，尚未標準化，iOS上的Safari最先實作這些屬性，所以比較完整，表現也比較穩定；其他瀏覽器不見得能解譯，但新版的Opera, Android, Fennec(Mobile Firefox)應該是可以實現其中幾項屬性的。但Opera Moblie 9.5中minimum-scale/maximum-scale、user-scalable的功能是不作用，因為Opera當時認為自家的Zoom功能是必要的。 width通常設為device-width，用意是適應各家裝置的大小，這樣寫CSS時就能放心的把版面寬度設為100%(雖然還有一個box model的問題，容後再述)。 user-scalable的實際行為就等於zoom，zoom=1可以配合行動版專用網頁的設定，剛剛好填滿畫面，不過桌機版網頁超出畫面是必然的。 《備註》 螢幕解析度不一定等於device-width， Nexus One 是螢幕解析度(800)不等於device-width(320)的典型例子， iPhone 4 亦同 &#8211; 螢幕解析度(960)，但device-width回報為(320)。 新出的手機傾向採用高畫素的面板，如果照實體螢幕解析度作為device-width，有可能進入大部分網站時都看到縮小的畫面，這是使用方便上的一個考量。 《資料來源》 W3C文件 http://dev.w3.org/csswg/css-device-adapt/ device-width的解說 http://www.quirksmode.org/blog/archives/2010/09/combining_meta.html [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=hsinyu00.wordpress.com&amp;blog=4879661&amp;post=347&amp;subd=hsinyu00&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
		<wfw:commentRss>http://hsinyu00.wordpress.com/2011/04/05/mobile-web-viewport/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="" medium="image">
			<media:title type="html">hsinyu00</media:title>
		</media:content>

		<media:content url="http://hsinyu00.files.wordpress.com/2011/04/mobile_mediaqueries.jpg" medium="image">
			<media:title type="html">mobile_mediaqueries</media:title>
		</media:content>
	</item>
		<item>
		<title>客製&quot;Send to&quot;功能，把Google Reader文章加入Google Bookmarks</title>
		<link>http://hsinyu00.wordpress.com/2010/01/18/google-reader-to-bookmarks/</link>
		<comments>http://hsinyu00.wordpress.com/2010/01/18/google-reader-to-bookmarks/#comments</comments>
		<pubDate>Mon, 18 Jan 2010 04:44:45 +0000</pubDate>
		<dc:creator>hsinyu00</dc:creator>
				<category><![CDATA[雕蟲小技]]></category>
		<category><![CDATA[google bookmarks]]></category>

		<guid isPermaLink="false">http://hsinyu00.wordpress.com/?p=279</guid>
		<description><![CDATA[Google Reader可以把文章透過』Send to』直接轉貼到Facebook、blogger、delicious等等，但對自家的Google Bookmarks反而不太捧場啊。Google Bookmarks沒人愛用，這個冷門方法也不怎麼好找。但本人對陽春東西就是有偏好，以下是被洗腦的google愛用者的自娛文&#8230; 1.在帳戶設定(Setting&#8230;)選』Reader Setting』。 2.進入Setting畫面後切換到』Send to』。發現Google提供的分享icon列表裡並沒有Google Bookmarks。 3.但google reader有提供自訂分享連結的功能，在最下面 還提供一些傳送連結的參數，但並未說明怎麼用，bookmarks也需要特定的參數名稱 4.按下』Create a custom link』，出現以下欄位： 填入以下連結: Name:  Google Bookmarks URL:  http://www.google.com/bookmarks/mark?op=edit&#38;-hl=zhTW&#38;output=popup&#38;bkmk=${url}&#38;title=${title} icon URL: http://www.google.com/favicon.ico 其中URL參數的意義，op=edit是把bookmarks定到編輯模式，bkmk=${url}&#38;title=${title}就是將文章的標題和網址填入bookmarks對應的欄位，要使用中文介面記得加-hl=zhTW。 輸好按save儲存。 5.往後在Google Reader裡打開文章時，』Send to』下面就會多一項』Google Bookmarks』 6.選』Google Bookmarks』，就可以直接把標題和網址帶到bookmarks裡啦 看起來不太一樣(沒有左邊欄)，但功能完全沒問題 好像英文版才有比較多功能喔，如果中文版找不到就切過去看看吧。 還有更多Send to 的玩法在這裡： http://googlesystem.blogspot.com/2009/08/google-readers-send-to-feature.html Posted in 雕蟲小技 Tagged: google bookmarks<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=hsinyu00.wordpress.com&amp;blog=4879661&amp;post=279&amp;subd=hsinyu00&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
		<wfw:commentRss>http://hsinyu00.wordpress.com/2010/01/18/google-reader-to-bookmarks/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="" medium="image">
			<media:title type="html">hsinyu00</media:title>
		</media:content>

		<media:content url="http://hsinyu00.files.wordpress.com/2010/01/2010-01-18_1132452.jpg" medium="image">
			<media:title type="html">2010-01-18_113245</media:title>
		</media:content>

		<media:content url="http://hsinyu00.files.wordpress.com/2010/01/2010-01-18_113726.jpg" medium="image">
			<media:title type="html">2010-01-18_113726</media:title>
		</media:content>

		<media:content url="http://hsinyu00.files.wordpress.com/2010/01/2010-01-18_114523.jpg" medium="image">
			<media:title type="html">2010-01-18_114523</media:title>
		</media:content>

		<media:content url="http://hsinyu00.files.wordpress.com/2010/01/2010-01-18_115514.jpg" medium="image">
			<media:title type="html">2010-01-18_115514</media:title>
		</media:content>

		<media:content url="http://hsinyu00.files.wordpress.com/2010/01/2010-01-18_1205271.jpg" medium="image">
			<media:title type="html">2010-01-18_120527</media:title>
		</media:content>

		<media:content url="http://hsinyu00.files.wordpress.com/2010/01/2010-01-18_120735.jpg" medium="image">
			<media:title type="html">2010-01-18_120735</media:title>
		</media:content>
	</item>
		<item>
		<title>機車搶劫奇遇記</title>
		<link>http://hsinyu00.wordpress.com/2009/04/12/robbery/</link>
		<comments>http://hsinyu00.wordpress.com/2009/04/12/robbery/#comments</comments>
		<pubDate>Sun, 12 Apr 2009 12:39:33 +0000</pubDate>
		<dc:creator>hsinyu00</dc:creator>
				<category><![CDATA[未分類]]></category>

		<guid isPermaLink="false">http://hsinyu00.wordpress.com/?p=266</guid>
		<description><![CDATA[我媽被搶了。 星期五下午，我媽騎著單車，載著我家的過動巨型西施犬去寵物店洗澡。寵物店離我家只有三分鐘，我媽一如往常悠哉由哉地把樂翻的狗狗放在前面的車籃裡。到了寵物店，放下狗，空出籃子，就非常順手的把皮包放進去。 然後我媽又循著一貫路線，想騎到常去聊天的朋友家。路上還遇到幾個熟人，停下來話家常一番。就在到達的前一刻，兩個蒙面人從左後方騎著一輛機車，強悍地逼近我媽，飛快地掠走車籃裡的皮包，隨即催滿油門消失在下一個轉彎口。 一切發生得太快，來不及反應。我媽大呼搶錢，路旁剛好停下的貨車司機和路過的女士，一起追著看搶匪的車牌號碼，但都不成功。我媽一時不知如何是好，又無處可去，所幸人沒受傷，最近的派出所就在三百公尺不遠處，很快就報了案。 我接到電話後，跟我老大告了個小假，盡快趕到派出所。雖然被搶是件令人傻眼的事，但更神奇的還在後面。不，不是吃案，先別這麼假設。我到達警察局時，值班警員確認了我的身分後，忽然從一貫公權力的威嚴，轉為百般客氣，說我媽正在跟派出所所長談話，請一起來聽。 我想，雖然我媽不免受驚，但機車搶劫算大案子嗎，怎麼還勞駕所長來問案呢。一進辦公室，所長像老朋友般滔滔不絕，從他個人的從警轉調歷程，一路談到最近本區的治安概況和黑道勢力，講了快十五分鐘。看來這宗搶案，是某系列犯罪的一個環節。最後他說：『我調到這邊剛滿三個月，卻有一種喘不過氣的感覺。這次讓你們受到驚嚇，非常抱歉、非常抱歉。』又一再宣示辦案決心，絕不吃案。最後站起來，一個九十度大鞠躬，再加好幾個四十五度小鞠躬。 我心裡OS，是我孤陋寡聞嗎？我們家又不是立法委員，這也太over了吧！警察局什麼時候變成了服務業，明明是搶匪的錯，硬要說成是警方的錯。還沒結束喔，我媽從所長辦公室出來製作筆錄時，在場所有的警員，只要手邊沒事又剛好耳聞這件案子，全都像KTV或是日本料理店服務生一般，走過來邊鞠躬邊說，『抱歉，讓您受驚嚇了。』隨後七手八腳地調出自己和附近里辦公室的監視錄影帶，可惜拍到畫面的，解析度都太差；解析度高的，角度又不對。即使如此，每位警員都眉頭深鎖，監視器畫面看了一遍又一遍，想找出任一點蛛絲馬跡，還叫我一起來看。憑著如此薄弱的線索是很難找出嫌疑犯的吧，換成是我，絕對拼湊不出一個所以然。各位警官們不要再撐了，人都跑了，要嘛就從其他管道去蒐證，要嘛就等其他線索浮現了再來辦，關在局裡，急於這一兩小時也沒用。 做筆錄的過程更是小心又小心，叮囑再叮囑，雖然這年頭還要問被害人出生地、學歷什麼的，有點繁文縟節啊。『記得就講，記不清楚就不要勉強，還有，要到銀行和戶政事務所去辦手續喔，我們開報案紀錄給妳，這樣就不會被刁難，也一定不會有刑責啦，放心。』最後還印了一篇Yahoo知識+的post給我們，上面列了所有重辦身分證件需要準備的東西(Yahoo知識+喔，怎麼不是戶政事務所網站，這位警察先生蠻愛上網的嘛。) 結束後，所長又走到門口，一路道歉個不停，最後目送我們到路口才回去。 據我媽說，派出所長還強烈表達了要賠償她所有損失的意願，我媽想這樣好嗎，警察局又不是保險公司，結果不了了之。我有種奇怪的感想，怎麼整個場景扭曲了，認真辦案雖然很好，但這樣的態度真的健康嗎？是什麼樣的壓力、什麼樣的治安，可以使得一個地區小派出所如此的草木皆兵？或是什麼樣不公的評論、誇大其詞的媒體，可以讓這些警官們如此矯枉過正？雖然吃案的例子俯拾皆是，我也不能斷定他們的客氣是真是假，但看得出來，在場的每個警察都憂心忡忡，警察也很可憐啊。民主社會雖有言論自由，但揠苗助長也太冤枉了吧，give me a break，拜託，自然就好。 Posted in 未分類<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=hsinyu00.wordpress.com&amp;blog=4879661&amp;post=266&amp;subd=hsinyu00&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
		<wfw:commentRss>http://hsinyu00.wordpress.com/2009/04/12/robbery/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="" medium="image">
			<media:title type="html">hsinyu00</media:title>
		</media:content>
	</item>
		<item>
		<title>迷你書摘：這才是心理學！</title>
		<link>http://hsinyu00.wordpress.com/2009/04/04/psychology/</link>
		<comments>http://hsinyu00.wordpress.com/2009/04/04/psychology/#comments</comments>
		<pubDate>Sat, 04 Apr 2009 12:09:49 +0000</pubDate>
		<dc:creator>hsinyu00</dc:creator>
				<category><![CDATA[讀書心得]]></category>
		<category><![CDATA[book]]></category>
		<category><![CDATA[心理學]]></category>

		<guid isPermaLink="false">http://hsinyu00.wordpress.com/?p=249</guid>
		<description><![CDATA[剛拿到這本書時，覺得不在頭上綁個『必勝』白布條是看不下去的，一來這不是我的專業，二來簡介超嚴肅。沒想到還蠻有趣，有點像是心理學界的謠言追追追或Myth Busters。說這是一本專講心理學的書就太狹隘，事實上，所有有志從事科學專業的人都不妨看看這本書；對科普有興趣的一般人，更可以藉此檢驗一下，自己是不是上了偽科學的當。 『科學』二字在我們這個時代過於氾濫，一個議題要被稱之為科學，以下的基本原則是不可少的。 實徵主義(empiricism) 首先是系統化的實徵主義。用俗話講就是觀察和實驗，某理論可以經由控制良好的實驗，重現理論提出者所描述的現象，實驗結果可公開的被觀察到。而這個理論可以被其他實驗者一再的重驗，經由證據累積而真正被建立，進而能具體預測宇宙中的現象而對人類有所幫助。 可證偽性 令我耳目一新的是，作者一再強調：任何科學理論都要留一扇窗，讓自己可以被修正或推翻，否則就不能被稱之為科學，這就是『可證偽性』。例如，十八世紀的重症黃熱病一度以放血來治療，主事醫師主張，若病患痊癒了就是療法生效，而死亡了就是病況過於嚴重，總之他的療法毫無瑕疵。又例如『超感官知覺論』說，你如果相信靈魂可以存在於我們周圍，他們就能出現在你身邊且有各種作為，若你不相信，他們就消失而無法被感應。這些論調無論如何都有得解釋，都不能被證偽，成為『偽科學』最鮮明的例子。而證偽的歷程與建立理論相同，是經過公開觀察實驗累積證據而成。 操作性定義 至於上帝存不存在、人生的意義是什麼，雖然這些問題答案未必是肯定或否定的，但這些是無法用科學解決和回答的『本質性問題』，就不在科學的領域來討論了。心理學也屬於科學的一部分，並不像大眾媒體塑造的，僅僅用訪談發展出概念，『佛洛伊德只要一張沙發就夠了』。與其他科學相同，心理學理論是由一個個『操作性定義』來描述的，所謂操作性定義大家小學有學過吧，就是像『大氣壓力為76毫米汞柱高』這種可被公開觀測到的指標。要得到足夠的指標來連結概念和可觀測事件、建立一個有效的理論，仰賴的是設計周全的實驗。 相關和因果 怎樣才算設計周全的實驗呢？再來回憶小學所學到的吧。老師說，一個實驗一定要有『操縱變因』，所有其他不屬於操縱變因的都是『控制變因』，操縱變因啟動的是實驗組，操縱變因不啟動的是對照組。這裡作者舉了一個令人傻眼但非常經典的例子，古德格柏醫師與癩皮病。二十世紀初此病被認為是較差的衛生條件、處理不當的污水所造成，但古德格柏醫師獨排眾議，認為是蛋白質缺乏、高比例澱粉的飲食所造成的營養不良。為了證明他的論述，醫師本人與志願者，混合麵粉，服下了癩皮病患的排泄物，但之後完全沒任何有發病的跡象，由此排除了污水和癩皮病相關性。然後又找到另兩組志願者，一組長期攝取與癩皮病患相同的飲食，另一組攝取均衡飲食，最後攝取與癩皮病患相同的飲食組果然出現癩皮病徵。由此不但證明了癩皮病與飲食的關聯，還證明了與污水的『虛假相關』。 實驗方法的中心思想就是操弄及控制，即便是實驗與自然真實的生活相去甚遠，這樣才能把影響結果的因素獨立出來，以確認因果相關性。現實中的因果，有些是正相關、有些是虛假相關或因果顛倒；有些因果永遠同時出現，但事實上是第三原因造成，甚至是許多原因同時出現，並產生交互作用才能導致特定的結果。若沒有實驗來解決疑惑，就只能依靠直覺和猜測。這都有待變數控制周全的實驗，來揭曉真正的答案。當下無法驗證的疑問，隨著實徵技術的進步，也許在未來會成為科學可重驗的事實。 見證、個案與統計 原書中花了許多篇章來說明這三件事，但我覺得他們之間息息相關，合在一起講也無妨。心理學研究相當依賴統計，而所有科學都重視證據的累積，但就是有這種時候，當統計告訴我們酒駕導致高車禍死亡率，隔壁的歐吉桑就跳出來說，我昨天就喝了點小酒，怎麼還是安然無恙的開車到家呢。我們所謂的常識、偏見在這裡慢慢形成，媒體更是善用這種個案見證的鮮活性，來告訴大眾某種行為是有益的、某樣產品是最好的。甚至心理學界本身，也在爭論單一臨床研究的結論，是否能凌駕於長久統計的結論。水能載舟亦能覆舟，個案的特殊性，是給了研究者機會收集到更多的證據，還是根本誤導了研究結果，一竿子打翻一船人？機率統計雖然不能回答我們絕對的結果，但這個預測的傾向，是比單一個案更具說服力的。 Finally, 在缺陷中進步 雖然像愛因斯坦相對論這種大躍進式的進步並非不可能，但這不是科學進化理所當然的模式。新的發現必須要考慮舊理論中的實徵資料(關聯原則)，一系列的科學實驗所創造的證據聚集，遠比單一實驗所創造的概念大突破更實在。無數有缺陷的實驗結果，才能整合成最終可信的智慧結晶。回到前面所說的，科學並不能給我們宇宙終極的答案，只能在發展中慢慢修正使得理論更接近事實。 後記 妙的是，讀這本書的感覺五味雜陳，一方面有『茅塞頓開』的感覺，這本書有二十年的歷史仍歷久彌新，二十年前國外就提倡的基本觀念，為什麼我們吵吵嚷嚷了這麼久，就沒有任何有力人士來正視聽？另一方面，在某個章節中，作者說了一段讓我有點難過的話：『&#8230;那些無法在模糊的氛圍裡工作的人，通常都不會從事科學工作，因為科學就是充滿不確定性，它所呈現的模糊幻燈片可能破壞了某些人的美感。科學家應有的態度是，對那些目前還很模糊但最終將會變為清晰的影像，保留一種強烈的好奇心。』只有無比堅強的靈魂，才能徹底捨棄一個宇宙終極答案所給予的安逸感和安全感吧。 Posted in 讀書心得 Tagged: book, 心理學<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=hsinyu00.wordpress.com&amp;blog=4879661&amp;post=249&amp;subd=hsinyu00&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
		<wfw:commentRss>http://hsinyu00.wordpress.com/2009/04/04/psychology/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
	
		<media:content url="" medium="image">
			<media:title type="html">hsinyu00</media:title>
		</media:content>

		<media:content url="http://hsinyu00.files.wordpress.com/2009/04/200507book_psychology.jpg" medium="image">
			<media:title type="html">200507book_psychology</media:title>
		</media:content>
	</item>
		<item>
		<title>文章分享：RIA專案開發的必備概念</title>
		<link>http://hsinyu00.wordpress.com/2009/02/26/ria/</link>
		<comments>http://hsinyu00.wordpress.com/2009/02/26/ria/#comments</comments>
		<pubDate>Thu, 26 Feb 2009 08:54:49 +0000</pubDate>
		<dc:creator>hsinyu00</dc:creator>
				<category><![CDATA[拾人牙慧]]></category>
		<category><![CDATA[RIA]]></category>
		<category><![CDATA[前端開發]]></category>

		<guid isPermaLink="false">http://hsinyu00.wordpress.com/?p=240</guid>
		<description><![CDATA[寫CSS和Ajax的前端工程師，似乎會刻意避免用flash/flex當解決方案，理由眾多，如檔案大loading重、SEO成效不好等等。但以下這篇由精誠資訊的RIA講師Anistar在ITHome的訪談內容，很清晰地闡明了RIA使用的場合，也解釋了CSS、Ajax、Flash/Flex綜合使用的必要性，不管使用哪一種解決方案，Usability和User friendly都是最終的目標。Anistar同時也提到了前端開發和後端開發的分工，這雖然已是網站業界的基本共識，仍值得我們提醒自己。 RIA專案開發的必備概念：原文請見 http://blog.riaproject.com/flex/1004.html/trackback Posted in 拾人牙慧 Tagged: RIA, 前端開發<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=hsinyu00.wordpress.com&amp;blog=4879661&amp;post=240&amp;subd=hsinyu00&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
		<wfw:commentRss>http://hsinyu00.wordpress.com/2009/02/26/ria/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="" medium="image">
			<media:title type="html">hsinyu00</media:title>
		</media:content>
	</item>
		<item>
		<title>Google讓我們變得弱智？</title>
		<link>http://hsinyu00.wordpress.com/2009/01/10/google/</link>
		<comments>http://hsinyu00.wordpress.com/2009/01/10/google/#comments</comments>
		<pubDate>Sat, 10 Jan 2009 13:44:51 +0000</pubDate>
		<dc:creator>hsinyu00</dc:creator>
				<category><![CDATA[庶民淺見]]></category>
		<category><![CDATA[google]]></category>

		<guid isPermaLink="false">http://hsinyu00.wordpress.com/?p=224</guid>
		<description><![CDATA[這則yahoo新聞出來其實有好一陣子了，引起我周圍的google愛用者和google不信任者小小的論戰，我自己也不免猶豫了一下，顯然是個有意思的題目。 原文在下方 做了個非正式的迷你民意調查，結果是這樣： 四、五年級以前的世代說：網路上什麼都有，但查來的資訊沒什麼可靠的 五年級說：會利用google得來的資訊，但一定要與其他資訊來源對照著用 六年級以後的說：雖然也參考網路以外的資訊，但先google來認識主要概念 資訊科技產業的人：這個產業的知識，不google難道要去圖書館找嗎 金融產業的人：要看股票、基金和匯率，還是網路比較快啦，不過有時人脈比較靈 法律界的人：我們查法條早就比google搜尋還厲害 真奇怪，每當有新工具盛行時，就有人抱著絕對悲觀的看法。當然，衝擊和改變在所難免，但人們總會自我適應出一個新的平衡點。好用有料的事物歷久彌新，譁眾取寵的事物自然淘汰。網站盛行以後，紙本書並沒有消失啊，只是多了一種選擇，各擔任不同的角色；張君雅小妹妹也沒把王子麵幹掉，何必一定要誰取代誰呢。 大家上學時都寫過報告吧，那時去圖書館找資料要翻櫃子裡的索引卡片，有作者卡片、圖書分類卡片等等，還有一種叫『關鍵字』的卡片。我在圖書館裡很不靈光，除了關鍵字卡片，用其他卡片通常找不到對的東西。那時我總是很驚奇，為什麼班上有些筆記公主，不用關鍵字卡片，卻以『年份、作者、出版機構』或其他怪方法為搜尋脈絡，還能找到一堆讓報告寫得漂亮的東西。 或許較長較艱難的搜索過程，能造成對某主題有較廣泛又深刻的認識，資訊在大腦中發酵較久，即使無法快狠準地找到解答。就像走路比較容易看清楚路上的風景，而坐車就只能看到風景唰一下的飛過，但較快到達目的地。各有各的好處。新聞中所述的『前幾個世代主要通過書本和傳統的學習獲得知識』說的就是這種過程。然而也不是萬無一失，有時最先被找到的書本論文或期刊，不幸是一本爛書，筆記公主也會踩到地雷吧。這只代表它容易被找到，就算與主題高度相關，內容太貧乏也沒用，大家還是會繼續找其他資料來對照，做個綜合的結論。 『關鍵字』卡片有沒有像hyperlink呢？我個人覺得搜尋原理相差不大，google僅僅是省略手工、加快跳躍過程而已。(硬要說斷章取義，關鍵字卡片不也有同樣的效果嗎) 排名第一的搜尋結果，如果是篇垃圾文，就算我們點進去看，也會馬上捨棄它。要決定找到的是不是垃圾，顯然得經過一番理智的綜合評估。google拋磚引玉，先找到quick answer，還是先找到best answer，似乎是殊途同歸。如果google造成人們沒有耐性，那書本也一樣。有人看十本書才下結論，有人看一篇文章就妄下斷語，在google存在之前就已經是這樣了吧。硬說google的速度，對資訊的深度和廣度沒有貢獻，用關鍵字跳躍就一定失去脈絡，好像也不對勁。 至於新聞中所提到的，google只依照六度分離的連結數來排名，好像也不完全是這樣，連結數只是其中的一項權重。理論上本文的關鍵字越多，排名也越前面，而與主題高度相關、內容充實有組織的文章，天生也具有這種性質。 人們都用google查什麼呢？以下幾種應該最常見： 資訊科技產業相關的知識，它在網路世界的更新頻率、密集度和正確性本來就比較高。而既然從事資訊產業，讓自己的訊息在google上容易被搜尋到，難道不是一種義務嗎。 驗證來自其他管道的訊息，與google互相對照，比如查產品的詳細規格，或旅遊景點的路線圖。 只要用小腦就能解決的問題，比如哪家餐廳好。即使做了錯誤的決定，付出的代價也不算大，何必花時間翻遍古籍經典勒。 如果一時什麼都找不到，google至少提供一個突破點。 當然google有缺點，比如說每個性質相同的資訊，沒有絕對公平的機會，刻意運作以這個方式曝光的會排在較前面(但不一定會成功)。 而在google世界之外，資訊自然會經由最適得其所的管道傳遞，盡信google不如無google啊。 Google世代：只搜尋不思考？ 更新日期:2008/12/30 15:35 Yahoo！奇摩特約記者薛怡青綜合外電報導 大家口中的草莓族，現在有了新的稱法，國外有研究將這群在1993年以後出生的小孩稱為「Google世代」，在美國約有6100萬人，他們的養成過程幾乎都在網路上。「Google世代」在網路上玩遊戲、聊天和學習，甚至有時候同時做這三件事情。 刻板印象認為，前幾個世代主要通過書本和傳統的學習獲得知識，相較之下，Google世代的特點是缺少耐心、持久性和衝動。但是先前倫敦大學的研究破除了這個迷思，Google世代並不局限於年輕人，而是更廣泛的文化現象，年輕人相較於年長者，並不更需要一直連在網上，也不會比較沒耐心，至少在等候網頁下載及檔案刪除的時候。 因此這形成更迫切的社會議題，舉例來說，掌握了枝微末節或大量的資訊會不會妨礙我們的創意及獨立思考？唾手可得及自動產生的答案會不會阻礙了我們的整體認知能力？ 根據長島大學教授Emily Walshe的研究，Google世代更偏好高度集中且容易摘要的資訊，而且我們已經習慣「強力搜尋」模式，快速瀏覽取代了閱讀的動作，網路使用者不分老少，都習慣只看網站的一兩頁（或者是整頁的一兩句），就跳出該網站。 在搜索和思考方面，前後文脈絡是非常重要的。Google搜索結果的排序，是根據衡量來自其它網頁鏈接的演算法，這基本上是一種6度分離的邏輯，但也同時讓資訊獨立於脈絡之外。久而久之，這種思考方式就容易形成「斷章取義」的後果。 「Google 世代」將內容普遍抽離於脈絡之外的影響，不只在教育，而且對醫療、新聞、商業和政府都產生了深遠的後果。這將影響到現代公民的每一個方面，改變人們思考現代公民身份、財產、認同甚至愛情的方式。如果我們不認真對待的話，這也許會使我們變得愚蠢，或者有一天我們更可能落入歐威爾所謂的「大騙局」。 Posted in 庶民淺見 Tagged: google<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=hsinyu00.wordpress.com&amp;blog=4879661&amp;post=224&amp;subd=hsinyu00&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
		<wfw:commentRss>http://hsinyu00.wordpress.com/2009/01/10/google/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="" medium="image">
			<media:title type="html">hsinyu00</media:title>
		</media:content>
	</item>
	</channel>
</rss>
