หน้าเว็บ

วันจันทร์ที่ 9 กุมภาพันธ์ พ.ศ. 2558

ขั้นตอนการสร้างเว็บไซต์

1. กำหนดเป้าหมายและวางแผนงาน
    1.1 กำหนดเป้าหมายของเว็บไซต์
    1.2 กำหนดกลุ่มผู้ชมเป้าหมาย
    1.3 กำหนดขอบเขตเนื้อหา และรวบรวมข้อมูลเนื้อหา
    1.4 เตรียมเครื่องมืออุปกรณ์ที่จำเป็น
    1.5 เตรียมทักษะและบุคลากร
    1.6 ประมาณการค่าใช้จ่าย
2. เลือก Web hosting และจด Domain name
     2.1 Web hosting คืออะไร
     2.2 หลักการเลือก Web hosing
     2.3 การจด Domain name
     2.4 การตั้งชื่อ Domain name ที่ดี
3 ออกแบบเว็บไซต์
     3.1 การออกแบบโครงสร้างเว็บไซต์ (Site Structure Design)
     3.2 การออกแบบระบบเนวิเกชั่น (Site Navigation Design)
     3.3 การออกแบบเว็บเพจ (Page Design)
4 ลงมือสร้างและทดสอบ
    4.1 รูปแบบของเว็บไซต์
    4.2 ภาษาโปรแกรมที่ใช้ในการสร้างเว็บไซต์
    4.3 โปรแกรมที่ใช้ในการสร้างเว็บไซต์
    4.4 ลงมือสร้างเว็บไซต์
5. ประชาสัมพันธ์ให้เว็บไซต์เป็นที่รู้จัก
6. ดูแล และพัฒนาอย่างต่อเนื่อง


การออกแบบโครงสร้างเว็บไซต์ (Site Structure Design)

การออกแบบโครงสร้างเว็บไซต์ (Site Structure Design)

ส่วนประกอบของหน้าเว็บเพจ     แบ่งออกเป็น 3 ส่วนหลักๆ คือ

1. ส่วนหัวของหน้า (Page Header)

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

2.ส่วนของเนื้อหา (Page Body)

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

3. ส่วนท้ายของหน้า (Page Footer)

เป็นส่วนที่อยู่ด้านล่างสุดของหน้า จะมีหรือไม่มีก็ได้  มักวางระบบนำทางที่เป็นลิงค์ข้อความง่าย ๆ และอาจแสดงข้อมูลเพิ่มเติมเกี่ยวกับเนื้อหาภายในเว็บไซต์ เช่น เจ้าของเว็บไซต์, ข้อความแสดงลิขสิทธิ์, วิธีการติดต่อกับผู้ดูแลเว็บไซต์, คำแนะนำการใช้เว็บไซต์ เป็นต้น
โดยปกติส่วนหัวและส่วนท้ายมักแสดงเหมือนกันในทุกหน้าของเว็บเพจ
.ตัวอย่าง แสดงส่วนประกอบของหน้าเว็บเพจ (trendypet.com)

โครงสร้างและรูปแบบของเว็บเพจ

ในหน้าเว็บเพจหนึ่งๆ ประกอบไปด้วยส่วนหัวของหน้า (Page Header), ส่วนเนื้อหา และการเชื่อมโยง (Page Body) และส่วนท้ายของหน้า (Page Footer)
ในเว็บไซต์หนึ่งๆ อาจมีโครงสร้างหน้าเว็บเพจหลายๆ แบบก็ได้ แต่จะต้องมีเอกลักษณ์ และลักษณะที่ใกล้เคียงกัน จะต้องจัดองค์ประกอบของหน้าเว็บเพจให้เหมาะสม ได้แก่ เนื้อหา กราฟฟิก โลโก้ ระบบเนวิเกชั่น ป้ายโฆษณา และอื่นๆ

การแบ่งพื้นที่ของหน้าเว็บเพจเพื่อแสดงส่วนประกอบต่างๆ

ทำได้หลายรูปแบบ เช่น

แบ่งแบบอิสระ


ตัวอย่างเว็บไซต์


บ่ง 2 ส่วน


