1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Make your shitty-looking website more appealing. Read this.

Discussion in 'Blogging' started by ijof9, May 2, 2012.

  1. ijof9

    ijof9 Power Member

    Joined:
    Mar 27, 2010
    Messages:
    536
    Likes Received:
    594
    Occupation:
    CTO
    Location:
    Western Europe
    Problem:
    Seen the dreads of recent Google updates? Your website might look like
    this, this, or this. Who's not tired of that? Google surely is because they just said "Improve quality and usability". With that in mind, you can hire a designer to clean up for $900, or apply the following solutions which are dirt-cheap fixes.

    So here are my tips:
    1. Follow the 960 grid system.
    http://960.gs/
    2. Don't use justified text. Looks like crap on the web. Go with left-aligned text, it's way better.
    3. Use consistent padding. If you have text in a box, and the text sticks to the box's inner margin it's bad. Give it 10-15 pixels to breath; in CSS it is like this <div style="padding:15px; border:solid 1px #ccc">Some text</div>
    4. Plagiarize designs from
    TemplateMonster. Use Kuler to color your site.
    5. Don't name your divs <div class='adwords'></div> because your visitors have AdBlock which makes those divs invisible.
    6. Use fashionable 25px-sized headings, and 12px-sized body text, and 11px footer text.
    7. Reason everything in your site and don't add shit unless you really need it
    8. Those pop-up, pop-unders, pop-ins, pop-out, animated, flashing banners won't quadruple your income as expected and what you gain
    you loose anyway along with stupid traffic. Focus on building traffic, and rotate ads.
    9. Instead of clogging up ads everywhere, steal Facebook's idea and kinda slap those ads to the right of the page. On the 960 grid system you can allocate a 250px right column and only use banners that fit that size. If one ad is too small, simply center that ad in a div and color its background or enclose in border.
    10. Finally use the new HTML5 tags <header><footer><article><nav> and role="navigation" etc. They are in the default wordpress theme twentyeleven and you can simply steal them from there

    Pro coding tips:
    1. Get rid of
    W3C Validation errors
    2. Follow some
    WCAG guidelines
    3. Install
    PageSpeed and follow the recommendations

    Feel free to add your own tips.
     
    • Thanks Thanks x 12
  2. ijof9

    ijof9 Power Member

    Joined:
    Mar 27, 2010
    Messages:
    536
    Likes Received:
    594
    Occupation:
    CTO
    Location:
    Western Europe
    No interest?
     
  3. geist7

    geist7 Newbie

    Joined:
    May 1, 2012
    Messages:
    31
    Likes Received:
    4
    Nice tips ijof! As a front end designer I'll throw some more tips out:

    - Always always always ALWAYS test your site in all browsers. Some sites these days wont even load in IE7, which is still heavily used. Use Adobe Browser Labs to test your site in all the important browsers. Make sure the site looks perfect in the major ones (IE9, Chrome, Firefox, Safari), good in IE8, and usable in IE7. Checking the site out on the iPhone and Android browsers can also be a good idea, depending on your audience.

    - Don't use flash anymore, stick with jquery. There are TONS of free jquery plugins out there that are super easy to install and use.

    - Make sure the site is viewable in most screen resolutions. This is depending on the site's audience of course, but there are still a large amount of people with 1024x768 screens.

    Hope I helped!
     
    • Thanks Thanks x 1
  4. KingMonkey

    KingMonkey Regular Member

    Joined:
    Apr 3, 2012
    Messages:
    397
    Likes Received:
    57
    I appreciate this post. Thanks.
     
  5. Zakhar

    Zakhar Power Member

    Joined:
    May 17, 2011
    Messages:
    670
    Likes Received:
    110
    Occupation:
    - Entrepreneur in the making.
    Location:
    I'mFromPluto
    @OP I was wondering why my ads were coming up on internet explorer but I have an add blocker on my firefox and they do NOT appear - using quickadsense widget to place the ads how do I go about making this visible I didnt even know it would block that till you mentioned it will need to look into it thanks
     
  6. champ5

    champ5 Newbie

    Joined:
    Apr 29, 2012
    Messages:
    46
    Likes Received:
    32
    And to make some basic, but good looking pages (at least small) you could use Twitter bootstrap. I'm using the buttons, forms and templates very often. At least better than pages looking like created in word :)
    Cannot post links, so just google it.
     
    • Thanks Thanks x 1
  7. Numa68

    Numa68 Registered Member

    Joined:
    May 21, 2009
    Messages:
    78
    Likes Received:
    28
    Occupation:
    I break things
    Location:
    North Carolina
    There are some great ideas on this thread. If your website looks like a wall of text or a popunder you would see on some shady site somewhere, chances are that you won't attract good visitors. If you don't attract good visitors you won't rank well.

    Another tip I would add is to not forget about our mobile friends! Phones, tablets, and netbooks are everywhere and if your site doesn't accommodate them then they'll go elsewhere.
     
  8. GiftGuru

    GiftGuru Supreme Member

    Joined:
    Jul 4, 2011
    Messages:
    1,469
    Likes Received:
    876
    Gender:
    Male
    Occupation:
    Software Developer
    Location:
    Las Vegas, NV
    Home Page:
    good stuff....made me laugh quite a few times
     
  9. keeponrocking

    keeponrocking Regular Member

    Joined:
    May 1, 2011
    Messages:
    211
    Likes Received:
    96
    Thank you, this was useful for me! ;-)
     
  10. headlines

    headlines Newbie

    Joined:
    May 4, 2012
    Messages:
    11
    Likes Received:
    1
    Nice daily turnover haha
     
  11. ijof9

    ijof9 Power Member

    Joined:
    Mar 27, 2010
    Messages:
    536
    Likes Received:
    594
    Occupation:
    CTO
    Location:
    Western Europe
    One more tip, because it happened to me recently.

    Don't support browsers unless you have analytics data! It's a waste of effort:

    [​IMG]

    No point in fixing my website for IE6, for only 10 users / month at my average conversion rate.
     
  12. Kaiser_Soze

    Kaiser_Soze Junior Member

    Joined:
    Nov 24, 2012
    Messages:
    151
    Likes Received:
    28
    Occupation:
    IT Manager
    Location:
    EU, Bulgaria
    Home Page:
    I agree with that. Although the trashy IE will soon drop below 10% it is still a percentage and must be taken care of. Same goes with the rest unpopular browsers. Not testing and fixing problems with crappy browsers is simply arrogant, imo.