Web design
Upcoming SlideShare
Loading in...5

Web design







Total Views
Views on SlideShare
Embed Views



0 Embeds 0

No embeds



Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
Post Comment
Edit your comment
  • Common tags

Web design Presentation Transcript

  • 1. Presented by: Susan Campagnone Cora Ganun Monika Kerby
  • 2. History
    • Computer technology advancements
    • 1982 Internet Protocol Suite (TCP/IP)
      • World-wide network - Internet
    • Business world and culture changed
    • Company survival
    • Business growth opportunities
  • 3. Getting Started Construction: Web Browser Reads the HTML documents and converts them into a visual web page Personal web address Register with a domain name -> Hire a web host -> Access web host to make updates
  • 4. Basics H yper T ext M arkup L anguage (HTML) Building block language: Markup language Contains elements called tags Opening < and closing > Element content space between tags is where images, text, and tables are inserted <b> this text will be bold </b> <i> this text will be italic </i> <u> this text will be underscored </u>
  • 5. Elements
    • HTML documents are defined by HTML elements
    • An element represents specific meaning
    <html> <body> <p> We attend Johnson & Wales. </p> </body> </html>
  • 6. Headers
    • Header tags tell what the page is about
    • Vary from size
    We attend Johnson & Wales. [H1] <h1>We attend Johnson & Wales. [H1]</h1> We attend Johnson & Wales. [H2] <h2>We attend Johnson & Wales. [H2]</h2> We attend Johnson & Wales. [H3] <h3>We attend Johnson 7 Wales. [H3]</h3>
  • 7. Fonts
    • Not every font is supported by browsers/computers
    Five Generic Font Families Serif versus sans-serif Hex Values <style type=&quot;text/css&quot;> body {font-family:sans-serif; font-size:15pt; color:#FFFFFF} </style>
  • 8. Background
    • Must complement web page
    • Can be either color or image
    Background Image: Background Color: <style type=&quot;text/css&quot;> body {background; (&quot;http://URL.com &quot;)} </style> <style type=&quot;text/css&quot;> body {background-color: #FFFFFF} </style>
  • 9. Images
    • Images interpreted faster than text
    • Integrate with the webpage design
    Upload image on web server/directory -> Include image tag <img src=&quot;URL&quot; alt=&quot;alternate text&quot; width=&quot;width&quot; height=&quot;height&quot; />
  • 10. Links
    • System of hypertext documents connected by links
    • Absolute Link to an external web site
    • Relative Link to a page in internal site
    • Mailto Link to email address
    • Named/Internal Point to a specific area of a web page
    <a href=“http://www.puppyplace.com”>Click Here</a>
  • 11. Bullets and Numbers
    • Clear and quick points
    • Displayed in a particular order
    • Unordered List Bullet Points: <ul> or Numbers: <ol>
    • List Item <li>
      • List items appear on webpage marked with bullet points/numbers
    • Apples
    • Oranges
    • Apples
    • Oranges
    <ul> <li>Apples</li> <li>Oranges</li> </ul> <ol> <li>Apples</li> <li>Oranges</li> </ol>
  • 12. Effective Websites
    • Easy to the eye
    • Colors complement
    • Compact and focuses on intended message
    • Can make or break a customer
  • 13. Ineffective
  • 14. Effective
  • 15. Ineffective
  • 16. Effective
  • 17. Presented by: Susan Campagnone Cora Ganun Monika Kerby