My first HTML website!

Discussion in 'Web Design and Development' started by ComicStix, Sep 20, 2009.

  1. ComicStix macrumors member

    Joined:
    Aug 29, 2009
    Location:
    Boston, Massachusetts
    #1
    Like I said this is my first ever HTML website. I had to put all my CSS syntax stuff into my HTML document because whenever I linked them to each other the CSS style sheet would not work. Was this a good effort for a first time website?

    ReadySetSkateboard
     
  2. miles01110 macrumors Core

    miles01110

    Joined:
    Jul 24, 2006
    Location:
    The Ivory Tower (I'm not coming down)
    #2
    Ick, it's definitely a first try. I think you've got a ways to go though.
     
  3. RonCarr macrumors regular

    RonCarr

    Joined:
    Sep 12, 2007
    Location:
    Tennessee
    #3
    Okay, wow. I know this is your first shot at coding a site but I will be honest. You have a long way to go.

    The colors are fine, however, you need to find a better way to implement them into the site. I say they are okay because it is a skateboarder site and it should be a little funky/psychedelic. (The grey is a little out of place though.)

    If you are not going to take advantage of the entire page then you really need to center everything so that it looks better.

    The pattern in the background needs to go. Now.

    You need to set the div so that it allows all of the content to be within it.

    I am not really a big fan of vertical navigation but if you like this then please work on it! It's div has no business going the same length as the content section.the dashed borders are not too flattering IMO.

    Add some padding to the text so that it does not go all the way to the edges of the div. Also, don't center the text either.

    Add a footer.

    Hope some of this helps out. Good luck!
     
  4. Chaszmyr macrumors 601

    Chaszmyr

    Joined:
    Aug 9, 2002
    #4
    The brutal truth is that this is pretty bad. With that said, there's pretty much no such thing as a good first effort with something as complicated as web design... What matters is how much you improve over time.
     
  5. JoshBoy macrumors 6502

    JoshBoy

    Joined:
    Oct 12, 2008
    Location:
    Sydney, Australia
    #5
    positive

    Keep trying buddy and keep posting your sites for feedback. Just remember when people tell you stuff you don't want to hear take it on board and move onto the next project with those learnings.

    Good luck mate!!!
     
  6. Consultant macrumors G5

    Consultant

    Joined:
    Jun 27, 2007
    #6
    Unfortunately it doesn't look like you have any design genes.

    Look into wordpress or blogger. You'll be much happier.
     
  7. Wee Beastie macrumors regular

    Joined:
    Aug 20, 2007
    Location:
    In the snow with Rosebud
    #7
    Tough crowd

    Haha okay, so now that you have gotten your ego-bruising out of the way, let's get to some more feedback.

    RonCarr has a couple of good points. I would wrap your header, navigartion and content divs in a div called container and then center it:

    Code:
    
    <div id="container">
    
    <!--START HEADER-->
    <div id="header">
    <img src="http://img87.imageshack.us/img87/6425/34882880c489e1fm3.jpg" border="0" width="880" height="116" alt="BannerFans.com" />
    </div>
    
    <!--START NAVIGATION-->
    <div id="navigation">
    <h1> Navigation</h1>
    </br>
      <ul>
    
      <li>
        <span style="font-size: 36px;text-align:center;"><a href="index.html"> Home </a></span> </li>
      </ul>
    </div>
    
    <!--START CONTENT-->
    <div id="content">
    <h1>Learn to Skateboard!</h1>
      <h2> *Under Renovation*</h2>
    
    <img src="http://4.bp.blogspot.com/_O5fDJGuQat4/SMil17p2ONI/AAAAAAAACGE/-mmOjy3igvY/s400/girl+skateboards+3.JPG" alt="Skateboard" width="500" height="350" align="middle" />
    <p> Have you ever wanted to learn how to skateboard? Ever wanted to ride like the pros? Want to skate with the local kids at the skatepark? Save yourself the embarrassment of going to the skatepark and failing, and learn at your own pace at your home. <b>Learn everything a total beginner would want to know! </b>Keep in mind though that this website is for beginners. If you want to learn how to do tricks I will probably be teaching those later!  Skateboarding is actually not as hard as you would think. All you really need is a skateboard, determination, and gravel!</p>
    <p> I have complied the lessons off this website from testing them in real life! I taught a complete beginner, my younger brother who is nine, to skate! I guarantee these lessons will be easy to follow. By using real world examples there is absolutely no reason you can't learn to skate. Think you are too old, too heavy, too girly? Anyone can learn to skateboard. I might be adding videos later on, also!
    <p> You might be asking yourself, "Why should I trust this website?" You should trust me because I have been skating for about six years. I also know the strategies that work for people. Skateboarding is like learning to ride a bike you never forget how to do it! So check out the articles to the left to start your journey to learning everything basic about skateboarding!
    
    </div>
    
    </div><!-- end #container -->
    
    And then center it like so:
    Code:
    #container {
    margin: 0 auto;
    width: 880px; /* this should be the total width of your site */
    }
    
    Re: external stylesheets: Looks incorrect to me. Try this and take note of the differences. XHTML should always be lowercase and all tags should be closed.
    Code:
    <link href="home.css" rel="stylesheet" type="text/css" />
    
    Do some research of floats and float based layouts. I understand the temptation of absolute positioning. My very first website had a stunning amount of it. Experience taught me that it is better used for advanced css techniques. I would suggest putting some effort into trying to get these results without using absolute positioning—you don't need it.

    The nuances of floats can be challenging, but they are effective and learning about them is a worthwhile endeavor. Also, my first tip about centering your site in the browser window won't work unless you do away with the absolute positioning.

    I think it is a good idea to learn this stuff, BUT if you are not really trying to get into the field and just want to advertise your service, Consultant's suggestion about looking into WordPress is a good one. Tons of awesome free themes out there. If you want to get into the field, time to buckle down and learn this stuff. It's fun! Frustrating at times, but fun.
     
  8. DaReal_Dionysus macrumors regular

    DaReal_Dionysus

    Joined:
    Jan 9, 2009
    #8
    Yes the website looks bad there's no question, but it is your first one!!!! I will say that you need to do graphics much better. You will learn as you go and there will be bumps in the road, but learn from professionals in the industry and I would recommend dreamwerver as well.

    good luck
     
  9. chiefroastbeef macrumors 6502a

    Joined:
    May 26, 2008
    Location:
    Dallas, Texas/ Hong Kong
    #9
    Like some others have mentioned, have you thought about Joomla or Wordpress and the like? There are great themes offered and your site can look really good!

    Like everyone else said, you do have a long way to go, it may be easier going the Joomla and Wordpress route. It is your first website, I hope you had fun, that is what matters!

    here is my first website based in Hong Kong, both are non-profits volunteer projects and I had a ton of fun!

    www.chinahandsunited.org

    and second based in New Jersey:

    www.wwn-go.com
     
  10. jaikob macrumors 6502

    jaikob

    Joined:
    Jul 1, 2008
    Location:
    Freeland, MI
    #10
    Uhhhh. Yeah.... pretty much what everyone else said. But if you are a true beginner, kudos. I would try a few tutorial sites, try learning some good color combos and aesthetic colors. the colors are completely horrid in my opinion.
     
  11. DaReal_Dionysus macrumors regular

    DaReal_Dionysus

    Joined:
    Jan 9, 2009
    #11
    Those aren't to bad there CRB!!! For the first and second one
     
  12. appledyl macrumors regular

    appledyl

    Joined:
    Apr 20, 2009
    Location:
    USA
    #12
    Keep it up! That looks WAY BETTER than my first HTML site. Mine didn't even have CSS or any design. Here's an example of a well-formatted CSS site. Try and model off of this. :rolleyes: http://xeyra.co.nr
     
  13. karl878 macrumors member

    Joined:
    Dec 8, 2005
    Location:
    CA
    #13
    No worse than my first attempt at making a web page.

    Keep studying; when you come across a web page that looks good, take some time to observe the layout, color scheme and take a look at how the page was coded (view source). I always run my work through a validator as well, to help catch coding errors. See:

    http://validator.w3.org/
     
  14. SchneiderMan macrumors G3

    SchneiderMan

    Joined:
    May 25, 2008
    Location:
    Apple state
    #14
    Its fine for a first try, maybe you should just use iweb?
     
  15. 7031 macrumors 6502

    7031

    Joined:
    Apr 6, 2007
    Location:
    England
    #15
    First of all, yes the design is bad, but it's still a hell of a lot better than my first too.
    To be honest, that design isn't exactly amazing, and I don't really like the logo myself to be honest, but pretty good.
     
  16. X-Cart macrumors newbie

    X-Cart

    Joined:
    Sep 25, 2009
    #16
    It seems all this feedback scared the author of the question and he even has not replied anything here...
     
  17. chiefroastbeef macrumors 6502a

    Joined:
    May 26, 2008
    Location:
    Dallas, Texas/ Hong Kong
    #17
    It is more fair to say his website scared us, to the point where poop came out and stained our computer seats. Those of us that were in a coffee shop at the time of the unveiling were indeed the most unfortunate.. Just joking!

    The poster did ask us for opinions, and it is good to know most of us on here are truth telling people.
     
  18. omgitskevin macrumors member

    Joined:
    Jun 12, 2009
    #18
  19. chiefroastbeef macrumors 6502a

    Joined:
    May 26, 2008
    Location:
    Dallas, Texas/ Hong Kong
    #19
    I like those sites! Very clean, simple, looks good, and easy to navigate. :)
     
  20. nullx86 macrumors 6502a

    nullx86

    Joined:
    Jun 26, 2009
    Location:
    Wilmington/Jacksonville, NC
    #20
    wow, I remember my first site. not that good. You got a long ways to go kid.
     
  21. X-Cart macrumors newbie

    X-Cart

    Joined:
    Sep 25, 2009
    #21
    I agree with that. It is better to tell truth, and I believe the author expected sincere answers when posted a question...

    It is just rather strange to my mind that the author has not replied anything back.
     
  22. angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #22
    Not that strange. The poster is like most that come here, and wants to advertise his site, like you are with your signature link. He likely didn't really care much about feedback, just free advertisement, which is why I don't critique sites on here very often anymore.
     
  23. chiefroastbeef macrumors 6502a

    Joined:
    May 26, 2008
    Location:
    Dallas, Texas/ Hong Kong
    #23
    Though let's be honest here, there ain't much to be advertised with this site. :p
     
  24. ComicStix thread starter macrumors member

    Joined:
    Aug 29, 2009
    Location:
    Boston, Massachusetts
    #24
    You're feedback made me go into a deep depression so I couldn't reply in a while. Just kidding! After taking the gist of all your opinions and advice I must say... That site sucked but then I thought to myself I didn't do so-so bad for my first try! All you gotta do is get back when you're knocked down! I decided to start all over with new CSS and new HTML. I have a lot to learn. Thanks to everyone for contributing. I appreciate it! Encouragement and constructive criticism. My revised website should be done by the end of October!
     
  25. chiefroastbeef macrumors 6502a

    Joined:
    May 26, 2008
    Location:
    Dallas, Texas/ Hong Kong
    #25
    Good to hear from you, you are off to a great start! I apologize for the negative comments I've made, and it is great to know you are a good sport about it!

    One thing you can do is download a css template and start from there. You can customize the graphics, fonts, colors and everything else to your liking. Search free css and there are plenty of good free templates that come with html and css files.

    have fun!
     

Share This Page