สอนสร้างเว็บไซต์ด้วยภาษา html ตอนที่ 5 Tag h (ส่วนหัวเรื่อง)


ในบทนี้เราจะมาทำความรู้จัก Tag H กัน Tag H เป็นคำสั่ง เพื่อบอกให้ทราบว่าข้อความที่อยู่ในแท็กนี้นั้นคือหัวเรื่อง Tag H  จะถูกใช้งานภายใต้ Tag body นอกจากนี้ Tag H ยังมีผลต่อการทำSEO Onpage ด้วย( การทำSEO onpage) สำหรับคำสั่งTag H นั้นจะมีตั้งแต่ <h1> ไปจนถึง <h6> โดย  <h1> จะมีขนาดและความสำคัญที่สุด เราลองมาดูการนำไปใช้งานกันครับ

<html>
<body>

<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>

</body>
</html>

จะได้ผลลัพธ์คือ 

This is heading 1

This is heading 2

This is heading 3

This is heading 4

This is heading 5
This is heading 6
ส่วนการนำ คำสั่งTag H ไปใช้นั้นก็ขึ้นอยู่กับเนื้อหาของเราว่าต้องการเน้นย้ำความสำคัญแค่ไหนครับ โดยปกติแล้ว <h1> มักใช้สำหรับหัวเรื่องที่มีความสำคัญที่สุด

สอนสร้างเว็บไซต์ด้วยภาษา html ตอนที่ 4 รู้จัก Attributes(แอทริบิวต์)


Attributes(แอทริบิวต์) คือ คุณสมบัติหรือคุณลักษณะเพิ่มเติมของ Tag นั้นๆ จะมีลักษณะ คำสั่ง="ค่า" เช่น

<html lang="en-US">
<body>

<h1>test</h1>
<a href="http://smileandsbyeseo.blogspot.com/">ทดสอบ</a>

</body>
</html>

จากตัวอย่างคำสั่งที่เป็น สีแดง จะบ่งบอกถึงคุณสมบัติ Attributes(แอทริบิวต์)  ที่มักพบได้บ่อย เช่น

คำสั่งกำหนดขนาดของรูปภาพ
<img width="104" height="142">

คำสั่งจัดการตัวอักษร
<font color="red" size="20">ทดสอบ</font>

คำสั่งเชื่อมโยงเว็บไซต์
<a href="http://smileandsbyeseo.blogspot.com/">ทดสอบ</a>

นี้เป็นเพียงแค่ตัวอย่างเท่านั้น คุณต้องรู้จักและทำความเข้าใจเกี่ยวกับAttributes(แอทริบิวต์)  เพื่อให้สามารถนำไปใช้งานได้ในต่อๆไป






รวมหัวข้อ สอนสร้างเว็บไซต์ด้วยภาษา html


เพื่อให้ง่ายต่อการนำไปใช้งานและศึกษาผมได้รวบรวมหัวข้อต่างๆที่เกี่ยวกับสอนการสร้างเว็บไซต์ด้วยคำสั่ง html เบื้องต้นไว้ในหัวข้อนี้ครับ


ทำความรู้จัก html ก่อนเริ่มต้นสร้างเว็บไซต์
สอนสร้างเว็บไซต์ด้วยภาษา html ตอนที่ 1ทำความรู็จักและเกริ่นนำ
สอนสร้างเว็บไซต์ด้วยภาษา html ตอนที่ 2 โครงสร้างของ html
สอนสร้างเว็บไซต์ด้วยภาษา html ตอนที่ 3 คำสั่งเบื้องต้นที่ใช้งานบ่อย



สามารถหาความรู้เพิ่มเติมได้จาก >>>> http://www.w3schools.com/

สอนสร้างเว็บไซต์ด้วยภาษา html ตอนที่ 3 คำสั่งเบื้องต้นที่ใช้งานบ่อย

tag และคำสั่งต่างๆที่จำเป็นต้องรู้ในการสร้างเว็บไซต์ 



