Website Design by lonyoo


									Website Design
    Michele Beisler

  2006 FIRST Robotics
   Competition Kickoff

    January 7, 2006
 Site Planning
 Visual Design
 Using Graphics and   Pictures
 Bells andWhistles
 Technical Information
            Site Planning
 Determine site goals
 Analyze your audience
 Analyze the “competition”
 Know your own abilities and resources
 Site Map
      Site Goals and Guidelines
 Why are  you creating this site?
 What do you hope to achieve with this site?
 What action do you want the audience to
  take as a result of visiting?
 What restrictions or guidelines must be
  followed when designing the site?
     FIRST Robotics
     Your School
               Audience Analysis
   Who are you trying to reach?
       Age
       Language and Culture
       Level of education
       Access to Web (High-speed? Dial-up?)
       Familiarity with the Web
   What are they looking for at your site?
       Information
       Services          Are there multiple
       Community            audiences?
      Analyze the “Competition”
 Look at   sites with similar content
     FIRST Robotics Teams
 Where do    they excel or fall short
     FIRST Robotics Teams web site design
      award winners
        Know Resources & Abilities
 What technical knowledge does your team have?
 What tools and resources does your team have
  access to?
       TIME
       Software
         • Web authoring tools
         • Image editing tools
         • Animation tools
       Hardware
         • Camera
       Other People
                  Site Map
 All thepages and all the links of the
  current site
 Boxes for pages, lines for links
 Shows how “deep” your site is

      Home   Members
                         2004   Media Day
                         2005   Competition
   Visual Design

     What looks good?

is a good goal for any design
        Elements of Visual Design
   Composition
       White Space
         • Avoid “information overload” syndrome
         • Helps readers scan/find info quickly
   Color
       Make websites easy on the eyes
   Fonts
       Use common fonts
       Limit number of fonts per page and per site
       Use the same fonts consistently throughout the site
   Motion
       Coolness factor if not overdone
       Use to enhance content
  Using Graphics and Pictures
 Make your   site more attractive
 Keep picture file size small to keep page
  loading time short
 Use file types of .jpg and .gif
            Bells and Whistles
 Flash Animation
     Special software needed to create files
 Counters
     Keeps track of number of hits to your site
     Check with your Web host server for
     Search for free counters online
 Sound
     Adds another dimension to your site
       Web Site Examples
 Regional Award   Winners

 Championship Award Winner
       Technical Information
Steps to getting website online
 Domain name
 Web hosting
 Website creation software
 Uploading your site
                Domain Name
 Free domain name
     Sub domain name of existing site
       • Example:!-ID
     Register unique domain name for $8 to $25
      per year
     Choose from .com, .net, .org, .biz, .info, .us
     Search internet to select company to work
       • Example:    $7.95/yr domain reg
                  Web Hosting
       web hosting service – Here is
 Find a
 where your website will reside
     Free
       • Size limitations
       • May be hidden costs
       • Advertising on your site
     Private
       • Costs vary from $10+ per month
       • No unwanted advertising
       • More disk space
         Free Web Hosting
 Oryou can search for free web hosting
 here –
        Web Creation Software
 Most Popular
     Microsoft Front Page
     Macromedia Dreamweaver
 Free web     creation software
     Search the Internet
 Online Templates
     Usually costs money
     Search the Internet for options
         Uploading Your Site
 Send files to web hosting server
 Final step in website creation
 Check site online to make sure it looks
  and works the way you want it to
 Plan your    website ahead of time
     Make it easy to understand and navigate
     Make it easy on eye and the brain
     The better the planning up front, the easier it
      will be to create your site
 Get a domain name and web hosting
 Build and upload your website
     Don’t forget to update and improve your site
      over time

To top