Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New Coder
    Join Date
    Jan 2012
    Posts
    18
    Thanks
    5
    Thanked 1 Time in 1 Post

    hidden heading? still seen by search engine?

    if i hide a heading or something will the search engine still be able to pick it up?

    maybe i should be more specific
    so theres two ways to hide an element but what i want to know is ... if a search engine like google will still recognize the hidden element


    http://w3schools.com/css/css_display_visibility.asp


    visibility:hidden hides an element, but it will still take up the same space as before. The element will be hidden, but still affect the layout.
    Code:
    <html>
    <head>
    <style type="text/css">
    h1.hidden {visibility:hidden;}
    </style>
    </head>
    
    <body>
    <h1>This is a visible heading</h1>
    <h1 class="hidden">This is a hidden heading</h1>
    <p>Notice that the hidden heading still takes up space.</p>
    </body>
    </html>
    display:none hides an element, and it will not take up any space. The element will be hidden, and the page will be displayed as the element is not there:
    Code:
    <html>
    <head>
    <style type="text/css">
    h1.hidden {display:none;}
    </style>
    </head>
    
    <body>
    <h1>This is a visible heading</h1>
    <h1 class="hidden">This is a hidden heading</h1>
    <p>Notice that the hidden heading does not take up space.</p>
    </body>
    
    </html>
    Last edited by lookkool3; 01-21-2012 at 04:49 AM.

  • #2
    New Coder
    Join Date
    Jun 2011
    Location
    Denver, CO
    Posts
    23
    Thanks
    0
    Thanked 7 Times in 7 Posts
    Content is still there even with display:none. Yes, it's all hidden, but it still gets put on the page (and search engines will look for actual content, not the fact that it's hidden).

  • #3
    Senior Coder Arbitrator's Avatar
    Join Date
    Mar 2006
    Location
    Splendora, Texas, United States of America
    Posts
    3,302
    Thanks
    28
    Thanked 276 Times in 270 Posts
    Quote Originally Posted by lookkool3 View Post
    if i hide a heading or something will the search engine still be able to pick it up?
    Google reads the HTML, so, of course, it will know that that content is there. There's no telling how their algorithm uses such content though since it's secret if I'm not mistaken.

    If you're trying to manipulate search results, note that they consider that an offense that warrants de-indexing your Web site; see http://support.google.com/webmasters...n&answer=66353.
    For every complex problem, there is an answer that is clear, simple, and wrong.

  • Users who have thanked Arbitrator for this post:

    lookkool3 (01-21-2012)

  • #4
    New Coder
    Join Date
    Jan 2012
    Posts
    18
    Thanks
    5
    Thanked 1 Time in 1 Post
    lol i wasn't guna do that but that seem like a good idea now that you mention it jk jk ... i was actually going to make the header an image since the font looks better as an image but i still wanted it to have the text of what the header says some where in the code so if can be like hidden inside ya know? that way im not really losing any key words but im still new to all this stuff i bet theres a better to do that like the meta tags aint that for search engines?

  • #5
    Senior Coder Arbitrator's Avatar
    Join Date
    Mar 2006
    Location
    Splendora, Texas, United States of America
    Posts
    3,302
    Thanks
    28
    Thanked 276 Times in 270 Posts
    Quote Originally Posted by lookkool3 View Post
    lol i wasn't guna do that but that seem like a good idea now that you mention it jk jk ... i was actually going to make the header an image since the font looks better as an image but i still wanted it to have the text of what the header says some where in the code so if can be like hidden inside ya know? that way im not really losing any key words but im still new to all this stuff i bet theres a better to do that like the meta tags aint that for search engines?
    If you plan to use an image representation of text, the proper way to supply the text to a search engine is to put it in the alt attribute of an img element. For example:

    Code:
    <header>
    	<h1><img alt="CodingForums.com: Web coding and development forums" width="361" height="67" src="http://www.codingforums.com/img/logo.gif"></h1>
    </header>
    The search engine will simply see <h1>CodingForums.com: Web coding and development forums</h1>, and users that have images disabled (maybe because they're on a mobile phone) will see this text also.

    Alternatively, you can use CSS3 Fonts or an object element which would allow a more optimal structure for the above case:

    Code:
    <header>
    	<hgroup>
    		<h1>CodingForums.com</h1>
    		<h2>Web coding and development forums</h2>
    	</hgroup>
    </header>
    Last edited by Arbitrator; 01-21-2012 at 09:13 AM. Reason: I added the second code block and mentioned the |object| element.
    For every complex problem, there is an answer that is clear, simple, and wrong.

  • Users who have thanked Arbitrator for this post:

    lookkool3 (01-23-2012)


  •  

    Posting Permissions

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