HiveBrain v1.2.0
Get Started
← Back to all entries
patternhtmlMinor

Improve HTML structure?

Submitted by: @import:stackexchange-codereview··
0
Viewed 0 times
improvestructurehtml

Problem

I am not new to html however would like to know about best practices. I need to develop a layout like this:

This is what I have proposed:


    
        
            
                
            
            
                Text goes here
                
            
        
        
            
        
    
    
        
            
        
        
            
            
            
            Text goes here
            
        
    


http://jsfiddle.net/gdWM5/

Can this be improved in any way?

Solution

your Table is not declared correctly in the markup.

This:


    


Should look like this


    
        
            
            
        
    


your self closing tag ` means that the row is now closed, you shouldn't have a outside of a row, it is bad structure and won't show correctly in browsers.

HTML is not made up of
's alone. you should include other elements as well, even when you are only figuring out your structure.

Image tags are not
they are ` and as long as you have everything you need inside the attributes, they are self closing tags.

from the looks of the Graphic, you may not need a table, you probably want a list instead of a table. If I were you I would look into an unordered list (you can format how you like with CSS)

Element tags do not have Capital letters in them at all, they are Lowercase.

More Descriptive ID names. If you have something that is going to be styled the same as something else give them class names and declare the style once. if you have one thing that is going to be different, create a class that will style it and the surrounding items the the same and add another class to it and declare it after the other class.

In Closing

I would say that you should figure out your CSS and then post a new question as well (with the CSS)

this is not a finished structure, it looks like something you threw together in about a half an hour. probably took you longer to draw the picture than write the HTML

Code Snippets

<div id="body-main-bottom">
    <Table><tr /><td /></Table>
</div>
<div id="body-main-bottom">
    <table>
        <tr>
            <td></td>
            <td></td>
        </tr>
    </table>
</div>

Context

StackExchange Code Review Q#38891, answer score: 8

Revisions (0)

No revisions yet.