แบ่ง 3 ส่วน     จะมีส่วน Footer หรือไม่ก็ได้

 
ตัวอย่างเว็บไซต์
ส่วนเนื้อหายังสามารถแบ่งสัดส่วนเพื่อแสดงเนื้อหาต่างๆ ได้อีก
ตัวอย่างเว็บไซต์

วันจันทร์ที่ 1 ธันวาคม พ.ศ. 2557

SQL

SQL คืออะไร
    SQL ย่อมาจาก structured query language คือภาษาสอบถามข้อมูล หรือภาษาจัดการข้อมูลอย่างมีโครงสร้าง มีการพัฒนาภาษาคอมพิวเตอร์ และโปรแกรมฐานข้อมูลที่รองรับมากมาย เพราะจัดการข้อมูลได้ง่าย เช่น MySQL, MsSQL, PostgreSQL หรือ MS Access เป็นต้น สำหรับโปรแกรมฐานข้อมูลที่ได้รับความนิยมคือ MySQL เป็น Open Source ที่ใช้งานได้ทั้งใน Linux และ Windows

แบ่งการทำงานได้เป็น 4 ประเภท ดังนี้


1. Select query ใช้สำหรับดึงข้อมูลที่ต้องการ

ใช้ในการดึงข้อมูลในฐานข้อมูล จะมีการค้นหารายการจากตารางในฐานข้อมูล ตั้งแต่หนึ่งตารางขึ้นไป ตามเงื่อนไขที่สั่ง ผลลัพธ์ที่ได้จะเป็นเซตของข้อมูลที่สามารถสร้าง เป็นตารางใหม่ หรือใช้แสดงออกมาทางจอภาพเท่านั้น โดยมีรูปแบบดังนี้
Select รายละเอียดที่เลือก From ตารางแหล่งที่มา Where กำหนดเงื่อนไขฐานข้อมูลที่เลือก Group by ชื่อคอลัมน์

ตัวอย่างการใช้งาน

1. Select fmane,lname From stdinfo
หมายถึง ให้แสดงเฉพาะคอลัมน์ fname คือ ชื่อ และคอลัมน์ lname คือ นามสกุล จากตาราง stdinfo
2. Select fname,lname From stdinfo Where programe=”สังคมศึกษา”
หมายถึง ให้แสดงชื่อ และนามสกุลจากตาราง stdinfo ซึ่งมีโปรแกรมวิชาเป็นสังคมศึกษา
3. Select fname From stdinfo Where fname Like ‘ส%’
หมายถึง ให้เลือกรายชื่อ นักศึกษาที่มีอักษรนำหน้าเป็น “ส” ขึ้นมาแสดงทั้งหมด
4. Select id,fname,lname From stdinfo Where id=”001” AND id=”005”
หมายถึง ให้แสดง รหัสประจำตัวนักศึกษา ,ชื่อ และ นามสกุล ที่มีรหัสเป็น 001 และ 005

ข้อสังเกต

1. ประโยคย่อย WHERE เราสามารถระบุเงื่อนไขได้โดยใช้โอเดปอร์เรเตอร์ ทั้วไป เช่น NOT < > = กรณีที่คอลัมน์เป็นตัวเลข เราก็สามารถระบุเงื่อนไขที่เป็นการคำนวนได้เช่น +,-,*,/
2. คำว่า Like ใช้กับค่าในคอลัมน์ประเภทตัวอักษรว่าตรงกับประโยคที่ต้องการหรือไม่ เราสามารถใช้เครื่องหมาย widecard เช่น *,??,% ในประโยคได้ ตามตัวอย่างข้างต้น
3. ในการคำนวนนั้นมีฟังก์ชัน COUNT,SUM,AVG.MIN,MAX ซึ่งสามารถนำมาใช้ได้ เช่น
Select Count(id) From stdinfo
หมายถึง ให้แสดงจำนวนรายการทั้งหมดในตาราง
4. ในกรณีที่ตารางสองตารางมีความสัมพันธ์กัน เราก็สามารถดูข้อมูลทั้งสองตารางพร้อมกันได้ เช่น ตารางที่ 1 ข้อมูลนักศึกษาชื่อ stdinfo
กำหนดให้มีคอลัมน์รหัสประจำตัว (id) ,ชื่อ (fname), นามสกุล (lname)
ตารางที่ 2 ขอมูลเกี่ยวกับวิชาที่เรียน ชื่อ substd
กำหนดให้มีคอลัมน์ชื่อวิชา (subject), รหัสประจำตัวอ้างอิง (rid) ,อาจารย์ผู้สอน (teacher)
เราต้องการดูข้อมูลรหัสประจำตัว ชื่อ นามสกุล และชื่อวิชาที่เรียน เราจะใช้คำสั่งดังนี้
Select stdinfo.id, stdinfo.fname,stdinfo.lname,substd.subject From stdinfo,substd Where stdinfo.id=substd.rid

