※ 引述《e04ckymadam (ckymadam)》之銘言： : 現在有關設計的行業幾乎每一個都要求要有網頁能力 : ,以前有去補習班學過一點,就是Dreamweaver.....但 : 說實在的那只是教你拖拖拉拉排個版就叫做網頁了... : 當然我也知道網頁沒那麼容易,拖拖拉拉那種是小朋友的做法 : 但想到網頁的相關技術還蠻多的...常常看到一些像 : ASP,PHP,Flash,JAVA,Vbscript,DHTML,資料庫..... : 媽呀!連最基本用FrontPage做網頁都要try來try去了 : 何況上述那些技術... : JAVA有上過幾堂,發現完全聽不懂在講什麼..狀況就像 : 統計學整學期只有最後一堂去上課時的情況...Flash. : ..做到設簡單的action就差不多了...官方的那本ActionScript : 雖然是中文的,但沒有幾頁看得懂... : 我想問的是...現在"學做網頁",應該怎麼入門比較好 : 有沒有推薦的書可以參考一下?還是說應該就"技術"本 : 身去學習,例如現在有很多網頁是完全用Flash打死的 : (當然有一定的技術才能這樣搞).... 嗯…入行快三年，從小職員變成自己在家當SOHO， 應該可以說說自己的心得。 網頁設計，基本上是手工藝一般的行業，切勿與程式設計搞混。 你所說要學的那些東西，其實大概只有Flash會比較需要學到中等程度， HTML要看得懂(未必要記，跟視覺版面對照著，可以自己檢查錯在哪即可)， 但特別是CSS需要學精，而這點你好像沒有認知到。 其他跟程式有關的，沾點邊即可—— 以我而言，只需要做到要修改網頁內容或排版時， 不要搞砸了程式設計師寫好的部分就好XD 所以這時候CSS樣式格外重要吶！ 因為這是讓視覺歸視覺，程式歸程式的最好方式。 全Flash的網站，視覺很炫，但Google大神神不到，這是一個致命的缺陷。 這對於講求搜尋排前、網路曝光率的商業網站來講是很傷的， 所以大部分商業網站都還是只在Banner這區塊做Flash動畫效果。 而Banner整塊用Flash沒啥不好，也很方便更新， 只要記得在footer的地方重置一份主選單的連結。 阿～對了，SWFObject是個好物！千萬要學會怎麼用。 加上從HTML設定變數ex:設定Num=1，Flash當中就可以寫當_root.Num=1時， 選單第一項會變換效果，並且呈現第一單元的主圖…之類的用法。 越說越亂@@~ 有些人稱呼網頁設計為美工，聽到是會不爽， 但有些網頁設計師自甘當美工，不對自己設計的版面多費點心思，也是沒辦法。 做網頁時不能只顧慮到視覺美感， 要依據網站主題、LOGO標準色，去延伸整個色系、風格； 還要設想網路使用者慣例、視覺動線，以及網站內容主次要性， 去設計排版，切割各個功能區塊。 不過假如是要做很藝術的網站，上面這些考量都可以不管， 但就真的只是自己做了爽而已囉～ 排版重點： 1.切記不要用框架頁。 目前使用者上網找資料已慣於"搜尋"， 而搜尋到的頁面，假如只是框架頁的內容部分， 他根本不會也不能回到選單去看網站其他單元。 加上框架頁好像對於視障同胞有礙，政府機關和學術單位的網站都會規範。 當不使用框架頁時，一頁網頁中，就要包含每一頁都會重複要看到的區塊ex: Banner、主選單、copyright...etc. 不管是搜尋到哪一頁，都可以連回首頁。 2.少用table排版，多用div搭配CSS。 http://www.hsiu28.net/ 這個網站的CSS教學很好， 教觀念、教重點、教技巧，沒有多餘的廢話。 我現在可以很自豪地說，我做的網站版面撤掉CSS樣式後， 是一個結構完整，語意(HTML語法的語意)明確的純文字網站。 沒有一堆意義不明的表格跟瑣碎切割的圖片， 有助視障人士閱讀，較符合W3C規範，也比較符合搜尋邏輯的喜好。 3.使用HTML語法時，語意要正確。 比如<h1>~<h6>是表示標題的語法， 在我還不會用CSS時，我覺得這些標題太大，行距也太高，所以都棄而不用， 把一段文字用<font>改大小顏色，權充為標題； 但會CSS之後我才了解，視覺樣式都可以從CSS重新設定的， HTML語法都是有其語意存在，不能亂用的。 雖然，我到現在還是偶爾會亂用… 版面區塊定義： 1.Banner： 我通常會把LOGO、網站名稱、主圖、Slogan、Menu都放在Flash當中。 當然還是必須要有配套措施，重覆隱藏一份主選單放在HTML碼當中。 3.Submenu： 這邊是預留給各單元的單元選單，可能只有一層架構，可能有兩層，不要超過； 若有三層架構的選單，建議第三層選單放在內文區塊置頂。 4.Content： 內文區塊，主要放置內容，但也要標示出目前所在的單元。 Title要與目前所在的Menu項目對應，Subtitle要與目前所在的Submenu項目對應。 5.其他區塊： 依據不同的網站可能會有不同的功能區塊，最常見的應該是會員登入吧～ 圖示連結，常放在左選單之下做裝飾，同時也把重要內容做成成圖示連結方便點選； 功能選單，常放在Banner上方單獨一排的小連結，放Home/Contact/EN...etc.； 索引，也有人翻譯麵包屑@@~常放在內文標題之上，一小排連結，標示所在位置。 版權宣告區，我通常會重放一次主選單連結，方便使用者捲到底部可直接切換單元， 當然還會放copyright、地址電話電郵、Suggestion並提供更新Player或IE的網址。 網站建置流程： 1.洽談簽約： 主要談好網站架構、程式需求、以及軟硬體系統規格。 並依據這些需求估價，開出詳細明細。 同時也在這時就探聽好客戶喜好的風格， 甚至客戶提供幾個參考網站，可以讓我拿捏設計方向更好。 2.製作版型： 主要先依據網站架構，在紙本上排好版面各個區塊； 再依據客戶喜好風格，以及客戶的LOGO造型與色系，開始使用繪圖軟體製作版型。 大部分的人是用photoshop，可是我從以前就習慣用fireworks，好用。 希望Adobe併掉Macromedia後出的這套CS3，色彩處理可以更細膩點，濾鏡多一些， 之前fireworks比較不好的就是這兩點。 3.切割版型： 調整好所有細節之後，就可以開始切割版型啦～ 這個階段其實才是考驗設計師的功力的時候。 假如隨便用table切一切，大概3個小時內可以切完吧！ 用CSS的話，我自己大概會花5~8個小時。 4.製作Flash Banner： 我通常是在這階段，才區分出首頁以及內頁不同的版面配置。 首頁Banner高，意象圖大，視覺動態多；內頁Banner短，視覺動態少。 這裡就要會用CSS樣式以及SWFObject了。 5.開始製作各頁內容。 嗯…說的很亂，其實我也還要多多努力啦～ 網頁設計的門檻實在很低，各行各業也都可以自己做網頁， 所以才會有老闆要求員工會做網業者佳，加上開個部落格比泡碗泡麵還方便… 因此真正要專職於網頁設計的人，要學的雜之外，還要有方向，有想法， 才能讓老闆們真正感受到何謂「閃開，讓專業的來～」，進而找上你來做網站； 而不是在徵人條件當中隨便附註一項：「會網頁設計者優先錄取」之類的方法。 目前我是獨立接案，負責PM和網頁設計兩部分，唯一不通的是程式， 所以會依據客戶主機的需求，找會寫相關程式的程式設計師合作。 嗯，繼續努力吧 -- U.Cafe 個人網站 http://unas.com.tw/ U.Design 作品集網站 http://unas.com.tw/U_Design/ --

※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 125.231.233.232