Wednesday, October 3, 2012

Avoid tables for layout in liferay themes

Please try to avoid tables in your code. Its default make a mobile sites and responsive layouts.
  • If you’re using tables for layout then you’re mixing presentation with content, so your bandwidth usage is higher than need be, as for every page your visitors view, they have to download the same presentational data again and again.
  • Redesigns are a lot harder than they need to be. Since tables can only be laid out on screen one way, if you want to change the layout of a table site, you have to change your tables in every single one of your pages. Not a nice job. With a full CSS site, all you need do is change that one CSS file.
  • Tables really don’t help accessibility for viewers with disabilities. Although your layout may look logical displayed on screen, the order in which it will be read by, say, screen reading software, may be very different. Many countries now have their own laws stating that websites must be accessible to all.
  • Likewise, people visiting your site using PDAs, mobile phones, and the like do not have the screen space that your big flashy table layout demands. A well written CSS site will generally scale far better to smaller and larger screens than a comparable table layout will.
  • Tables are just plain complicated to look at in HTML. Before you even get to any content inside them you’re at three levels of indentation.
  • Tables can hurt search engine ratings. If you’re using a “classic” left hand navigation table, your navigation will be placed before your content in your HTML file. Because Search Engines generally place more importance on the things nearer the beginning of a page, the chances are your content will be largely ignored.
  • Tables can take longer to display correctly than CSS. If you use Internet Explorer, you’ll have seen this many times when loading tabled sites. While everything on the page is downloading, the IE will keep rendering, bouncing the contents of the page back and forth until the download is complete and it knows where to place everything..
So, how should you write pages? With proper semantic markup, that’s how! Your markup shouldn’t be describing how to lay your content out on the page, just what the different parts of your document are. So paragraphs will be inside <p> tags, lists are in <ul> and <ol> tags, etc. For bits that your want to move around the page for your actual layout, use <div> tags.  

7 comments:

  1. Very helpful advice in this particular post! It’s the little changes that make the largest changes. Thanks for sharing!
    Signature:
    i like play games friv4 school online and play games 2 girls 2 online free and play game friv games and games2girls ! have fun!

    ReplyDelete
  2. Very interesting! Thanks you.
    Signature:
    facebook entrar iniciar sesion gratis - Sitio Oficial iniciado sesión en Facebook lengua española. facebook entrar rápido, facebook iniciar sesion en tu cuenta de entrar facebook

    ReplyDelete
  3. Thanks for the great post. Pretty good post. I just stumbled upon your blog and wanted to say that I have really enjoyed reading your blog posts.
    agario is a multiplayer browser game in which players have to eat competitors or be eaten while striving to dominate the world of colorful cells. In agario game, you start off with a small circle and eat smaller static circles and other smaller players. Once you get big enough you will get addicted. With agar io, you have an option to split your circle in two and throw one half at the other players with larger speed, in order to gain more mass. You have the option to play agar.io in a Free For All mode, where you play against everyone, or you can play in teams. Play agario skins online game for free with your friends now!

    ReplyDelete
  4. You topic is very great and useful for us…Thank you for that information you article.
    Signature:
    i like play games happy wheels online and play happy wheels 2 games and friv , girlsgogames , games2girls

    ReplyDelete
  5. invites you to play games for a chance to win cars Corolla Altis car


    Friv Games
    Kizi 100
    Games2Win

    ReplyDelete

  6. the Mobilism Apk is the one of the best

    ios,android App instagram++ store to get

    thetons of free app and game. snapchat++

    Here the latest version of TutuApp of free.Many time game and update 8 ball pool mod apk so they are not

    running tutuapp is also update a app in new feature so downloaad a many app so and check on tutuapp

    ReplyDelete