Essentials

1
Chapter 2
2
Essentials

• Designing your website
• Saving html files
• Default page
• Editing web pages
• Viewing edited work
• Organizing website files
• Inspiration of others

3
Designing Your Website

• Purpose of site
• Audience
• Message to convey
• Navigation
• Consistency
• For class intranet student sites
• Demo projects to grade
• Blog

4
Saving Your Page

• Save As
• Save As Type ALL FILES
• Add .html extension to the file name
• Notepad Wordpad
• All Files

5
Default Page

• Every folder (directory) in your website
• Lists its contents
• Unless it contains index.html
• Be sure to include an index.html file
• To give a starting page for common locations
• To keep people from browsing your folders
• Spelling must be exact
• Including lowercase/uppercase

6
Editing Your Page

• Open editor (notepad)
• File Open Browse to your file
• Or in Windows Explorer rt-click Open with
• Choose notepad
• After saved as .html (first time)
• No need to do SaveAs
• Just do File Save OFTEN

7
Viewing Edited Work

• To view changes
• Open html file in browser (Firefox)
• F5 to refresh
• No need to close notepad when updating
• Notepad file save
• Firefox F5
• Repeat as necessary

8
Organizing Website Files

• Websites that need organization
• Sites with more than a few (3-5) pages
• Sites with many images or other files
• Sites that may grow in the future plan ahead
• Sites with separate projects this means us!
• Keep file and folder names simple
• LowercaseAndUppercase or under_score
• Consistency is key

9
Organizing your WebDesign site

• Separate folders for
• Images
• Class projects
• Blog
• Other?
• Main menu on ALL pages (absolute address)
• Home (http//10.1.2.45/username)
• Projects (http//10.1.2.45/username/projects)
• Blog (http//10.1.2.45/username/blog)
• Others?

10
(No Transcript)
11
Inspiration of Others

• There are MANY
• Styles
• Formats
• Designs
• Organizational structures
• Find elements of other sites that you like
• Do borrow others ideas
• Not their content (dont steal code)

12
Essentials

• Designing your website
• Saving html files
• Default page
• Editing web pages
• Viewing edited work
• Organizing website files
• Inspiration of others