Updates
18th September 2010
Thanks to everybody who has “Liked” HTMLSource on Facebook so far! We are closing in on 1000 fans now, which is fantastic! It’s great to see that more and more people are getting involved in web design when the field itself is becoming so interesting again.
Speaking of which, I’ve been working on a new project recently with some friends that has allowed me to learn a bunch of useful web design techniques, including CSS transitions (very nice) and extensive interactivity through jQuery. We’ve built a Google Maps mashup that aims to make the somewhat crazy public transport system in my home city of Dublin more usable. We call it Hit the Road, and it shows you how to get to anywhere in the city usings maps of the public transport routes. It won’t be particularly useful to you unless you happen to live in Dublin too, but if you’re using a powerful browser like Chrome, Safari or Firefox 4, you will be able to see all of the advanced CSS-based animation. Internet Explorer users will have to wait until version 10 to be able to appreciate everything!
15th September 2010
I can still remember buying a magazine one day in 1999 so that I could get the CD with Internet Explorer 5 on it. This was back when a new version of IE was an exciting moment, with new design possibilities to explore, despite the relatively primitive web design standards we had back then (and we still got our software from magazines!). Things took a turn for the worse since though — versions 6, 7 and even 8 have been just plain bad in comparison to the alternatives that were available at the same time. The times, they are a-changin’ though, as today see the release of IE9, the most significant new version of Internet Explorer since IE4. Internet Explorer now supports many important aspects of HTML5 and CSS3, as well as being built with a whole new JavaScript engine that is faster than Safari. Newly-minted IE9 users should have a look at the gallery Microsoft have built to showcase the capabilities of the new browser.
21st April 2010
The big news this week has been Facebook’s announcement of a “Like” button for the entire web. This will shake things up considerably — with one click (assuming you’re already signed in to Facebook), you can share a page you like on your profile. Compared to all the other avenues for promotion that we web designers have, this is pretty foolproof! The button looks like this:
Give it a click if you’re having a good time on HTML Source. :) There’s some space at the bottom so that the widget can show a list of any of your friends who have already liked a page. I wrote up a quick tutorial on how to add the Facebook Like button to your own pages.
1st December 2009
Many readers have started hearing rumblings about HTML5, the new version of HTML that is being developed at the moment, and are asking when they should start using it. The easy answer is: right away. I just converted this site to valid HTML5 in about half an hour. The first step is to replace your HTML 4.01 doctype with the new doctype for HTML5 documents:
<!DOCTYPE html>
That’s all it is. Once you’ve added the new HTML5 doctype to the top of your pages, the trusty HTML validator will recheck you against the HTML5 rules. If you’ve previously written valid HTML 4.01 code, the changes required will probably be minimal (for me, it was mostly replacing the odd align
attribute on paragraphs with CSS’ text-align: center, and removing the border
attribute from images).
Browsers are already starting to support some of the most exciting new techniques and elements that are contained in HTML5, and some really nice experimental pages have been built (like this audio & animation project that uses <canvas>
—no Flash here). I’ve started working on a new set of tutorials to launch next year, but for now, you can start making HTML5 pages yourself and tracking the specification’s progress at the WHATWG blog.
20th November 2009
“Too square and boxy!” is a criticism I’ve heard about this site’s design for many, many years. (Confusingly, the second most common complaint is against the bubbly background, which is made up of a bunch of perfectly round circles!) Old hands at the site should notice some subtle changes appearing throughout the layout recently. Modern browsers like Safari, Chrome and Firefox (which—I’m happy to report—over 70% of the visitors to this site use) can easily do rounded corners in CSS, without needing the image-based hacks of old.
Secondly, and in breaking with a long and distinguished tradition, I’ve decided to rename HTMLSource (one word) to HTML Source (two words) so that it’s easier to find. This pains me greatly.
13th September 2009
Despite the somewhat erratic update schedule here ever since I entered the final stages of my PhD recently, traffic has been climbing steadily upwards for the last few months. This August has been HTMLSource’s most successful month ever! So thanks for visiting.
I’ve been looking around at all the other major HTML tutorial sites that have existed, many of whom I was locked in a bitter rivalry with for years. Unfortunately the majority of them have succumbed to age, and are now shambling zombie pages, dead but still online, peddling outdated tutorials with no clear indication that they are ancient and often wrong. For example, the quality of some of the pages listed on the beginner’s HTML page on the open directory is simply disgraceful. This situation should be “good” for HTMLSource and make me happy, but it doesn’t. This is bad news for anyone trying to learn HTML. With this much inaccurate information available online in once-popular websites, some readers are going to be led towards writing bad code and eventual frustration.
Thankfully directories are a dying breed and Google does a good job of bubbling this and other recent and relevant sites to the top of search results. If you’re learning from multiple sites all at once, please do be careful that the site you’re using has been updated recently (at least in the last few years).
29th June 2009
Since I’m doing a lot of my browsing these days on my iPhone, a few best practices have become apparent for the design of websites for smartphones. I’ve bundled that together with a brief history of mobile browsers in a new tutorial, designing for mobile. We’ve also finally launched our web hosting & domains section. Years ago, I tried writing my own reviews of different web hosts, which quickly became an impossible task. Now, I’ve partnered with a company that feed in fresh information about the features and pricing of thousands of different web hosts every day. Check it out and see if you can get a good deal.
2nd April 2009
One of the nice things that I just realised about switching back to HTML 4.01 markup is that when readers check the source code of the page they’re viewing here, they don’t see any crazy XHTML syntax like the space-backslash parts of “<br />
”. Even though I rewrote the code for this site in 2002 to use XHTML, I have always written all the code examples in the tutorials as HTML 4.01, as this is the most straightforward version of HTML to use. It did cause some confusion though, when I was teaching the use of <br>
, but using <br />
myself in the source code of the site. Now, this is all cleared up!
1st April 2009
The site now has almost 200 tutorials, so I’m bound to have missed some things as I went through them bringing them up to date. I could use your help here — if you see something you don’t agree with, please give me a nudge and point me to the offending passage. Thanks!
30th March 2009
And so, like Jurassic Park, HTMLSource is back online, and back up-to-date!
The major change for this 2009 update is that we’ve cast off our underlying XHTML code and gone back to good ol’ HTML 4.01, like old times. XHTML was hot way back in the space-year 2000 when it first emerged, and just about everybody was gushing about how it was the future of markup. Since then, this brave new future hasn’t materialised as originally expected. There were some missteps, like a draft of a now-dead XHTML 2 specification that nobody wanted to use. Work on a new version of HTML, which was becoming increasingly desperately needed, stalled in the somewhat slow and stodgy W3C (who normally take care of these things), as they were putting their efforts into XML, XHTML and assorted other languages. An outside group calling themselves the “Web Hypertext Application Technology Working Group” (WHATWG) stepped up and developed a pretty nice specification for a new version of HTML, which naturally they called HTML 5. HTML 5 is the new hot.
HTML 5 isn’t ready to be used just yet, although it probably won’t be long before browsers start supporting some of the more obviously useful new elements in the specification, like sections and the video element. When they do, I’ll describe how to use them here. For now, have a look through the newly revamped list of tutorials that I’ve written over the years that have been updated to be current with what modern web browsers like Firefox, Safari and Chrome are able to do.
There are a couple of recent new tutorials too: I went a bit password-crazy recently after seeing some statistics on how poor the passwords that most people use online are. In Site Management, you can learn how to password-protect some parts of your site. To go along with that, there’s an article about how I choose my passwords to be both safe and memorable. Even if you’re not password-protecting your site as above, you should be using a strong password to protect your email account and FTP access.
10th March 2009
Yes, you read those “Last modified on...” dates correctly. HTMLSource is almost back in business. I’ll have more here in a little while. All tutorials are getting brought back up to date!
More Funtastic Updates!
Episode 1 | Episode 2 | Episode 3 | Episode 4 | Episode 5 | Episode 6 | Episode 7 | Episode 8 | Episode 9 | Episode 10 | Episode 11 | Episode 12