首頁 部落格 網站製作第二篇:網頁設計與程式製作
Kanie
Sep 27, 2022
從龐大的專業網站到一頁式網站,只要是客戶交辦的任務,只有四個字:使命必達!目前任職於iWare台南辦公室,擔任專案經理一職,是經驗豐富的網站規劃師,更是台南的在地通。

網站製作第二篇:網頁設計與程式製作

前一個階段我們聊到了網站設計執行製作前置規劃與準備,當正式開始進入執行與製作時,好的網站架設重點在於:前端網頁的規劃(UI/UX)後端程式邏輯的設計,要知道前端是給瀏覽者看的、後台是給操作者看的,這兩點有非常大的不同:

一、前端網頁設計規劃:

瀏覽者要看的是整體網頁設計動線流暢及資訊傳達的清晰與否,一個不會迷路的網站就能讓瀏覽者找到需要的資訊,而會不會停留繼續閱覽,就是端看網站內容的品質,而網站的內容是否符合公司想要表達及陳述的,或是不是有對瀏覽者需求的解析,這些就又要看網站規劃的人員是不是在第一階段時有充分的準備及完整的規劃了。

二、後台程式規劃:

好的後台功能會有六成程式是以前端的動線流程來規劃後台功能.所以還是必須以前端為基準來建立後端程式的架構,但另外的四成就須看工程師的邏輯能力,好的工程師帶你上天堂,反之就是一個不好的邏輯後台,造成操作者使用上的困難。

建議在網站規劃時就須與負責的專案人員討論需求及使用流程,充分的溝通能更了解使用者需求,進而達到設計出來的程式貼近及符合操作者想要的功能與方向,最後達成滿意的操作介面及使用流程。

網頁設計常用到的程式語言又有哪些呢?在這裡做簡單的介紹:
網頁設計常用的前端語言

標準標記語言--HTML

HyperText Markup Language(超文本標記語言),簡稱HTML,是一種用於建立網頁的標準標記語言,透過網頁瀏覽器的讀取,可以將其轉換成視覺化網頁。雖然它不是程式語言,卻是建構網站的重要基石,所以列在此處,供大家參考。

JavaScript – 網頁前端互動程式

JavaScript簡稱JS,是前端互動程式,JS是來做出很多網頁上的效果及互動功能,我們常看到的就是如“照片輪播”功能。
自從RWD(響應式網頁設計)出現後,就有許多瀏覽器不再支援Flash,這時候JS就取代Flash用來製作網頁動態效果的主流語法。

 jQueryJavaScript函式庫-網頁前端互動程式     

jQuery是跨瀏覽器的JavaScript函式庫,將HTMLJavaScript之間的操作簡化。也提供了許多現成的互動效果語法,讓設計師不需要全部都自己手刻寫JS,就可以直接拿這些函式來使用,製作出許多不同網頁特效,大大減少的工時。

 

CSS-網頁設計最重要的建構語法

CSS 既非標準程式語言,也不是標記語言而是一種風格頁面語言(style sheet language),CSS能讓你在 HTML 文件中的元素上套用不同的頁面樣式。例如要將 HTML 頁面上所有段落元素文字全部轉換成紅色,你會在 CSS 裡編寫相關語法一次套用,還需要把 CSS 套用在 HTML 文件上。這樣 CSS 的樣式效果就會在瀏覽器的 HTML 檔案顯示。

後端程式語言:
PHP 網頁程式語言

PHP是目前主流的網頁設計開發的程式語言,它可跨平台執行與運作,不管在Linux或Windows主機,都可以流暢的執行。
PHP大多都與MySQL資料庫搭配使用,他們可以一起用來開發各種架構的網站。

 

Asp.Net-網頁設計後端程式

NET 是由微軟所提供用以開發動態網頁設計的程式語言,大多用於Windows主機上執行。.NET大多都與MS SQL資料庫搭配使用,它除了支援物件導向之外,於網站效能及開發製作時間也較快,若您要使用Windows平台來放置網站,建議您可以採用Asp.Net來建置。

以上是大概針對網頁設計時所會應用到的開發語言。

 

對於架構,開發環境語言等均有大概的認知後,您就可以開始執行、製作您的網站,在第一篇及第二篇這些基本的知識後,對於後續與網頁設計公司,或是與我們專業的iWare網頁設計團隊人員溝通時,可以大幅減少您需要再了解的時間。

顯著改善網站用戶體驗的12個技巧
顯著改善網站用戶體驗的12個技巧
Jericho
Jericho
Nov 15, 2024
網頁設計的10個排版技巧
網頁設計的10個排版技巧
Jericho
Jericho
Nov 13, 2024
網站撰寫文章的9種不同方式
網站撰寫文章的9種不同方式
Jericho
Jericho
Nov 06, 2024