การเขี�ยนเว็บไซต์�

นางสาว็ จิ�ราว็�ลย� พรมพ�ลาดรหั�ส 5640248204 ว็.5606

สาขีาว็�ชาว็�ทยาการคอมพ�ว็เต์อร� คณะว็�ทยาศาสต์ร�และเทคโนโลย� มหัาว็�ทยาล�ยราชภั�ฏเลย ปี'การศ(กษา 2557

1.1 คว็ามเปี*นมาและคว็ามส+าค�ญขีองปี-ญหัา

เนื่��องจากปั�จจ บั�นื่เทคโนื่โลยี�ด้�านื่เครื�อข่�ายีคอมพิ�วเตอรื ได้�ม�การืพิ�ฒนื่าไปัมาก ม�การืพิ#ด้ถึ%งการืท&า Web site โด้ยีการืเข่�ยีนื่โปัรืแกรืมด้�วยีภาษาต�างๆ เช่�นื่ ภาษา HTML PHP เปั,นื่ต�นื่ ส่�งผลให้�ม�การืพิ�ฒนื่าเครื�อข่�ายีคอมพิ�วเตอรื และได้�ม�บัทบัาทในื่ท กๆ ด้�านื่ ไม�ว�าจะเปั,นื่ด้�านื่การืพิาณิ�ช่ยี ธุ รืกรืรืมอ�เล4กทรือนื่�กส่ ด้�านื่การืต�ด้ต�อส่��อส่ารืและโทรืคมนื่าคม ไม�เว�นื่แม�แต�ด้�านื่การืศึ%กษา

1.2 ว็�ต์ถุ/ปีระสงค� 1. เพิ��อศึ%กษาเรื��องการืเข่�ยีนื่เว4บัไซต บันื่เว4บั

2. เพิ��อให้�ม�ความรื# �เก��ยีวก�บัการืเข่�ยีนื่เว4บัเพิ��มข่%7นื่

