一、前言


昨天發文後,馬上收到系統罐頭通知,終於熬到這一天了(我好興奮啊啊啊!)終於要完成人生首次鐵人幫比賽的挑戰了!
最後一天的主題,決定回歸到新手全端工程師,必知的環節上去做討論。大家要架設網站,一定都會去做一些功課、學習基本知識,但大家知道網站與 HTML 的架構真實為何嗎?

二、網站的架構

平常瀏覽的網站,是如何建立起來的?

項次 專有名詞 定義
1 網際網路(Internet) 是能讓全球的電腦連線、交換各種資料的網路系統。
2 全球資訊網(World Wide Web,Web) 是一套可藉由超連結將分散於全球各地的多媒體資料,加以整合應用的資訊系統。
3 網站(Website) 在全球資訊網(Web)中,用 HTML 等工具製作的網頁集合。
4 網址(URL) 格式固定,而每個部分都有各自的功用。如:
http://test.com/sample/hello.html 對應為:
通訊協定://網域名稱/目錄名稱/檔案名稱.副檔名

三、HTML 檔案的架構

項次 專有名詞 定義
1 <!doctype html> 「Doctype宣告」,說明使用哪種版本、類型的 HTML。
2 <html>~`` 通常緊接在 Doctype 後面,說明檔案是 HTML 文件。
3 <head>~`` 描述網頁的標題、說明與常見的外部使用連結等。
4 <title>~`` 網頁的標題文字。
5 <body>~`` 是 HTML 文件的主體,實際顯示在網頁上。
6 <meta charset="UTF-8" 是文字的編碼格式設定為UTF-8的意思,是必要性的存在值。
7 <meta name="description" content="~"> 「meta」標籤用來描述內容概要和關鍵字,不會顯示在瀏覽器內容,但有助於使用者搜尋時可瞬間判斷。

四、結論與自我鼓勵

其實當全端工程師也半年了,雖然工作上很多時間都很匆忙,且要顧及非常多層面的案件進度,能額外學習時間很短很少,但也只能盡力把握空檔補足不足之處。本篇文章參考之書籍,是公司提供給新人與UI看的入門書籍,我覺得寫得非常淺顯易懂,回頭看當複習也是很不錯!

今天是鐵人賽的最後一天,在此要感謝在培訓營給我很多正確觀念與知識的龍哥與其他專業講師和助教,還有工作上一直提供我機會學習各樣事務的主管XD,最後,要感謝我的男友,鼓勵我陪伴我度過了這30天,中間歷經了東部小旅行與媽媽的手術住院回診等,如果沒有他的每篇留言與支持(外行的忠實小粉絲,留言都很可愛&#9825;),我想我會半途而廢吧?總之,恭喜自己第一次參賽,就成功完成挑戰,期待收到獎狀的一天!