Question

I have html snippets and i was wondering where I should keep them… For example:

Currently I have the following in my HTML page

<div id="Mailbox" class="ui-corner-all">
    <div id="Messages">
        <ul class="messageList">
            <li class="noMessage">You have no messages</li>
        </ul>
    </div>
    <div class="trashIcon ui-corner-bottom">
        Delete Selected Message(s)
    </div>
</div>

Then, when the page loads, jquery and javascript turns this into a full functioning mailbox system.

What I am wondering is – Should I bother with the HTML snippet, or just build the entire thing through JS?

Answer 1

Having the markup in your page potentially degrades much better for users with no script. Plus, it’s usually easier to work with existing markup than build it completely from scratch with JavaScript.

Sometimes templating can be an appropriate solution. This will not degrade for users without script, but if you have a script-heavy page that needs to create a lot of markup dynamically, templates can make this simpler.

If you find that you are duplicating blocks of markup from page to page, this should probably be addressed server-side by storing the common content in a single location.