ในหัวข้อ สอนสร้างเว็บไซต์ด้วยภาษา html  เราพอจะทราบแล้วว่าการสร้างเว็บเพจให้เป็นเว็บไซต์ด้วยภาษา html มีโครงสร้างยังไง มีอะไรบ้าง ขอทบทวนซักนิดนะครับ เว็บเพจจะมีโครงสร้างหน้าเว็บดังนี้
<html>
<head>
<title>ส่วนหัว </title>
</head>
<body>
<h1>ตัวอย่าง</h1>
<p>ข้อมูลอันแรก</p>
</body>
</html> 

โดย tag(แท็ก) คำสั่งดังตัวอย่างเรียกว่าแท็กคำสั่งแบบเปิดและปิด เช่น <title>..... </title> และอีกประเภทคือแบบเดี่ยวเช่น <br> เรามาดูซิว่าแท็กคำสั่งต่างๆในการทำเว็บไซต์มีอะไรบ้าง

1.คำสั่งหลักๆที่ใช้งานในการทำเว็บเพจ
<html>....</html> คือ คำสั่งสำหรับบอกว่านี้คือใสส่วนของเว็บไซต์ทั้งหมด
<head>...</head> คือ ส่วนสำหรับการใส่รายละเอียดข้อมูลของเว็บไซต์และการใช้ชุดคำสั่งบางประเภทเช่น javascript css เป็นต้น
<title>......</title> คือ คำสั่งสำหรับแสดงชื่อหน้าเว็บเพจนี้
<body>....</body> คือ คำสั่งสำหรับบอกว่านี้คือส่วนของเนื้อหาทั้งหมดที่ใช้แสดงบนเว็บเพจ


2.คำสั่งเพื่อกำหนดส่วนหัวของเรื่อง  <h>

<h1>test</h1>
<h2>test</h2>
<h3>test</h3>
<h4>test</h4>
<h5>test</h5>

<h6>test</h6>

เมื่อนำไปใช้จะมีลักษณะดังนี้


test

test

test

test

test
test
3.คำสั่งเพื่อกำหนดบรรทัดหรือย่อหน้า <p>
<p>test</p>
<p>test</p>
<p>test</p>
เมื่อนำไปใช้จะมีลักษณะดังนี้
test
test
test

4.คำสั่งเพื่อกำหนดลิงค์  <a>

<a href="http://smileandsbyeseo.blogspot.com/">ทดสอบ</a>

เมื่อนำไปใช้จะมีลักษณะดังนี้

ทดสอบ


5.คำสั่งใส่รูปภาพ  <img>

<img src="seo.jpg">

เมื่อนำไปใช้จะมีลักษณะดังนี้


สำหรับบทนี้  สอนสร้างเว็บไซต์ด้วยภาษา html ตอนที่ 3 ก็เป็นการเกริ่นนำสำหรับคำสั่งที่จำเป็นต้องรู้นะครับเนื่องจากใช้งานบ่อย บทต่อๆไปยังมีคำสั่งที่ต้องเรียนรู้อีกเยอะครับ ก็ค่อยๆนำไปใช้กันนะครับ

สอนสร้างเว็บไซต์ด้วยภาษา html ตอนที่ 2 โครงสร้างของ html

คำสั่งพื้นฐานที่ใช้งานบ่อยและควรต้องรู้ในภาษา html

จาก สอนสร้างเว็บไซต์ด้วยภาษา html ตอนที่ 1 เราพอจะเห็นโครงสร้างคราวๆแล้วว่าเว็บไซต์มีลักษณะอย่างไรนะครับ บทนี้จะกล่าวถึง Tag คำสั่งพื้นฐานที่สำคัญที่ใช้แสดงโครงสร้างของหน้าเว็บนะครับ โดย คำสั่ง Tag ที่เราพูดอยู่นี้จะเป็นลักษณะ Tagเปิด และ Tagปิด นะครับโดยเว็บเพจทุกทุกเว็บต้องมีคือส่วนของ Tag เปิด <html> และ Tag เปิด  <body> และ Tagเปิด  </body>และ  Tag ปิด </html>เสมอๆ

