สำรวจความพร้อมของเรากันสักนิด
# คอมพิวเตอร์ติดตั้งโปรแกรม DREAMWEAVER 8 เรียบร้อย
# มีอินเตอร์เน็ตสำหรับการค้นหาข้อมูลและภาพประกอบ
# คุณสมบัติของผู้ที่จะทำ ใจรักมีความสนใจ มีความรู้พื้นฐานคอมพิวเตอร์ใช้งานอินเตอร์เน็ตเป็น (ประมาณนี้คงพอแล้วมั่ง )
ขั้นตอนแบบ step by step (การกำหนด Local site) ก็คือโฟลดอร์ในเครื่องที่จะเก็บข้อมูลเว็บไซต์เรานั้นเอง
1 เปิดโปรแกรม DREAMWEAVER ขึ้นมาตามภาพ จากนั้นไปที่เมนู site >> New Site
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEioElw8XFHA5w5fCI1WK-RABxI0BTijk8CoJL94-OWb7rNEAQhd2CGBxcbO68rKtM2noPHeGRQEzMPyqOXS4tJnFD6QG9C2HeXFuKCkmr0s3bChx4vbe0adQBxxEvKwUjBFEDSAG0ylNQM/s320/dw01.gif)
2 กำหนดชื่อของเว็บไซต์ ตามตัวอยางผมใส่ Golopburi ,และช่อง http address (ชื่อของเว็บเราแบบทางการที่จะให้ผู้ใช้งานเข้ามาดู) ให้เรากรอกเข้าไปตามโดมนเนมที่เรามีอยู่ แต่ถ้าไม่มีหรือยังไม่ได้จด ก็คลิก Next ต่อไปได้เลย
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUc6YPV-HPH_emQu4WZCfHd98dq3hCcyTF3VGAfOjMlfJl_5HupQFGTUDsqDcxLHTy1ovcDDx5I7QYxQBvKS4PvQ0vm_Xnem_TmW0uhH_Rw-EhtJfD6rqVCFErsZY8WFoV1sIqD1nHFtk/s320/dw02.gif)
3 ในขั้นตอนนี้ให้เราคลิก Next ต่อไปได้เลยครับ
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEbmeo11_lgVBMFIYSUhXzp5DxcadKoAKnvz2n1yC3P-7iY_kneTfTAqIHtDYmxhJPVBwAy3mZcQfUH3T3rWvvnF0byHZlQ6GXnvOdAyqXBrcUWh_9leWWArlhsM01F_LdV3DCc1Q28Yk/s320/dw03.gif)
4 การกำหนดเส้นทางทีจะไปยังโฟลเดอร์ที่จะเก็บข้อมูลของเรา ให้คลิกสัญญลักษณ์แฟ้ม เพื่อเข้าไปเลือก หรือสร้างโฟลเดอร์รองรับข้อมูลเว็บไซต์ของเรา ตามตัวอย่างผมกำหนดไว้ที่ไดร์ฟ c:\Golopburi ,จากนั้นคลิก Next
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLP47GMgucc-KB1GvccDdClaLrO7KnO47qI-GTx_squcI92rGCL1284eSQBkn1exiIkI_k8g48hN5fH2VO1OytJLtdhDLflAaR2uFf8A_yXXCttE-MFKSImwUG5drn44gfH2hrVGGZkRY/s320/dw04.gif)
5 จะถามเกี่ยวกับ Host FTP สำหรับให้เรา upload ไฟล์ข้อมูลขึ้นไปเพื่อให้แสดงบนอินเตอร์เน็ต ถ้าเรายังไม่มีข้อมูลเว็บโฮสต์ในขั้นตอนนี้ ก็เลือก None ,และคลิก Next ผ่านไปก่อน แล้วเราค่อยมากำหนดทีหลังได้
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfGCj98uQg3Bod44qUyOvDVpTxJnGp4M0aC2EM2VAYNv_ehwxPzPXrPVlgxG_PVY-q8Zs9KNAl9ghZ_XcpEeu-EDLypss9n2doornl-3aEqV5pCw_iMZpHEgeDQL9UaJFM36l9pVEOG64/s320/dw05.gif)
6 ภาพแสดงข้อมูลการกำหนดค่า Local site ของเราเสร็จเรียบร้อย ,คลิก Done
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiW4BdtMYicY9SI7CgwUteVW9RPAI8XF2cPq3EJpe4132U4o7oZ4qGLUWFfn105yfOw47mOHy7jK-SzWM8gUEagd3q8nqh2ZfeGVujCtuo7ki66qURSwYYgEhRNK2ceruTz9XIqwsA5zTk/s320/dw06.gif)
7 การสร้างหน้าแรกของเว็บไซต์ ให้ไปที่เมนู File>> New
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgR4pVpjLBvqllBcTu113SIUJo1QilHMnpg5gh7HNy9kt0Q3ZuKxdj8CjnWJ4lGpq_P7e_9ebOQMke_ujXZRIWOi98oIx04NgCkUATF0gOMjYd_gkQqfw9yTLwm08pMYDb2ZcbDbwLDSkc/s320/dw07.gif)
8 ให้เลือก Page Design(CSS) ,Halo Left Nev ตามภาพตัวอย่าง ,คลิก Create
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgE0LPTMsXtLgVD3MwKS6J-ChOdZdOwKDxDv8YSy8wc1KOt6kST-dURxU5sTSm0Q3niiVi1sGFKRE_LX9knplMhLRDvdOs5FjuTo5c4NmT23HrrqSggAwuRuIXeNy4CEfLeNw2aAF9nISU/s320/dw08.gif)
9 จะให้เราบันทึกซื่อไฟล์ ให้เรากำหนดเป็น index ,คลิก save
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhk2cy7891AXg5cOtsXvG7_GVltqtlUnC_hvXF-gL-r6QaJdkaR4N62_ubOcvwt9HJ5Wv9Ifx6bAjkG1tZ1dYppNrX1Owwtb8g8XqulkT3OMtul1Fz0Q1a6FkYoxC-2lUt1ZqWxwMTYgE/s320/dw09.gif)
10 รูปแบบไฟล์ที่เราเลือกต้องการส่วนประกอบเพิ่มเติม เพื่อการทำงานที่ถูกต้อง ให้เราคลิก Copy ได้เลยครับ
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoD4ZWxYSxfgXKxlG37raXZdVcmlVhf4_dS9ywfCdaNoWXMPtz1CrBT_bO8T9zxlnAlXkzCdc7QGpFkJ-aCOlBWc6KpX-qtCif82Xc_B9axAXWPvcdCPScij938L21k3DV8mQ43A_9cws/s320/dw10.gif)
11 ถ้าเราทำถูกต้องเราก็ควรจะได้ภาพหน้าตาของไฟล์ index ที่เราพึ่งกำหนดขึ้นมาตามภาพ เป็นการจบการสร้างเว็บไซต์ด้วยตัวเองในบทที่ 1 ครับ สำหรับบทต่อไป ผมจะได้มาแนะนำการเปลี่ยนแปลงข้อความ เมนู ภาพและอค์ประกอบอื่นๆ ของหน้าเว็บเพจนี้ให้เป็นตามที่เราต้องการ อย่าลืมติดตามบทตอไปนะครับ
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEm1dH7uGBkPZlNPa6BjppjA7G8mgI-_3LPfQDLYuHxDupaz_-duh0G_gOGwopNwHtCeFT__sYGuM9qs_kLSgwX-XcknyewQmM9m0260Sv9e1BItQd3jFG6p5q5OoTz0VRLP0fPSK_k6E/s320/dw12.gif)
No comments:
Post a Comment