Great instructor! I felt like he was always there to answer any of my questions. I would certainly take other courses from him in the future - as a matter of fact, I enrolled in one already!"
This course fills a great need in designing responsive web sites for various devices using industry available tools. The instructor supported a very interactive discussion area which was as helpful as the course material. It was great to learn about the latest techniques for responsive web design."
I think this was a great course and David is a very responsive instructor. I thoroughly enjoyed the course."
This is a very rich and excellent course. It captures all that I need to learn in order to improve my site. Learning by working on projects is a very effective and rewarding experience. The discussion area is very rich too. I learned a lot from my classmates. The many tools I was introduced to are very useful and helpful. Thanks a lot!"
Another great course from Dave! It was a lot of fun and highly educational. Among all the great things Dave does well, the best to me is the supplementary material. I will be able to build on what I learned in this course by accessing these supplementary tools."
Excellent presentation and explanations of complex material. Engaging delivery!"
I've learned so many great, exciting things in this class. I feel I truly can make my sites responsive now! Before this course, I was trying to learn by watching videos and reading from various sites. I was getting stuck on different things and felt like I was going one step forward and two steps back. This course was just what I needed to learn how all the techniques work together! I feel I have a solid foundation to implement into my sites."
I thoroughly enjoyed this course. I learned many valuable and exciting skills that I look forward and implemented into my current web site designs. Before this course, I'd been trying to learn responsive web design by watching videos and reading from various sites. I was getting stuck on different things and felt like I was taking one step forward and two steps back. This course was just what I needed to learn how all the techniques work together! Mr. David Karlins is a great instructor. His lessons are easy to understand and are inspiring. He is always available for help and advice. He also praises students for a job well done."
I really liked Mr. Karlins. Great knowledge, friendly, helpful, and he went out of his way to suggest solutions to my questions, even giving me handy links for problems that I was having with things outside the class. This class really helped me with mobile apps."
I never really paid much attention to the fact that some websites are more user friendly than others on my phone, but now I notice everything! For instance, the website I am working on redesigning for a client needs a lot of fine tuning for both the large formats and small formats and I feel much more comfortable creating a better functioning site."
Course Code: crw
In this first lesson, you will take a look at exactly what responsive Web design is, why it is necessary, and the basic concepts in building responsive websites. You will examine some models of responsive design and see what you can learn from them. Then you will learn how to apply relative units of measurement to optimize the display of images and text in different viewports and environments.
In this lesson, you will investigate how menus function differently depending on the browsing environment, and you will find out how to design responsive menus that adapt to full-screen desktop or laptop environments as well as smartphones and tablets. You will learn to apply CSS3’s media feature. Then you will discover responsive color schemes and fonts that will ensure visibility and readability in a wide range of viewing environments. You will also learn how to test color schemes for contrast value, and you will explore Google Fonts as a source of downloadable Web fonts compatible with mobile devices.
Explore a basic strategy of applying a 3-2-1 framework with stacked columns. You will learn how to use media queried, HTML5’s semantic elements, and logical operators to build pages that are user-friendly in devices of all sizes. Then you will learn a simple way to collapse content into expandable blocks for mobile users, but present an alternate page layout for full-sized viewports. You will use the HTML5 <details> and <summary> tags to make content that users can expand or collapse on a small screen. You will also use media queries to present the content in full-size viewports in columns rather than the expandable and collapsible blocks that work in mobile devices.
This lesson will show you an array of strategies for making sure photos aren’t slowing down your responsive sites. You will learn to compress images to reduce file size while maintaining image quality, build a cache file to make photos download more quickly for users on return visits, and manage image downloads with jQuery widgets. You will also learn what video hosts work best when designing responsive sites. Then you will learn to create and embed SVG (Scalable Vector Graphics) images, and scale them responsively.
In this final lesson, you will expand your capacity to provide mobile users with an app-like experience. This means you will integrate more styling and interactive animation. You will do this by connecting with a set of widgets and animated elements from the jQuery Mobile framework. You will employ media queries to keep the full-sized viewport experience friendly. Then you will continue to work with the jQuery Mobile framework to build a Web app welcome page that can serve as a mobile-friendly entryway into your site. You will learn to define and apply a media query so that users coming from laptop or desktop sized viewports see a more traditional navigation bar that works well with large screens. You will build a home page to show off all the projects you have created in this class.
David Karlins is the bestselling author of more than a dozen books on web design, including “HTML5 for CSS3 for Dummies.” His articles have appeared in publications ranging from Macworld to Business Week. He has taught web, graphic, and interactive design at San Francisco State University and in the Extension program at University of California, Berkeley.
Some experience creating Web pages with HTML and CSS is needed before enrolling in this course.
The instructional materials required for this course are included in enrollment and will be available online.
A new session of each course opens each month, allowing you to enroll whenever your busy schedule permits.
Once a course session starts, two lessons will be released each week for the six-week duration of your course. You will have access to all previously released lessons until the course ends.
The interactive discussion area for each lesson automatically closes two weeks after each lesson is released, so you’re encouraged to complete each lesson within two weeks of its release.
The final exam will be released on the same day as the last lesson. Once the final exam has been released, you will have two weeks plus 10 days (24 days total) to complete the final and finish any remaining lessons in your course. No further extensions can be provided beyond these 10 days.