1.3 ขีอบเขีต์ขีองการศ(กษา 1. ศึ%กษาทฤษฎี�เก��ยีวก�บัทางด้�านื่การืเข่�ยีนื่เว4บัไซต 2. ศึ%กษาค�นื่คว�างานื่ว�จ�ยีในื่ปัรืะเทศึท��เก��ยีวก�บัการืเข่�ยีนื่เว4บัไซต

1.4 อ/ปีกรณ�และเคร01องม0อ1. ฮาร�ดแว็ร� - Hard Disk 500 GB

- CPU Intel Core i5 - RAM 4 GB

2.ซอฟต์�แว็ร� - Microsoft Word 2010 - Google Chrome - Internet Explorer

1.5 ปีระโยชน�ท�1คาดว็4าจิะได5ร�บ1. ส่ามารืถึรื# �ถึ%งทฤษฎี�การืออกแบับั

เว4บัไซต 2. ส่ามารืถึรื# �และเข่�าใจถึ%งโปัรืแกรืม

ในื่การืเข่�ยีนื่เว4บัไซต

1.6 ค+าน�ยามศ�พท�เฉพาะ1. การืเข่�ยีนื่เว4บั ห้มายีถึ%ง การืส่รื�างเว4บัไซต การืแส่ด้งผลข่องเว4บัจะอยี#�บันื่บัรืาวเซอรื ผ#�ใช่�ส่ามารืถึเข่�าถึ%งได้�ผ�านื่ทางเครื�อข่�ายีอ�นื่เทอรื เนื่4ต2. Web browser ห้มายีถึ%ง โปัรืแกรืมท��ใช่�แปัลภาษา html (interpreter) เช่�นื่ Internet Explorer, Firefox, Opera, etc.3. URL ห้มายีถึ%ง ท��อยี#� (Address) ข่องเว4บัไซต เช่�นื่ www.hotmail.com เปั,นื่ต�นื่4. Server ห้มายีถึ%ง เครื��องคอมพิ�วเตอรื ท��ให้�บัรื�การืต�างๆ เช่�นื่ Web Server จะให้�บัรื�การื เก��ยีวก�บัเว4บัไซต , Database Server จะให้�บัรื�การืเก��ยีวก�บัการืจ�ด้การืฐานื่ข่�อม#ล เปั,นื่ต�นื่5. Web Server ห้มายีถึ%ง เครื��องคอมพิ�วเตอรื ห้รื�อโปัรืแกรืมซ%�งให้�บัรื�การืเว4บัไซต ผ#�ใช่�เรื�ยีกช่มห้นื่�าเว4บัไซต ได้�โด้ยีใช่�โปัรืโตคอล HTTP ผ�านื่ทางเว4บัเบัรืาว เซอรื

2.1 ทฤษฎี�การออกแบบเว็บเพจิการืออกแบับัและพิ�ฒนื่าเว4บัเพิจ ส่ามารืถึท&าได้�ห้ลายีรื#ปัแบับั ข่%7นื่อยี#�ก�บั

ล�กษณิะข่องข่�อม#ลท��จะนื่&าเส่นื่อข่องผ#�พิ�ฒนื่า ตลอด้จนื่ให้�ตรืงกล �มเปั;าห้มายี ท��ต�องการืนื่&าเส่นื่อ เช่�นื่ ห้ากกล �มเปั;าห้มายีเปั,นื่นื่�กศึ%กษาและจะนื่&าเส่นื่อข่�อม#ลเก��ยีวก�บั ความบั�นื่เท�ง อาจจะออกแบับัให้�ม� ท�ศึทางการืไห้ลข่องห้นื่�าเว4บั ท��ม�เทคนื่�คท��ห้ลากห้ลายี ได้�มากกว�าเว4บัท��นื่&าเส่นื่อด้�านื่ว�ช่าการื

ทฤษฎี�การออกแบบเว็บเพจิ สามารถุแบ4งได5สามล�กษณะ ค0อ1. แบับัล&าด้�บัข่�7นื่ (Hierarchy) เปั,นื่การืจ�ด้แส่ด้งห้นื่�าเว4บั เรื�ยีงตามล&าด้�บั

ก��งก�านื่แตกแข่นื่งต�อเนื่��องไปัเห้ม�อนื่ต�นื่ไม�กล�บัห้�ว2. แบับัเช่�งเส่�นื่ (Linear) เปั,นื่การืจ�ด้แส่ด้งห้นื่�าเว4บัเรื�ยีงต�อเนื่��องไปัในื่ท�ศึทางเด้�ยีว3. แบับัผส่ม (Combination) เปั,นื่การืจ�ด้ห้นื่�าเว4บัช่นื่�ด้ผส่มรืะห้ว�างแบับัล&าด้�บัข่�7นื่

และแบับัเช่�งเส่�นื่

2.2 ทฤษฎี�ส�ก�บการออกแบบเว็บไซต์�การืส่รื�างส่�ส่�นื่บันื่ห้นื่�าเว4บัเปั,นื่ส่��งท��ส่��อความห้มายีข่องเว4บัไซต ได้�อยี�างช่�ด้เจนื่

การืเล�อกใช่�ส่�ให้�เห้มาะส่ม กลมกล�นื่ ไม�เพิ�ยีงแต�จะส่รื�างความพิ%งพิอใจให้�ก�บัผ#�ใช่� แต�ยี�งส่ามารืถึท&าให้�เห้4นื่ถึ%งความแตกต�างรืะห้ว�างเว4บัไซต ได้� ส่�เปั,นื่องค ปัรืะกอบัห้ล�กส่&าห้รื�บัการืตกแต�งเว4บั จ%งจ&าเปั,นื่อยี�างยี��งท��จะต�องท&าความเข่�าใจเก��ยีวก�บัการืใช่�ส่�

1. ส่�โทนื่รื�อนื่ (Warm Colors) เปั,นื่กล �มส่�ท��แส่ด้งถึ%งความส่ ข่ ความปัลอบัโยีนื่ ความอบัอ �นื่ และด้%งด้#ด้ใจ ส่�กล �มนื่�7เปั,นื่กล �มส่�ท��ช่�วยีให้�ห้ายีจากความเฉื่��อยีช่า ม�ช่�ว�ตช่�วามากยี��งข่%7นื่ 

2. ส่�โทนื่เยี4นื่ (Cool Colors) แส่ด้งถึ%งความท��ด้#ส่ ภาพิ อ�อนื่โยีนื่ เรื�ยีบัรื�อยี เปั,นื่กล �มส่�ท��ม�คนื่ช่อบัมากท��ส่ ด้ ส่ามารืถึโนื่�มนื่าวในื่รืะยีะไกลได้� 

3. ส่�โทนื่กลาง (Neutral Colors) ส่�ท��เปั,นื่กลาง ปัรืะกอบัด้�วยี ส่�ด้&า ส่�ข่าว ส่�เทา และส่�นื่&7าตาล กล �มส่�เห้ล�านื่�7ค�อ ส่�กลางท��ส่ามารืถึนื่&าไปัผส่มก�บัส่�อ��นื่ๆ เพิ��อให้�เก�ด้ส่�กลางข่%7นื่มา 

โทนส�สามารถุแบ4งออกเปี*น 3 กล/4ม ค0อ 

2.3 ทฤษฎี�การออกแบบเว็บไซต์�1. ความเรื�ยีบัง�ายี ได้�แก� ม�รื#ปัแบับัท��เรื�ยีบัง�ายี ไม�ซ�บัซ�อนื่

และใช่�งานื่ได้�ส่ะด้วก 2. ความส่ม&�าเส่มอ ได้�แก� ใช่�รื#ปัแบับัเด้�ยีวก�นื่ตลอด้ท�7ง

เว4บัไซต เช่�นื่ รื#ปัแบับัข่องห้นื่�า 3. ความเปั,นื่เอกล�กษณิ การืออกแบับัเว4บัไซต ควรืค&านื่%ง

ถึ%งอ�ตล�กษณิ เพิรืาะรื#ปัแบับัข่องเว4บัไซต จะส่ะท�อนื่ถึ%งเอกล�กษณิ ข่ององค กรืนื่�7นื่ๆ

4. เนื่�7อห้าท��ม�ปัรืะโยีช่นื่ เนื่�7อห้าเปั,นื่ส่��งท��ส่&าค�ญท��ส่ ด้ในื่เว4บัไซต

5. รืะบับัเนื่ว�เกช่�นื่ท��ใช่�งานื่ง�ายี ต�องออกแบับัให้�ผ#�ใช่�เข่�าใจง�ายีและใช่�งานื่ส่ะด้วก

6. ล�กษณิะท��นื่�าส่นื่ใจ ห้นื่�าตาข่องเว4บัไซต ต�องม�ความส่�มพิ�นื่ธุ ก�บัค ณิภาพิข่ององค ปัรืะกอบัต�างๆ

7. ค ณิภาพิในื่การืออกแบับัและการืเรื�ยีบัเรื�ยีงเนื่�7อห้าอยี�างรือบัคอบัส่ามารืถึส่รื�างความรื# �ส่%กว�าเว4บัไซต ม�ค ณิภาพิ ถึ#กต�องและเช่��อถึ�อได้�

1. โปีรแกรม Dreamweaver CS6

เปั,นื่เครื��องม�อในื่การืส่รื�างเว4บัเพิ4จท��ม�ปัรืะส่�ทธุ�ภาพิส่#งและการืออกแบับัเว4บัเพิจ1. ส่นื่�บัส่นื่ นื่การืท&างานื่แบับั WYSIWYG ห้มายีความว�า อะไรืก4ตามท��เรืาท&า

บันื่ห้นื่�าจอ Dreamweaver CS6 ก4จะปัรืากฏผลแบับัเด้�ยีวก�นื่บันื่เว4บัเพิ4จ2. ม�เครื��องม�อในื่การืส่รื�างรื#ปัแบับัห้นื่�าจอเว4บัเพิ4จและม�ความในื่การืยี�ด้ห้ยี �นื่ส่#ง3. ส่นื่�บัส่นื่ นื่ภาษาส่ครื�ปัต�างๆ ท�7งฝั่�� งไคลเอ4นื่ต และเช่�ฟเวอรื เช่�นื่ Java, Asp

2.4 ทฤษฎี�โปีรแกรมท�1ใช5เขี�ยนเว็บไซต์�

2. โปีรแกรม Adobe Photoshop CS6เปั,นื่โปัรืแกรืมท��เก��ยีวก�บัการืส่รื�างกรืาฟBกให้�ออกมาอยี�างส่วยีงาม

ไม�ว�าจะเปั,นื่การืส่รื�างต�วอ�กษรืต�างๆ และอ�กท�7งยี�งนื่�ยีมมาแต�งภาพิอ�กด้�วยี

3. โปีรแกรม Adobe Flash CS6เปั,นื่โปัรืแกรืมท��เว4บับัรืาวเซอรื ส่ามารืถึแส่ด้งส่��อนื่&าเส่นื่อข่องม�นื่ได้� ม�ความส่ามรืถึ

ในื่การืลองรื�บัภาพิแบับัเวกเตอรื และบันื่แบับัเรืส่เตอรื และยี�งรืองรื�บัรืะบับัเส่�ยีงและว�ด้�โอแบับัส่เตอรื�โอได้�อ�กด้�วยี

4. ทฤษฎี�ฐานขี5อม<ลฐานื่ข่�อม#ล ปัรืะกอบัด้�วยีรืายีละเอ�ยีด้ข่องข่�อม#ลท��เก��ยีวข่�องก�นื่ ซ%�งถึ#กนื่&ามาใช่�

ในื่งานื่ด้�านื่ต�างๆ เช่�นื่ ด้�านื่ธุนื่าคารื จะม�ฐานื่ข่�อม#ลท��เก��ยีวข่�องก�บัข่�อม#ลเง�นื่ฝั่าก ข่�อม#ลเห้ล�านื่�7จะถึ#กจ�ด้เก4บัไว�อยี�างม�รืะบับั และม�ความส่�มพิ�นื่ธุ ก�นื่ เพิ��อปัรืะโยีช่นื่ ในื่การืจ�ด้การืและรื�ยีกใช่�ข่�อม#ลได้�อยี�างม�ปัรืะส่�ทธุ�ภาพิ

งานว็�จิ�ยท�1เก�1ยว็ขี5อง ระบบการส0บค5นผลงานว็�จิ�ยและโครงงานคอมพ�ว็เต์อร�ธุ/รก�จิ ว็�ทยาล�ยราชพฤกษ� ผ<5ว็�จิ�ย ศ�ร�พร อ4ว็มม�เพ�ยร

การืพิ�ฒนื่ารืะบับัส่�บัค�นื่ผลงานื่ว�จ�ยีม�ว�ตถึ ปัรืะส่งค เพิ��อเก4บัรืวมรืวมรืายีละเอ�ยีด้ข่�อม#ลผลงานื่ ว�จ�ยีออกมาเปั,นื่รืะบับังานื่ส่�บัค�นื่ข่�อม#ลบันื่เครื�อข่�ายีอ�นื่เทอรื เนื่4ต ท&าให้�การืส่�บัค�นื่ผลงานื่ว�จ�ยีม�ความ ส่ะด้วกและรืวด้เรื4วมากยี��งข่%7นื่ เพิรืาะส่ามารืถึส่�บัค�นื่ได้�จากค&าท��เก��ยีวข่�องในื่ผลงานื่ว�จ�ยีนื่�7นื่ๆ

จบัการืนื่&าเส่นื่อข่อบัค ณิค�ะ

บรรณาน/กรม ศึ�รื�พิรื อ�วมม�เพิ�ยีรื. (2551). รืะบับัการืส่�บัค�นื่ผลงานื่ว�จ�ยีและโครืง

งานื่คอมพิ�วเตอรื ธุ รืก�จ ว�ทยีาล�ยีรืาช่พิฤกษ .

ห้ล�กการืทางานื่ข่องโปัรืแกรืมบันื่อ�นื่เตอรื เนื่4ต. ค�นื่เม��อ 20 ต ลาคม 2557, จาก https://sites.google.com/site/klumtee10/home/hlak-kar-thangan

อาส่าส่ม�ครืว�ก�เด้�ยี ภาษา JAVA การืแก�ไข่ครื�7งล�าส่ ด้: 19 พิฤศึจ�กายีนื่ 2014 14:17 UTC

ว�ก�พิ�เด้�ยี ส่ารืานื่ กรืมเส่รื�. ภาษาPHP การืแก�ไข่ครื�7งล�าส่ ด้: 9 ม�ถึ นื่ายีนื่ 2014, 06:31 UTC

นื่างส่าวอนื่งค ห้ลอด้แก�ว โครืงส่รื�างพิ�7นื่ฐานื่ข่อง HTML นื่�กว�ช่าการืคอมพิ�วเตอรื / อาจารืยี พิ�เศึษว�ทยีาล�ยีช่ มช่นื่ยีโส่ธุรื

https://sites.google.com ภาษา SQL การืแก�ไข่ครื�7งล�าส่ ด้: 10 ส่.ค. 2555 10:08

http://www.rangforever.com ภาษา JSP (Java Server Pages) การืแก�ไข่ครื�7งล�าส่ ด้: 12 ก.พิ. 2557