Htmlshell - generate HTML skeletons | Hacker News Reader

Htmlshell - generate HTML skeletons

htmlshell.com

73 pointsTomAnthony28 comments

Please don't include jQuery or Prototype using the URLs shown there, because they are only cached for one hour. Use a full-version URL.

It's interesting. It would be helpful to me if it included a set of simple templates for different basic css layouts.

e.g. box centered in the center of the screen, three column fixed, two column flexible, etc.

here's a page with a whole listing of example css layouts. http://www.maxdesign.com.au/articles/css-layouts/

Just what I need to make a little one-off JavaScript app.

To be more DRY, shouldn't the "Autorun JavaScript" make use of selected JavaScript libraries (i.e. jQuery if possible)?

I agree.

Moreover, html5boilerplate recommends NOT to include the /1/ query: http://html5boilerplate.com/html5boilerplate-site/built/en_U...

Actually what would really be neat is if it uses an included library if one is linked (e.g. jQuery $(function(){...});) and the code shown wrapped in an anonymous function otherwise (function(){...})();

The 'autorun Javascript' at the bottom would be better of in a directly run anonymous function to avoid polluting the global scope with an 'autorun' function. Also, the 'On page loaded' example is not really needed. Any Javascript included at the very last in the page will run automatically on 'page load'.

OP is not the creator of the site. You can email him here (from contact link at bottom of page): steve.niles@htmlshell.com

Why do so many people still use redundant HTML tags?

The opening and closing body and head tags aren't needed, nether is the closing html tag. It doesn't make that much difference to the page as a whole but it adds another level of indenting to your code and makes it more complicated than it needs to be.

Seriously!?!

The president of the Federation in Star Trek VI said it best:

"Let us redefine progress to mean that just because we can do a thing, it does not necessarily mean we must do that thing."

Other than the initial level of indenting, which is basically a non-issue for most people I suspect, there just isn't any reason to omit tags like this.

At the same time, they make the markup clearer, and help a reader quickly delineate between two important sections of the document. Therefore, since they provide at least a very small positive benefit, it is perfectly reasonable, IMHO, to include them.

I'm not sure I agree (I too did not know they weren't required any more).

We frequently see things like JavaScript pulled in at the bottom of documents -- the head and body long since stopped having functional impacts, and all they seem to do is make you feel guilty about doing things it seems it's not only pragmatic but perfectly OK to do now.

I guess omitting the outermost HTML tags would disturb me slightly if one wants to keep XML-ish. But then it's always bugged me that XML kind of assumes the "file" has no semantic significance.

Do you need to delineate explicitly? There's a block of meta tags followed by a block of content tags. Quite possibly with whitespace inbetween. I think it's fairly obvious.

Probably the most accurate answer to your question is: Because so many people don't know they are not required. (I certainly was in that category until about 5 minutes ago)

But even now knowing that info... I will continue to use them. Yes, it adds another level of indenting... but personally I prefer that. Text that is without a left margin tends to be a little harder to read. I also like to have a visual grouping of the elements. I think I would disagree that it "makes it more complicated" to have those tags.

Exactly how much complexity does a closing <html> tag add?

None, but for something that's attempting to generate very simple markup

  <!DOCTYPE html>
  <html>
    <meta charset="UTF-8">
    <title>TITLE</title>

Is nicer than

  <!DOCTYPE html>
  <html>
   <head>
    <meta charset="UTF-8">
    <title>TITLE</title>
   </head>
   <body>
    
    </body>
  </html>

The <html> is also optional here.[1]

    <!DOCTYPE html>
    <meta charset="UTF-8">
    <title>TITLE</title>

Look at that, I saved you another indent.

I think the recent Google Style Guide [2] has made this en vogue, but hipster points for anyone who knew about it before.

[1] http://www.whatwg.org/specs/web-apps/current-work/multipage/...

[2] http://google-styleguide.googlecode.com/svn/trunk/htmlcssgui...

The character set is also optional if sent as an http header.

http://www.w3.org/TR/REC-html40/charset.html#h-5.2.2

And a supporting talk by paul irish http://paulirish.com/2011/primitives-html5-video/

Can I still take the hipster points if I never knew that the second html tag was required? I just always assumed that the new spec rolled the doctype and html declaration into the same thing.

Perhaps my HTML5 introduction pitched it that way, or perhaps I just jump to conclusions too easily, but nice to know I've gotten it right, even if only by accident.

Yup. I write all my personal web pages like this now. It's far more efficient, simply because it's less stuff to forget, easier to remember, and much quicker to type.

How often are you actually typing </html>, <head>, and <body> that it actually makes you less efficient? This reminds me of all the ASI discussions that have been going on lately.

>> Why do so many people still use redundant HTML tags?

1. Dinna know you could skip them "legally"

2. Increased readability at nearly no cost

3. Concern that browser "x" will render crap if I skip them.

Just so that it doesn't make any difference to you or your presentation doesn't mean that you should avoid it. It is a best practice to include them and semantically right thing to do. It gives a structure to your document and defines what your document is about.

I don't see it as a redundant tag, not at all.

I would say it's more complicated to rely on omission rules.

Also you can simply not indent html and body.

If it doesn't make much difference then you do it your way and I'll do it mine. What difference does it make? Plus, you can choose to indent however you wish so that's not much of a reason.

Personally, I just like the idea of opening and closing tags that clearly define what's going on in the markup.

Would love to see optional inclusion of the following: - Bootstrap (1,2) - jQuery UI - YUI - skeleton framework - facebook meta tags - viewport toggling - foundation framework - google analytics code (minus acct. #)

Remember to have a backup for the jQuery googleapis call, you need to have this right after it: <script>window.jQuery || document.write('<script src="js/libs/jquery.x.js"></script>')</script>

Inserting DOM elements via document.write will kill the performance of your site. Don't do it.

What about shiv or boilerplate?

Reply on news.ycombinator.com