MAT153 Web Design 1 A Brief Overview of the Web Design Process.
Transcript of MAT153 Web Design 1 A Brief Overview of the Web Design Process.
WEB DESIGN WORKFLOW
MAT153 Web Design 1A Brief Overview of the Web Design Process
6 PHASES OF THE WEB DESIGN PROCESS Information Gathering Planning the Site Interface and Site Design Development of the Site Testing and Launch Site Maintenance
PURPOSE
All sites start as an idea Something to be accomplished Something to promote Something to share Someone to entertain Some news to broadcast Something to sell
GOALS
What is the goal of your web site? Sell stuff Sell yourself Tell a story Persuade people
TARGET AUDIENCE
Who will be your site visitor? What do these visitors expect? Does your target audience have certain
common characters? Income Age Interests Computer abilities
CONTENT
Content is the stuff of the site What do other sites in the same genre
offer? What do you have to offer? Start grouping your stuff into categories
PLANNING
Like anything you build, you need a plan Structure 3 to 7 Top-level categories Content is the stuff that goes into each
category Content can be words, images, sound,
multimedia
INTERFACE AND SITE DESIGN
Design is the pretty stuff that happens in Photoshop after all the initial planning is done Shapes Colors Proximity Form Typography
DEVELOPMENT OF THE SITE
Move from a pretty picture to an interactive web page using Dreamweaver Slice Export HTML Technologies
TESTING
Fill the site with content Words Image Multimedia
Is it working? What is working What is not
Fix it!
3, 2, 1 - LAUNCH
What is the benchmark for launch Not all content is necessary for launch Determine what is necessary What will be added later
Determine launch date Open the site to the public – Launch!
SITE MAINTENANCE
Change is all Eliminate that which is not working Make what is working more prominent and
easier to get to Fresh content is a must Targeted content is better Always be eager to reinvent your site
THE TOOLS OF THE TRADE
Information Gathering and Site Planning Microsoft Office Word Microsoft Office Excel
Interface Design Adobe Photoshop Adobe Bridge
Development of the Site Adobe Dreamweaver Adobe Flash Adobe Photoshop Adobe Bridge
Testing and Launch Web Browsers Adobe Device Central Dreamweaver Browser
Lab Site Maintenance
Analytics and Statistics Adobe Dreamweaver Adobe Photoshop Adobe Flash Adobe Bridge Adobe Contribute
WEB DESIGN WORKFLOWThank you for your attention!