By Kevin Yank

Back to Basics with Build Your Own Web Site The Right Way Using HTML & CSS

By Kevin Yank

With Google seemingly launching a complex, new web application every week, it’s easy to get caught up in the waves of cool, new stuff hitting the Web every day here at SitePoint HQ. But this past week, I had the opportunity to get back to basics and remember what it’s like to build your very first web page.

My girlfriend Jessica is completing a postgraduate teaching degree, and one of her assignments was to produce a web site describing a number of ways in which computers could be used in the classroom. In preparation for this assignment, her lecturer gave a brief demo of Dreamweaver, and suggested that students who couldn’t figure out the program could just design their site in PowerPoint (yes that PowerPoint!) as a series of cross-linked slides and export them to HTML.

Product shot: Build Your Own Web Site The Right Way Using HTML & CSSNow, Jess is studying to teach drama and English, so she could easily have taken the path of least resistance, but as we had just received our office copies of Ian Lloyd’s Build Your Own Web Site The Right Way Using HTML & CSS, I dropped one on her desk and hinted that she might find it interesting reading.

Less than a week later, she shot me an instant message one afternoon with a URL in it and asked me, “What do you think?” Bracing myself for the worst, I clicked through and blinked in astonishment at the green check mark that popped up at the bottom of my browser window. The site validated!

It turns out that Jess enjoyed the book so much, she even included an extra page on her site explaining how she had come by her newfound HTML and CSS skills:

I read the book, which assumed no prior knowledge, and was quickly educated in how to use valid HTML and create snazzy web layouts in CSS, in a way that means I can apply my styling to a number of pages using one style sheet – very handy if I want to change something across all my pages.

The result? You’re looking at it. The fact that my first page I created, my homepage, is Valid XHTML 1.0 Strict is an achievement that very, very few first-time webpage builders can claim. In fact, all my webpages pass both HTML and CSS validation 100%, except for the Blogger code in my blog page. But that’s their problem, and another reason why I would ideally use hand-crafted weblogging technology if I were using blogging with students.

I should say, even though I know I’m pushing the boundary between exposition and just plain bragging – this website took me only FIVE days to make. From opening the book through to writing these closing words. That fact even has my head spinning.

I’m still getting used to my girlfriend preaching the gospel of web standards, but I couldn’t be more proud – not only because Jess did such a professional job on her first-ever web site, but also because Ian has produced a book that can engender that level of enthusiasm in building web sites the right way from someone with no prior web design experience.

Now to drop a copy of the newly-updated HTML Utopia: Designing Without Tables Using CSS, 2nd Edition on her desk…

  • Pingback: » Blog Archive » SitePoint Book…()

  • Pingback: Blog Standard Stuff » Wow, I Couldn’t Have Asked for a Better Review!()

  • nico7799

    Congrats to your girlfriend! And you for introducing her to Web Standards.

  • LiQ

    So why should we choose ‘HTML Utopia: Designing Without Tables Using CSS, 2nd Edition’ over, the above praised, ‘Build Your Own Web Site The Right Way Using HTML & CSS’? What are the differences?

    Phew, those where long titles. I prefer the good old days where they would have been called something like RailBoardWeaverSomethingCool.

  • LiQ: HTML Utopia is a bit more advanced than the beginner’s book. For example, it assumes you know some HTML, are familiar to some extent with what CSS is/does. My book, on the other hand, assumes no knowledge whatsoever – for example, the first chapter is all about getting your computer set up for web development (ie telling you what a text editor is and where you can find it, whether you are a Mac or PC user). In short, you could say that my book is the foundation that sits underneath all the other SitePoint books – it’s just that SitePoint built the walls before laying the foundations! :-) I hope that helps you to understand the difference

  • Michel Merlin

    Thanks lloydi (and LiQ) for making clearer what 2 of these great books are one to another. I thin a good site (and organization) as SitePoint should post a short and clear page with a TABLE (yes they are useful in that situation) showing which book buy first.

    Short of such clear explanation I simply bought nothing so far…

    Paris, Thu 8 Jun 2006 14:00:00 +0200

  • Michel – that’s actually a pretty good idea. I do not work for SitePoint (just wrote that book), but I think that some kind of ‘family tree’ or route would be good, showing the relationships between the books, rather than the linear one (mostly based on when the books were released) could help greatly. Matt, Simon, Kevin & Co – something to look into?

  • Chris Conn

    Jessica did a very good job on that site. I’ve seen horrific sites from Dreamweaver that work, but have to have subtle “bug-fixes” in place because their code wouldn’t validate.

  • ringobob

    She did great on her first website. My level of technical knowledge is high, but my design skills are about on par with what she produced. Good to know I can hand off my HTML responsibilities to someone with a book and 5 days ;)

  • We realise that it’s not easily apparent which book might suit you best, so we are investigating ways to help make everything clearer.

  • Pingback: Beginning Web Design / Wow, I Couldn’t Have Asked for a Better Review!()

  • Cary

    While I like the Firefox’s Tidy html validator plugin, the CSE Validator extension is much more reliable.

    And yes, Jessica’s page still validated!

    Of the books I have on starting out in HTML, this book is my favorite and the one I find most usefull.

  • Cary

    I just wanted to further add that I use both Tidy and CSV validator extensions at the same time. Lots of usefull info when the page source comes up! Uh, but not on my pages, of course.

  • Blue Sky

    I think the idea of a family tree is a great idea and would be very helpful especialliy to those on a tight budget.

  • Steve

    I have just purchased this wonder book (it’s great!), and have a question. I believe it is in chapter 3 there is a page that lists all the CSS items to be added to the practice website exercise. On the web site is a 3 lime menu using <ul>. Why in the style sheet is the <li> font set to small TWICE? Why not list this once in the style sheet?


  • Hi Steve. If you look at the book’s errata page you’ll see that this is listed as a known typo. Thanks.

Get the latest in JavaScript, once a week, for free.