We understand first-hand how frustrating it can be trying to learn how to use new technologies in a short amount of time. And because mastering a new skill isn't usually easy, we decided to do something about that by breaking this course down into easily consumable bite-sized chunks that make the concepts not only super clear, but also really memorable - pretty quickly.
Instead of just showing you how to "paint by numbers", like most courses do, we'll be showing you why the code works like it does so you'll be able to actually take that knowledge and apply it anywhere.
That means you'll be able to do awesome things like being able to bootstrap your business, market on a shoestring budget, or just learn a highly marketable skill to boost your resume or CV - all in about about 3 hours!
Over the course of these easy to follow, bite-sized video lectures you'll gain a strong foundation in responsive web design, wireframing, HTML5 and CSS3 – even if you've never tackled any of these topics before.
We'll walk you through it, step-by-step, as you create your own 100% custom landing page, that's search engine friendly and whose content and layout is completely under your control. And because we take the time and care to explain to you not just “the how" but also “the why" behind the code, you'll finish with a really deep understanding of how to apply what you've learned with us to any project you take on in the future.
Why are you taking this course? Find out right here. If you're short on time and big on ambition… you're in the right place.
Time to get our hands dirty… by sketching out our wireframe.
Every file needs a home. We'll show you where to put everything so your projects just works.
Learn all about HTML tags, and make friends with the <h1> and <br> tags. We promise, you'll like them.
Get a firm grip on how to work with an HTML page's head and body sections. We'll also show you how to use the <html>, <head>, <body>, and <title> tags. They're important.
What's the difference between a block and inline tag? We'll show you. You're also going to get acquainted with the <div> and <a> tags, and learn just where to use them.
We're going to conquer the entire HTML body section of our page, really quickly. Along the way, you'll learn all about “content wrappers” and HTML tag attributes, in addition to the <img>, <p> and <li> tags. In case that's not enough, we're also going to show you a quick and simple way to get an interactive Google map embedded into your page, as well as all the social buttons you'll ever need - using free tools!
We'll unravel the mysteries of Cascading Style Sheets, or CSS, in this section and you'll learn exactly what they are and how to use them to make your web page look stylish, beautiful and professional.
How many colors can you use in your web designs? Millions. We'll show you exactly how to color in your design using the three different methods available to you in CSS to get just the color and shade that's perfect for you. Learn how to use the CSS 'color' rule with plain English words, hex codes, or RGBA values.
It's time to style your <body> tag via CSS. Never suffer distorted background images again by learning how to properly use a background image via the 'background-image' and 'background-size' CSS rules. You're also going to see exactly how to set font colors via the 'color' rule, font sizes via the 'font-size' rule, and text line spacing via the 'line-height' rule. There's no faster way to improve your style than watching this lecture!
Content wrapper? What's wrapped inside? Chewy content goodness, that's what! We'll show you how to quickly give yourself a handy visual assist while coding by using the 'border' rule to make your invisible divs temporarily visible while you're building. We're also going to take you through the 'max-width' and 'margin' CSS rules as well so that your content will be centered and sitting pretty, just where you want it.
Everyone likes to be properly introduced using their correct title. Your responsive web page is no different. In this lecture we'll show you exactly how to style your page's title using the <h1> tag, and we'll get you really comfortable with the 'margin' and 'text-align' CSS rules along the way. Last but not least, you're going to learn all about the CSS 'width' rule and how you can apply it to your images to quickly make them responsive and scalable.
When is a box a box? When we create a 'box' class of course! You're going to see exactly how to create and style up the 'box' class that lets all the boxes on your webpage share the same rounded corners - and you'll only have to set it up once! Then we'll introduce you to the 'announcement' ID where you'll see for the first time how to apply multiple attributes to the same HTML tag get exactly the look you want with as little coding as possible. And did we mention? You'll also get to see just how the 'border-radius', 'background', 'padding', 'box-sizing', and 'font-weight' CSS rules work. There's so much CSS goodness in this lecture.
Ever wonder how to get different webpage elements positioned just right, when going from left to right? Then you're in the right place! In this lecture you'll see how to use CSS floats using the 'float' rule, as well as where and how you can apply them to position your design elements perfectly, and responsively. We'll also demonstrate how you can fix a really common bug that happens when using floats by taking advantage of the CSS 'clear' rule.
We'll walk you through, step-by-step, exactly how to add some unique style choices to the blue title bands at the top of your left and right content boxes. By the time this lecture is done you'll know exactly how to use the 'border-top-left-radius' and 'border-top-right-radius' CSS rules. We'll also add to your bag of CSS tricks by showing you how to use negative margin values to cancel out bits and pieces of your code, but only where you want to, in order to really fine tune your design.
This lecture is list-tastic! You're going to learn all about lists, how they work, what they can be used for (hint: more than just listing things), and how to get them looking just how you want by using the 'list-style-type' CSS rule.
Whether you are looking to enhance your career, polish up some rusty skills, or finally launch that business you have been dreaming about, we believe our selection of short, “stackable" tutorials will give you the skills and confidence you need to succeed in whatever your passion is.
Petr is originally from a small town outside of Prague, in the Czech Republic. Currently living in NYC, he is both a physics researcher, engineer, and a talented developer. Passionate about the sciences and their application in technology, he has built everything from e-commerce websites to autonomous flying drones. He is experienced in over a dozen programming languages and developmental frameworks and enjoys tutoring and helping others learn as much he as does creating amazing things.
James is a multi-hat wearing problem solver with a talent for taking concepts from idea to reality. An entrepreneur and consultant with a background in finance, real estate and technology startups in New York and Europe, James enjoys sitting at the crossroads of technology and business - leveraging elements of each to advance the other. He lives in New York with his wife, new son and a 19lb blonde norwegian forest cat named Lars.