Src and alt are attributes for the img tag. Src is absolutely required, or you won't get an image to show. Alt is required as a standards/accessibility thing (IOW, it's good form to include it, for those with images disabled for whatever reason), but the img tag will work without it. The "alt=" attribute also provides the tooltip text when mousing over an image.
The <img> HTML example should probably be displayed as something like <img src="image.png" alt="This is an image!"/> so that the user knows how to put the tag together.
As for the standards questions by ninetydegrees, XHTML 1.0+ requires that all tags be closed, even self-contained tags. So <hr/> would be the proper form. HTML 4.0 doesn't require this of self-contained tags, but will accept XHTML format, and I find it better to be consistent, since it causes less confusion that way (especially for the casual user).
I also agree with the grouping idea. The alphabetical list is only good for the "what's this do?" line of thinking, which is generally the opposite of how one thinks when learning (X)HTML. Generally speaking, the person looking this stuff up will be thinking more along the lines of "how can I do this?" Also, even as an experienced web developer who knows what all the tags do, I found the list to be getting to the point of too long and distracting that it started becoming painful to read through. There's not much to differentiate between entries.
As far as the <h> tags go, it might be useful to provide more detailed explanation on another page about them. The heading tags don't always show up different sizes (and can be styled to not change size at all), but their significance goes beyond just visual size. They actually help non-graphical utilities (browsers, web spiders, etc) differentiate between sections and subsections in a web document. It's like the "Table of Contents" tool in MS Word, which uses the headings to create an outline to use as the ToC.
Credentials: Web developer for a respected consulting company, Bachelor degree in Computer Information Systems specializing in web development, and freelance web developer since 2000.
no subject
The <img> HTML example should probably be displayed as something like <img src="image.png" alt="This is an image!"/> so that the user knows how to put the tag together.
As for the standards questions by
I also agree with the grouping idea. The alphabetical list is only good for the "what's this do?" line of thinking, which is generally the opposite of how one thinks when learning (X)HTML. Generally speaking, the person looking this stuff up will be thinking more along the lines of "how can I do this?" Also, even as an experienced web developer who knows what all the tags do, I found the list to be getting to the point of too long and distracting that it started becoming painful to read through. There's not much to differentiate between entries.
As far as the <h> tags go, it might be useful to provide more detailed explanation on another page about them. The heading tags don't always show up different sizes (and can be styled to not change size at all), but their significance goes beyond just visual size. They actually help non-graphical utilities (browsers, web spiders, etc) differentiate between sections and subsections in a web document. It's like the "Table of Contents" tool in MS Word, which uses the headings to create an outline to use as the ToC.
Credentials: Web developer for a respected consulting company, Bachelor degree in Computer Information Systems specializing in web development, and freelance web developer since 2000.