ทักทายและพูดคุย
สวัสดีครับ เป็นยังไงกันบ้างครับได้อ่านบทเรียนที่แล้วหรือเปล่าเอ่ย บทเรียนที่ผ่านมาเป็นการแนะนำเกี่ยวกับการผลิตเอกสารของเว็บไซต์เบื้องต้นครับ ซึ่งผู้ที่ไม่เคยเขียนเอกสารเว็บไซต์และอยากรู้ว่าขั้นแรกต้องทำยังไงบ้างก็กลับไปอ่านที่ เอนทรีนี้ นะครับ ซึ่งผมได้สอดแทรกคำศัพท์ภาษาอังกฤษไว้ให้ด้วยครับ เพื่อเป็นการทบทวนและเพิ่มพูนความรู้ด้านภาษาอังกฤษยิ่งขึ้นครับ ตอนนี้ผมยิ่งเขียนยิ่งแปลก็ยิ่งติดใจซะแล้วหล่ะครับ ถึงแม้ว่าการแปลของผมนั้นอาจจะไม่ใช่ขั้นเซียนแต่ก็ยังแอบหวังนะครับว่าเพื่อนๆคงพอจะเข้าใจสิ่งที่ผมต้องการจะสื่อสาร เอาหล่ะครับ! วันนี้ก็เช่นเคยครับ ผมมาแปลเนื้อหาบทที่สองในส่วนของคู่มือแนะนำการเขียนโปรแกรมพื้นฐานบนเว็บไซต์ด้วยภาษา html ซึ่งเนื้อหาก็จะอธิบายเพิ่มเติมจากบทเรียนที่แล้วนะครับ ซึ่งกว่าเพื่อนๆจะเข้าสู่การศึกษา html จริงๆคงต้องเป็นเอนทรี่ที่สี่ครับ แต่ผมรับรองนะครับว่าการศึกษาแบบที่ผมพยายามจะนำเสนอจะทำให้เพื่อนๆเข้าใจทั้งในเชิงภาษาการเขียนเว็บไซต์และภาษาอังกฤษในด้านนี้และจะเป็นประโยชน์ในการอ่านเว็บต่างประเทศไงครับ เพราะศัพท์บางคำนั้นเพื่อนๆต้องเรียนรู้และทำความเข้าใจเป็นพิเศษครับ อืม นำเรื่องมาซะนานตอนนี้ก้ได้เวลาเข้าสู่บทเรียนที่สองได้แล้วครับผม
Your Second Web Page
Now that you have created your first webpage, let us examine the different segments of your "index.html" file. You have probably noticed a pattern of various words that are surrounded with < and >. These items are called HTML tags.
An example of an html tag is <body>. The Body tag tells the browser where the page's content begins. Body is also an example of one of the required HTML tags that every web page must have.
หน้าเว็บตัวที่สองของคุณ
เอาหล่ะครับ ตอนนี้เพื่อนๆก็สร้างหน้าเว็บอันแรกของตัวเองเป็นแล้ว,ผมจะพาไปดูซิว่าส่วนต่างๆที่ใช้ในการเขียนเป็นไฟล์ "index.html" นั้นมีความหมายและแตกต่างกันอย่างไรบ้าง.เพื่อนๆต้องสังเกตเห็นแน่นอนใช่ไหมครับว่า ลักษณะรูปแบบของตัวแปรคำสั่งเฉพาะนั้นจะอยู่ภายในเครื่องหมาย < และ > . ซึ่งคำสั่งที่เขียนในลักษณะนี้ในภาษา html เราเรียกกันว่า tag(อ่านว่า แท็ก) ครับ.
ผมจะยกตัวอย่างแท็กhtml <body> นะครับ. แท็ก Body นั้นจะทำให้เว็บบราวเซอร์ (ie firefox) รู้ว่าเนื้อหาของเว็บไซต์นั้นเริ่มที่ตรงนี้ กล่าวคือสิ่งที่เพื่อนๆมองเห็นในหน้าเว็บนั้นจะถูกเขียนโค้ดเก็บไว้ระหว่าง แท็ก Body ไงครับ.ซึ่งแท็ก Body นั้นเป็นสิ่งที่จำเป็นจะต้องมีในเอกสาร html ทุกอัน เหมือนกับว่าถ้าไม่มี <body>....</body> ก็ไม่ใช่ html ครับ.
ศัพท์น่ารู้
examine พิจารณา ตรวจ สังเกต
segments กลุ่มคำ แต่ละส่วน แบ่งแยก
probably อย่างน่าจะเป็นไปได้ ค่อนข้างแน่
notice ข้อสังเกต สังเกต
pattern รูปแบบ รูปร่าง แบบแผน
surrounded ล้อมรอบ ครอบด้วย
required ต้องการ จำเป็น
Basic HTML Tag Information
Let's learn more about these tags. A basic web page is composed of 2 main tags. If you create a web page without these tags you will be in trouble!
HTML Code:
<html> <body> Your site's content goes here </body> </html>
The first HTML tag, which conviently is labled <html> tells the browser that your HTML code is starting. The second HTML tag, <body> tells the browser that the visible part of the webpage ( your content ) is going to start.
แท็ก HTML ขั้นพื้นฐาน
เอาหล่ะเพื่อนๆครับ เรามาเรียนรู้แท็กข้างล่างนี่ให้มากขึ้นอีกนะครับ,ผมจะขอบอกว่าหน้าเว็บที่เพื่อนๆสร้างขึ้นนั้นขั้นต่ำที่สุดเลยนะ เราจำเป็นต้องมีตั้งแต่สองแท๊กตามด้านล่างนะครับ.ถ้าเพื่อนๆสร้างหน้าเว็บโดยไม่มีแท็กเหล่านี้ เพื่อนๆจะเจอกับปัญหาครับ เพราะมันจะทำงานไม่ได้เลยครับ.
HTML Code:
<html>
<body>
เนื้อหาหลักๆของเว็บจะถูกเขียนภายในส่วนนี้ครับ
</body>
</html>
แท็กhtmlอันแรกนั้นจะเริ่มต้นด้วยแท้กที่ชื่อว่า <html> ซึ่งจะบอกให้บราวเซอร์รู้ว่านี่คือโค้ดภาษา html นะ.มาในบรรทัดที่สอง แท็ก html ชนิด <body> จะบอกเว็บบราวเซอร์ว่า ภายในนี้คือส่วนที่มีไว้ให้สามารถเยี่ยมชมเนื้อหาได้ (เนื้อหาหรือข้อมูลที่คุณต้องการให้คนอื่นเห็นเมื่อเปิดเว็บ)
ศัพท์น่ารู้
composed สงบ เงียบ
trouble ปัญหา อุปสรรค
conviently
labled
Closing Tags - </tag>
You might be wondering what is the deal with the two tags at the end, </body> and </html>. These tags are telling the browser that certain tags are ending. The </body> lets the browser know that your content is ending, while the </html> tells the browser that your HTML file is finished.
The "/" that is placed before the tag's name informs the browser that you would like to stop using the specified tag. <tag> is used to begin a tag and </tag> is used to end a tag.
การปิดแท็ก-</tag>
เพื่อนๆอาจจะรู้สึกพิศวงกับแท็กสองอันสุดท้าย </body> และ </html> .แท็กทั้งสองอันนั้นมีหน้าที่บอกให้บราวเซอร์แน่ใจว่าแท็กปิดแล้วคือสิ้นสุดการใช้งานแท็กนั้นๆ.แท็ก </body> นั้นบอกให้ทราบว่าเนื้อหาของเว็บที่นำไปแสดงผลจะจบแค่ตรงนี้.ขณะที่แท็ก </html> จะบอกบราวเซอร์ให้ล่วงรู้ว่าการเขียนโค้ดภาษา html เสร็จสิ้นแล้ว
เครื่องหมาย "/" ใช้วางนำหน้าชื่อแท็กนั้นจะแจ้งให้บราวเซอร์ทราบว่าเพื่อนๆต้องการที่จะหยุดการทำงานแท็กพิเศษนั้นแล้ว.เราใช้ <tag> เมื่อเริ่มต้น และเราใช้ </tag> เมื่อต้องการหยุดการทำงานของแท็กนั้นๆครับ
ศัพท์น่ารู้
wondering น่าพิศวง งงงวย
deal แจกจ่าย แตกแยก แจกไพ่
certain แน่นอน แน่ชัด จริงๆ
while ขณะที่
placed วาง(ทับ) แทนที่
informs แจ้งให้ทราบ เป็นตัวรายงาน
specified พิเศษ เฉพาะเจาะจง
HTML Tag Order - Important!
The order that opening tags appear and ending tags appear follow an important rule. If an HTML tag is opened within another, for example the body tag is opened inside the html tag, then that tag(body) must close before the outter(html) tag is closed.
We ended the body tag first because it was opened most recently. This rule of "closing the most recent tag before closing older tags" applies to all HTML tags.
ลำดับของแท็กHTML-สำคัญนะจ๊ะ!
เพื่อนๆครับ ลำดับในการเขียนแท็กของ html ที่ปรากฏตอนเปิดแท็กและปิดแท็กนั้นสำคัญมากๆนะครับ ซึ่งจะเป็นไปตามกฏความสำคัญของแท็กแต่ละชนิด เช่น แท็ก< body> ต้องเขียนหลังจากเขียนแท็ก <html> และเมื่อจะปิดก็ต้องปิดแท็ก </body> ก่อนค่อยปิดแท็ก </html> เป้นอันดับสุดท้าย
การที่เราปิดแท็ก body ก่อนนั้นก็เพราะว่าแท็ก body ถูกเปิดใช้งานเป็นตัวล่าสุดไงครับ ผมจะยกตัวอย่างให้เข้าใจง่ายๆนะครับ สมมติให้เพื่อนๆหยิบกระดาษที่มีลายบรรทัดจากสมุดหนึ่งแผ่นมา จากนั้นให้เขียน ก ข ฃ ค ฅ ฆ โดยหนึ่งตัวอักษรต่อหนึ่งบรรทัดเท่านั้นนะ จะเห็นว่าเราเขียนทั้งหมดหกบรรทัด จากนั้นผมต้องการให้เขียนย้อนหลังกลับโดยมี "/" ขั้นไว้ด้วยโดยให้เพื่อนๆเริ่มจากบรรทัดที่เจ็ด เมื่อเพื่อนๆเขียนเสร็จแล้วจะมีลักษระดังข้างล่างนี่ไงครับ
ก
ข
ฃ
ฅ
ฆ
--------------การเขียนแบบสมมาตรจะช่วยให้มองโค้ดง่ายครับ
/ฆ
/ฅ
/ฃ
/ข
/ก
แท็กภาษาhtmlก็เช่นกันครับ ลำดับความสำคัญก็เหมือนตัวอักษรภาษาไทยนั่นหล่ะครับ เหมือนการส่องกระจก และส่วนนิยามของกฏนี้ก็คือ " เราจะปิดแท็กล่าสุดก่อนค่อยปิดแท็กก่อนหน้านั้น " ซึ่งใช้ประยุกต์ได้กับทุกแท็กในภาษาhtmlนะครับ
ศัพท์น่ารู้
appear ปรากฏ
within ภายใน ข้างใน ในส่วน
recently ตัวล่าสุด ล่าสุด
applies ประยุกต์ใช้
Continue Along
These ideas might take a while to sink in, so how about you create your second web page? Copy this code into notepad, like you did before, following the same directions.
HTML Code:
<html> <head> <title>My Own Webpage!</title> </head> <body> <h2>Welcome to my webpage</h2> <p>Coming soon </p> </body> </html>
After you are sure that your HTML code inside notepad is exactly the same as our provided HTML code, go ahead and save your file. You should be saving this file as "index.html". You may be prompted that you will be saving over a file, that is OK, you do not need your 1st web page anymore. When you are done, please continue.
ติดตามมาด้วยกันสิครับ
แนวความคิดแบบนี้ได้นำมาใช้ช่วงขณะหนึ่งมาแล้ว(แปลมั่วหว่ะ).ดังนั้นเพื่อนๆน่าจะรู้แล้วหล่ะว่าจะสร้างหน้าเว็บตัวที่สองนี้อย่างไร?ก็ให้คัดโค้ดข้างล่างไปใส่ในโปรแกรม notepad เหมือนที่เคยทำมาก่อนหน้านี้ไงครับ,แล้วก็ทำตามคำแนะนำเหมือนเดิมครับ
HTML Code:
<html> <head> <title>My Own Webpage!</title> </head> <body> <h2>Welcome to my webpage</h2> <p>Coming soon </p> </body> </html>
เมื่อเพื่อนๆตรวจสอบมั่นใจแล้วว่าโค้ดhtmlที่อยู่ในnotepadนั้นถูกต้องตรงตามเงื่อนไข(กฏ)ของภาษา html แล้วให้บันทึกซะครับ เพื่อนๆอาจจะบันทึกไฟล์เสร็จอย่างรวดเร็ว และต่อไปนี้ เพื่อนๆก็ไม่จำเป็นต้องมีเว็บเพจอันแรกของตัวเองซะทีครับ,ก็เพื่อนๆทำเป็นแล้วนี้ครับจะทำอีกกี่ร้อยอันยังได้เลย . โปรดติดตามบทต่อไปนะครับ สวัสดี
ศัพท์น่ารู้
sink จม ตกลง ลดลง
exactly อย่างถูกต้อง อย่างแน่ชัด
provided โดยมีเงื่อนไขว่า
prompted รวดเร็ว ฉับไว ทันที
anymore นานกว่านี้ อีกต่อไป
เฮ้ออ ทำไมการแปลสิ่งที่พูดแค่ 3 นาทีเสร็จมันชั่งยากอย่างงี้ ผมเพิ่งเข้าใจการแปลเนี่ยหล่ะ การที่เราจะแปลอะไรสักอย่างแล้วให้มันน่าอ่านนี่ยากเนอะ คนที่เค้าแปลนิยายต่างประเทศนี่คงเก่งสุดๆ เพราะนอกจากจะได้ศัพท์แล้ว ยังมีทักษะในการเรียงร้อยถ้อยคำที่น่าอ่านด้วย สำหรับผมแล้วไม่หวังว่าจะพูดภาษาอังกฤษได้ ขอแค่พออ่านออกแปลได้ เรียบเรียงคำพูดได้ดีก็พอแล้วครับ เผื่อจะมีสาวตาสีฟ้ามาบอกรัก จะได้เข้าใจสิ่งที่เค้าพูด ...
edit @ 2006/06/07 06:06:37
edit @ 2006/06/07 06:08:44
edit @ 2006/06/07 06:10:34
edit @ 2006/06/07 06:12:21