2. Update query ใช้สำหรับแก้ไขข้อมูล

ใช้สำหรับการแก้ไขข้อมูลในตาราง โดยแก้ในคอลัมน์ที่มีค่าตรงตามเงื่อนไข มีรูปแบบดังนี้
Update ชื่อตาราง Set [ชื่อคอลัมน์=ค่าที่จะใส่เข้าไปในคอลัมน์นั้น ๆ ] Where เงื่อนไข
เช่น จากตารางแสดงรายชื่อนักศึกษากรณีที่นักศึกษาชื่อ สมบัติ มักน้อย ย้ายโปรแกรมวิชา จาก สังคมศึกษา ไปเป็นภาษาไทย เราใช้คำสั่งดังนี้
Select stdinfo Set programe=’ภาษาไทย’ Where Fname=’สมบัติ’ and Lname=’มักน้อย’

3. Insert query ใช้สำหรับการเพิ่มข้อมูล

ใช้ในการเพิ่มเติมข้อมูลใหม่ ๆ เข้าไปในฐานข้อมูล มีรูปแบบดังนี้
Insert Into ชื่อตาราง [=ชื่อคอลัมน์1,2..] Values [ค่าที่จะใส่ลงในคอลัมน์ 1,2…]
เช่น ต้องการเพิ่มรายชื่อนักศึกษา ที่มีรหัสประจำตัวเป็น 007 ชื่อ กมลวรรณ ศิริกุล โปรแกรมวิชา วิทยาศาสตร์ เราสามารถใช้คำสั่งดังนี้
Insert into stdinfo (id,fname,lname,programe) Values (‘007’,’กมลวรรณ’,’ศิริกุล’,’ วิทยาศาสตร์’)

4. Delete query ใช้สำหรับลบข้อมูลออกไป

ใช้ลบข้อมูลออกจากตาราง มีรูปแบบดังนี้
Delete From ชื่อตาราง Where เงื่อนไข
เช่น ต้องการลบรหัสประจำตัวนักศึกษา 005 ออกจากฐานข้อมูล เราใช้คำสั่งดังนี้
Delete From stdinfo Where id=’005’



ประโยชน์ของภาษา SQL

1. สร้างฐานข้อมูลและ ตาราง    
2. สนับสนุนการจัดการฐานข้อมูล ซึ่งประกอบด้วย การเพิ่ม การปรับปรุง และการลบข้อมูล
3. สนับสนุนการเรียกใช้หรือ ค้นหาข้อมูล    


ประเภทของคำสั่งภาษา SQL


1. ภาษานิยามข้อมูล(Data Definition Language : DDL) เป็นคำสั่งที่ใช้ในการสร้างฐานข้อมูล กำหนดโครงสร้างข้อมูลว่ามี  Attribute ใด
 ชนิดของข้อมูล รวมทั้งการเปลี่ยนแปลงตาราง และการสร้างดัชนี คำสั่ง : CREATE,DROP,ALTER
2. ภาษาจัดการข้อมูล (Data Manipulation Language :DML) เป็นคำสั่งที่ใช้ในการเรียกใช้ เพิ่ม ลบ และเปลี่ยนแปลงข้อมูลในตาราง    คำสั่ง : SELECT,INSERT,UPDATE,DELETE
3. ภาษาควบคุมข้อมูล (Data Control Language : DCL) เป็นคำสั่งที่ใช้ในการกำหนดสิทธิการอนุญาติ หรือ ยกเลิก การเข้าถึงฐานข้อมูล เพื่อป้องกันความปลอดภัยของฐานข้อมูล คำสั่ง : GRANT,REVOKE