Welcome! 登入 註冊
專區首頁 專區百科 專區論壇 專區部落格 專區地圖

Advanced

[作業00] 網頁設計課前準備與基本認識

[作業00] 網頁設計課前準備與基本認識

歡迎來到網頁設計的世界,為了讓大家更快的進入這門課程,更好的學習網頁設計,請大家完成以下任務!


第一週須完成的任務:

1. [url=http://jinjin.mepopedia.com/~jinjin/webdesign-notes/ ]逛逛老師整理的網頁設計教學網站[/url]


[url=http://jinjin.mepopedia.com/~jinjin/webdesign-notes/homeworks.html#all]本學期作業列表[/url]

[hr]

2. 安裝軟體


安裝必備軟體

[hr]

1. FileZilla

免費好用的FTP軟體

https://filezilla-project.org/

FileZilla是一套開放原始碼的免費FTP檔案傳輸軟體,內建44種語言的多國語系介面,且還提供Windows、Linux、Mac OS X等多種作業系統平台的版本。除了支援一般FTP檔案傳輸之外,還可支援SFTP與「FTP over SSL/TLS」…等傳輸模式,是個相當穩定而好用的免費軟體。

本課程的作業,將藉由FileZilla上傳至雲端伺服器,請每位同學都須下載並學會使用!

安裝說明:
http://jinjin.mepopedia.com/~jinjin/webdesign-notes/concept.html#fz

[hr]

2. Notepad++

http://notepad-plus-plus.org/

實用的免費文字編輯軟體 - Notepad++,是旅法台灣人作品,體積輕巧不佔系統記憶體,支援多分頁功能,是一套用來取代Windows記事本的工具,他的操作方式與記事本完全相同。

具有好用的中文搜尋取代、開啟檔案群組、在目錄中的指定副檔名搜尋特定字串、程式語言高亮度顯示等功能,支援ANSI、UTF-8(支援檔首無BOM)、UCS-2...等格式的編譯及轉換,是必備的原始碼編輯軟體。可以替許多的程式語言的語法上色,而且還有半透明視窗的效果,是撰寫程式的好幫手。

[hr]

3. Dreamweaver


視覺設計師常用的網頁設計軟體,不過不宜太依賴內建的功能,先了解網頁背後的結構與語法才是王道。

[hr]

3. 閱讀關於html、css相關書籍,建立網頁設計基本概念


請多多利用圖書館或網路資源

[hr]

4. 教學網站註冊


http://mepopedia.com/forum/register.php?804
註冊帳號建議為『學號』
每位同學都必須註冊,有任何註冊問題請隨時反應。可以寄信到 mepo@mepopedia.com 申請開通帳號,或於課堂上留下帳號及 email 由老師統一申請開通。

5. 認識瀏覽器


安裝目前主流的三個瀏覽器:IE、Google Chrome、FireFox至少三種瀏覽器。

http://jinjin.mepopedia.com/~jinjin/webdesign-notes/concept.html#concept03

1. Internet Explorer (IE)


特色:是目前全球使用人口最多的瀏覽器,因為是Microsoft開發的軟體,因為有許多先天的優勢,也因為最多人使用,所以大部分的網站、論壇甚至是一些php或java程式編碼都採用IE可以普遍認得的編碼。在其他不同瀏覽器上觀看這些網頁的時候,有可能發生網頁顯示不正常或者部分功能無法使用的情況。現階段而言,聰明的網頁編輯人員都會在製作網站的時候,根據這三種瀏覽器作為測試的平台,基本上以符合三種瀏覽器使用為原則。 。
缺點:速度慢、網頁編碼方式不符合html發佈的官方寫法,因此較容易出現網頁顯示異常。
下載 Internet Explorer
http://windows.microsoft.com/zh-TW/internet-explorer/products/ie/home

[hr]

2. Google Chrome


快速啟動 Google Chrome 瞬間即可啟動。
迅速載入 Google Chrome 的網頁載入速度飛快。
高速搜尋 直接從網址列搜尋網頁。
下載Google Chrome
http://www.google.com/chrome?hl=zh-TW

[hr]

3. Firefox


Mozilla Firefox是目前市占率第三名的瀏覽器,它有著豐富的擴充套件,可打造出相當個人化的瀏覽環境。今天Mozilla基金會釋出了最新的Firefox 29.0正式版,最大的特色在於新設計的界面以及方便的網路同步功能,能將你的分書籤、密碼、分頁、附加元件…等資料自動同步到雲端的Firefox帳號中,比前一版(28.0)更加美觀、直覺、好用
下載FireFox
http://moztw.org/

[hr]

6. 多觀摩與紀錄優良網站


1.瀏覽網站時可隨時觀察或記錄不同瀏覽器閱讀時的差異<
2.多看多觀摩美觀且優良網站的設計,並隨時記錄優良網站的網址,以供後續設計的參考


[hr]

7. 預備週課後問答


1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助?
2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?
3.是否已安裝好軟體?並提出任何相關問題!


回覆完畢請註明學號。

祝大家有個愉快的學習旅程!

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助? 希望可以學的懂
2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因? Netflix
3.是否已安裝好軟體?並提出任何相關問題! 還沒下載(/ _ ; )

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助? 希望可以學的懂

可以更多元的了解網業應用之類的, 希望能學習到一些常用的基本設計

2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因? Netflix

https://www.maya.com.tw/ 推薦的,我覺得他的網頁設計的很清楚明瞭,不會雜亂

3.是否已安裝好軟體?並提出任何相關問題! 還沒下載(/ _ ; )

還沒載

是傳1A 1075445031 黃子芃

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助? 希望可以學的懂
關於網頁呈現方式
2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因? Netflix
http://www.annasafroncik.it/,風格符合主題
3.是否已安裝好軟體?並提出任何相關問題! 還沒下載(/ _ ; )
還沒下載

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助?
* 雖然還沒有學過網頁設計也覺得還蠻難的感覺很恐怖,會盡力學習

2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?
fotor是個修圖的網站,照片都可以用很方便
3.是否已安裝好軟體?並提出任何相關問題!
安裝好了一個



Edited 1 time(s). Last edit at 02/22/2019 08:54PM by 1075445048.
(編輯記錄)

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助? 希望可以學的懂
學習網站可以在未來的找工作或著是創業上有所幫助。
2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因? Netflix
Google和Yahoo比我比較喜歡Google因為要找什麼都方便,也不會跳出其他廣告。
3.是否已安裝好軟體?並提出任何相關問題!
還沒下載

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助?

期許自己的功力能越來越好 以後出社會可以有個好的工作養家 至於幫助呢可說是非常大的 多學一點總是好事 以後關於設計方面就不怕有啥不懂的了 起碼能全能一點

2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?

YOUTUBE https://www.youtube.com/?gl=TW&hl=zh-tw 我覺得是目前最多人使用拿來看影片的軟體 至於我呢是因為能輕鬆方便找到想看的影片 就很像百科全書 你能想到的幾乎都有所以覺得蠻值得推薦

3.是否已安裝好軟體?並提出任何相關問題!

是的 之後能安裝的軟體都會安裝在電腦裡面 至於問題等到上課時 遇到不會或聽不懂的 會立即請教老師解答的

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助? 希望這學期可以學到網站設計的基礎,可以幫助自己如果以後要架設網站可以自己做~
2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因? https://shopee.tw/ 蝦皮購物 輕易上手,消費者可以簡單上手購買東西。
3.是否已安裝好軟體?並提出任何相關問題! 除了DW其他都下載好了!

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助?希望可以學會網頁設計,對於以後就業很有幫助
2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因? Youtobe https://www.youtube.com/?gl=TW&hl=zh-tw 因為可以查到很多想看的影片和想聽的音樂
3.是否已安裝好軟體?並提出任何相關問題! 還沒下載

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助?
我覺得學習這門課可以用在將來開店的時候,它可以幫助我開創自己的品牌在網路上。

2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?
https://www.google.co.jp/?client=safari&channel=iphone_bm
因為可以查到很多資訊。

3.是否已安裝好軟體?並提出任何相關問題!
是,沒有任何問題。

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助? 未來可以自己架構和設計網站,也是一項工作技能,希望可以熟練網頁設計,做出好的作品。
2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?Instagram。 http://instagram.com/ 我覺得他軟體好用,方便瀏覽。
3.是否已安裝好軟體?並提出任何相關問題!是。沒有問題。

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助?

能學到如何自製個人網頁,個人覺得這個學習在將來是有一定的幫助。

2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?

YouTube,https://www.youtube.com/?gl=TW&hl=zh-tw,這網站是一個很了不起的網頁,能集結世界各地的人將事物分享的地方。

3.是否已安裝好軟體?並提出任何相關問題!

已安裝,DW的不分還沒有安裝



Edited 2 time(s). Last edit at 02/22/2019 07:33PM by 1075445032.
(編輯記錄)

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助?
希望能有一個介紹自己或介紹自己品牌的平台spinning smiley sticking its tongue outspinning smiley sticking its tongue out
2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?
https://www.youtube.com/ YouTube是大家都熟悉不過的網站~廣大蒐集各類影片,娛樂、教學、音樂、紀錄......等的影片都有,能夠看見許多不同風格的創作者作品、而且最令我滿意的地方是,網站會記錄下此帳號常看的類型影片,在下一次開啟時,推薦新的影片。thumbs up
https://www.pinterest.com/ Pinterest是許多設計人都知道的網站!有無限多的平面作品,繪畫類、攝影類......等,都值得我們參考,在沒有靈感時我會經常翻閱這個網站,連手機都有下載APP,網站的優點是,圖片比文字還多,不會有繁瑣複雜的問題,可以一次看到大量的參考圖片。thumbs up
https://www.design-seeds.com/blog/ design-seeds是我私心推薦的網站,他主要的功能是配色的參考,我高中在做包裝設計時找到的網站,是配色障礙設計人的好幫手,整體網頁瀏覽的感覺也比其他類似的網站還容易上手,可能也是因為我個人的風格關係,非常喜歡它呈現色彩的方式。thumbs up
3.是否已安裝好軟體?並提出任何相關問題!
已經下載軟體 後半段站台管理那邊不懂....confused smiley

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助?
* 雖然還沒有學過網頁設計也覺得還蠻難的,可是如果能學會就多了一種專業,以後如果要設置一個網頁就能自己設置加設計不用麻煩別人了。

2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?
* / pinterest / 這是個以圖片來互相分享的程式,在這能找尋到自己喜歡的種類圖片也能分享自己喜歡的圖片給大家欣賞並互相存取,這個網站的配置好在他們圖片邊角都圓化在視覺看起來很舒服有趣,而圖片的解析度都很棒,很推薦這個程式。

3.是否已安裝好軟體?並提出任何相關問題!
請問安裝完是個叫 / opera快速撥號 的 / 網站嗎??
那個是跟google一樣的查詢網站嗎??

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助?
可以讓我學習到更多除了設計以外的相關知識 ,並且找到其中的樂趣與奧妙,讓設計不再只是侷限於本科系,還能夠與網頁設計做結合,多元性的發展。

2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?
中華百科全書 http://living.pccu.edu.tw/chinese ,我常常用這個網站來查一些我想知道的東西 ,還蠻方便好用的。

3.是否已安裝好軟體?並提出任何相關問題!
目前還沒安裝

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助?
能更加認識網頁的驅動邁向,讓觀看者看到所想表達的思想。

2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?
網站【pixiv】https://www.pixiv.net/ 是亞洲等地區大型插畫交流分享的網站,裡面幾年前新增繪畫實況跟加的與創作者交流互動、原創商品、比賽創作資訊、作者介紹及教學軟體分享、動圖......等等資訊的大型創作網站,網站簡單名確從中認識了很多,此外,它還是安利美特集團的公司。

3.是否已安裝好軟體?並提出任何相關問題!
沒有問題! 感謝老師的說明~

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助?
希望在未來能對自己想做的是有所幫助
2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?
711lativ,https://www.lativ.com.tw/,商品連接很清楚,網頁設計風格很簡單明瞭
3.是否已安裝好軟體?並提出任何相關問題!
是,除了DW

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助?
對比賽跟作業都有幫助
2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?
https://www.pinterest.com/ 許多圖片的網站thumbs up
3.是否已安裝好軟體?並提出任何相關問題!
是,Dw未安裝 希望能學會,高職時期上到一半就沒在上了希望能了解並深入

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助?
希望可以學會網頁設計這個知識,知道跟看懂如何設計一個美美的網頁,以後對工作會很有幫助。
2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?
是https://www.youtube.com/,時間都不會太久的影片,我很喜歡,因為我好少有時間放假,可以一次看很多個影片,也不會花太多時間,對我而言,youtube是一個讓我很放鬆的網站。
3.是否已安裝好軟體?並提出任何相關問題!
FileZilla已經安裝好了
希望這學期可以會網頁設計的軟體



Edited 1 time(s). Last edit at 02/23/2019 12:28AM by 1055433049.
(編輯記錄)

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助?
Ans.我覺得學習網頁設計能讓我多一項技能,希望在學期結束前能夠看懂語法,並且製作出一個兼具視覺性與實用性的網頁。

2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?
Ans.
網站名稱:Airbnb
網址:https://www.airbnb.com.tw/?logo=1
推薦原因:這個網站主要是讓閒置資源達到最大的利用,在網站上可以出租房屋、房間,對旅客來說很方便,並且透過輸入地點、日期、人數的方式來搜尋,及可看到照片、房內設備、價錢、房東資訊和旅客評價。

網站名稱:MUJI無印良品
網址:https://www.muji.com/tw/
推薦原因:網頁的排版就如同它的商品帶給人的感覺一樣,屬於簡約、簡潔、樸素的感覺,分類的方式也能讓使用者很清楚、快速的找到想要找的商品。


3.是否已安裝好軟體?並提出任何相關問題!
Ans.是,目前沒有任何問題。

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助? 希望能學得好
2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?
https://www.webtoons.com/zh-hant/
webtoons是很多人看漫畫都會使用的,這裡很多漫畫,圖式排版整齊,滑鼠滑過去也有劇情介紹,分類的很清楚!
3.是否已安裝好軟體?並提出任何相關問題!
還沒,尚未,

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助?
設計是廣泛的,我覺得可能會和未來想做的工作有關,且能更了解每個網頁去分析品質
2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?
Youtube 我覺得這是一個很好的網站,頁面打開來就能馬上看到各影音的分類,還會自動搜尋相似的影片,頁面色也不會花俏
3.是否已安裝好軟體?並提出任何相關問題!
已安裝,目前沒有問題,謝謝老師錄影教法,會比較記得

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助?
不要被當,應該沒有
2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?
https://www.netflix.com/tw/ Netflix 裡面的原創電影很好看
3.是否已安裝好軟體?並提出任何相關問題!
還沒

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助?
學習如何製作網頁設計棒報
2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?
dcard.google.設計美觀.乾淨好操作
3.是否已安裝好軟體?並提出任何相關問題!
是的

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助?
2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?
3.是否已安裝好軟體?並提出任何相關問題!
A:
1.我希望我能確實學到,老師也能慢慢教,因為我電腦方面比較不好;我覺得學了以後,可以嘗試自己做其他程式的感覺,這樣也能考證照,找工作
2.YouTube的名字lee YuYo-BTS創作故事
[BTS/FF]Switch Love 同性幻戀-同性成人議題故事(完結):http://www.youtube.com/playlist?list=PLf7befGKt2jonlzH_1ZecY93sYy8tv_AR ,這是其中一個故事序章的網址
3.已經安裝好了,可能要之後才有問題

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助?
2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?
3.是否已安裝好軟體?並提出任何相關問題!
A:
1.我希望我能確實學到,老師也能慢慢教,因為我電腦方面比較不好;我覺得學了以後,可以嘗試自己做其他程式的感覺,這樣也能考證照,找工作
2.YouTube的名字lee YuYo-BTS創作故事
[BTS/FF]Switch Love 同性幻戀-同性成人議題故事(完結):http://www.youtube.com/playlist?list=PLf7befGKt2jonlzH_1ZecY93sYy8tv_AR ,這是其中一個故事序章的網址
3.已經安裝好了,可能要之後才有問題
學號:1075445007

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助?
現今社會中,每天上網看影片、聽音樂或找資料,都是極為平常的事情,但我們卻都不了解他背後是透過多少人的努力,才能讓我們能輕而易舉的找的我們要的資訊,所以想透過這節課,對網頁設計有基礎的認識,或許有一天,我也能夠替我的品牌架設網站。

2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?
https://www.pinterest.com/pin/369647081903431054/ Pinterest
這是一個整合世界各國的作品,除了操作簡單外,也有連結能快速找到作品簡介,甚至能添加自己的喜好,紀錄你喜歡的風格。
3.是否已安裝好軟體?並提出任何相關問題!
都安裝好了,沒有問題。

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助? 希望可以學到跟網頁設計有關的東西

2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因? https://www.google.com.tw/,風格符合主題
3.是否已安裝好軟體?並提出任何相關問題! 還沒下載(/ _ ; )
還沒下載

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助?
A:學高中學不到的東西,強化記憶力
2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?
A:好像沒有推薦的網站
3.是否已安裝好軟體?並提出任何相關問題!
A:安裝好了,沒有問題

視傳一B 1075445034 鄭詳霖

1.請寫下你對於本課程的期許,你覺得學習網頁設計對你有什麼幫助?
a:帮助我学会不一样架构网页的方法,技多不压身。

2.請將瀏覽過不錯及值得推薦的網站,列出網站名稱及網址,並試著說明及分析你覺得好的原因?
a:https://change.qq.com/a20190320delist/ 是一个游戏的官网,与众多游戏网站类似,它有导览选项,背景图的大小比例合适,文字排版不错。

3.是否已安裝好軟體?並提出任何相關問題!
a:是的,已装好DW。目前暂没有。


1055443132 黃喬永