- Introduction to Web Design - Web Development Processes

Download - Introduction to Web Design - Web Development Processes

Post on 31-Dec-2015

25 views

Category:

Documents

0 download

DESCRIPTION

. . Internet for Education IT Web Design Web. - Introduction to Web Design - Web Development Processes. . . - PowerPoint PPT Presentation

TRANSCRIPT

  • INTERNET FOR EDUCATIONIT WEB DESIGN WEB- Introduction to Web Design- Web Development Processes*.

  • *

  • *

  • *

  • - - - - - - - - - - Plug in

    *

  • *

  • * (Simplicity) (Consistency)

  • * (Identity) (Useful Content)

  • * (User-Friendly Navigation) (Visual Appeal)

  • * (Compatibility) (Design Stability)

  • * (Functional Stability)

  • *www.apple.com ----

  • *Webmaster Information ArchitectDesigner HTML and JavaScript Coder

  • *Developer/Programmer System Administrator Content Editor/Writer

  • Dreamweaver,FrontPage ,GoLive ,Homesite ,HotDog Pro ,HotMetalPro , NetObjects Fusion HTML *

  • *

  • Information Architecture ( Final Architecture Plan ) *

  • (Information Architecture)

    *

  • *

  • , , , *

  • 1. 2. 3. 4. *

  • *

  • 3 1 () () () 2 1 ( ) 3 ( )

  • 3 3 //( ) () ( 74% 20% 6%)

  • a-z 0-9 Underscore ( _ ) Dash ( - ) tip_tricks.html ( tip tricks.html) how_to_write.html how2write.html Underscore Dash index HTML 2 .htm .html () index.html / Unix () Index.html index.html 2 bird.JPG, Bird.jpg bird.jpg 3

  • ... Head 64 Make a home with HTML : HTML (//) Make a home with HTML : HTML ............... (Keyword) Search Engine

    (Title bar)

  • Head Title Meta () (x y )

    (Keyword) (Description) Make a home with HTML : HTML

  • (//) Meta Head

  • 1. 2. 3. 4. 5.

    * 10

  • 6. 7. 8. 9. 10.

    * 10

  • 10 1. 2. 3. 4. (URL) 5. 6. *

  • 10 7. 8. 9. 10. *

  • WEB DEVELOPMENT PROCESSES*

  • *

  • 13 13 Phase 5 phase

    *

  • *

  • *

  • 13 Phase1: (Research)1. - - - - *

  • 13 2. - - - - (User Experience)- (Scenario)3. - -

    *

  • 13 Phase 2: (Site Content)4. -

    Powerbar(www.powerbar.com)*

  • 13 - (Repurposed Content)* www.cooktek.com

  • 13 4. ()- (Value Added Content)- 5. - - - *

  • 13 Phase 3: (Site Structure)6. - 7. - (Site Structure Listing) *

  • *Section 1Section 1.1Section 1.2Section 2Section 2.1Section 2.2Section 2.2.1Section 2.2.2Section 2.2.3Section 2.3Section 2.4Section 3

  • 13 - (Architectural Blueprint)

    *

  • 13 *- Site map www.jwt.com

  • 13 8. - (Site Flow) flow chart storyboard *

  • Site FlowPOTENTIAL USERS NONUSERS CURRENT USERS JOURNALISTS*HOMEProductsThe CompanyDownload &SupportPressCenterClickWise Walk-ThroughDownloadClickWise Company Contacts

  • 13 - (Navigation System) *- Peachpit Press(www.peachpit.com)

  • * (Content Inventory) (Draft Architectural Plan) (Site Structure Listing) (Architectural Blueprint) (Navigation System) (Organize) (Restructure) (Visualize) (Site Flow)

  • 13 Phase 4: (Visual Design)9. (Interface Design)- (Architectural Page Mock-up) -

    *

  • 13 - (Page Layout)- (Design Sketch)* 3

  • *

  • 13 10. - (Web-Based Prototype)- (Final Architecture Blueprint)- (Production Specification)- (Style Guide)*

  • 13 Phase 5 : (Production &Operation)11. (Production)- - (Final Interface)- (Web Template)

    *

  • * 3

  • 13 - -

    * 3

  • 13 12. (Launch)- (Usability) (Consistency and Accuracy) (Compatibility and Degradability)- (Promotion)*

  • 13 13. (Maintenance & Growth)- - - - *

  • 13 13 Phase 5 phase phase

    *

  • *

  • *

  • ENDQuestion ?*

    *