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

By | | JavaScript

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…

Get Started with
Ruby on Rails

Github, Twitter and Hulu. All huge. All successful. All Rails.

Learn the web development framework of the moment with our newest book and course.

Learn Rails

Kevin Yank

Kevin began developing for the Web in 1995 and is a highly respected technical author. He wrote Build your own Database Driven Website using PHP and MySQL, a practical step-by-step guide published by SitePoint, and he's co-author of the SitePoint Tech Times, a bi-weekly newsletter for technically-minded web developers. Kev believes that any good webmaster should have seen at least one episode of MacGyver.

More Posts - Website

{ 13 comments }

Matthew Magain January 3, 2007 at 11:27 am

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

Steve August 22, 2006 at 2:17 am

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?

Thanks,

Blue Sky July 21, 2006 at 12:27 am

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

Cary July 8, 2006 at 3:17 pm

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.

Cary June 30, 2006 at 9:23 am

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.

Simon Mackie June 9, 2006 at 10:32 am

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

ringobob June 9, 2006 at 1:40 am

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 ;)

Chris Conn June 8, 2006 at 10:56 pm

Kevin,
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.

lloydi June 8, 2006 at 10:16 pm

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?

Michel Merlin June 8, 2006 at 10:00 pm

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

lloydi June 8, 2006 at 6:08 pm

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

LiQ June 8, 2006 at 5:31 pm

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.

nico7799 June 8, 2006 at 3:07 am

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

Comments on this entry are closed.

{ 3 trackbacks }