Overview
-
This course shows you how to turn designs from Photoshop into a fully functioning website using Dreamweaver. Learn how to slice mockups, apply HTML and CSS, test code, and more.
Syllabus
-
Introduction
- Welcome
- What you should know
- Using the exercise files
- Set up Photoshop
- Set up Dreamweaver
- Branding and content
- Layout and navigation
- Work with content
- Add color
- Adjust fonts
- Challenge: Type legibility
- Solution: Type legibility
- Slice graphics
- Web images
- Optimize web graphics with Photoshop
- Use image optimization tools
- Create a favicon
- Challenge: Web graphics
- Solution: Web graphics
- Create a Bootstrap file
- Create rows for page content
- Customize the navigation menu
- Menu styles
- Menu alignment
- Add a carousel
- Use the Photoshop extractor
- Create custom CSS, part 1
- Create custom CSS, part 2
- Code for SEO and accessibility
- Error checking with the Validator tool
- The Clean Up HTML tool
- The Link Checker panel
- Build and style pages
- Use Glyphicons
- Create custom styles
- Make a gallery
- Challenge: Carousel
- Solution: Carousel
- Next steps
