Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Simple HTML5 Template
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="x-ua-compatible" content="ie=edge, chrome=1" />
<title>untitled</title>
<link rel="stylesheet" href="" />
</head>
<body>
<script src=""></script>
</body>
</html>
@chriscoyier

This comment has been minimized.

Copy link

chriscoyier commented Dec 7, 2011

Pf. You call yourself a minimalist with those fancy-dancy closing slashes in there?

@nimbupani

This comment has been minimized.

Copy link

nimbupani commented Dec 7, 2011

also end tags for body and html :))

@nathansmith

This comment has been minimized.

Copy link
Owner Author

nathansmith commented Dec 7, 2011

Did I say "minimalist"? I should've just said "lazy". :)

In that, I'm too curmudgeonly to un-learn my old XHTML habits of self-closing slashes, </body>, and </html> tags.

@kevindougans

This comment has been minimized.

Copy link

kevindougans commented Dec 7, 2011

i've felt for years that the basic html template got too complicated for no apparent reason. i can understand why things had to be declared (i.e. xhtml) but there really wasn't a need for that to be a 150 char string. reminds me of when i first learned html in 96/97, when i thoroughly enjoyed it, yay! :)

@nathansmith

This comment has been minimized.

Copy link
Owner Author

nathansmith commented Dec 7, 2011

Agreed. Back to basics, FTW. :)

@biojazzard

This comment has been minimized.

Copy link

biojazzard commented Dec 7, 2011

Great!
I´ll only change one letter, so that fits for me:

lang="eS"

;-P

@adamstac

This comment has been minimized.

Copy link

adamstac commented Dec 7, 2011

So lazy there aren't any indents either. Surprised you didn't post this in Haml.

@nathansmith

This comment has been minimized.

Copy link
Owner Author

nathansmith commented Dec 7, 2011

Yeah, if I'm writing HTML, I don't indent anything until the 2nd level of nestedness inside <body>, since every site has <html>, <head>, and <body>, I'm not usually visually scanning to find them. I tend to be focused on the "meat" of the page... the tags inside <body>.

@daveygm

This comment has been minimized.

Copy link

daveygm commented Dec 14, 2011

I take this minus the self-closing slashes, then add in HTML5 Boilerplate as needed. Thanks!

@adamstac

This comment has been minimized.

Copy link

adamstac commented Dec 14, 2011

I just use Serve w/ my bootstrap. Deploy's to Heroku in minutes too.

@nathansmith

This comment has been minimized.

Copy link
Owner Author

nathansmith commented Dec 14, 2011

@adamstac — Agreed. Serve is awesome.

But, it's overkill if I just want to have a valid HTML document to test something real quick. Chrome seems to not just like HTML snippets without at least an html tag around 'em.

For instance, a few days ago, I was verifying a Formalize (http://formalize.me) bug reported in WebKit, so I put this in my minimal HTML template, tested it on the desktop, and then deleted it...

<!--
  Other browsers only see size="2" and
  higher, so they treat this as a single
  select drop-down, but WebKit always
  responds to size="..." attribute.
-->

<select>
  <option>...</option>
  <option>...</option>
</select>

<select size="0">
  <option>...</option>
  <option>...</option>
</select>

<select size="1">
  <option>...</option>
  <option>...</option>
</select>

In instances like that, setting up Serve would've been more effort than it's worth. So, that's why I keep a handy flat-file template at arm's length.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.