ตัวอย่างโครงสร้างภาษา html
<html>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
</body>
</html>
ขอบคุณรูปภาพจาก http://www.w3schools.com/html/html_intro.asp
จากตัวอย่างจะเห็นว่าเว็บไซต์นี้เริ่มต้นด้วยคำสั่ง <html> เพื่อบอกว่านี่คือส่วนของภาษา html จากนั้นก็เป็นคำสั่งในส่วน <body> เพื่อบอกว่าในส่วนนี้เป็นส่วนของเนื้อหา เมื่อส่วนของเนื้อหาสิ้นสุดจะต้องทำการปิดคำสั่งด้วยคำสั่ง </body> เพื่อบอกว่าสิ้นสุดในส่วนของเนื้อหาแล้ว และต้องใช้คำสั่ง </html> เพื่อบอกว่าสิ้นสุดหน้าเว็บเพจแล้ว ส่วนคำสั่ง <h1> <p> เราจะกล่าวในบทต่อไปครับ 
โดยปกติแล้วเว็บเพจจะมี tag อีกชุดหนึ่งสำหรับการบอกว่าหน้าเว็บนี้เกี่ยวกับอะไรและเป็นชุดคำสั่งสำหรับใช้งานโค้ดบางอย่างเช่น ชุคดำสั่งของ Javascript นะครับนั่นคือ <head>...</head> เช่น

<html>
<head>
<title>ส่วนหัว </title>
</head>
<body>
<h1>ตัวอย่าง</h1>
<p>ข้อมูลอันแรก</p>
</body>
</html> 

ก็ขอจบเรื่อง สอนสร้างเว็บไซต์ด้วยภาษา html ตอนที่ 2 ไว้เท่านี้ก่อนนะครับ สามารถย้อนกลับไปดู สอนสร้างเว็บไซต์ด้วยภาษา html ตอนที่ 1 ได้ด้วยนะครับ ^_^




สอนสร้างเว็บไซต์ด้วยภาษา html ตอนที่ 1ทำความรู็จักและเกริ่นนำ

โครงสร้างและคำสั่งต่างๆในภาษา html เบื้องต้นที่ต้องรู้


ตอนนี้เราจะมาทำความรู้จักเกี่ยวกับ ภาษา html กันก่อนนะครับ เนื่องจากภาษา html เป็นภาษาพื้นฐานสำหรับการพัฒนาสร้างเว็บเพจให้กลายเป็นเว็บไซต์ เราต้องรู้จักองค์ประกอบของภาษา html ดังนี้ครับ

โครงสร้างของ ภาษา html
ภาษา html จะประกอบด้วยคำสั่งต่าง เรียกว่า tag จะมีลักษณะ <> เช่น

<html>
<head>
<title>ส่วนหัว </title>
</head>
<body>
<h1>ตัวอย่าง</h1>
<p>ข้อมูลอันแรก</p>
</body>
</html> 

จากตัวอย่างจะเห็น tag คำสั่งที่สำคัญๆได้แก่ tag <html>, tag <body>, tag <h> , tag <p>,tag <head>, tag <title> เป็นต้น
โครงสร้างของ ภาษา html จะเริ่มด้วย  tag <html> ตามด้วย tag <head> ตามด้วย tag <body>
คุณสามารถสร้าเว็บเพจได้โดยการก๊อปปี้โค้ดด้านบนลงโปรแกรม notepad แล้วเซฟไฟล์เป็นนามสกุล .html ลองดูวิธีทำตามรูปด้านล่างนี้ครับ


สร้าง text Document ขึ้นมาครับเพื่อจะเขียนโค้ดลงไป

ทำการดับเบิ้ลคลิ๊กเพื่อเปิดไฟล์ขึ้นมาครับ หรือ คลิ๊กเมาส์ขวา > open with > notepad ครับ แล้วทำการเพิ่มโค้ดลงไปดังตัวอย่างครับ


