10152121Advanced CSS
Course Information
Description
Advanced topics in website design. Topics include: working with the browser’s developer tools; designing and implementing various styles of responsive web design layouts using Flexbox, CSS Grid layout, and CSS frameworks (such as Bootstrap); implementing content hiding and showing; applying CSS processing techniques (pre-processors and post-processors); and incorporating transitions, transforms, and animations.
Total Credits
3
Course Competencies
  1. Perform HTML, CSS, and JavaScript debugging using default browser tools
    Assessment Strategies
    Exercise is evaluated by instructor outside of the classroom
    Criteria
    Modify CSS dynamically to test visual changes
    Disable and enable applied styles dynamically
    Identify JavaScript errors and locate within source files
    Test and debug in a minimum of 3 industry accepted browsers

  2. Optimize website components to improve overall performance
    Assessment Strategies
    Project is tested outside the classroom setting
    Criteria
    Create and apply sprite images to website where appropriate
    Run and analyze website performance reports
    Minify CSS and apply correctly to HTML
    Test and debug in a minimum of 3 industry accepted browsers

  3. Write and apply custom responsive design components for website
    Assessment Strategies
    Project is tested outside the classroom setting
    Criteria
    Write and apply media queries to correctly achieve responsive design changes on various viewports
    Write and apply media queries to hide or show content based on given criteria
    Design and code for website differences for 3 or more viewports
    Test and debug in a minimum of 3 industry accepted browsers

  4. Utilize at least one popular mobile-first front-end framework for webpage styling
    Assessment Strategies
    Project is tested outside the classroom setting
    Criteria
    Implement Bootstrap or similar framework correctly within website to achieve mobile-first design
    Write CSS to override Bootstrap or similar framework to achieve specific custom changes at different break points
    Test and debug in a minimum of 3 industry accepted browsers