SitePoint Sponsor

User Tag List

Results 1 to 13 of 13
  1. #1
    SitePoint Zealot j3ph's Avatar
    Join Date
    Jan 2006
    Posts
    134
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    How would you explain good html structure to a layman?

    I've been asked to give a workshop on search engine marketing and I'm trying to explain what good html structure is. The problem is that those who will be taking this workshop are not exactly familiar with html.

    Any ideas on how to break it down without giving an entirely different lecture on html?

  2. #2
    SitePoint Wizard bronze trophy Jeff Mott's Avatar
    Join Date
    Jul 2009
    Posts
    1,314
    Mentioned
    19 Post(s)
    Tagged
    1 Thread(s)
    Good HTML should describe what each piece of content is, not what it should look like.
    "First make it work. Then make it better."

  3. #3
    SitePoint Zealot j3ph's Avatar
    Join Date
    Jan 2006
    Posts
    134
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks. That's perfect....

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,331
    Mentioned
    463 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by j3ph View Post
    those who will be taking this workshop are not exactly familiar with html.
    That seems to be a big problem with SEO people (not sure if that's what these folk are into, but ...). They often suggest things that are bad HTML, so it's good that you are doing this. I like what Jeff said. You could elaborate by mentioning that HTML markup gives important semantic signals (that is, the code is meaningful) and so using it for purposes other than what it's intended for is bad practice—like misusing alt and title attributes for keyword stuffing, for example. A client of mine was told by an SEO person the other day to pepper her site with keywords in bold, italic and underlines. Jeesh, apart from being freakingly ugly, I can tell you those elements weren't intended for that purpose.

  5. #5
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,871
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Perhaps you can start by talking about the semantics of various pieces of text and then introduce HTML as the way web pages tell the browser the semantic meaning of each section of the content. That way they will learn what HTML is for before actually learning any HTML.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  6. #6
    SitePoint Zealot j3ph's Avatar
    Join Date
    Jan 2006
    Posts
    134
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I think I've decided to just show them how to search for inline styles, overuse of tables (implying a non-CSS based layout) and proper use of heading tags. Beyond that I feel involves an entirely separate workshop.

  7. #7
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,283
    Mentioned
    51 Post(s)
    Tagged
    2 Thread(s)
    Since there's lots of crap out there about things like title and alt attributes, and how anchors actually work, you probably want to mention those. People who don't know HTML but work with SEO have heard strange things about these and it's probably good to take a bit of time to demystify them.

    http://www.paciellogroup.com/blog/20...tle-attribute/ (you may want to skim through this for your own knowledge)

  8. #8
    Community Advisor silver trophybronze trophy
    dresden_phoenix's Avatar
    Join Date
    Jun 2008
    Location
    Madison, WI
    Posts
    2,821
    Mentioned
    34 Post(s)
    Tagged
    2 Thread(s)
    when speaking to VERY LAYCLIENTS I like to say that markup denotes IMPORTANCE and INTENTION in a fashion something similar to a report outline. Sometimes I will show them an "unstyled" document and how it "flows". It seems to be an effective method to not only to explain markup but for client to provided usable content rather than random text.

  9. #9
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,658
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    You should use my html in my sig as a model. That thing is so clean you could eat off it. I took all my 10 years of knowledge and applied it to it. The only thing I need to do is take some time and format it better. All the includes muff that up. That thing is like a WP site. Every single thing in that site is a include. Making all edits a breeze.

  10. #10
    SitePoint Wizard bronze trophy Jeff Mott's Avatar
    Join Date
    Jul 2009
    Posts
    1,314
    Mentioned
    19 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by EricWatson View Post
    That thing is so clean you could eat off it.
    I think I found a spec of dirt.

    Why do you use <span class="margin"></span> to create the appearance of paragraphs rather than actual paragraphs?
    "First make it work. Then make it better."

  11. #11
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,658
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Jeff Mott View Post
    I think I found a spec of dirt.

    Why do you use <span class="margin"></span> to create the appearance of paragraphs rather than actual paragraphs?
    The expander plugin required it. If I used paragraphs I lost the nice "read less" location. It would br itself down 15px. So I had to resort to that fix. Trust me I messed with it for like 5 hours.

  12. #12
    SitePoint Wizard bronze trophy Jeff Mott's Avatar
    Join Date
    Jul 2009
    Posts
    1,314
    Mentioned
    19 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by EricWatson View Post
    The expander plugin required it. If I used paragraphs I lost the nice "read less" location. It would br itself down 15px. So I had to resort to that fix. Trust me I messed with it for like 5 hours.
    Display inline on the last paragraph seems to do the trick.

    Code:
    <div id="intro">
        <p>Welcome To...</p>
        <p>Whether you’re...</p>
        <p style="display: inline;">When it...</p>
    </div>
    (Obviously you would move that inline style to your CSS file, but you get the idea.)
    "First make it work. Then make it better."

  13. #13
    SitePoint Member
    Join Date
    Feb 2013
    Location
    Pakistan
    Posts
    12
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You can search some information from here.
    http://ezinearticles.com/?Hypertext-...yman&id=589637
    Last edited by Stevie D; Mar 1, 2013 at 07:14. Reason: Off-topic link removed


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •