Date post: | 25-Dec-2015 |
Category: |
Documents |
Upload: | dominick-tate |
View: | 232 times |
Download: | 3 times |
Creating A Simple Web Page
Step 1- Open Dreamweaver & Create A New Page (File New) and blank
Step 2- Create a Wrapper or Container For Your Site (Insert, Layout Objects, Div Tag)
THEN CLICK NEW CSS RULE
Step 3- Link The Div Tag & Create A New CSS File (Save too)
Step 4- Container CSS Summary(go to Box & Border)
• WIDTH: 960px• BORDER: Black all around• MARGIN: 0, auto, 0, auto
If you double click on the
CSSStyleSheet in the file view
you get this
Step 5- Now Save Your Page as “Index.html”
Step 6a- Go into the CSS Style Sheet And Add These Styles
HEADER (BANNER)
NAV
Step 6b- Go into the CSS Style Sheet And Add These Styles
FOOTER
TEXT SECTION
Step 7- Make sure index.html has the attached CSS Style Sheet to it (right click on page, CSSStyles, Attach)
Step 8- Do You Have This?
Step 9- Create The HTML Structure Using Div Tags (make sure named exactly as CSS Styles)
This structure will give you a header, left nav bar, a text
area and footer
Step 10- Have You Got This?
Step 11- View In IE
Next Steps- Make A Page Template
1. Add in Navigation Link text2. Add in Banner- 728 x 90px- 3. Add in Logo- 300 x 200px4. Add in Animated Banner- 163x163px5. Add in Editable Region
Step 12- In Your Website Folder Create A Folder Called “Images” and add your banner, logo and animated banner
Add in Banner- 728 x 90px- 3. Add in Logo- 300 x 200px4. Add in Animated Banner- 163x163px
Step 13- Notice In Dreamweaver You Have The Image Resources Available
Step 14- Drag In Images & Resize If Necessary
Step 15- Preview In IE
Step 16- Add Some Fonts In CSS for “Nav”
Step 17a- Create two editable regions and then create a new CSS for each of those sections
for the text (Verdana, black etc)- One is a page header and
one is just the page text.
Step 17b- Make sure your Section Header and section text are linked to the CSS you
just created Select editable region
Make sure the ID relates to the CSS here
Step 18- Check Your Page Works In IE