CODEWITHSUNDEEP
htmlcsshtml-generation
Kira M. Backes
Kira M. Backes

Reputation: 550

Automatic HTML generation guidelines for maximum CSS stylability

I'd like to ask about your experience with automatic HTML generation and what should coders consider to reach a maximum stylability? Please add good guidelines and please explain the reason for them.

I'll start with 3 points:

  1. You create a div or a td or anything else with text content.. Put a span in it!

    <div><span>text content</span></div>

    instead of

    <div>text content</div>

    Reason: Sometimes you have to apply a different styling to the text content. If you can only access it indirectly by the surrounding div some things aren't possible.

  2. Put BRs behind divs!

    <div id="myId">foo bar</div><br>

    instead of

    <div id="myId">foo bar</div>

    Reason: Let's say you decide to let some divs float left, you'll need to clear left after them. You can do that now with

    div#myId + br {
  clear: left;
}

    And if you don't need the br, you can simply do:

    div#myId + br {
  display: none;
}

    Without that appended br the floating of divs is a real hassle and you can't properly align the content.

  3. This 'should' be a no-brainer but still: Use classes and IDs, so that you can properly access every item in CSS.

Okay, that's what I found out, now it's your turn to extend this collection of guidelines :-)

Upvotes: 0

Views: 137

Answers (1)

DA.
DA.

Reputation: 40673

point #1: if neither the DIV nor SPAN have a class or ID, then they are equally difficult to style. I'd never add extra markup for the sake of CSS, either. I wouldn't suggest this particular method.

point #2: Same as above. I despise systems that put extra markup in the HTML.

point #3: Yes. I definitely agree with that one. Granted, that's easier said than done.

I'm not sure what kind of 'automatic generation system' you are creating, but let's assume it's a CMS. As such, I'd recommend the following:

  1. The CMS should not be a design management system. It should manage content.

  2. The CMS should not really create any HTML (other than semantic markup of the content itself such a paragraph, list, blockquote tags, etc). The HTML should be created by someone managing the templates. There should be page templates, section templates, and content templates...all editable by a developer.

Wordpress does this well, for example.

Upvotes: 2

Related Questions