7

7 月

By kevin

0 Comments

網站建置的基本步驟 2.網頁設計

一般觀念就是網頁設計就只是設計網頁的外觀，實際上網頁設計不只有設計網頁的外觀，還要一些細節的調整，例如版面結構設計、HTML結構調整、網頁排版、瀏覽器相容性問題…等等，再厲害一點的設計師還可以設計互動JavaScript，而互動程式有些公司企業快把互動的開發交給網頁工程師，所以不一定要網頁設計師去設計。

HTML結構

由於HTML的資訊架構清晰完整，能讓網頁上呈現各種資料也能夠有效的分類或分區，所以在網頁排版前，都會先規劃好HTML結構，像是網頁都有主選單<menu>、LOGO、頁首<header>、頁尾<footer>、導覽列<nav>、內容區，不同的區域可以設定不同的網頁元素像是屬性、標籤、按鈕，挑選HTML元素要設定正確的層級關係，例如要顯示某文章段落可用<p>，要特別顯示某文字可用<strong>，顯示按鈕包含連結時不應該前後加上<input>或<a>等等網頁元素，這些網頁設計元素HTML相關書籍都有，可以去翻閱看看。

版面設計、網頁排版、CSS規劃

網頁排版也算是專業的一環，需要了解網站結構、頁面結構來調整，而網頁排版有些設計師基本上會使用CSS來排版進行版面配置調整，如果還能了解網格(Grid)概念，來使用CSS來設計，後續的網頁問題會較少，網頁製作進程速度也較快，CSS規劃是非常重要的，一個CSS必須有良好的結構、易懂的命名規則，可以讓整體網站方便後續開發與擴展。

然而如果是用Joomla!或WordPress，使用CSS的機會就比較少了，大部分版型都設計好了，更需要細節的部分才需要使用到CSS。

瀏覽器相容性

網頁設計做好之後，需要測試瀏覽器相容性，這個工作非常重要，雖然現在技術已經可以支援不同瀏覽器了，但是專業的網頁設計還是需要在不同的瀏覽器有相同甚至更好的表現，如何調整到最好取決於設計師的功力了。

目前主流瀏覽器就有很多種，不同的瀏覽器使用者也有不同的特性，而不同瀏覽器HTML和CSS可能會有微妙的差異，而微妙的差異往往是煩人的，不僅影響CSS還可能JavaScript也會影響到，細節調整不易，需要經驗豐富的人才能解決，網路上也有很多資料，如果爬文自己調整的話，是用時間換取經驗，簡單說這工作很花時間。

4

7 月

By kevin

0 Comments

網站建置的基本步驟 1.網站企劃

早期的網站都以HTML為主要寫法，當時的設計很辛苦沒有好用的設計軟體和工具支援，但是換個角度想現在的網頁網站又有太多的設計和工具可是使用，但是設計過程還是很複雜又難的，以前有相當多問題需要克服，像是瀏覽器相容性問題或是互動式頁面又或是，程式語言方面的開發，早期的一堆網頁架構語法，需要學習很多程式語法，相當複雜難學。

但是普遍大家認知就是做網站很簡單，但是可能很簡單但是不專業，可能內容整體上會顯得不夠

專業，網站建置過程有太多地方細節需要細心的修整，而網站優劣也取決於被忽略的細節中，而網站建置不在只是以前滿街都是普通網站，而是以細節專業、美感設計、網站優化流暢性為主體，還可能加上SEO優化呢。

所以說網站建置很複雜，可以去書局、書店尋找相關書籍，都會有非常多的書籍或專區，就可以知道網站建置說簡單不簡單說複雜很複雜，光研究一本網站建置的書可能就需要很久時間。

網站建置的基本步驟

1.網站企劃

2.網站設計

3.程式開發(以前)

4.網站發布

5.網站維護

先來說說網站企劃，網站還沒開始製作前，這個是重點，因為建置需要注意的細節很多，如果剛開始需求訂立的不明確，可能未來就會修修改改，不只浪費時間還會增加溝通成本，所以最好可以事先規劃好。

而溝通成本可能還包括：

製作成本：溝通過程中成品的花費成本。

機會成本：溝通過程中所流失的機會，如可以去做更有價值的事情，但是沒去做。

時間成本：溝通過程中所花費的時間長短。

情緒成本：溝通過程中衍生的情緒影響可能影響著網站品質或是建置速度。

而且做網站建置需要溝通和時間佔的時間比率比較高，時間成本比重也較大，說簡單不簡單說容易也不容易，就是花時間來請別人做，當然自己做還是要花時間的，但是自已花時間又意味著不能做其他事情所以又有機會成本在，所以說可能很容易就忽視掉了。