กดเลือก File > save as เพื่อบันทึกงานครับ

จะแสดงหน้าให้บันทึกไฟล์ครับ ตั้งชื่อว่า test.html ในช่อง Encoding ให้เลือกเป็น UTF-8 ครับเพื่อทำให้แสดงภาษาไทยได้ แล้วกด save ครับ 


คลิ๊กขวาที่ไฟล์ชื่อ test.html ที่เราเพิ่งสร้างไปครับ > open with > google chrome(หรือเว็บบราวเซอร์อื่นเช่น IE, firefox ก็ได้ครับ)



จะแสดงหน้าเว็บแบบตัวอย่างครับ
หวังว่า สอนสร้างเว็บไซต์ด้วยภาษา html ตอนที่ 1 คงไม่ยากจนเกินไปนะครับ ^_^






แนะนำเครื่องมือที่จำเป็นในการสร้างเว็บไซต์


โดยปกติแล้วการสร้างเว็บไซต์นั้นคือการเขียนโค้ดเข้าไปให้กลายเป็นเว็บไซต์ สำหรับโปรแกรมที่ใช้เขียนโค้ดพวกนี้เรียกว่า Text Editor สำหรับวินโดว์มีตัวที่ติดมาอยู่แล้วนั้นคือ notepad นั่นเองแต่ด้วยความที่ notepad ไม่มีลูกเล่นและเวลาเขียนโค้ดเยอะๆทำให้มีปัญหาได้ จึงได้มีการพัฒนาโปรแกรมสำหรับช่วยสร้างเว็บไวต์ขึ้นมาอีกมากมายทั้งฟรีและไม่ฟรี ที่ได้รับความนิยมมีดังต่อไปนี้

โปรแกรมลิขสิทธิ์เสียเงิน
1. Editplus เป็นโปรแกรมที่ได้รับความนิยมมากเนื่องจากมีฟังก์ชั่นต่างๆมากมายในการเขียนโปรแกรม เบาเครื่อง
2. Dreamweaver เป็นโปรแกรมที่ได้รับความนิยมสูงสุดตัวหนึ่งเนื่องจากมีฟังก์ชั่นการใช้งานเพียบพร้อม และสามารถแก้โค้ดพร้อมเห็นหน้าจอเว็บไซต์ได้ด้วย

โปรแกรมฟรีแวร์
1. notepad++ มีความสามารถคล้ายกับ Editplus 
2. Sublime Text เป็นโปรแกรมที่กำลังได้รับความนิยมมากในปัจจุบัน ความสามารถและฟังก์ชั่นการใช้งานจะเยอะกว่า notepad++
3. Netbean มีฟังก์ชั่นในการใช้งานหลากหลาย นิยมนำมาใช้เขียนภาษาจาวา
4. Esclipe ได้รับความนิยมพอๆกับโปรแกรม Netbean 


ก็ลองหาโปรแกรมเหล่านี้มาใช้งานกันดูนะครับ สำหรับผมขอแนะนำ Sublime Text  ละกันเพราะได้รับความนิยมมากในขณะนี้ครับ ก็หวังว่าทุกท่านจะมีเครื่องมือสำหรับสร้างเว็บไซต์ที่ถูกใจนะครับ



ทำความรู้จัก html ก่อนเริ่มต้นสร้างเว็บไซต์



HTML: (Hypertext Markup Language) หรือเรียกว่า เอชทีเอ็มแอล คือ ภาาษที่ใช้ในการสร้างเว็บเพจ(หน้าเว็บ 1 หน้าเรียก เพจ หน้าเว็บหลายเพจรวมกันเรียกว่า เว็บไซต์) โดยปกติแล้วหน้าเว็บเหล่านี้จะถูกเปิดโดยเว็บบราวเซอร์ เช่น IE, firefox, googlechrom เป็นต้น

