1 / 13

What makes a website?

What makes a website?. Comprised of interlinked Web pages Typically begins with a home page Titled sitename / index.html Contained under a home directory Built using XHTML & CSS

cathy
Download Presentation

What makes a website?

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. What makes a website? • Comprised of interlinked Web pages • Typically begins with a home page • Titled sitename/index.html • Contained under a home directory • Built using XHTML & CSS • Extensive Hypertext Markup Language – tells the browser (Firefox, etc.) what content to display and its hierarchy • Cascading Style Sheets – manages the appearance of the site (colors, fonts, sizes, etc.)

  2. Under the hood • To view the XHTML, select • Tools  • Web Developer  • Page Source • To view the CSS, select • Tools  • Web Developer  • Style editor • Tags make websites work Rule #1: ALL TAGS MUST HAVE AN OPENING AND A CLOSING!

  3. Appears in the browser tab Links to the CSS to control the page layout Controls headlines Controls the tabs Paragraph text Controls links

  4. Notes – not visible to user Defines background color, font, size, and font color for body Defines all attributes for all text in h1 tags

  5. Why dreamweaver? • Ease & efficiency • Don’t have to know all the code • Can view your work as a Web page as you go • Lots of shortcuts • Consistency • Create pages from templates you have already used • Create pages from suggested templates • Easy management • Groups files • Easier to update/change

  6. Cons to dreamweaver • Cost • Can be confusing • Difficult to understand all tools without some knowledge of coding

  7. Basic web page elements • Text • Any words, sentences, paragraphs used on your site • Images • Photos • Graphics • Multimedia • Widgets • Hyperlinks • Links to other pages • Internal links • Navigation menu

  8. Step one: defining your website • You are setting up your ROOT DIRECTORY • The main directory that houses all files for your website • Lets Dreamweaver know what pages, images, documents, and CSS files are attached to your website • You must define a new website for every different project you work on • In class, you will work on a practice website; outside of class, you will create your own

  9. Step one: defining your website • Open Dreamweaver • A prompt with options should pop up • Select “new site” or “Dreamweaver site” • Enter 335 Practice Site as the name of the site • Click the folder icon & save to your personal server (P: drive)

  10. Step two: creating the home page • Go to File  New • Select Blank Page  HTML  <none> • Save the file to your root folder • Title it index (no capitalization or spaces)

  11. Step 3: entering text • Three views for your site: • Code • Split (code & design) • Design • Enter site title “CMAT 335” between <title> tags • Type in between <body> tags • Refresh & view in design tab

  12. Adding text • Always first type your text in Word document • Checks for spelling • Allows you another storage space • Copy & paste from document into site • Paste special allows you to keep some formatting • Text with structure plus full formatting

  13. Your website • An online portfolio • Should have: • Index page (homepage) with photo & brief introduction • About me page (brief bio & photo) • Work experience page • Interests page

More Related