使用dreamweaver5.5 開啟jQuery Mobile

Dreamweaver5.5與之前的版本就差在於多了行動裝置的設計與開發。(cs6都出來了...)

5.5的誕生並不是為了修正之前的錯誤而改版，而是多了很多關於行動裝置開發的工具，還有javascript程式庫.jquery等等.CSS可以設定圓角.陰影，支援HTML5.內嵌自字形。

最重要的是可以藉由5.5開發jquery mobile，它會自動幫你匯入javascript與css架構。

假如要學習使用5.5來開發手機網頁，又不想要看程式碼，可能會有點吃力，因為手機網頁已經不同於我們一般在PC看的網頁，這點是所有網頁設計師都會有點困惑的地方，要記住，不是只設計給PC的人看，所謂行動裝置的設計，不只是指手機，還有平板，牽涉的功能很多，已經不是過去用div切一下就可以解決的問題。 你有css是否符合螢幕的問題.你也有檔案大小的問題。

怎麼使用dw5.5開啟jquery Mobile頁面 :1.請先去adobe下載試用版。但是是英文版。http://www.adobe.com/tw/downloads/

2.開啟後會有一個歡迎介面，這個介面可以選擇你要開啟舊檔，還是開新頁面，由於jquery是範本，所以我們必須點選中間那一欄下面的more....

3.按下more之後，請點選"page from sample"-->"Mobile starters"-->"jquery Mobile (CDN)"

這裡的jquery Mobile (CDN)是指從CDN載入jQuery Mobile程式庫 。(CDN就是content distribution nerwork，內容傳遞網路) 請google。

這裡的這三個 CDN.local phonegap 的差別在最後面介紹 。

4.按下create後就可以看到這個畫面，會產生一個頁面，然後有一些原生的內容，這個畫面總共有四個div(#page~#page4)，每個div都有屬於自己的header跟content還有footer，這其中的關係跟瀏覽出來的結果有什麼關聯，多多嘗試就知道了。
會發現雖然都寫在同一頁，但是實際瀏覽出來的結果卻是分別獨立開來的頁面。

5.接下來請試著去修改頁面的資訊

6.然後我們來瀏覽一下實際狀況是如何，請切換成live view

7.切換後可以看到整個頁面的結果，為什麼可以看到顏色跟css樣式，那是因為產生這個jquery頁面的時候就已經匯入javascript跟css樣式檔了。可以試著點按裡面的連結，在按back回上一頁，只是會有點卡卡的，因為是使用dw的liveview ，如果事實即丟到瀏覽器觀看，應該是不會卡卡的。

8. 怎麼開新jquery檔案就先介紹到這裡，存起來吧，點選file->save as 

9.存檔的時候請放在一個自己知道的資料夾，或是開新資料夾來放資料。檔名取index.html

10. 存好之後你會發現只有一個index.html，是不是怪怪的呢？那些匯入的css跟javascript在哪了?這個問題非常簡單，看了一下index.html的原始碼，你會發現這些匯入的css或是js 都是匯入自http://的連結。

為什麼匯入來自網路的原始碼跟樣板
這是因為在前面我們開新檔案的時候選擇了CDN
CDN就是匯入來自網路所提供的檔案，優點是減少頻寬，降低負擔。
但是要哪天這個網路所提供的檔案停用或者無法上網時，那就會看不到js跟css匯入的效果。

所以如果再存檔的時候你希望連js跟css也一併存在本機的話(這也是我覺得比較保險的作法)，就要選擇第二個 jQuery Mobile(local) (就是本機)的選項，如此一來在存檔的時候就會詢問你是否一併儲存這些相關的檔案到跟目錄。
個人比較建議這種方法，因為比較保險。

先介紹到這裡..。

mobile_web練習二

http://yiyingwu.zxq.net/p1_mobile/index.html




http://yiyingwu.zxq.net/p1_mobile/index.html 
(練習網址，請將瀏覽器縮成約略手機螢幕的比例，如上圖xdd )

昨天看到一個不錯的範本就co下來解析解析一下
跟上一次練習的mobile web功能不太一樣，這個範本多了怎麼放google MAP，而且css也好理解很多... 謝天謝地，終於比較懂了點。上次在網路上看到範本太驚人的深奧了。

原來google的地理位置在url連結裡有，害我點了好久都找不到，像這樣
http://maps.google.com/maps?q=%E5%9C%8B%E7%AB%8B%E9%AB%98%E9%9B%84%E5%A4%A7%E5%AD%B8&hl=zh-TW&ie=UTF8&ll=22.731461,120.281925&spn=0.051377,0.066175&sll=37.0625,-95.677068&sspn=44.928295,67.763672&vpsrc=6&hq=%E5%9C%8B%E7%AB%8B%E9%AB%98%E9%9B%84%E5%A4%A7%E5%AD%B8&radius=15000&t=m&z=14&iwloc=B
原來連結已經透露地理位置了。

不過有些功能還是很不能理解，可能真的要有智慧型手機才能真的知道mobile web需要功能是什麼吧。寒假再來好好研究。

實戰小筆記

之前為了放一個實習的靜態網站，一直很擔心會不會買錯主機之類的，總之，那時候繁雜的小問題很多，畢竟花錢買空間的不是我，但是決定要怎麼買的人是我，實在太沒有安全感了就上網看了很多文章，我只能說呢...空間買下去之後才會真正知道怎麼做，看再多的文章也幾乎只是觀念上的知道而已吧...

首先網站要做到可以讓別人上網看到你的網站，有兩件事要做，第一種就是租網址，第二種是買空間。 (我印象中，網址只能算是用租的，空間是買的，印象中啦....)

如果你上網去查 怎麼讓別人看到我的網站，很多文章都會說，首先一定要買空間，空間就像你的房子，如果沒有房子，你的網站要放哪呢? 之後你要買網址，網址就是你的門牌號碼，你希望別人找到你家，總要給他你的門牌號碼吧!，所以以上這兩件事是缺一不可，除非你自己在家架主機，那麼另當別論了。(其實我覺得在台灣申請真的蠻嚴格的....)


開始有點觀念之後就是上各家租空間的公司去察看與比價空間的價位如何，說實在各家價位差很多。這時候問題又來了，看不懂哪種方案適合自己就算了，當你要買的時候，那亂七八糟複雜到不行的申請表看了我頭就暈。

申請了之後呢，電信業者把相關的ftp訊息寄到你的信箱，有人看到這個也昏了，ftp是甚麼?怎麼用啊!?

等到這個ftp上傳網站了以後呢，人的慾望是無窮的，這時候就很興奮的上網google自己網站在第幾頁第幾個，挨這個....記得在網頁的<meta>標籤裡好好做關鍵字就好，幾周後就會自己看的到了，別擔心....
(註: FTP(file transfer protocol,FTP)檔案傳輸協定，兩台電腦互相傳輸檔案)

順便補充一下，這種xxxxx.com就是網域名稱，很多公司都是花大把的錢買能代表他們的網址，簡直一場網域名稱大戰，誰先登記誰就贏。有一種人整天搶著登記知名公司的網域這種行為就是"網路蟑螂"。