Mr.Warawut KhangkhanFacebook: http://www.facebook.com/AjWarawut           Twitter: http://twitter.com/awarawut            ...
F                                           F                           F           F                       F         F   ...
Mr.Warawut Khangkhan   2   F   3
F      F F                              F                F                  F           F   F       F   F            F    ...
F (Cont.)                               F F F                                       F                        F            ...
F (Cont.)                            F               F                 F                         F     F F           F    ...
Mr.Warawut Khangkhan   2   F   7
F                 F       F         F F F                F       F             F                  F F       F             ...
F           F       F                           F                           F                       F                     ...
F              waterfall model                                                   F                                       F...
F              waterfall model                                        F                                            F      ...
F              waterfall model                                            F                                               ...
F              waterfall model                                                   F                                        ...
F              waterfall model                                                   F                                   F    ...
Mr.Warawut Khangkhan   2   F   15
F           F                                               F                F           F               F       •   F    ...
F                     F         F     F         F                             F             F                         F F ...
F                 F               F         F F F                     F       F           F             F           F     ...
F             F    FMr.Warawut Khangkhan       2   F   19
Mr.Warawut Khangkhan   2   F   20
F                  F 1.           F       (Simplicity)                                   F F                       F      ...
F                    F 2.                             (Consistency)                                     F F               ...
F                                F 5.                                          F    F     (User-Friendly Navigation)      ...
F                        F 7.                 F               F        F       F          (Compatibility)                 ...
F                           F 9.                                F                      F   (Functional Stability)         ...
F                    F 12. F                     F       F               (New/Press Releases)                      F    F ...
http://www.adobe.com/solutions/professionalvideo/Mr.Warawut Khangkhan   2   F                                            27
Mr.Warawut Khangkhan   2   F   28
F 1.                  F (Web Master) 2.          F          F F (Information Architect) 3.               F (Web Designer) ...
1.                                                F (Web Master)          F                       F F                     ...
2. F                               F           F                         (InformationArchitect)           F           F   ...
3.                         F (Web Designer)           F           F            F               F           F              ...
4.                             F (Web Programmer)           F           F             F   F     F F                   F F ...
5. F                        (System Administrator)           F                   F   F       F   F   F   F    F           ...
6. F                               (Content Editor /Writer)               F                                    F          ...
Mr.Warawut Khangkhan   2   F   36
F             F            F                (Sequence)            F              (Hierarchy)            F               (W...
F                               (Sequence)                   F                       F         F F   F      Website   F   ...
F                    (Sequence)          F          F                 Sequence                  F      F Search Engine F  ...
F -F                        F  F                                          F                                               ...
F                   (Hierarchy)                                                      F   F     F F                   F    ...
F                               (Hierarchy)       F F                         F           F F       F F         F    Page ...
F -F                              FF                                             F     F F                    F           ...
F                            (Web)                                   F                 F   F       FF       F          F  ...
F -F                                       F  F                                                              F            ...
Mr.Warawut Khangkhan   2   F   46
F                                   1.                                    2.                              3.              ...
1.                            F F F                                                              F           F            ...
1.                    (Strategy)                              F             F       F F F                          F F    ...
3.                              (Assumption)                                           F       F   F                      ...
2.                                                        F                    F             F F                          ...
3.                                 F       F      F     F F                                                F       F FF   ...
F                                                       F         F              .                   F           F F      ...
F                                                                       F       F                F   F                    ...
F   FF   F   F   F   F   55
4.                                                                F                          F       F               F    ...
4.                                                                           F                       F               F    ...
5. F                             F       (Site Map)             F                         F                 F         F   ...
6.                    F                  F                                           F                      F             ...
Mr.Warawut Khangkhan   2   F   60
7. F                                   F         F                       F       F               F     F F          F     ...
8.                                                   F                                             F                      ...
9.                                   F                        F        F             F       F         F   F      F       ...
Mr.Warawut Khangkhan   2   F   64
F 1.           F               F         F                           –                    F                          F    ...
F 4.                      F               F                 F           (URL) –                            F              ...
F 6.                                      F                           –               F                          F        ...
F 9.      F       F           F                  F           –               F          F                         F 10.   ...
Mr.Warawut Khangkhan   1   F   F   F   69
Web Site              F        F                      . (2554).               .F      F    7   , 2554,    http://dit.dru.a...
Book                       . (2554).        F                                        :       .   :                F       ...
Upcoming SlideShare
Loading in …5
×

การออกแบบและพัฒนาเว็บไซต์

958 views

Published on

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

Published in: Education, Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
958
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
28
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

การออกแบบและพัฒนาเว็บไซต์

  1. 1. Mr.Warawut KhangkhanFacebook: http://www.facebook.com/AjWarawut Twitter: http://twitter.com/awarawut E-Mail: awarawut@hotmail.com Mobile: 089-461-9591
  2. 2. F F F F F F F F F F F FMr.Warawut Khangkhan 2 F 2
  3. 3. Mr.Warawut Khangkhan 2 F 3
  4. 4. F F F F F F F F F F F F F FMr.Warawut Khangkhan 2 F 4
  5. 5. F (Cont.) F F F F F F F F F F F F F F F F F F F F F F F F Plug-in F F F F F F F F F F F F F F F F F F F F F FMr.Warawut Khangkhan 2 F 5
  6. 6. F (Cont.) F F F F F F F F Search Engine F F F F F F F F F F F F F F F F F F F F F FMr.Warawut Khangkhan 2 F 6
  7. 7. Mr.Warawut Khangkhan 2 F 7
  8. 8. F F F F F F F F F F F F F (Software Development Life Cycle: SDLC) Waterfall ModelMr.Warawut Khangkhan 2 F 8
  9. 9. F F F F F F F F F F F F FMr.Warawut Khangkhan 2 F F 9
  10. 10. F waterfall model F F F F F • (Feasibility) F F F F F F F F F • F FMr.Warawut Khangkhan 2 F 10
  11. 11. F waterfall model F F F F • (Analysis) F F F • F F F F • F F F F FMr.Warawut Khangkhan 2 F 11
  12. 12. F waterfall model F F F( • F F (Design) F F F F ) • HTML CSS F F JavaScript F F F F Adobe Dreamweaver F F FMr.Warawut Khangkhan 2 F • F F F 12
  13. 13. F waterfall model F F F F F • HTML CSS F JavaScript (Construction and Testing) F F F F F Adobe F F Dreamweaver Flash F F • F F F • FMr.Warawut Khangkhan 2 F F internet 13
  14. 14. F waterfall model F F F F • FTP (Launch) F F F F F F F F • F (Maintenance) FMr.Warawut Khangkhan 2 F 14
  15. 15. Mr.Warawut Khangkhan 2 F 15
  16. 16. F F F F F F • F F F F F F F • F F F F F F F F F F F F F F F PhotoShop F F F • FMr.Warawut Khangkhan 2 F 16
  17. 17. F F F F F F F F F FMr.Warawut Khangkhan 2 F 17
  18. 18. F F F F F F F F F F F F F F F PhotoShop FMr.Warawut Khangkhan 2 F 18
  19. 19. F F FMr.Warawut Khangkhan 2 F 19
  20. 20. Mr.Warawut Khangkhan 2 F 20
  21. 21. F F 1. F (Simplicity) F F F F F FMr.Warawut Khangkhan 2 F 21
  22. 22. F F 2. (Consistency) F F F 3. F (Identity) F F F F F F 4. F (Useful Content) F F F F F F F F F F F F F F F F F F FMr.Warawut Khangkhan 2 F 22
  23. 23. F F 5. F F (User-Friendly Navigation) F F F F F F F F F F F F F F 6. F (Visual Appeal) F F F F F F F F F F F F F F F F FMr.Warawut Khangkhan 2 F 23
  24. 24. F F 7. F F F F (Compatibility) F F F FF F F F F F F F F F F F F F F F F F F 8. (Design Stability) F F F FF F F F F F F F F F FMr.Warawut Khangkhan 2 F 24
  25. 25. F F 9. F F (Functional Stability) F F F F F F F F 10. F (About the Company) F F F F F F F F F 11. F (Product Information) F F F F F F F F F F F F F F FF F F F F F FMr.Warawut Khangkhan 2 F 25
  26. 26. F F 12. F F F (New/Press Releases) F F F F F F F F 13. F F (Contact Information) F F F F F F F F F F 14. (Frequently Asked Question: FAQ) F F F F F FMr.Warawut Khangkhan 2 F 26
  27. 27. http://www.adobe.com/solutions/professionalvideo/Mr.Warawut Khangkhan 2 F 27
  28. 28. Mr.Warawut Khangkhan 2 F 28
  29. 29. F 1. F (Web Master) 2. F F F (Information Architect) 3. F (Web Designer) 4. F (Web Programmer) 5. F (System Administrator) 6. F (Content Editor / Writer)Mr.Warawut Khangkhan 2 F 29
  30. 30. 1. F (Web Master) F F F F F F F F F F F F F F F F F F F F F F F F F F F F F F F F F Protocol, URL, FTP, Image, Web Server DatabaseMr.Warawut Khangkhan 2 F 30
  31. 31. 2. F F F (InformationArchitect) F F F F F F F F F F F F F F F F F F F F F F (Site Map) F F F F F FMr.Warawut Khangkhan 2 F 31
  32. 32. 3. F (Web Designer) F F F F F F F F F F PhotoShop Illustrator F F F F F F Fireworks ImageReady F F F F F Dreamweaver F F F (Typography)Mr.Warawut Khangkhan 2 F 32
  33. 33. 4. F (Web Programmer) F F F F F F F F F F F F F F HTML (XHTML), DHTML, JavaScript, Cascading Style Sheets (CSS), Internet Protocol (IP), PHP, Database (DB) AJAX F F F Dreamweaver F F F F F F FTP F F FMr.Warawut Khangkhan 2 F 33
  34. 34. 5. F (System Administrator) F F F F F F F F F F Routing, Client/Server Programming F Tk, Perl Shell FMr.Warawut Khangkhan 2 F 34
  35. 35. 6. F (Content Editor /Writer) F F F F F F F F F F F F F F F F FMr.Warawut Khangkhan 2 F 35
  36. 36. Mr.Warawut Khangkhan 2 F 36
  37. 37. F F F (Sequence) F (Hierarchy) F (Web)Mr.Warawut Khangkhan 2 F 37
  38. 38. F (Sequence) F F F F F Website F F F F F F F Web F F F LinerMr.Warawut Khangkhan 2 F 38
  39. 39. F (Sequence) F F Sequence F F Search Engine F F Google.com, Yahoo.com Search Engine F F F F F Main Page F Detail Page F F F F Main Page F F F F F Detail Page F F F FMr.Warawut Khangkhan 2 F 39
  40. 40. F -F F F F F F F F F F F F F Search Engine F F F F F F F Page F Video on Demand F F F F F F F F F F F F F F F F F F FF F WebpageMr.Warawut Khangkhan 2 F F 40
  41. 41. F (Hierarchy) F F F F F F F F F F F F SequenceMr.Warawut Khangkhan 2 F 41
  42. 42. F (Hierarchy) F F F F F F F F Page F F F F F F F F F FMr.Warawut Khangkhan 2 F 42
  43. 43. F -F FF F F F F Link F F F F F F F F F F F F F F FF F F Back F F F F F Site Structure Sequence Design F F F F F F F Website 43
  44. 44. F (Web) F F F FF F F F F F F F F F F F F F FMr.Warawut Khangkhan 2 F 44
  45. 45. F -F F F F F F F F F F F F F F F F F F F F Website F F F F F F FF F F F F F F F Website FMr.Warawut Khangkhan 2 F 45
  46. 46. Mr.Warawut Khangkhan 2 F 46
  47. 47. F 1. 2. 3. F F 4. F 5. F F (Site Map) 6. F 7. F F F 8. F 9. FMr.Warawut Khangkhan 2 F 47
  48. 48. 1. F F F F F F F F F F F F F F F F F F F F F F F F F F F F F F FMr.Warawut Khangkhan 2 F 48
  49. 49. 1. (Strategy) F F F F F F F F F 2. F (Deliverable) F F FMr.Warawut Khangkhan 2 F 49
  50. 50. 3. (Assumption) F F F F F 4. (Scope Management) F F F F F F F F F F FMr.Warawut Khangkhan 2 F 50
  51. 51. 2. F F F F F F F F F F – F F F F F F F F – F F F F F F F F F F F F – F F F F F F F F F – F F F F F F F F FMr.Warawut Khangkhan 2 F 51
  52. 52. 3. F F F F F F F FF F F F F F F F FMr.Warawut Khangkhan 2 F 52
  53. 53. F F F . F F F F F F F . F F F . F F F F F F F F F F F F F FMr.Warawut Khangkhan 2 F 53
  54. 54. F F F F F F F F F F F F F (Index) . F . . F . F F F F . FMr.Warawut Khangkhan 2 F 54
  55. 55. F FF F F F F 55
  56. 56. 4. F F F F F F F F F F F F F F F F F F (Tree Structure) FMr.Warawut Khangkhan 2 F 56
  57. 57. 4. F F F F F F F F F FF F F F F F F F F F FMr.Warawut Khangkhan 2 F 57
  58. 58. 5. F F (Site Map) F F F F F FMr.Warawut Khangkhan 2 F 58
  59. 59. 6. F F F F F F F F F index.html F . F F F F F (Logo) . (Menu) F F F F FMr.Warawut Khangkhan 2 F 59
  60. 60. Mr.Warawut Khangkhan 2 F 60
  61. 61. 7. F F F F F F F F F F F F F HTML, PHP, ASP.NET Dreamweaver FMr.Warawut Khangkhan 2 F 61
  62. 62. 8. F F F F F F F F F F FMr.Warawut Khangkhan 2 F 62
  63. 63. 9. F F F F F F F F FTP F F F F FMr.Warawut Khangkhan 2 F 63
  64. 64. Mr.Warawut Khangkhan 2 F 64
  65. 65. F 1. F F F – F F F F F bookmark F url F F F F F F F F F F FF F F 2. F F – F FF F F F F F F F F F F F F F 3. F – F F F FF Scrolling Text, Blink Text, MarquessMr.Warawut Khangkhan 2 F 65
  66. 66. F 4. F F F (URL) – F F F F F F F F F F F F _, - ~ F F F F F F F 5. F F F F – F F F F F F F F Search Engine F F F F F F F F F F FF F F F F F F F F F FMr.Warawut Khangkhan 2 F 66
  67. 67. F 6. F – F F F F F F F F F F F 7. – F F F F F F F 8. F F F – F F F F F F F F F F F F F F F F F F F F F F F F F F F FMr.Warawut Khangkhan 2 F 67
  68. 68. F 9. F F F F – F F F 10. F – F F F F F F F F 15 F F F F F F FF F 8 F F F 90%Mr.Warawut Khangkhan 2 F 68
  69. 69. Mr.Warawut Khangkhan 1 F F F 69
  70. 70. Web Site F F . (2554). .F F 7 , 2554, http://dit.dru.ac.th/home/004/tachakorn/WEBDE/Ch apter2.pdf Thai WBI, Website. (2554). Web Site Design. F 20 , 2554, http://www.thaiwbi.com/course/WebDesign/index2.h tmlMr.Warawut Khangkhan 1 F F F 70
  71. 71. Book . (2554). F : . : F .Mr.Warawut Khangkhan 1 F F F 71

×