1 / 29

第一課

第一課. 網頁概念 主講人 - 洗碗精. 今日內容. 常見名詞 網頁元素 - 一個網頁包含什麼? 事前的準備 網頁如何製作 - 軟體與語法 網頁設計軟體 實作示範 讓大家看到你的網頁. 常見名詞. 瀏覽器 (Browsers) 打報告會用到 word 、聽音樂可以開 realplayer 、閱讀網頁則需要用到稱為瀏覽器的軟體來開啟網頁 瀏覽器是一個總稱 如 IE 、 kkman 都是瀏覽器的一種. 副檔名 用來分辨檔案類型 如同圖片的副檔名有 .jpg .gif 等等,網頁的副檔名也有 .html .htm .php ...etc

ganit
Download Presentation

第一課

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. 第一課 網頁概念 主講人-洗碗精

  2. 今日內容 常見名詞 網頁元素 - 一個網頁包含什麼? 事前的準備 網頁如何製作-軟體與語法 網頁設計軟體 實作示範 讓大家看到你的網頁

  3. 常見名詞 • 瀏覽器(Browsers) 打報告會用到word、聽音樂可以開realplayer、閱讀網頁則需要用到稱為瀏覽器的軟體來開啟網頁 瀏覽器是一個總稱 如IE、kkman 都是瀏覽器的一種

  4. 副檔名 用來分辨檔案類型 如同圖片的副檔名有.jpg .gif等等,網頁的副檔名也有.html .htm .php ...etc .html、.htm等網頁檔,可以用IE、kkman等瀏覽器開啟 這是一個圖片檔 這是一個網頁檔

  5. 網頁代管- 提供空間給你放網頁(即提供伺服器),例如學校的http://dorm.nsysu.edu.tw/ • 網域名稱(DomainName)- 也就是我們常聽到的”網址”,例如 http://biocamp.no-ip.info/coppermine/ http://dorm.nsysu.edu.tw/~b942010023 容後再敘

  6. 伺服器– 提供一種以上的網路服務的主機就稱為伺服器,例如google有提供搜尋引擎,就可以稱為伺服器,CDPA有提供學生信箱,也可稱之為伺服器。 我的伺服器 http://saaxd.no-ip.info/index2.html 容後再敘

  7. 超連結 這是一個超連結

  8. 網頁元素 - 一個網頁包含什麼? • 內容、圖片、動畫、音樂、logo、愛…etc

  9. 網址 圖片 超連結 內容 還有更多…容後再敘

  10. 事前的準備 • 製作網頁之前,需要先做好準備,蒐集資料、了解網頁風格等等…

  11. 蒐集網站的資料檔案並妥善分類,名字好好取 • 網站的目的、主題是什麼 • 符合主題的圖片(素材、自己畫…等等)色彩、風格 Ex:http://www2.nsysu.edu.tw/Biotech/index1.phphttp://www.cp-essay.com/

  12. 企劃書- 1.設計個大綱 2.簡單畫出架構 3.估價(?)

  13. 網頁如何製作? 軟體與語法 1.網頁製作軟體  不需編輯程式碼,由軟體幫你弄 2.程式碼  直接編輯程式碼,接下來的課程將會教到 程式碼不可怕,只要來上課,人人都可以作網頁

  14. 程式碼 程式碼

  15. 網頁製作軟體 免費的- Mozilla Composer www.mozilla.org Nvu www.Nvu.com 要$的- DreamWeaver

  16. 網頁如何讓人看到 需要有一個對外的地方放網頁 • 自己架一個站(後面課程) • 放到別人架好的站 Ex:宿網提供的網頁空間

  17. 放在自己的電腦裡不行嗎 • 平平是一台宅在宿舍的電腦,配備都一樣… • 平常使用的電腦 v.s. 有架站的電腦 宅用 ↓ 別人看不到你的站 宅用,but有架站 ↓ 別人可以連到你的站

  18. What is 有架站的電腦?? • 簡單來說 • 就是 • 有裝架站軟體的電腦

  19. 示範使用DreamWeaver • 文字、顏色、超連結(相對、絕對、target、電子郵件)、加入圖片、加入背景、表格(絕對、相對寬度)、框架

  20. 申請空間+上傳 • 作好網頁之後,要怎麼讓其他人看到這個網站呢? • 我們需要 1.網址 2.網頁空間 3.傳過去

  21. 申請免費的網頁空間 我們以宿網提供的空間當做這次範例 學校的CDPA有提供免費的網頁空間,還附上網址唷! 現場示範,請提供一名志願者

  22. STEP1 預備工具-FTP FTP = File Transfer Protocol(檔案傳輸協定) 兩部不同的電腦之間雖然檔案格式或本身系統 不同,但透過FTP可以讓兩部電腦檔案順利傳送。 作好的網頁 網頁空間 FTP

  23. STEP2 申請空間-http://register.cdpa.nsysu.edu.tw/(宿網)

  24. STEP3 打開FTP 登入剛剛申請到的空間 需輸入以下- 主機名稱:dorm.nsysu.edu.tw 帳號:b9X20100XX 密碼:XXXXX

  25. 主機位置 帳號 密碼

  26. STEP4 上傳 進入”htdoc”資料夾 將網頁拉過去

  27. 左半邊=你的電腦 右半邊=你申請的空間

  28. STEP5 打開瀏覽器輸入網址,看看成果吧! http://bXXXXXXXXX.dorm.nsysu.edu.tw

  29. 下週 動態與靜態網頁、HTML 教學 等你唷~ 垃圾給我帶走 不然你就死定了

More Related