X

Dreamweaver CC Responsive Design with Bootstrap [2015, ENG]

English Tutorials and Courses

 
  • Filter
  • Time
  • Show
Clear All
new posts
  • medmoh
    Thread Author
    VIP
    • Sep 2018 
    • 2738 
    • 1,914 
    • 1,920 

    Dreamweaver CC Responsive Design with Bootstrap [2015, ENG]

    Year of issue: 12/2015
    Manufacturer: Train Simple
    Manufacturer website: trainsimple.com/CourseDetailUser.aspx?id=206
    Author: Dan Carr
    Duration: 5:00
    Shared Material Type: Video Clips
    English language

    In this course, Dan Carr guides you through developing a responsive website in Adobe Dreamweaver using the Bootstrap framework. First, you'll learn about what responsive design is and it's role in modern web design. Next, Dan reviews all the features built into Dreamweaver for working with Bootstrap. Finally, you'll build a complete responsive website from a Photoshop mockup and test your site on various devices.

    Code:
    1. Understanding Bootstrap & Dreamweaver
    Course Overview
    What is Responsive Design?
    How Does a Fluid Grid Work?
    How Does Bootstrap Make Design Easier?
    How Does Dreamweaver Make Design Easier?
    So, What's the Workflow?
    2. Setup the Bootstrap Project
    Get the Supplied Files
    Create a new Site
    Create a CSS File for the Project
    Create an HTML page and Add the Bootstrap Framework
    Navigate the Page in the Dreamweaver Workspace
    3. Working with the Boostrap Grid System
    Create a Grid
    Build Rows and Columns in the Grid
    Edit Rows and Columns in the Grid
    Define Column Behavior Across Screen Sizes
    Add Content to the Grid with Snippets
    Preview Your Work
    4. Working with Bootstrap Components
    Component Overview
    Working with Containers
    Working with Navbars
    Working with Buttons
    Working with Media
    Working with Forms
    Working with Pagination
    Working with Jumbotrons
    Working with Lists
    5. Build Pages for a Website Design
    Create a Page Template Header
    Create a Page Template Footer
    Customizing the Header CSS
    Customizing the Footer CSS
    Create the Index Page Jumbotron
    Create the Index Page Calls to Action
    Create the Features Page Video
    Create the Features Page Content
    Create the Gallery Page Carousel and Subimages
    Create the Gallery Page Content
    Create the Articles Page Part1
    Create the Articles Page Sidebar Part1
    Create the Articles Page Sidebar Part2
    Create the Contact Page
    Add Hyperlinks and Navigation Part1
    Add Hyperlinks and Navigation Part2
    6. Add Text, Images, and CSS Using the Extract Panel
    Overview of the Photoshop Design Comps
    Overview of Using Extract in Dreamweaver
    Add Web Fonts to the Project
    Styling the Landing Page Jumbotron Part1
    Styling the Landing Page Jumbotron Part2
    Styling Landing Page Calls to Action
    Adding Media Queries to Landing Page
    Adding Video to Features Page
    Styling Features Page List
    Adding Images to Gallery Page Carousel
    Adding Subimages and Content to Gallery Page
    Add Content to the Articles Page Part1
    Add Content to the Articles Page Part2
    Add Content and Branding to the Contact Page

    Sample files: present
    Video format: MP4
    Video: AVC, 1280x720, 16: 9, 30fps, 552kbps
    Audio: AAC, 44.1kHz, 128kbps, stereo


    Attached Files
  • alawadly
    LifeTime Premium
    • Oct 2018 
    • 231 
    • 121 
    • 60 

    #2
    الشكر الجزيل لحضرتك على الكورسات الرائعه
    Comment
    • medmoh
      Thread Author
      VIP
      • Sep 2018 
      • 2738 
      • 1,914 
      • 1,920 

      #3
      Originally posted by raedms
      الله يجزاك الخير
      شكرا لك يأ خي
      Comment
      • medmoh
        Thread Author
        VIP
        • Sep 2018 
        • 2738 
        • 1,914 
        • 1,920 

        #4
        Originally posted by alawadly View Post
        الشكر الجزيل لحضرتك على الكورسات الرائعه
        شكرا لك يأ خي
        Comment
        Working...
        X