Udemy
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
Development
Web Development Data Science Mobile Development Programming Languages Game Development Database Design & Development Software Testing Software Engineering Development Tools No-Code Development
Business
Entrepreneurship Communications Management Sales Business Strategy Operations Project Management Business Law Business Analytics & Intelligence Human Resources Industry E-Commerce Media Real Estate Other Business
Finance & Accounting
Accounting & Bookkeeping Compliance Cryptocurrency & Blockchain Economics Finance Finance Cert & Exam Prep Financial Modeling & Analysis Investing & Trading Money Management Tools Taxes Other Finance & Accounting
IT & Software
IT Certification Network & Security Hardware Operating Systems Other IT & Software
Office Productivity
Microsoft Apple Google SAP Oracle Other Office Productivity
Personal Development
Personal Transformation Personal Productivity Leadership Career Development Parenting & Relationships Happiness Esoteric Practices Religion & Spirituality Personal Brand Building Creativity Influence Self Esteem & Confidence Stress Management Memory & Study Skills Motivation Other Personal Development
Design
Web Design Graphic Design & Illustration Design Tools User Experience Design Game Design Design Thinking 3D & Animation Fashion Design Architectural Design Interior Design Other Design
Marketing
Digital Marketing Search Engine Optimization Social Media Marketing Branding Marketing Fundamentals Marketing Analytics & Automation Public Relations Advertising Video & Mobile Marketing Content Marketing Growth Hacking Affiliate Marketing Product Marketing Other Marketing
Lifestyle
Arts & Crafts Beauty & Makeup Esoteric Practices Food & Beverage Gaming Home Improvement Pet Care & Training Travel Other Lifestyle
Photography & Video
Digital Photography Photography Portrait Photography Photography Tools Commercial Photography Video Design Other Photography & Video
Health & Fitness
Fitness General Health Sports Nutrition Yoga Mental Health Dieting Self Defense Safety & First Aid Dance Meditation Other Health & Fitness
Music
Instruments Music Production Music Fundamentals Vocal Music Techniques Music Software Other Music
Teaching & Academics
Engineering Humanities Math Science Online Education Social Science Language Teacher Training Test Prep Other Teaching & Academics
AWS Certification Microsoft Certification AWS Certified Solutions Architect - Associate AWS Certified Cloud Practitioner CompTIA A+ Cisco CCNA Amazon AWS CompTIA Security+ AWS Certified Developer - Associate
Graphic Design Photoshop Adobe Illustrator Drawing Digital Painting InDesign Character Design Canva Figure Drawing
Life Coach Training Neuro-Linguistic Programming Mindfulness Personal Development Personal Transformation Meditation Life Purpose Emotional Intelligence Neuroscience
Web Development JavaScript React CSS Angular PHP WordPress Node.Js Python
Google Flutter Android Development iOS Development Swift React Native Dart Programming Language Mobile Development Kotlin SwiftUI
Digital Marketing Google Ads (Adwords) Social Media Marketing Google Ads (AdWords) Certification Marketing Strategy Internet Marketing YouTube Marketing Email Marketing Retargeting
SQL Microsoft Power BI Tableau Business Analysis Business Intelligence MySQL Data Modeling Data Analysis Big Data
Business Fundamentals Entrepreneurship Fundamentals Business Strategy Online Business Business Plan Startup Blogging Freelancing Home Business
Unity Game Development Fundamentals Unreal Engine C# 3D Game Development C++ 2D Game Development Unreal Engine Blueprints Blender
30-Day Money-Back Guarantee
Design Web Design Responsive Design

Creating Responsive Web Design

Learn how to optimize your webpages for different screen sizes and platforms.
Rating: 4.6 out of 54.6 (445 ratings)
40,596 students
Created by Chris Converse
Last updated 10/2014
English
English [Auto]
30-Day Money-Back Guarantee

What you'll learn

  • Learn CSS3 media queries.
  • Integrate Google's HTML5 Shiv JavaScript.
  • Make CSS rules specifically for Internet Explorer.
  • Learn image slicing and optimization techniques in Photoshop.
  • Develop strategies for HTML markup.
  • Consider design adaptations for multiple screens.
  • and much more...
Curated for the Udemy for Business collection

