Find online courses made by experts from around the world.
Take your courses with you and learn anywhere, anytime.
Learn and practice real-world skills and achieve your goals.
"Design in the browser"
"Responsive web design"
These are all the latest rage in web development and design, but what do they mean? This course will cover these concepts, as well as provide a base knowledge of useful web code. There is much more demand for designers to know how to code. By the end of this course, you will be able to do just that. Even if you are starting from scratch!
The first part of this course covers basic HTML and CSS. We break down the concepts of this code as well as provide useful code examples to get you started, and have several resources for further research and practice.
The second portion we will dive into helpful tools to speed up development, how to jumpstart our web code with grids and frameworks, and look into how to make our website mobile friendly--covering both code and concept of responsive design.
Even if you are not a designer, but want to learn front-end web development, or want to improve your web code skills, you will benefit from this course.
Advanced topic videos are in progress and will be published in March of 2015. While you are waiting, you can purchase this course at 50% off, AND you will get the advanced topics FOR FREE! The price has already been adjusted here. Once the advanced topic videos are added, the price will return to the full amount.
Not for you? No problem.
30 day money back guarantee.
Learn on the go.
Desktop, iOS and Android.
Certificate of completion.
|Section 1: Introduction|
It is an exciting time in design for interactive media. Designing for interactive also presents many more variables and challenges. Learning how to code will help you in your design for the web. It is also something more and more employers are looking for in a designer.
Learning how to code sounds daunting. But it doesn't have to be. We will break things down in simple terms. Ready?
Web code likes to speak in letters. Lets go over some terminology first.
|Section 2: Lets dive in to code!|
This section we will focus on two languages, HTML and CSS. Both of these work together to create the web, but both have specific tasks. Structure, and design are kept separate, and here is an example why.
We also start diving into the concept of "designing in the browser" using HTML and CSS.
HTML is a language that is fairly close to the english language. Lets first break down the structure of HTML tags to make them seem less intiminating.
Increasing our HTML vocabulary, one tag at a time. Here we cover more tags to create our website's structure.
Here we start covering CSS syntax, and start with a sample website, styling colors, padding, margins, etc.
We're starting to get some of these finishing touches done on our example site. Isn't it wonderful when a page comes together?
Lets get into some more layout specific CSS. After looking at CSS floating, things are staring to take shape.
You can also download the final source code that we use in this sample.
Here's some free resources to learn more and use as reference as you code!
|Section 3: Getting more advanced|
Media queries, grids, sass and frameworks -- coming soon!Preview
tracy apps is a creative professional working with small and large clients all over the world for over 15 years. While her college degree is in art, she started hand-coding websites in 1996 after buying her first HTML book and staying up all night to create her first "homepage."
As a business owner, tracy is in charge of all aspects of the creative process for clients. She is also passionate about teaching others about design, user experience, web development, WordPress, photography/video and communication strategy.
Tracy has spoken at over a half dozen conferences and tech meetups, and guest taught at various colleges and universities in Milwaukee. She also wears bowties a lot.