tag:blogger.com,1999:blog-86293420972035132402024-03-13T23:52:57.800-07:00บทที่3การออกแบบเเละพัฒนาเว็บไซต์http://www.blogger.com/profile/09284739676133932227noreply@blogger.comBlogger2125tag:blogger.com,1999:blog-8629342097203513240.post-29915010024486576132019-02-24T22:17:00.002-08:002019-02-24T22:17:06.024-08:00การเปิดพื้นที่การใช้งาน การนำภาพเข้าใช้งาน และการบันทึกงาน การเปิดพื้นที่การใช้งานใหม่<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;">1. ไปที่ Application menu เลือก File > New จะปรากฎหน้าต่างดังรูปด่านล่าง</span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<b><span style="color: black; font-family: verdana, sans-serif; font-size: small;"><br /></span></b></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1dUVj_ulPWv_9uIwSZZTkhK4_0caMvVbWN0s1q2Ci8b7p9tw2ceUJ8JXaQEZ0yMwv5wvYb1JFgHnJ0jVauwqOZgtpf3dhzvgTsY6VTb2YWIH4ou5Pmo7zVFLciiiN_bxVqdr1FFPOIp-R/s1600/111.PNG" imageanchor="1" rel="nofollow" style="background: none; border-bottom: none; color: #8a8c50; margin-left: 1em; margin-right: 1em;"><span style="color: black; font-family: verdana, sans-serif; font-size: small;"><img border="0" height="236" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1dUVj_ulPWv_9uIwSZZTkhK4_0caMvVbWN0s1q2Ci8b7p9tw2ceUJ8JXaQEZ0yMwv5wvYb1JFgHnJ0jVauwqOZgtpf3dhzvgTsY6VTb2YWIH4ou5Pmo7zVFLciiiN_bxVqdr1FFPOIp-R/s1600/111.PNG" style="border-color: rgb(204, 204, 204) rgb(153, 153, 153) rgb(153, 153, 153) rgb(204, 204, 204); border-image: initial; border-radius: 5px; border-style: solid; border-width: 1px; box-shadow: rgb(204, 204, 204) 0px 0px 6px; padding: 7px;" width="320" /></span></a></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<b><span style="color: black; font-family: verdana, sans-serif; font-size: small;"><br /></span></b></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"> 2. จากรูปมีการกำหนดค่าต่างๆมากมาย </span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<span style="background-color: transparent; color: black; font-family: verdana, sans-serif; font-size: small; line-height: 20.79px; text-align: center;">ช่อง Name คือการกำหนดชื่อของชิ้นงาน</span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<span style="background-color: transparent; color: black; font-family: verdana, sans-serif; font-size: small; line-height: 20.79px; text-align: center;">ช่อง Preset คือ ชนิดของงานต่างๆ ที่กำหนดไว้ให้แล้ว มีให้เลือกมากมาย เช่น Web , Photo ,U.S.paper , international paper</span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<span style="background-color: transparent; color: black; font-family: verdana, sans-serif; font-size: small; line-height: 20.79px; text-align: center;">ช่อง size จะสัมพันธ์กับช่อง Preset คือ ขนาดของงานแต่ละชนิด เช่น ค่า Preset เป็น International paper ช่อง Size ก็จะมีตัวเลือก คือ A4 , A3 , A2 ,A1 และอื่นๆ</span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<span style="background-color: transparent; color: black; font-family: verdana, sans-serif; font-size: small; line-height: 20.79px; text-align: center;">ช่อง width คือขนาดความกว้างของชิ้นงาน หากต้องการกำหนดเอง มีหน่วนให้เลือก 7 ชนิด</span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<span style="background-color: transparent; color: black; font-family: verdana, sans-serif; font-size: small; line-height: 20.79px; text-align: center;">ช่อง Hight คือขนาดความสูงของชิ้นงาน </span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<span style="background-color: transparent; color: black; font-family: verdana, sans-serif; font-size: small; line-height: 20.79px; text-align: center;">ช่อง Resolution คือ ความละเอียดของงาน มีหน่วยเป็น Pixelต่อนิ้ว และ Pixel ต่อเซนติเมตร</span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<span style="background-color: transparent; color: black; font-family: verdana, sans-serif; font-size: small; line-height: 20.79px; text-align: center;">ช่อง Color mode คือชนิดของพื้นที่สีในการทำงาน มีให้เลือกหลากหลาย เช่น RGB , CMYK และมีค่าความละเอียดให้เลือกเป็น bit</span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<span style="background-color: transparent; color: black; font-family: verdana, sans-serif; font-size: small; line-height: 20.79px; text-align: center;">ช่อง Background Contents คือเลือกชนิดของ พื้นหลังงาน มี 3 แบบ คือ แบบขาว แบบสี และแบบโปร่งใส</span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 21.3333px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"><span style="line-height: 20.79px; text-align: center;"> เมื่อทำการกำหนดขนาดของงานเสร็จเรียบร้อยแล้ว ให้คลิปปุ่ม OK เพื่อทำการเปิดพื้นที่การทำงานดังตัวอย่างภาพ เปิดพื้นที่งานขนาด A4 พื้นหลัง สีขาว</span></span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<b><span style="color: black; font-family: verdana, sans-serif; font-size: small;"><br /></span></b></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVUhSLYGICMcyjMkScczQjwvK6OALmsA0ZvCwmFKUGuqJE8atuGhpGAmGYagiSSEWJ4dIrZqWhVRldUe4fYpeo0s5bxboiuzK2ZmqFksfozK2sGZehbjAEvx4DtMSMvlqIXLdCca7zM3LZ/s1600/222.PNG" imageanchor="1" rel="nofollow" style="background: none; border-bottom: none; color: #8a8c50; margin-left: 1em; margin-right: 1em;"><span style="color: black; font-family: verdana, sans-serif; font-size: small;"><img border="0" height="216" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVUhSLYGICMcyjMkScczQjwvK6OALmsA0ZvCwmFKUGuqJE8atuGhpGAmGYagiSSEWJ4dIrZqWhVRldUe4fYpeo0s5bxboiuzK2ZmqFksfozK2sGZehbjAEvx4DtMSMvlqIXLdCca7zM3LZ/s1600/222.PNG" style="border-color: rgb(204, 204, 204) rgb(153, 153, 153) rgb(153, 153, 153) rgb(204, 204, 204); border-image: initial; border-radius: 5px; border-style: solid; border-width: 1px; box-shadow: rgb(204, 204, 204) 0px 0px 6px; padding: 7px;" width="400" /></span></a></div>
การออกแบบเเละพัฒนาเว็บไซต์http://www.blogger.com/profile/09284739676133932227noreply@blogger.comtag:blogger.com,1999:blog-8629342097203513240.post-88325478884064210042019-02-24T22:13:00.003-08:002019-02-24T22:13:48.683-08:00<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"><b>การนำภาพเข้าใช้งาน</b></span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"> หากเรามีภาพที่ต้องการเปิดเข้าใช้งานในโปรแกรม ในทำการ ตามขั้นตอนต่อไปนี้</span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"> ไปที่ File > open เลือก Floder ที่มีรูปที่เราต้องการ เลือกรูปนั้นแล้วกด Open</span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"><br /></span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvcqwpNm3wil9qkaFt6ockVAMwkZrn2ujSHiYXuTGaOsAobqchf9Ei3NM2K6B7KWRaf4qcKXNRkf76BmojjfyRWth9pzvFUTN2Gy2vx5N1ubNdAIJAGhJxJF9LHrlROJ7ktNOSWe9BwzeC/s1600/333.PNG" imageanchor="1" rel="nofollow" style="background: none; border-bottom: none; color: #8a8c50; margin-left: 1em; margin-right: 1em;"><span style="color: black; font-family: verdana, sans-serif; font-size: small;"><img border="0" height="172" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvcqwpNm3wil9qkaFt6ockVAMwkZrn2ujSHiYXuTGaOsAobqchf9Ei3NM2K6B7KWRaf4qcKXNRkf76BmojjfyRWth9pzvFUTN2Gy2vx5N1ubNdAIJAGhJxJF9LHrlROJ7ktNOSWe9BwzeC/s320/333.PNG" style="border-color: rgb(204, 204, 204) rgb(153, 153, 153) rgb(153, 153, 153) rgb(204, 204, 204); border-image: initial; border-radius: 5px; border-style: solid; border-width: 1px; box-shadow: rgb(204, 204, 204) 0px 0px 6px; padding: 7px;" width="320" /></span></a></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"> </span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;">จะได้รูปมาปรากฎอยู่ที่ Stage หรือพื้นที่การทำงานดังรูป ตามตัวอย่างด้านล่าง ใช้รูปดอกบัว</span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"><br /></span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6jew3sUJXm0ZecfcukPtMLTD7Aj-jRc56bhFBjmKnLfTO6tmWJN6KkQnWyiqBFdodL_sijlbJSrxzn0LA-t6b_cbso-NKkpHw4T4UfdyHf7DtrJl9nw2-gD7QyHWnKSnHQ7L5eE9ThBK-/s1600/444.PNG" imageanchor="1" rel="nofollow" style="background: none; border-bottom: none; color: #8a8c50; margin-left: 1em; margin-right: 1em;"><span style="color: black; font-family: verdana, sans-serif; font-size: small;"><img border="0" height="172" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6jew3sUJXm0ZecfcukPtMLTD7Aj-jRc56bhFBjmKnLfTO6tmWJN6KkQnWyiqBFdodL_sijlbJSrxzn0LA-t6b_cbso-NKkpHw4T4UfdyHf7DtrJl9nw2-gD7QyHWnKSnHQ7L5eE9ThBK-/s320/444.PNG" style="border-color: rgb(204, 204, 204) rgb(153, 153, 153) rgb(153, 153, 153) rgb(204, 204, 204); border-image: initial; border-radius: 5px; border-style: solid; border-width: 1px; box-shadow: rgb(204, 204, 204) 0px 0px 6px; padding: 7px;" width="320" /></span></a></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px; text-align: center;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"><br /></span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"> </span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"> <b>การบันทึกงาน</b></span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"> สมมุติว่า เราได้แต่งรูป พระทราย ดังตัวอย่างภาพด้านล่าง เสร็จเรียบร้อยแล้ว เราต้องการบันทึกการทำงาน ทำตามขั้นตอนดังต่อไปนี้</span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"><br /></span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7q7ZDTnSoMXE0HKrRRS7Zm7mb2SONQbxi-qG4JrE2hmPK052Wj8Dz1uTHztF2GxsFv3C7TbyGmfRB6qJw9KJPiWAAaeZgunkp5s0h6LWaqZyxnm3mn268SB8IDzxxqF_28RPqxhtYsre6/s1600/555.PNG" imageanchor="1" rel="nofollow" style="background: none; border-bottom: none; color: #8a8c50; margin-left: 1em; margin-right: 1em;"><span style="color: black; font-family: verdana, sans-serif; font-size: small;"><img border="0" height="172" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7q7ZDTnSoMXE0HKrRRS7Zm7mb2SONQbxi-qG4JrE2hmPK052Wj8Dz1uTHztF2GxsFv3C7TbyGmfRB6qJw9KJPiWAAaeZgunkp5s0h6LWaqZyxnm3mn268SB8IDzxxqF_28RPqxhtYsre6/s320/555.PNG" style="border-color: rgb(204, 204, 204) rgb(153, 153, 153) rgb(153, 153, 153) rgb(204, 204, 204); border-image: initial; border-radius: 5px; border-style: solid; border-width: 1px; box-shadow: rgb(204, 204, 204) 0px 0px 6px; padding: 7px;" width="320" /></span></a></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px; text-align: center;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"><br /></span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;">1. ไปที่ File > Save as จะปรากฎหน้าต่างดังรูปด้านล่าง</span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px;">
</div>
<ul style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px; margin: 0.5em 0px; padding: 0px 2.5em; text-align: center;">
<li style="border: none; list-style-position: outside; list-style-type: circle; margin: 0px 0px 0.25em; padding: 0px;"><span style="color: black; font-family: verdana, sans-serif; font-size: small;">ช่อง File name คือให้เราตั้งชื่องาน</span></li>
<li style="border: none; list-style-position: outside; list-style-type: circle; margin: 0px 0px 0.25em; padding: 0px;"><span style="color: black; font-family: verdana, sans-serif; font-size: small;">ช่อง Format คือ การบันทึกไฟล์งานประเภทต่างๆ เช่น PSD , JPEG , TIFF และอื่นๆ </span></li>
<li style="border: none; list-style-position: outside; list-style-type: circle; margin: 0px 0px 0.25em; padding: 0px;"><span style="color: black; font-family: verdana, sans-serif; font-size: small;">เมื่อเลือกเสร็จเรียบร้อยแล้ว กด Save ก็จะทำการบันทึกสำเร็จ</span></li>
</ul>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 21.3333px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"><br style="line-height: 20.79px; text-align: center;" /></span></div>
<div style="background-color: white; clear: both; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 20.79px; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXGXhJ5S6ro0QvDlwm1soXSUZ54D3Say0Syb1h3EB94keW-6VChGL6StRTcNjigZSZ1uCI7iRDGQvQvRiFNTtDnk_RoG7TqrZNV5Xxj_HEGdVG1_g0EpYviTmVyXF8xRgRfsel2GD509Wj/s1600/666.PNG" imageanchor="1" rel="nofollow" style="background: none; border-bottom: none; color: #8a8c50; margin-left: 1em; margin-right: 1em;"><span style="color: black; font-family: verdana, sans-serif; font-size: small;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXGXhJ5S6ro0QvDlwm1soXSUZ54D3Say0Syb1h3EB94keW-6VChGL6StRTcNjigZSZ1uCI7iRDGQvQvRiFNTtDnk_RoG7TqrZNV5Xxj_HEGdVG1_g0EpYviTmVyXF8xRgRfsel2GD509Wj/s1600/666.PNG" style="border-color: rgb(204, 204, 204) rgb(153, 153, 153) rgb(153, 153, 153) rgb(204, 204, 204); border-image: initial; border-radius: 5px; border-style: solid; border-width: 1px; box-shadow: rgb(204, 204, 204) 0px 0px 6px; padding: 7px;" width="292" /></span></a></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 21.3333px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"><span style="line-height: 18px;"><br /></span></span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black;"><span style="font-family: verdana, sans-serif; font-size: small;"><br /></span></span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black;"><span style="font-family: verdana, sans-serif; font-size: small;"><br /></span></span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;">โปรแกรมที่จะใช้สำหรับสร้างเว็บไซต์ ในที่นี้จะสอนวิธีการสร้างด้วยโปรแกรม Dreamwaver และตกแต่งด้วย Photoshop ซึ่งมีคุณสมบัติในการตกแต่งรูปภาพ สร้างไอคอน หรืออื่นๆ ที่มีความสวยงาม จะงามมากงามน้อยขึ้นอยู่กับผู้สร้างนะค้า</span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;">ก่อนอื่นเราต้องไปดีไซต์หัวเว็บก่อน (Heading) ก่อนที่จะดีไซต์เราต้องไปจัดหาโปรแกรมเสียก่อนนะคะ จะเวอร์ชั่นไหนก็ได้ ถ้าใช้งานพื้นฐาน ก็จะคล้ายๆ กัน</span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<br /></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;">เปิดโปรแกรม Photoshop</span></div>
<ul style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<li style="list-style-position: outside; list-style-type: circle;"><span style="color: black; font-family: verdana, sans-serif; font-size: small;">สร้างพื้นที่ทำงานโดยคลิกที่ File > New</span></li>
<li style="list-style-position: outside; list-style-type: circle;"><span style="color: black; font-family: verdana, sans-serif; font-size: small;">กำหนดขนาดพื้นที่ทำงาน (หัวเว็บ)</span></li>
<li style="list-style-position: outside; list-style-type: circle;"><span style="color: black; font-family: verdana, sans-serif; font-size: small;">Width คือความกว้างของหัวเว็บ ถ้าต้องการสร้างเว็บที่มีขนาดเต็มหน้าจอ ก็ประมาณ 980 pixels / Height คือความสูงของหัวเว็บ ประมาณ 140, 150, 160 pixels</span></li>
<li style="list-style-position: outside; list-style-type: circle;"><span style="color: black; font-family: verdana, sans-serif; font-size: small;">Color Mode เลือก RGB (สำหรับนำไฟล์แสดงผลทางหน้าจอคอมพิวเตอร์)</span></li>
<li style="list-style-position: outside; list-style-type: circle;"><span style="color: black; font-family: verdana, sans-serif; font-size: small;">Background Contents รูปแบบพื้นที่ทำงาน ถ้าเลือก White คือพื้นสีขาว</span></li>
<li style="list-style-position: outside; list-style-type: circle;"><span style="color: black; font-family: verdana, sans-serif; font-size: small;">OK</span></li>
</ul>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"><img height="186" src="http://www.oknation.net/blog/home/blog_data/445/14445/images/1.gif" style="display: block; margin-left: auto; margin-right: auto; max-width: 427px; text-align: center;" width="320" /></span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"><br /></span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;">เมื่อได้พื้นที่ทำงานแล้ว ขั้นตอนต่อไป เป็นการออกแบบหัวเว็บ</span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"><br /></span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"><img height="230" src="http://www.oknation.net/blog/home/blog_data/445/14445/images/2.gif" style="display: block; margin-left: auto; margin-right: auto; max-width: 427px; text-align: center;" width="320" /></span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"><br /></span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;">อธิบายตามหมายเลขนะคะ</span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;">1. เลือกสีที่จะผสมในช่องสีเหลี่ยมด้านบนและด้านล่าง (Forground / Background) ถ้าไม่ผสมก็จะได้สีแค่สีเดียว</span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;">2.คลิกเครื่องมือ Grandent Tool (นำเมาส์ชี้ค้างที่เครื่องมือ ก็จะมีชื่อเครื่องมือปรากฎขึ้นมา)</span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;">3.คลิกเมาส์ลากลงบนบริเวณพื้นที่ทำงาน มีรูปแบบให้เลือก 5 แบบ (จะนำภาพมาลงภายหลัง)</span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;">3.1 ข้ามไป 1 ขั้นตอนคือการพิมพ์ข้อความ ขออภัยค่ะ ให้คลิกที่ เครื่องมือรูปตัว T (Type Tool)</span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;">3.2 คลิกที่บริเวณพื้นที่ทำงานและพิมพ์ข้อความที่ต้องการลงไป</span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;">4. ตกแต่งใส่สีเส้น หรือเงา โดยคลิกที่ Effect (ตัว F เล็กๆ)</span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;">5.คลิก เครื่องหมายถูกที่ช่องสุดท้ายคือสีเส้น (Storke) อันอื่นๆ ลองคลิกดูได้ค่ะ บนสุดจะเป็นเงา (Drop Shadow)</span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;">6. ใส่สีเส้นที่ช่องหมายเลข 6 ขนาดเส้นที่ช่อง Size เลขเยอะ แปลว่าเส้นยิ่งหนา</span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;">7.OK</span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"><br /></span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"><img height="132" src="http://www.oknation.net/blog/home/blog_data/445/14445/images/3.gif" style="display: block; margin-left: auto; margin-right: auto; max-width: 427px; text-align: center;" width="320" /></span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"><br /></span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"><br /></span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;">การบันทึกงานที่สร้าง</span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;">1. คลิกเมนู File > Save For Web</span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;">2. คลิกเลือกประเภทไฟล์ (นามสกุล) ถ้าเป็นภาพปกติ JPEG ถ้าเป็นภาพเคลื่อนไหวได้ GIF</span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;">(วันหลังจะอธิบายความหมายของประเภทไฟล์ แต่ละประเภท)</span></div>
<div style="background-color: white; color: #444444; font-family: Arial, Verdana, sans-serif; font-size: 13.3333px; line-height: 18px;">
<span style="color: black; font-family: verdana, sans-serif; font-size: small;">3.OK</span></div>
<div>
<span style="color: black; font-family: verdana, sans-serif; font-size: small;"><br /></span></div>
การออกแบบเเละพัฒนาเว็บไซต์http://www.blogger.com/profile/09284739676133932227noreply@blogger.com