Help Me with my homepage.

Discussion in 'Review My Site' started by websitedude, Sep 5, 2010.

  1. essellar

    essellar Community Advocate Community Support

    Messages:
    3,295
    Likes Received:
    227
    Trophy Points:
    63
    Callum's right. Don't take it personally; we were all n00bs at one point. Your markup should probably look a lot more like this:

    HTML:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 FINAL//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html lang="en-gb">
    <head>
       <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
       <meta http-equiv="Content-Language" content="en-gb">
       <title>Play Free online games at iGames | iGames:The place for online games </title>
    </head>
    <body>
       <div id="container">
          <div id="header">
             <img id="logo" src="" height="" width="" alt="[iFreeGames Logo]" />
             <h1 id="page_title">The place for Online Gaming</h1>
          </div><!-- end header div -->
          <div id="navigation">
             <ul id="nav_links_list">
                <li><a href="free%20online%20gaming.htm">Games</a></li>
                <li><a href="profile.htm">iGames Connect</a></li>
                <li><a href="http://igamesforums.proboards.com/index.cgi">Forums</a></li>
                <li><a href="http://www.facebook.com/pages/IGames/124871420891978?ref=ts">Facebook</a></li>
                <li><a href="http://www.twitter.com/igames_">Twitter</a></li>
             </ul><!-- end nav_links_list -->
          </div><!-- end navigation div -->
          <div id="main_content">
             <div class="local_content">
                <div class="article">
                   <h2>News</h2>
                   <p>Ok the latest news is everything on iGames pretty much is under construction since a new home page went on we decided to revamp everything we could get our hands on so the site is very slow at the moment but bear with us because the experience at the end will be amazing.</p>
                </div><!-- end article class div -->
                <div class="article">
                   <h2>Welcome to iGames</h2>
                   <p>Welcome to iGames your places for all the best free online games including, car games, shooting games and Sports games, Political games, Tycoon games, Simulation games, Skill games, Networking games, Random games, Multiplayer games and Game arcades. Also we make some of our games our selves making your experience on iGames even more pleasurable. All our games are updated every week to build up our collection of ours games to above 100 embedded games. What are you doing reading this go and play our games!</p>
                </div><!-- end article class div -->
                <div id="latest">
                   <h2>Latest Games</h2>
                   <ul id="latest_links_list">
                      <li class="item"><a class="uniIcon" href="http://www.miniclip.com/games/fragger/en/"><img title="Play Fragger" alt="Fragger" src="./Play Free_files/fraggersmallicon.jpg" width="70" height="59"></a></li>
                      <li class="item"><a href="Fragger%20lost%20city.htm">Fragger Lost City</a></li>
                      <li class="item"><a href="AirPort_Mania.htm">Airport Mania</font></a></li>
                      <li class="item"><a href="Obama_Alien_Defence.htm">Obama Alien defence</a></li>
                      <li class="item"><a href="Presedential_paint_ball.htm">Presidential Paintball</a></li>
                   </ul><!-- end latest_links_list -->
                </div><!-- end latest div -->
             <div><!-- end local_content class div -->
             <div class="external_content">
                <ul class="categories">
                   <li class="category">Shooting
                      <ul class="items">
                         <li class="item"><a href="Ove-rlord.htm">OverLord</a></li>
                         <li class="item"><a href="A.L.I.A.S.htm">A.L.I.A.S</a></li>
                         <li class="item"><a href="Sundown%20shoot%20off.htm">Sundown Shootoff</a></li>
                         <li class="item"><a href="alias%202.htm">A.L.I.A.S 2</a></li>
                         <li class="item"><a href="battle%20over%20berlin.htm">Battle over Berlin</a></li>
                         <li class="item"><a href="captain_usa.htm">Captain USA</a></li>
                      </ul><!-- end items list -->
                   </li>
                   <li class="category">Sports
                      <ul class="items">
                         <li class="item"><a href="mini_%20pool%202.htm">Mini Pool 2</a></li>
                         <li class="item"><a href="mini%20pool%C2%AD_3.htm">Mini Pool 3</a></li>
                         <li class="item"><a href="Bowling_.htm">Bowling</a></li>
                         <li class="item"><a href="surfs%20up.htm">Surfs Up</a></li>
                         <li class="item"><a href="ping%20_pong.htm">Ping Pong</a></li>
                         <li class="item"><a href="air%20hockey].htm">Air Hockey</a></li>
                      </ul><!-- end items list -->
                   </li>
                   <li class="category">Skill
                      <ul class="items">
                         <li class="item"><a href="Air_Balloon_Rally.htm">Air Balloon Rally</a></li>
                         <li class="item"><a href="Colours_.htm">Colours</a></li>
                         <li class="item"><a href="Wordzs.htm">Wordz</a></li>
                         <li class="item"><a href="Master_Checkersd.htm">Master Checkers</a></li>
                         <li class="item"><a href="Arms_dealer.htm">Arms Dealer</a></li>
                         <li class="item"><a href="Connect_2.htm">Connect 2</a></li>
                      </ul><!-- end items list -->
                   </li>
                   <li class="category">Simulation
                      <ul class="items">
                         <li class="item"><a href="Air%20traffic%20cheif.htm">Air Traffic Chief</a></li>
                         <li class="item"><a href="sim%20air%20traffic.htm">Sim Air Traffic</a></li>
                         <li class="item"><a href="sim%20rescue.htm">Sim Rescue</a></li>
                      </ul><!-- end items list -->
                   </li>
                   <li class="category">Car
                      <ul class="items">
                         <li class="item"><a href="formula%20fog.htm">Formula Frog</a></li>
                         <li class="item"><a href="sim%20taxi.htm">Sim Taxi</a></li>
                         <li class="item"><a href="taxi%20driving%20game.htm">Taxi Driving School</a></li>
                         <li class="item"><a href="planet%20racer.htm">Planet Racer</a></li>
                         <li class="item"><a href="crazy-taxi.htm">Crazy Taxi</a></li>
                         <li class="item"><a href="rickshaw%20racing.htm">Rickshaw Jam</a></li>
                      </ul><!-- end items list -->
                   </li>
                   <li class="category">Multiplayer
                      <ul class="items">
                         <li class="item"><a href="Tanks.htm">Tanks</a></li>
                         <li class="item"><a href="Bunny%20wars.htm">Multiplayer Bunny Wars</a></li>
                         <li class="item"><a href="conquer%20antartic.htm">Conquer Antartica Multiplayer</a></li>
                         <li class="item"><a href="Match%204.htm">Match 4</a></li>
                         <li class="item"><a href="chess.htm">Multiplayer Chess</a></li>
                         <li class="item"><a href="Multiplayer%20checkers.htm">Multiplayer Checkers</a></li>
                      </ul><!-- end items list -->
                   </li>
                   <li class="category">Tycoon
                      <ul class="items">
                         <li class="item"><a href="7%20seas%20estater.htm">7 Seas Estate</a></li>
                         <li class="item"><a href="sim%20lemonade%2030%20days.htm">Sim Lemonade 30 Days</a></li>
                         <li class="item"><a href="sim%20lemonade%20millonaire.htm">Sim Lemonade Millionaire</a></li>
                         <li class="item"><a href="Farm_%20Mania.htm">Farm Mania</a></li>
                         <li class="item"><a href="Youda%20_farmer.htm">Youda Farmer</a></li>
                         <li class="item"><a href="Dinner_at_%20romeos.htm">Dinner at Romeos</a></li>
                      </ul><!-- end items list -->
                   </li>
                   <li class="category">Other Genres
                      <ul class="items">
                         <li class="item"><a href="Network%20games.htm">MMOG</a></li>
                         <li class="item"><a href="homemadegames.htm">Homemade Games</a></li>
                         <li class="item"><a href="Retro_Games.htm">Retro Games</a></li>
                         <li class="item"><a href="politics%20games.htm">Political Games</a></li>
                         <li class="item"><a href="RPG-Games.htm">RPG Games</a></li>
                         <li class="item"><a href="Highscore_games.htm">Highscore Games</a></p><p></li>
                      </ul><!-- end items list -->
                   </li>
                </ul><!-- end categories list -->
             </div><!-- end external_content div -->
             <div id="ads">
                <a href="http://marketplace.xbox.com/en-US/games/media/66acd000-77fe-1000-9115-d802585504fb/"><img border="0" src="http://igames.org.uk/Advert.jpg" width="128" height="724"></a><p></p>
             </div><!-- end ads div -->
          </div><!-- end main_content div -->
          <div id="footer">
             <p>Thank you for using iGames: the place for online Games</p>
             <ul id="footer_links_list">
                <li><a href="FAQs.htm">FAQs</a></li>
                <li><a href="Advertising.html">Advertising</a></li>
                <li><a href="buisness%20site.html">Business site</a></li>
                <li><a href="http://www.myriad.x10hosting.com/">Myriad</a></li>
                <li><a href="Turbo_Cow_GAmes.html">Turbo Cow Games Studio</a></li>
                <li><a href="sitemap.html">SiteMap</a></li>
             </ul><!-- end footer_links_list -->
          </div><!-- end footer div -->
       </div><!-- end container div -->
    </body>
    </html>
    
    By itself, it won't look anything like what you want, but it means exactly what you want. The looks come later (and there's a character limit on postings here).
     
  2. essellar

    essellar Community Advocate Community Support

    Messages:
    3,295
    Likes Received:
    227
    Trophy Points:
    63
    ... a character count which, by the way, I originally exceeded. I had to remove a few things from the page to get under the limit -- your metadata (description and keywords) and the hit stats script. Putting them back is no problem. Note that I've done away with your image-swapping JavaScript and the image-based navigation -- neither of them are necessary, since CSS can handle the job all by itself. (And note that most browsers don't support deferring JS anyway.)

    You may have noticed that I left tables out of the equation. They would have been a good semantic fit as well, but in this case I've decided that lists (and lists of lists) are a better fit given the layout you are trying to achieve. Without styling, they're just bullet lists. That may not be the look you were going for, but that's what they are at a conceptual level. The trick is to make them look like something other than the default bullet lists. Two of the lists (the top navigation and the footer) should turn into a horizontal menu, and nine of them should turn into "feature boxes" (the "latest" list and the eight gaming categories). None of them should look like a bullet list, though, so we'll de-list-ify them with the following CSS:

    Code:
    #nav_links_list, #latest_links_list, #footer_links_list, ul.categories, ul.items {
    list-style: none;
    margin: 0;
    padding: 0;
    text-indent: 0;
    } 
    
    Warning: doing that and nothing else will make a bigger mess of things than you now have. Unfortunately, unless someone takes over the reigns in the meantime, you'll have to wait for the next episode -- I have to step out again for a couple of hours. (I'm at the mercy of my care providers and their schedules, as I'm severely disabled and unable to care for myself.)
     
  3. v4xde

    v4xde New Member

    Messages:
    74
    Likes Received:
    0
    Trophy Points:
    0
    Hi,

    As others have told you, change things around like: CSS, don't use backgrounds for text, HTML, etc.

    Also, you may need to think to go back to use old HTML instead of HTML5. This is because of browsers compatibility.
    Than use old technology, and your site will be faster than Google's 1st page entering (now that they have JS).

    v
     
  4. websitedude

    websitedude New Member

    Messages:
    218
    Likes Received:
    0
    Trophy Points:
    0
    [​IMG]

    But that looks nothing like the home page with no background or anything as well as the text for catergoris being in a list down instead of how they were in the middle of the page help again please
     
  5. Gonrah

    Gonrah Member

    Messages:
    98
    Likes Received:
    2
    Trophy Points:
    8
    You forgot CSS.
     
  6. websitedude

    websitedude New Member

    Messages:
    218
    Likes Received:
    0
    Trophy Points:
    0
    ok im using frontpage and im not 100% sure it works with css and yes i know i should use dreamweaver but i got frontpage for free
     
  7. callumacrae

    callumacrae not alex mac Community Support

    Messages:
    5,257
    Likes Received:
    97
    Trophy Points:
    48
    Don't use frontpage. Don't use dreamweaver. Notepad is free, use it.

    ~Callum
     
  8. Gonrah

    Gonrah Member

    Messages:
    98
    Likes Received:
    2
    Trophy Points:
    8
    Why you are using Dreamweaver? You do not need WYSIWYG software. You can write everything alone with simple free source code editor like Notepad++ or CodeBrowser.
     
  9. websitedude

    websitedude New Member

    Messages:
    218
    Likes Received:
    0
    Trophy Points:
    0
    yep now using it as you speak but im no genius at any style of coding and can only work out basic stuff so can you tell me how to use my background in css because id rather use that then block colour and how do i insert the boxes that are part of the background on the original homepage
     
  10. Gonrah

    Gonrah Member

    Messages:
    98
    Likes Received:
    2
    Trophy Points:
    8
    You can set a background for specific class of <div> and there you can put your game lists.

    ---------- Post added at 01:26 PM ---------- Previous post was at 01:23 PM ----------

    I am also a newbie in web design and so I cant help you with pure code but I am sure that Alex Mac, essellar and other can do it.
     
  11. websitedude

    websitedude New Member

    Messages:
    218
    Likes Received:
    0
    Trophy Points:
    0
    right ok I've been doing this wrong back in the old day credits were awarded for everything. So i will give all my credits to the person who can write the code i need to make the page look how it should including also the css and stuff. I'm sure with in time and after doing courses I will learn more in depth coding but for now I would like someone else to do it if you don't mind. Aswell as all my credits an advertising spot on my site is also up for grabs with an average of our 900 page views a month on the site.

    Thanks
     
  12. websitedude

    websitedude New Member

    Messages:
    218
    Likes Received:
    0
    Trophy Points:
    0
    The problem should now be fixed :)
     
  13. callumacrae

    callumacrae not alex mac Community Support

    Messages:
    5,257
    Likes Received:
    97
    Trophy Points:
    48
    Credits are disabled :)

    There is still a problem or 38 on the main page. Something this big, you won't be able to get anyone to do it for free, I'm afraid.

    ~Callum
     
  14. Gonrah

    Gonrah Member

    Messages:
    98
    Likes Received:
    2
    Trophy Points:
    8
    You have placed box titles of the first row (Shooting Games, Sport Games . . .) higher than the second (Car Games, Multiplayer Games, ).It is small, but when I see it, I guess that others also will notice it.
     
  15. essellar

    essellar Community Advocate Community Support

    Messages:
    3,295
    Likes Received:
    227
    Trophy Points:
    63
    What part of "don't use a background image to format the tables" is it that you didn't understand? As long as you insist on having the boxes as part of the background image, you are going to have alignment problems. Each of those lists can "draw" its own box around itself, and can find its rightful place on the page -- no matter how wide or narrow the user's screen is.

    What I gave you before is a good starting point, and it is how the page should look in HTML. The CSS will "unlist" the bullet lists. You seriously need to learn some CSS (things like display, float, background-color, width, height and so on) -- there isn't a lot to it if you're willing to learn. And yes, step away from Frontpage permanently. Avoid Dreamweaver as well until you know what you're doing in HTML and CSS. Dreamweaver can be a great tool, but you need to overhaul its output, and that means knowing what the HTML means. The alternative is to break down and pay somebody (not in credits) to do the work for you. There are many hours of work to get from where you are to where you want to go. My billing rate (when I was still able to work) was $US100/hr (oh, but I was worth it), though I'm sure you can get it done for a lot less using something like RentACoder or offering anything here more substantial than credits you can't pay anyway and an advertisement that nobody I want to advertise to will ever see.
     
  16. mosimages

    mosimages New Member

    Messages:
    31
    Likes Received:
    0
    Trophy Points:
    0
    HTTP 403 Forbidden??

    (sorry ..if it answered in other page..i read this tread from last page):wink:
     

Share This Page