聽別人自我介紹時,職稱是「前端」工程師,或是工程師朋友說他負責「後端開發」的部分,這樣的工作內容介紹對你來說簡直是有說沒有懂,不就都是工程師嗎?還分什麼前、後端呢?
應用程式(Application),簡稱 App,台灣人總愛唸 A、P、P,也不乏聽到一些科技新貴說自己是「A、P、P 開發者」,如果跟國外工程師交流時這樣介紹自己,事後得知 App 根本沒人這樣念,應該會很想挖洞埋了自己吧!
常常聽到別人提起 UX、UI、HTML、CSS、Frontend、Backend 等等科技名詞,總是似懂非懂,不好意思加入話題嗎?是時候好好認識一下這些科技字,下次聽到別人在談論這些話題時,你也能自信的上前去貢獻一點意見。
這篇文章為大家整理了十個最常聽到、也最容易混淆意義的科技熱門字,並用一句簡單英文給每個名詞一個解釋,也許日後大家會有機會解釋給身邊國內外的朋友聽呢。
Internet vs. Web
Internet 這個英文單字大家應該都認得,大家都簡稱網路,但其實網路應該想成「Network」這個字。Network 是指區域性的電腦、周邊裝置透過網路線或無線網路互相連接,使得裝置間能互相交換資訊,例如一個學校網路(School Network)或家庭網路(Home Network)。
而 Internet 這個字則是「Interconnection of Networks」的簡稱,嚴謹一點的翻譯是網際網路,是利用 TCP/IP 通訊協定將全球數百萬台電腦、各地不同的網路(Network)互相連線形成的網路世界。簡單來說:「Internet is a network of networks」。
至於 Web,很多人會認為是 Internet 的同義詞1,這就大錯特錯了。 Web 是大家對 World Wide Web (WWW、W3)的簡稱,中文翻作全球資訊網或萬維網,是一套建構 Internet 之上,藉由超連結(Hyperlink)將 Internet 上世界各地的資料整合起來的資訊系統,並且以網頁(Web pages)形式顯示這些資訊,使用者則需要用瀏覽器(Web browsers)來存取這些網頁。
因此 Web 跟 Internet 兩個字關係緊密,但並不是同義詞。但現在的日常生活中越多人將兩者混淆,「上網」查資料有些人會說 「I was on the Internet」或 「I was on the Web」2,兩種說法其實都可以,但嚴格來講,前者講的是一個網路世界,後者講的是使用者用什麼樣的方式獲得這個世界裡的資訊。
各用一句英文來解釋:
「The Internet is millions of computers interconnected in a global network.」
「The World Wide Web is the system we use to access the Internet.」
HTML vs. CSS
上一部分提到了網頁(Web Pages),而網頁的內容其實就是多媒體資訊加上一系列的 HTML 指令所組成的,而網頁的「長相」則是 CSS 控制的部分3。
HTML 是「超文字標籤語言(HyperText Markup Language)」,HTML 用各種標籤來命令網頁瀏覽器用什麼結構來顯示標籤內的資訊,告訴瀏覽器這個網頁的標題(Heading)是什麼、有幾個段落(Paragraph)、哪部分的內容要用表格(Table)顯示、或是用清單(List)顯示等等,簡單來說就是一種用來描述網站內容及結構的語言。
而 CSS (Cascading Style Sheets)則是一種「樣式表(Stylesheet)」,用來對內容進行排版及美化,目的是控制網頁內容顯示的樣子,像是格局(Layout)、字型(Font)、顏色(Colors)等顯示效果。
用一句簡單的英文來解釋:
「HTML holds the content in place, and CSS makes it look pretty.」
Front End vs. Back End
現在懂了網頁、網站怎麼製作的,也該來了解他們怎麼運作的。因為網頁裡的資料並不是存在你的電腦裡,而是在 Internet 裡的某台伺服器(Web Server)裡,所以在當地電腦裡運作的部分我們稱為「前端」,在遠方伺服器工作的部分則稱為「後端」4。
網站前端(Front End)指的是一般使用者看得到的介面,包括了上部分解釋的 HTML 跟 CSS 網頁顯示內容,還有其他在網頁瀏覽器上你能看到的任何東西跟功能。像是網頁上的動畫特效、 Google 搜尋的自動填寫功能(Autocomplete)、網頁的彈出式視窗,都是前端工程師用 JavaScript 設計的傑作。
網站後端(Back End)部分,指的是網站維護者用來處理資料的頁面,通常由伺服器(Server)、應用程式(Application)、資料庫(Database)所組成。一旦你在網頁上輸入資料,以輸入帳號密碼為例,應用程式就會將你的帳號密碼儲存在一個遠端伺服器的資料庫裡。而開發所有有關這方面技術的工程師,自然就稱為「後端工程師」,像 PHP、Ruby、Python 都是常見的後端技術開發語言。
用一句英文來解釋兩者的分別:
「Front-end code interacts with a user in real time while back-end code interacts with a server to return results」
App vs. Software
App 這個字近幾年可以說是超熱門,大家每天掛嘴邊,哪個 App 好用、今天哪個 App 提供限時免費下載。App 中文翻成「應用程式」,但應用程式跟軟體(Software)又有什麼差別呢5?
軟體(Software),廣義來說電腦有形的部分(硬體)以外的都叫做軟體,是可以在電腦上執行的程式跟所有相關檔案。而應用程式 App 則是專為某項裝置、某個目的所設計的軟體之一,功能專一單純,通常指在 iOS 或 Android 等平台上運作的程式工具(Mobile Apps),或是在 Chrome Web Store 裡專為 Chrome 瀏覽器所下載的 Web Apps 等等。
其中的分別只要記住一句簡單英文:
「All apps are software but not all software is an app.」
所有的 App 都是軟體,但並不是所有的軟體都是 App。非應用程式的軟體例子像是作業系統(Operating System)、防毒軟體(anti-virus)、裝置驅動軟體(Device Driver)等等。
在這邊筆者想特別強調一點,「App」常常聽台灣人總愛唸成「A、P、P」,將三個字母分開念,也聽過一些國內工程師說自己是「A、P、P 開發者」... 如果有國外工程師聽到你這樣講,大概要腦筋急轉彎一下才知道你的意思呢!
正確念法其實是 app /æp/ ,只有一個音節,發 æ 這個音時舌頭要扁扁往下壓、p 則輕輕發「ㄆ」音,要小心別唸成 ape /eɪp/(猩猩)了。如果之前念 A、P、P 的朋友趕緊改過來吧!下次跟朋友提起 App 時,唸唸看 /æp/ 的發音,你會突然覺得自己談話好像瞬間有深度、高級很多 XD
UX vs. UI
UX、UI 這兩個詞常被大家混用,雖然兩者息息相關、是對好搭擋,但也應該了解之間的差別6:
UI —— 使用者介面(User Interface),介面是一項產品或一個網站如何陳列排放、如何輸入輸出、如何和使用者互動(按鈕、拖曳),所以 UI 的定義就是讓使用者得以使用產品的功能來達到結果的設計與安排。用一句簡短的英文來總括 UI:
「Ui is how the product is laid out.」
UX —— 使用者體驗(User Experience),這詞本身並沒有列指特定的事,介面設計、視覺風格、程式效能、正常運作和功能、使用者的族群,凡是這個產品會影響使用者「感覺」的方面,都屬於 UX 的一環。用一句簡短的英文來總括 UX:
「UX is how the product feels like to users.」