Working with Images and HTML

In this introductory tutorial on images (img) in HTML, we will explore some easy-to-use, creative applications to further enhance your ability to use images on your web page effectively. Additionally, we will explore the types of images you can use, as well as how to best optimize images so that your web page loads easily.

Continue Reading

An Introduction to Margins and Padding in CSS and HTML

In this introductory tutorial on Margins and Padding in CSS and HTML, we will explore some easy to use, creative applications to further enhance your ability to add space around an element. You may want to add space around an image or extend space between the web page border and the text you are displaying. 

Additionally, we will explore the different levels of spacing and come to truly understand the difference between Margins and Padding in CSS. Within that realm, we will also explore the many custom options you have to set the margins and padding with precise measurements.

Continue Reading

The Best Ways to Learn HTML

The prospect of learning HTML can seem confusing at first: where to begin, what to learn, the best ways to learn — it can be difficult to get started. In this article, we’ll explore the best ways for learning HTML to assist you on your programming journey.

Continue Reading

3 Reasons To Take “Intro To HTML & CSS”

You could call them “The Basics.” Or, “The Fundamentals.” You could even call them “The ABCs.” Whatever you call them, HTML & CSS are the building blocks that make up the web as we know it. If you’re going to have any kind of a career in web development, these are core technologies you need to master.

Think Like A Developer

Look online, and you’ll see countless options for how to learn HTML & CSS. We have options too. But ours are a little different. At Udacity, we’re always thinking about careers, about hireability, about job-readiness. We want you to Be In Demand. So we don’t just teach skills web developers need to know. We show you how to think like a web developer.


If you’re not already familiar with HTML & CSS, you may not be thinking career yet. That’s ok. And you may not be ready to enroll in our Front-End Web Developer Nanodegree program. That’s OK too. We have a rich library of free courses (yes! free!) that represent the ideal opportunity to get started on mastering key skills, in ways that will set you up for future success as you progress. Intro To HTML & CSS is just such a course.

From Design To Code

In simplest form, building a great website is all about taking a design, and turning it into static web pages. That’s exactly what you’ll do in this course. Notice, I didn’t say, “that’s what you’ll learn to do in this course.” I said, it’s what you’ll DO. You’ll actually build a site. And because of our focus on your future, that site will be a responsive portfolio site, so you’ll have the functionality in place to add future projects to your portfolio.

An article in the Boston Globe recently noted the following:

“Even if you’re not planning to become a programmer or developer, knowing and understanding computer code can enhance resumes and help careers.”

If you’re ready to start learning HTML & CSS, that’s awesome! In this day and age, it’s really, really important you do so. And this course is a great—and free!—way to begin.

Check it out.

HTML5 Contest Winning Game Released


Udacian Florian d’Erfurth took Udacity’s HTML5 Game Development and created Foxes and Shotguns, a fantastic game that won Best Overall Game in the course contest. Today we’d like you to join us in congratulating Florian on releasing a beta version of Foxes and Shotguns!

Florian, a freelance web designer, took Web Development as his first Udacity course and was “blown away by the quality; even though I already knew how to build websites, I learned a lot.” When HTML5 Game Development was announced, it was the beginning of a new passion for game development!

Below, Florian shares the Udacity courses that helped him make Foxes and Shotguns, and gives a preview of what you can expect from Foxes and Shotguns in the near future.

Foxes and Shotguns Inspiration

I thought about a runner avoiding obstacles. However, I find those games get boring quickly. My solution was to add shooting to jumping, to have some sort of tension and yet keep simple controls that works well on touch devices too.

As for the theme, I came up with the idea of alternating easy levels with hard levels, resting with fighting. Easy became day, and hard became night, where you would be chased by demons.

You may ask why foxes, rabbits, shotguns? Well I don’t really know, but the red moon is summoned by killing 7 rabbits.

Making the Game: Applying Knowledge from Other Udacity Courses

The physics engine used in the HTML5 course doesn’t run well in mobile browsers, so I made a simple one using what I’ve learned from Differential Equations in Action. It’s a really simple engine that is only suited for this game, but without it I wouldn’t be able to target mobile browsers.

I also used app engine and database techniques I’ve learned from the Web Development course so I could handle in-game payments.

For the new version of Foxes and Shotguns, I wanted to use WebGL to illuminate the night scene with gunshots that would reveal enemies. Thanks to the Interactive 3D graphics course, I was able to understand how to program my custom shaders.

Now I’m resuming the Introduction to Artificial Intelligence class, which I paused for a few months while taking the HTML5 course and then building the game. But I can’t wait to finish that class and see how I can apply what I will have learned.

Stay Tuned for More Games!

I will make more games, although for now I’m focusing on improving Foxes and Shotguns. I’ve launched this new version as a beta so I can iterate and progressively improve it by listening to feedback and looking at statistics. So those are the early days, and a lot more improvements are on the way.

I plan to launch Foxes and Shotguns on the Chrome Web Store next month and make the game playable offline along with some performance improvements for mobile devices.