1 / 14

Basic Web Design Using Dreamweaver

Basic Web Design Using Dreamweaver. Robby Seitz 121 Powers Hall 915-7822 rseitz@olemiss.edu. Basic Web Design. What is the easiest way to build or update a Web page? Get someone else do it for you. What can you give someone to help them build a good Web page for you? Money.

honora
Télécharger la présentation

Basic Web Design Using Dreamweaver

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Basic Web Design Using Dreamweaver Robby Seitz 121 Powers Hall 915-7822 rseitz@olemiss.edu

  2. Basic Web Design • What is the easiest way to build or update a Web page? Get someone else do it for you. • What can you give someone to help them build a good Web page for you? Money.

  3. Methods Compared .

  4. HTML Basics • Hyper-Text Markup Language • Don’t worry, we have handouts!(Source: www.addedbytes.com/cheat-sheets/html-cheat-sheet/)

  5. HTML Basics Markup Tags - Nesting • Open, surround, close <tag attribute=“value”…>stuff</tag><a href=“http://www.olemiss.edu”>Link</a><p>This is my very short paragraph.</p> • Empty or self-closing <img src=“mypic.jpg” /><br />

  6. HTML Basics Spacing doesn’t matter (much), but indentation helps show nesting. <html> <head> <title>Robby’s Page</title> </head> <body> This is a picture of my cat, Lou.<br /> <imgsrc=“mycat.jpg” /> </body> </html>

  7. HTML Basics

  8. Web Concepts Expect viewers to see things differently. Obstacles to consistent page rendering include: • Different browser versions • Different screen resolutions • Different accessibility needs • Different mobile devices

  9. Web Concepts Keep layout and content as separate as possible. • Content – Information and its contextual meaning. • Layout – The format and arrangement of information.

  10. Basic Dreamweaver Parts of the screen • Top menu: File, Edit, View… • Top toolbar: Common, Layout, Forms…

  11. Basic Dreamweaver Parts of the screen • Tabs: Document names • Code/Design views • File Transfer, Validation

  12. Basic Dreamweaver Parts of the screen • Tag Selector • Properties window:Format, Style, Align…

  13. Basic Dreamweaver Parts of the screen • Windows on right side: Files, CSS…

  14. Basic Web Design Using Dreamweaver www.dreamweaver.com Robby Seitz 121 Powers Hall 915-7822 rseitz@olemiss.edu

More Related