Requirements

  • Text editor
  • Positive attitude : )

Description

Learn how to create websites that adjust to any screen size while optimizing download speeds.

  • HTML5, CSS3, and Media Queries
  • HTML5Shiv for Internet Explorer
  • Photoshop Image Optimization and Slicing
  • Design Adaptations for Various Screens

Create Websites that are Optimized for All Screens
Because people use a variety of devices to access the Internet, it's important that, as a website designer, you know how to create a site that will conform to any screen size. Today's websites should be able to resize and rearrange elements and content automatically so that any user on any device from anywhere in the world can access your site and browse it with ease. And building a website that's compatible with the many browsers available from both the past and the present is also an integral part of launching a strong site.

Not every website designer knows how to create these "intelligent" websites. With the right training, you can differentiate yourself from the competition and potentially expand your client base.

Contents and Overview
In just 1.5 hours and through 11 lectures, you'll learn all that you need to know to create a dazzling website using CSS3 and HTML5. You'll understand how to make your site backwards compatible with old browsers, and how to set it up using CSS rules so that it will adjust itself to any screen size while optimizing download speeds. This course, which is ideal for web developers, graphic designers, usability experts, and interaction designers, will even provide you with CSS, HTML, and Photoshop templates that you can use to design your own sites.

Upon successful completion of this course, you'll be confident in your abilities to design a customized website that's optimized to work on any computer or mobile device. From the creation of CSS files to the design of a site's layout, text, and graphics, you'll be fully versed in launching a site that's going to appear just as you intended, regardless of what screen your visitors will be using.

Who this course is for:

  • Graphic Designers
  • Web Developers
  • Interaction Designers
  • Usability Experts

Course content

8 sections • 33 lectures • 3h 22m total length

  • Preview04:53
  • Preview01:12
  • Preview08:45
  • Creating your project root
    00:56
  • Examining the design composition
    02:23
  • Slicing and optimizing the banner graphics
    09:23
  • Optimizing the template and content graphics
    03:58

  • Adding the starter files to your project
    01:20
  • Linking CSS files to an HTML file
    05:32
  • Preview02:35
  • Creating the main content containers
    03:13
  • Adding promo containers and adding navigation links
    04:53
  • Adding content to the containers
    02:49
  • Style the background and page container
    07:51
  • Adding typographic styles
    05:37
  • Creating compound CSS rules
    10:49
  • Creating CSS rules for layout
    05:40
  • Setting CSS rules to floating promo containers
    06:50

  • Preview02:15
  • Adding CSS rules for medium screen sizes
    05:26
  • Adding CSS rules for small screen sizes
    06:51
  • Styling the navigation for small screens
    07:20

  • Preview04:23
  • Preview00:52
  • Project Files
    8.3 MB

  • Slicing and Optimizing Graphics
    08:00

  • Creating Content Containers
    07:19
  • Adding Sample Content
    06:29

  • Creating CSS Files
    05:27
  • CSS for Styling Text
    14:34
  • CSS for Layout
    23:13

  • CSS for Medium Screens
    07:53
  • CSS for Small Screens
    14:09

Instructor

Chris Converse
Designer and Developer at Codify Design Studio
Chris Converse
  • 4.2 Instructor Rating
  • 1,680 Reviews
  • 47,199 Students
  • 11 Courses

Chris has over 25 years experience in graphic and interactive design, with a unique focus on both design and development. As a graduate of the Rochester Institute of Technology (RIT), he has focused his career on merging design and technology to create the optimal execution across various media. In addition to graduating from the Rochester Institute of Technology, he is also a featured speaker at various industry-related conferences, including the Adobe MAX, NAB, CreativePro Week and Keyframes. Watch his step-by-step courses online at LinkedIn Learning, Udemy, Skillshare, CPDForumula, CreativeLive, Pluralsight, or on Amazon Video.

  • Udemy for Business
  • Teach on Udemy
  • Get the app
  • About us
  • Contact us
  • Careers
  • Blog
  • Help and Support
  • Affiliate
  • Impressum Kontakt
  • Terms
  • Privacy policy
  • Cookie settings
  • Sitemap
  • Featured courses
Udemy
© 2021 Udemy, Inc.