demosthenes.info

I’m Dudley Storey, the author of Pro CSS3 Animation. This is my blog, where I talk about web design and development with , and . To receive more information, including news, updates, and tips, you should follow me on Twitter or add me on Google+.

web developer guide

my books

Book cover of Pro CSS3 AnimationPro CSS3 Animation, Apress, 2013

my projects

CSSslidy: an auto-generated #RWD image slider. 3.8K of JS, no JQuery. Drop in images, add a line of CSS. Done.

tipster.ioAutomatically provides local tipping customs and percentages for services anywhere.

Baby Turtle

Starting Your Web Development Education Online

students / resources

Estimated reading time: 3 minutes, 45 seconds

Now two decades old, the web has matured to the point at which it can start teaching students about itself. While a great deal of outdated or incorrect material remains online, taken as a whole resources for web development are better than ever, with a growing awareness of standards and best practices. Following the original spirit of the web, much of this training material is freely available.

As a web development teacher, it’s my opinion that most learners would benefit from attending a real-life class with a competent instructor who can provide direction and immediate feedback. However, I completely understand that a classroom environment is not for everyone: online resources allow students to pace themselves, and provide endless opportunities for review. For fulltime students, the same resources can be a vital adjunct to classroom time, providing a different perspective and potentially filling gaps in a curriculum.

Note that I have not read or seen every last detail of the resources I provide here. If you find errors or have alternate suggestions I’d appreciate your feedback in the comments section below.

The Basics

For people who demand “I just want to make a simple site right now!” I would recommend the well-regarded SquareSpace. But if you want to be a web developer or a designer, if you desire to have complete control over your pages, it is vital that you understand the fundamentals. My current recommendation would be to start with:

Don’t Fear The InternetDon’t Fear The Internet, a video series by the delightful (and soon to be betrothed) Jessica Hische and Russ Maschmeyer. Presented in short, accessible sections, the videos start from basic concepts, and work through using HTML, CSS, and the basics of typography. It’s a casual, non-threatening introduction designed for non-designers.

Video series are great, but they don’t provide the studied depth communicated by written material. I’d recommend combining Jessica and Russ’s introduction with A Beginner’s Guide To HTML & CSS, written by Shay Howe: a very well-written and approachable site that covers the basics of web development.

Book cover for A Practical Guide To Designing For The WebBoth of those resources are excellent, but neither specifically addresses design. Despite what you may hear, having a “designer’s eye” is not a skill that anyone is born with: like almost everything else, good design comes from patient observation, experiment, and hours of practice. To help you get there, I would recommend reading Mark Boulton’s Designing For The Web. It’s available in dead-tree format or PDF, but the entire book is available online for free. Boulton’s background is grid-centric, and knowing the rules and principles of grids can really help guide new, struggling designers. Before he gets there, Mark gives a thorough explanation of the designer’s workflow, color and type.

Curricula & Transitional Books

If you preer a more structured, academic approach to learning, there are two resources I would recommend: the Opera Web Standards Curriculum and the Web Education Community Group Wiki. You’ll note that the former is beginning to be folded into the latter: the Opera Curriculum was donated to the W3C, who have used it as the core text for the more dynamic (and easier to maintain) wiki.

Similarly, Dive Into HTML5 by Mark Pilgrim was a spearhead to modern web development, but has been slightly superseded by the rapidly changing specification. It remains an excellent resource, especially for anyone who might have played around with web development a few years ago and desires a refresher.

Typography

FontShop Guide to TypographyTypography on the web is growing more powerful every day as rich font embedding finally becomes a reality for pages. FontShop has an excellent, beautifully designed and free PDF series on typographic education; you can download the entire set as a .zip file. There’s also the slightly more advanced Webfont Font User’s Guide.

JavaScript

JavaScript Fundamentals Development for Absolute BeginnersWith Microsoft’s determination to be up-to-date with web standards, the company has released a great deal of developer resources, including a set of videos on its Channel 9 site that include HTML5 & CSS3 Fundamentals: Development for Absolute Beginners and JavaScript Fundamentals, each in 21 parts.

Interaction Design

Interaction design – thinking about the ways in which people use your website, and how that could be improved – is a very important topic. While there is a lot of academic and corporate research available, I would suggest starting with the pithy and direct First Principles Of Interaction Design, by Bruce Tognazzini: a page of invaluable advice, available in multiple languages.

This should be more than enough to get anyone started in web development; in the next article, I’ll look at paid online courses.

comments powered by Disqus

This site helps millions of visitors while remaining ad-free. For less than the price of a cup of coffee, you can help pay for bandwidth and server costs while encouraging further articles.