Hi everybody, I'm Colleen van Lent and I'd like to welcome you to introduction to responsive design. In this course, we're going to talk about different ways that you can make your website look the best it can possibly look. No matter if someone's viewing them on a phone, a laptop or a tablet. We're really going to cover the basics in this course and help you develop a general understanding of what responsive design is and why you need to know it. We're going to talk about ways that you can customize your own site without using any special software to give it a really special look and feel. But, we also want to talk about using frameworks. Because if other people are using software or different code to make their site look great, why not take advantage of it and learn how to use it yourself. In week one, we're really going to focus on the theory. The idea of what is responsive design. What do people mean when they use that term? Those of us in technology are pretty guilty of throwing out terms and using them even when we don't really know what they mean. We're going to talk about what makes for good responsive design. If you don't know what to aim for, it's really hard to know how to get started. Finally, we're going to end the week talking about something very concrete and that's the role of what we call fluid measurements, these different type of measurements that can change as the screen size changes. In week two we're going to tackle media queries. And this is the first time you're really going to get your hands really dirty with some code, and get things to work. We're going to talk about what they are. And how do you plan, before you even start to code, for the best practice? It doesn't really do you any good to sit down and code without having a plan. In week two, we're going to talk about break points, how you can decide what different screen sizes are the ones you really want to focus on. And finally, I am going to do an example where you and I are going to code together to make a navigation bar. By the end of week two, you're going to be ready and feel like you can really tackle this. In week three, we're going to shift a little bit and instead of writing our own code. We're going to start using different frameworks. In particular, we're going to talk about the different benefits and pitfalls of using other people's code. Sometimes, it's really easy and really great to be able to use these different software options. But sometimes it comes at the cost of good practice and accessibility. In particular we're going to talk about the Bootstrap 3 framework. I've picked this one because it's one of the most popular frameworks out there. Now for those of you who may be familiar with responsive design you'll know that a Bootstrap 4 is coming out soon. But that's okay. I'm going to focus on those elements of Bootstrap 3 that you're going to be able to use over and over again. The simple things such as getting started, the grid system, and also, also again, a navigation bar. Because these are the keys to really getting your site to have that responsive feel. Finally in week four, we're going to continue with more bootstrap, but we're going to talk about things such as images, tables, and maybe some advanced navigation techniques. These are things that are cool and kind of fun, but I don't really think are core to understanding what responsive design is. So we leave them at the end to make them something more we can play around with. We're also, I'm hoping to get to some case studies. We're going to talk to people about how they approached designing the responsiveness their real life sites. We will do this with the culmination of a final project. When you're done with this course, you are going to have one or more pages that you have written yourself. With the help of a framework that can respond to different screen sizes. So, who is this class designed for? Who might really hoping can take advantage of this? It's really someone who's new to responsive design. Someone who'd like to get started and possibly carry on this ideas once their done with the course. You will need a general knowledge of HTML and CSS in order to get the most out of this course. If you don't understand those two concepts, I really recommend that you go back and get a grasp of them and then come back to us in the responsive class. Again, as with any coding class at all. This is a class with people with persistence. You're going to run into problems. This isn't a course where you're going to read something, take a quiz and you're done. Instead, we're going to be coding, probably failing a little bit, coding, failing some more, then and then hopefully success. So, who am I? Well, if you're new to one of my courses, I have a PHD in computer science. I've been teaching for about two decades, sticking mostly with introductory programming, web design, and artificial intelligence. What I really love to do is help students debug. Help them to get those general basic ideas down so they can go off and really master some of the more advanced concepts. And I understand that it's not always about conveying content. It's about helping you recognize those places where you might run into trouble. If I can let you know early, it might help you get up over some of those humps. So in this course, we're going to have a pretty consistent workload. Every week, you'll have multiple videos to watch. Some of them will be kind of traditional lecture format. However, there will be other which I tend to call, Code With Me. These are lectures where I really hope you'll sit down and type along with me and make sure you can replicate what I'm doing. There will be a few weekly readings but there'll always be online articles. I like to find things that are very pertinent to what's going on in web design right now. There will also be weekly assessments, it'll either be in the form of quizzes or in coding. And speaking of coding these will all be done using peer assessments. So we want to make sure, that you're not only writing code but you're able to look at other people's code and understand what they're doing. So how do you succeed in this class? I will always say that the best way to code is with a friend but that's not always possible, so I hope that you'll use the message boards not only to ask your questions but to answer the questions of others. Never spend more than 20 minutes on something that doesn't work. I'm not kidding. I want you to just move on. When things are working it's great, you can whip out a whole bunch of code. But when it's not it's rarely the case that staring at it is going to make it any better. Make sure that you feel comfortable looking things up on your own. This is the internet, you can stick your question into a search engine and you will probably find the answer. You'll find three or four wrong answers, but eventually, the answer will be there. Finally, make sure that you practice, practice, practice. The only way to really learn how to code is to make sure you're getting as much experience as you can. Welcome to introduction to responsive web design. I hope that you'll learn a lot. Thanks.