SitePoint Sponsor

User Tag List

Page 2 of 3 FirstFirst 123 LastLast
Results 26 to 50 of 63
  1. #26
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,287
    Mentioned
    51 Post(s)
    Tagged
    2 Thread(s)
    Y'know, I was moving away from using Web Site Name as h1 and page itself as h2, cause everyone was saying that Coca Cola's About page is really title'd "About" and not "Coca-Cola: About" however...
    when someone asked me what that name was, was it not also a title? And, well, it is. If it's ONLY a logo sure, it's a logo, make it a whatever and stick the image on top with image replacement or make it content as an HTML image, but the name of the Web Site has to be SOME sort of title on your page as well.

    The name of the company on a company site IS a title. I couldn't make myself start with the company name as a h2 and then have the title of the main content an h1 because that's screwing with the order, so I ended up going back to using an h1 for company/website title and using h2 for the main page title. This means for me only a single h2 allowed and everything else is an h3 or lower.

    I know Teh googlies don't index sites but lone pages. However the About page of either my company or Coca Cola's are differentiated by the fact that one about is but a single page belonging only to Coca Cola and my about belongs to me, and the text saying so is a sort of title.

    If I take two books or newspapers and rip all the pages out and scatter them around (what teh interTubes do), the pages as single documents may have "About" as their titles, however they belong under yet another title, another heirarchy, and that's the book or newspaper they belong to, if it's listed on that page. Googles may see pages as standalone, but they simply aren't. They belong to someone and I can't think of anything other than a title to define that someone's name.

    I'm sooooo waffley, I should be a politician.

    <p id="title">Name of website<span></span></p>
    <h1>About Us</h1>

    I just can't do this anymore. Why am I naming p "title" and not making it a header? That's just... so wrong, I can't. Making "title" into "companyname" still means "name" and that's just me playing semantics with myself to make mee feel better : (

  2. #27
    SitePoint Evangelist
    Join Date
    Jun 2008
    Posts
    455
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I have read Building Findable Websites by Aarron Walter and it specifies that H1 should be used for the header of your website, like the logo then H2, etc should be used for the rest of the content where h2 takes the importance of the h1 tag within content.

    I've started to use h1 for implementing website logos etc.
    Code:
    <h1 id="xxxx-logo">A bit about the website with keywords</h1>
    (The logo would be implemented using css).

    Previously I was using
    Code:
    <div id="logo"><img src="xxxxxxx" title="xxx"></div>

    The first example provides more useful and relavent content for Search Engines to gobble up.

  3. #28
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by JimmyP View Post
    What would you recomend for a blog? (where all posts are listed on front page)
    That could be a legitimate reason for multiple top-level headings.

    Another option is to use a single H1 for the blog name and use H2s for article headings. That's what I do, but it's not The Only Correct Way™.
    Birnam wood is come to Dunsinane

  4. #29
    SitePoint Wizard silver trophybronze trophy
    Join Date
    Jul 2008
    Location
    New York, NY
    Posts
    1,432
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Stomme poes View Post
    Y'know, I was moving away from using Web Site Name as h1 and page itself as h2, cause everyone was saying that Coca Cola's About page is really title'd "About" and not "Coca-Cola: About" however...
    when someone asked me what that name was, was it not also a title? And, well, it is. If it's ONLY a logo sure, it's a logo, make it a whatever and stick the image on top with image replacement or make it content as an HTML image, but the name of the Web Site has to be SOME sort of title on your page as well.

    The name of the company on a company site IS a title. I couldn't make myself start with the company name as a h2 and then have the title of the main content an h1 because that's screwing with the order, so I ended up going back to using an h1 for company/website title and using h2 for the main page title. This means for me only a single h2 allowed and everything else is an h3 or lower.

    I know Teh googlies don't index sites but lone pages. However the About page of either my company or Coca Cola's are differentiated by the fact that one about is but a single page belonging only to Coca Cola and my about belongs to me, and the text saying so is a sort of title.

    If I take two books or newspapers and rip all the pages out and scatter them around (what teh interTubes do), the pages as single documents may have "About" as their titles, however they belong under yet another title, another heirarchy, and that's the book or newspaper they belong to, if it's listed on that page. Googles may see pages as standalone, but they simply aren't. They belong to someone and I can't think of anything other than a title to define that someone's name.

    I'm sooooo waffley, I should be a politician.

    <p id="title">Name of website<span></span></p>
    <h1>About Us</h1>

    I just can't do this anymore. Why am I naming p "title" and not making it a header? That's just... so wrong, I can't. Making "title" into "companyname" still means "name" and that's just me playing semantics with myself to make mee feel better : (
    You bring a good argument to the table. I worked with this guy that would do something like this:

    Code:
    <a id="logo" title="..." href="/"><img src="logo.gif" alt="..." /></a>
    
    <h1><span>Site Name -</span> About</h1>
    
    h1 span { 
    	position: absolute;
    	top: 0;
    	left: -999em;
    }

  5. #30
    SitePoint Addict rochow's Avatar
    Join Date
    Oct 2006
    Location
    Queensland, Australia
    Posts
    300
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The logo is the branding of that website, it has more meaning than the simple text that its made up of. That's why it should be an image.

    However.................

    I've come across sites I've coded which have no real <h1>, so what to do there? There will be a few headings in the content section and I can't technically make them all <h1>'s, and can't technically make them all <h2>'s... and can't make the logo a <h1> on the homepage then an image on subpages where there IS a <h1> (well can, but its stupid). I've used <h2>'s for them all just had no <h1> on that particular page, not an ideal solution though.

    Ideas?

  6. #31
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,287
    Mentioned
    51 Post(s)
    Tagged
    2 Thread(s)
    Yeah I've also had pages where the company name was definitely the Title of the Index Page but on inner pages it was just there because 1. it was a section of the company's site and 2. they want the logo on each page

    If there's nothing that can really be an h1 though, possibly the copy needs to be rewritten and the info on the pages reshuffled? Generally a page should mostly be about one thing.

    That's why often if the logo also happens to have the little slogan text with it, all that text is dumped into image replacement and using ds's <small> technique, and often in an h1 depending on the page.

    You could also do the #index h1 and p or img styles, and the rest of the pages different h1/p/img styles, though that's not really great if the idea is that each page on the site looks about the same and follows the same design.

  7. #32
    SitePoint Wizard silver trophybronze trophy
    Join Date
    Jul 2008
    Location
    New York, NY
    Posts
    1,432
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    There are some 'developers' that add a h1 that is hidden to the viewer.

  8. #33
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,287
    Mentioned
    51 Post(s)
    Tagged
    2 Thread(s)
    Can't think of a reason for that, though I've seen Mike Cherim add OTHER headers which are invisible to the viewer. Can't remember if that was mentioned in this thread or another. He has a good reason for it, but I don't think I'd do it with an H1.

  9. #34
    SitePoint Wizard silver trophybronze trophy
    Join Date
    Jul 2008
    Location
    New York, NY
    Posts
    1,432
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yeah, I was looking through Mike's experiments. He has some pretty neat stuff

  10. #35
    SitePoint Enthusiast
    Join Date
    Jul 2006
    Posts
    34
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Again, thanks for all your opinions.

    Out of curiosity, I've taken a look at how some of the big ones do it, and found interesting things.

    Molly Holzschlag:
    • image for a logo
    • h1 for site navigation title
    • also h1 for a title, 'molly.com', which I believe is on every page
    • h2 for post date
    • h3 for post title


    Eric Meyer:
    • h1 for logo
    • h3 for post title
    • no h2 on the home page at least


    Dave Shea: h1 for logo

    ALA:
    • h1 for logo
    • no h2 on the home page
    • h3 for date
    • h4 for post title


    An interesting assortment, I think. Not very helpful, perhaps, in deciding.

  11. #36
    SitePoint Addict rochow's Avatar
    Join Date
    Oct 2006
    Location
    Queensland, Australia
    Posts
    300
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    - h3 for date
    - h4 for post title
    What the heck... perhaps because the date comes first, their logic is the date is the heading, with the posts made on that date being the sub-heading (as there are multiple posts under that date)

    From their site:

    <h1 id="masthead">
    <a href="/"><img src="/pix/alalogo.gif" alt="A LIST Apart: For People Who Make Websites" /></a>
    </h1>
    and this:

    <div id="ishintro"><p>Fine-tuning the mechanics of progressive enhancement. Rethinking the assumptions of standards-based design.</p></div>
    I'm guessing it hasn't been updated in years...

  12. #37
    SitePoint Wizard silver trophybronze trophy
    Join Date
    Jul 2008
    Location
    New York, NY
    Posts
    1,432
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I agree with Rochow.

    Being that these specific sites are obviously outdated, I would not 'follow' the rule of thumb presented.

    Also, a lot of the time, developers get so involved with presentation, that they forget about the 'separation' of data.

  13. #38
    SitePoint Addict rochow's Avatar
    Join Date
    Oct 2006
    Location
    Queensland, Australia
    Posts
    300
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by cooper.semantics View Post
    Also, a lot of the time, developers get so involved with presentation, that they forget about the 'separation' of data.
    This is true especially with your own sites. With someone else's site, you follow their design and your job is solely to work on the HTML and CSS - when it's your own site though, its easy to put too much emphasise on the design and not do a proper job on the HTML and CSS.

  14. #39
    SitePoint Enthusiast
    Join Date
    Jul 2006
    Posts
    34
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Strange, though, as you would think that if someone would write proper HTML and CSS, those guys would - but you're right: some of the things I quoted are clearly not very good practice.

  15. #40
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by curiousn View Post
    Strange, though, as you would think that if someone would write proper HTML and CSS, those guys would
    Why? Becoming famous is more a result of good marketing than of spectacular skills.
    Birnam wood is come to Dunsinane

  16. #41
    SitePoint Addict rochow's Avatar
    Join Date
    Oct 2006
    Location
    Queensland, Australia
    Posts
    300
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If anything it's quite the opposite (famous = not great skills). Ever heard the saying "those who can't do, teach?". Similar to when you become a manager you lose your skills as you aren't actively doing all the work.

  17. #42
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Molly, Eric, Dave and Jeffrey definitely have great skills, but they are only human. No one is perfect and everyone makes mistakes.
    Birnam wood is come to Dunsinane

  18. #43
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,287
    Mentioned
    51 Post(s)
    Tagged
    2 Thread(s)
    Comes back and bites them sometimes. I've seen more than once someone here posts something, and someone else digs up their own personal site and says, "you mean do it like you didn't here?"

    But who's more important, you or your clients? The work you do for your clients I think can (should) speak more than whatever garbage pit you live in at home, yeah?
    It's gotta be pretty hard to redo a site like ALA when you can't afford to break any old stuff, esp when it starts numbering in the hundreds of pages.

  19. #44
    SitePοint Troll disgracian's Avatar
    Join Date
    Aug 2006
    Location
    Samsara
    Posts
    451
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I've long used this model, and I'd be interested to hear other opinions on it:
    HTML Code:
    <h1><img width="x" height="y" src="/path/to/img" alt="Text for non-image browsers"></h1>
    It marks up (or appears to) the alt text as a level 1 heading when images are disabled.

    Cheers,
    D.

  20. #45
    SitePoint Wizard silver trophybronze trophy
    Join Date
    Jul 2008
    Location
    New York, NY
    Posts
    1,432
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by disgracian View Post
    I've long used this model, and I'd be interested to hear other opinions on it:
    HTML Code:
    <h1><img width="x" height="y" src="/path/to/img" alt="Text for non-image browsers"></h1>
    It marks up (or appears to) the alt text as a level 1 heading when images are disabled.

    Cheers,
    D.
    I would refrain from putting an image inside a <hx> tag.
    Also, if you are using the branding-logo as your <h1> I would tell you to rethink your approach.

  21. #46
    SitePοint Troll disgracian's Avatar
    Join Date
    Aug 2006
    Location
    Samsara
    Posts
    451
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Why?

    Cheers,
    D.

  22. #47
    SitePoint Wizard silver trophybronze trophy
    Join Date
    Jul 2008
    Location
    New York, NY
    Posts
    1,432
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I advise you read this entire thread, but here is an example of what I do:

    Code:
    <div id="branding">
    	<img src="" alt="" width="" height="" /><!-- Branding logo -->
    	<p>......</p><!-- Tagline + hidden information --><!-- EDITED TO NOT CONFUSE ANYONE -->
    </div>	
    
    <div id="content">
    	<h1>About</h1>
    	.......
    </div>
    One huge reason out of the bunch why I do not use 'graphic headers' is because,
    I build a lot of sites that entail internationalization.

    I think since headers are important, they should be most accessible for everyone.

    Text is the most accessible thing when used correctly.
    1. Do not size text in pixels.
    2. Do not size text in absolute units of measurement.

    Technically, pixels are relative units of measurement but, ie6 does not agree, therefore, ie will not scale text sized in pixels.
    Last edited by cooper.semantics; Oct 6, 2008 at 19:27.

  23. #48
    SitePoint Addict rochow's Avatar
    Join Date
    Oct 2006
    Location
    Queensland, Australia
    Posts
    300
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Why a <p> for the tagline? Usually they aren't paragraphs, merely a few words

  24. #49
    SitePοint Troll disgracian's Avatar
    Join Date
    Aug 2006
    Location
    Samsara
    Posts
    451
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I read the thread before posting. Other than not marking up the site name with h1, I can't see a single practical drawback to using hx to mark up alt text. I even used your criteria:
    Quote Originally Posted by cooper.semantics View Post
    A good practice to test your solutions:

    1. Disable stylesheets
    2. Disable images
    3. Print preview
    3/3.

    Cheers,
    D.

  25. #50
    SitePoint Addict rochow's Avatar
    Join Date
    Oct 2006
    Location
    Queensland, Australia
    Posts
    300
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by disgracian View Post
    I read the thread before posting. Other than not marking up the site name with h1, I can't see a single practical drawback to using hx to mark up alt text. I even used your criteria:

    3/3.

    Cheers,
    D.
    Well that's easy: The <h1> tag is for the main heading on the page, and the logo is NOT the main heading of the page (as much as some fanboys try to argue that it is)


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
  •