ภาษา HTML มีการจัดทำเป็นมาตรฐานโดยมี World Wide Web Consortium (W3C) เป็นผู้ดูแล ปัจจุบันภาษา HTML ได้พัฒนามาสู่ยุคที่เรียกว่า HTML5 ความสามารถของ HTML5 นั้นมีมากมายเหลือเกินซึ่งยังไม่ขอกล่าวถึงเพราะจะหนักสมองปล่าวๆ 555+

ก็ขอเกริ่นนำสำหรับภาษา html แต่เพียงเท่านนี้นะครับ ในส่วนต่อๆไปเราจะต้องทำความรู็จักโค้ดต่างๆของภาษา html ที่จำเป็นในการสร้างเว็บเพจ

การตลาดออนไลน์คืออะไร และทำอย่างไร สำคัญหรือไม่

การตลาดออนไลน์คืออะไร และทำอย่างไร สำคัญหรือไม่


การตลาดออนไลน์ (Online Marketing) คือ การทำการตลาดโดยอาศัยสื่ออินเตอร์เน็ต การทำการตลาดออนไลน์ในปัจจุบันเป็นที่นิยมมากเนื่องจากทำได้ง่าย รวดเร็ว ประหยัด

การตลาดออนไลน์ ทำอย่างไร สำหรับตัวผมการทำการตลาดมีหลายวิธีด้วยกันเช่น
1. การโพสประกาศ ประชาสัมพันธ์ ข้อมูลขององค์กร หน่วยงาน หรือร้านค้าของตนผ่านแหล่งสังคมออนไลน์ต่างๆ เช่น เว็บบอร์ด เว็บโพสประกาศ โซเชียลเน็ตเวิร์ด
2. การทำ SEO คือ การทำให้เว็บไซต์ของเราถูกต้องตามหลักการค้นหาของ Search Engine ยักษ์ใหญ่อย่าง google โดยอาศัยหลักการ on page และ off page  เพื่อให้เว็บไซต์ของเราติดอันดับหน้าแรก Google
3. การลงโฆษณากับ google adword  google adword  คือผลิตภัณฑ์หนึ่งของ google สำหรับการโปรโมทเว็บไซต์ร้านค้าหรือองค์กรผ่าน Search Engine Google สำหรับการลงโฆษณาแบบนี้จะต่างจากการทำ Seo ตรงที่การแสดงของโฆษณาจะแสดงในตำแหน่งที่เด่นชัดในหน้าการค้นหา อาจจะเป็นตำแหน่งที่ 1, 2, 3 ของหน้าเว็บค้นหา เป็นต้น
4. การลงโฆษณากับ Facebook เรียกว่า Fackbook Ads การลงโฆษณาแบบนี้เป็นการโปรโมทผ่านเว็บ facebook โดยเราสามารถกำหนดรายละเอียดต่างๆได้เช่น ต้องการให้เนื้อหาแสดงให้ เพศชายหรือเพศหญิง ช่วงอายุเท่าไหร่ ภูมิภาคไหน เป็นต้น นอกจากนี้ประเทศไทยมีการใช้งาน Facbook มาก ซึ่งการทำการตลาดแบบนี้ถือเป็นตัวช่วยที่ได้ผลทีเดียว
5. การใช้สื่อโซเชียลเน็ตเวิร์คและโซเชียลมีเดีย ปัจจุบันโซเชียลเน็ตเวิร์คและโซเชียลมีเดียมีผลต่อการดำรงชีวิตในปัจจุบันมาก การเลือกทำการตลาดผ่านช่องทางนี้จะได้ผลตอบรับที่เร็วมาก เช่น facebook google+ line youtube เป็นต้น

ความสำคัญของการทำการตลาดออนไลน์ ถือว่าสำคัญมากในปัจจุบันเนื่องจาก ประหยัด รวดเร็ว และครอบคลุมมากในปัจจุบัน แต่กระนั้นการทำการตลาดแบบออฟไลน์ เช่น การแจกใบปลิว แจกนามบัตร ก็เป็นสิ่งที่สำคัญที่ควรทำควบคู่กันไปเพื่อให้เกิดผลสำเร็จสูงสุด