Chat Bam Web Design

Discussion in 'Website & Graphic Reviews' started by hcted, Jul 2, 2010.

  1. hcted

    hcted
    uix_expand uix_collapse
    Member

    Joined:
    Jun 30, 2010
    Messages:
    283
    Likes Received:
    0
    Hey guys,

    I have been looking to make a completely redesigned Chat Bam site. Right now it feels basic. I tried sticking to the professional Blue and White colors. I just need some ideas what to add/remove.

    Appreciate it :D

    http://chatbam.com
     
  2. Fergal

    Fergal
    uix_expand uix_collapse
    Premium Member
    Premium Member

    Joined:
    Nov 18, 2007
    Messages:
    10,578
    Likes Received:
    1,163
    The design looks better now. You could probably improve the site header a little, to make it more professional. Maybe, add some colour so that there isn't so much white space. The navigation bar could also be improved, perhaps by adding buttons and making it stretch across the full width of the table.

    Your text appears very close to the left hand border between the white and the blue, it would be easier and more comfortable to read if you nudged it in a few pixels towards the centre.
     
  3. GekiDan

    GekiDan
    uix_expand uix_collapse
    Active Member

    Joined:
    Jun 11, 2009
    Messages:
    2,594
    Likes Received:
    218
    I have a comment very much similar to what Fergal said.
    There are lots of work needed on your banner. Fill it up will some cool and attractive graphics. I definitely suggest you to change your font. The "W" doesn't look like a "W" so it's hard to read on the first time I glance at your header.
    Like Tweet Zone, the text goes toward the edge of your layout. You need to have some spaces in between so that visitors can easily read it. Plus, there's a wide blank space between the first and the second column. You can also need some vertical and horizontal spaces between your image and texts.

    I also noticed the the image of The Tweet Zone is different from the homepage and portfolio.

    I will also suggests you to make a test site first to enhance your knowledge before offering such services. What people see on your site is the thing that future customers expect to see in theirs.
     
  4. 50Cent

    50Cent
    uix_expand uix_collapse
    Member

    Joined:
    Jun 15, 2010
    Messages:
    782
    Likes Received:
    24
    It would be great if you have the whole website in web2.0ish with the use of the blue and white colors.
    Why you did not go and create a logo for your web design company instead of a text?
    When i click of the tabs like portfolio, is the content on the portfolio tabs is align with the blue footer box on the left?
     
  5. hcted

    hcted
    uix_expand uix_collapse
    Member

    Joined:
    Jun 30, 2010
    Messages:
    283
    Likes Received:
    0
    Sorry, I do not do any web2.0 work. That kind of design is overrated and overused in many places, which is why I refuse to code it.

    I do have a logo?

    Thanks, I forgot to fix the padding and the TZ images on both pages :\ I will look into these.
     
  6. TiaWood

    TiaWood
    uix_expand uix_collapse
    Member

    Joined:
    Dec 24, 2009
    Messages:
    42
    Likes Received:
    0
    It doesn't look too bad but I agree that the header needs work done.
     
  7. GekiDan

    GekiDan
    uix_expand uix_collapse
    Active Member

    Joined:
    Jun 11, 2009
    Messages:
    2,594
    Likes Received:
    218
  8. hcted

    hcted
    uix_expand uix_collapse
    Member

    Joined:
    Jun 30, 2010
    Messages:
    283
    Likes Received:
    0
    Can someone tell me what the header should have/include?

    Web 2.0 sites are all over the place, they are all the same designs and just look like muck to me really. That is why I stick to good ole whatever I am doing now.
     
  9. GekiDan

    GekiDan
    uix_expand uix_collapse
    Active Member

    Joined:
    Jun 11, 2009
    Messages:
    2,594
    Likes Received:
    218
    The header should include a logo and name of your site/company.

    Well, I do respect your points there.
     
  10. hcted

    hcted
    uix_expand uix_collapse
    Member

    Joined:
    Jun 30, 2010
    Messages:
    283
    Likes Received:
    0
    I have a logo? I do have one that a few members on here have responded to help that I will change later.
     
  11. daryljames

    daryljames
    uix_expand uix_collapse
    New Member

    Joined:
    Aug 2, 2010
    Messages:
    4
    Likes Received:
    0
    Clean site. I like the layout and background. The logo seems somewhat lacking though. A more modern, sleek logo would pull it all together.
     
  12. hcted

    hcted
    uix_expand uix_collapse
    Member

    Joined:
    Jun 30, 2010
    Messages:
    283
    Likes Received:
    0
    Hey,

    Thanks for the feedback :D We will be rotating the images out a bit this week and work on advertising as our numbers our down for this part of the month.

    We have also moved out site to PHP, HTML really held the site back. Some good changes will come this week.
     
    #12 hcted, Aug 15, 2010
    Last edited: Aug 15, 2010
  13. DavidL

    DavidL
    uix_expand uix_collapse
    Member

    Joined:
    Dec 16, 2009
    Messages:
    305
    Likes Received:
    1
    I looked through your coding and I don't think tables are the way to go as it can appear differently on different browsers. Adding predominant CSS as the base and placing a div container on each section for text is much more browser friendly, but it's your choice.
     
  14. houstonVijai

    houstonVijai
    uix_expand uix_collapse
    Member

    Joined:
    Feb 24, 2010
    Messages:
    76
    Likes Received:
    3
    Hello dotDavid,
    Being a webdesigner myself and have my own freelance company, I like to share some feedback.

    You got good and neat logo. It is not fancy but looks normal for a startup if it is one. You got good content but it all scattered around places. Pictures does't go well with the content in most places. When I click the blog, it takes WP blog folder with different template. You should atleast keep the template same or atleast same color scheme. Finally, try to use a good dark background not always white. White doesn't keep you customers in your sites according to a study.

    But you got good site going, just tweak it to make look good.

    All the best.. :)

    Vijai
     
  15. Fergal

    Fergal
    uix_expand uix_collapse
    Premium Member
    Premium Member

    Joined:
    Nov 18, 2007
    Messages:
    10,578
    Likes Received:
    1,163
    That's a great review Vijai and you have given some great tips on that site. I'm interested to hear more about why you say white is not a good background colour, personally I like sites with white backgrounds and it seems to work well for some large sites, such as Amazon and eBay.
     
  16. GekiDan

    GekiDan
    uix_expand uix_collapse
    Active Member

    Joined:
    Jun 11, 2009
    Messages:
    2,594
    Likes Received:
    218
    doDavid is right. Using tables on sites are now mo advisable because, like David says, it shows differently on different browsers used by your visitors.
    CSS is now the "it" thing. You can use <div> tags to arrange your template's design.

    Although it's hard to get used at first, it will help you on the long run of your business.

    Here's a good article regarding the pros and cons of using tables and CSS:
    http://www.decloak.com/dev/csstables/css_tables_01.aspx
     
  17. PaulPinnacle

    PaulPinnacle
    uix_expand uix_collapse
    Member

    Joined:
    Aug 24, 2010
    Messages:
    275
    Likes Received:
    59
    That's a subjective one, but I agree with the other comments that having so much unused white space is a terrible waste in such a prominent area.

    Personally I'd probably look at placing some social media links in the top right corner (so maybe a FB, twitter and linkedin image) and having a call to action in the remaining space (could also consider using a client testimonial which changes on each page, an image to help with branding of the site, etc.). There's no 'right' or 'wrong' way to do it, it's just under utilised at the moment.

    I'd suggest keeping the header area a little more consistent. I haven't gone through the code to see what's causing it, but on moving from page to page the header changes. On the home page the blue bar is slightly lower than on the other pages and on the 'about' page the 'chat bam' and tag line shifts to the right. It's not a big deal, but it's the little things that add up and give a site that touch of class.

    When the page first loaded, I was confused on where to go/what to read first. The layout of the upper left corner could do with a rethink.

    The main issue I see (this is 100% subjective, so feel free to totally ignore) is the centred image. If that was either removed or replaced with a more panoramic (i.e. wide) image to fill that space, I think it would make it a lot easier on the eye.

    I'm not a big fan of the 4 column central section. I think if this was reduced to 2 columns, just 1 text column and 1 image column (allowing you to expand on the text, has benefits for users and SEO) it would make it a lot easier to follow the flow there (e.g. idea, then content, then standards, then live... at the minute, while reading you kind of bounce between them all).

    I'd move the text for "Chat live with us now" to the same level (top of the text lines up) as the large "Chat Bam.." text. I'd add a little more text between the live chat heading and the icon so that the white space underneath is reduced (looks a little unsightly at the moment). I'd also consider lining up the right hand column with the right section of the three column layout below it. (At the moment, the eye is bouncing far too much between sections. It feels like a jigsaw that isn't quite put together)

    On the "Latest Live Client Site", I'd expand on the description so that it fills up 3-4 lines (match what's to the left and right a little more), or else get additional sites in there asap (I'm not sure if that is intended to be 'THE' latest, or a list of the most recent).

    I assume there are plans to bring the blog appearance in line with the website design? If not, I'd strongly encourage it for branding reasons.

    The site currently has 3 h1 tags (not good). Change the tags for all 3 of these to h2 (or h3). Make the "homemessagelarge" div text your h1 (I'd personally make the 3 headings at the bottom your h2's and the headings on the right column your h3's). You can still control how they appear on the site via the CSS, but in terms of semantic mark up and SEO, this would be far more beneficial.

    Currently using an old version of the google analytics code. Upgrade to the newest asynchronous version, it's faster and lighter for users to load (and relocate it to just before the </head>).

    Add a privacy policy to gain trust if users need to supply personal data.

    Some of the images being referenced are returning 404's. Remove or fix the bad links. (clear.gif, free-guide-bg.gif, h1bg.gif)

    There are numerous other SEO tweaks you could look at, but if you tackle the above it'd be a good start.

    HTH.
     
  18. PaulPinnacle

    PaulPinnacle
    uix_expand uix_collapse
    Member

    Joined:
    Aug 24, 2010
    Messages:
    275
    Likes Received:
    59
    Ohhh, and set up some 301's to tidy up the canconicalization issues with the homepage (e.g. the www vs. non www version and the index.php vs. non pages - the SE's view these as a number of different pages with duplicate content). Using 301's means you retain the benefits of any backlinks, regardless of which version the person linking has used.
     
  19. Chris Grigg

    Chris Grigg
    uix_expand uix_collapse
    Member

    Joined:
    Feb 8, 2010
    Messages:
    58
    Likes Received:
    0
    I do believe I would like to see some borders surrounding the different spots around the site. To be honest, nothing sticks out saying "READ THIS PART FIRST. ITS IMPORTANT". Nothing yells at me to grab my attention. Maybe something that is two tone title (colors) and maybe a different font and placement to make it stand out.
     
  20. hcted

    hcted
    uix_expand uix_collapse
    Member

    Joined:
    Jun 30, 2010
    Messages:
    283
    Likes Received:
    0
    Thank you all for the views. I have been writing down and fixing ideas on paper for thhe homepage currently, hoping to make the site better. I will also be doing something about the crappy nav bar. We will be adding in a javascripted one with a slider.

    Much will be rearranged, and hopefully have the design up before sept 30. Right now we are busy on jobs brought in by Chat Bam. *Yes we actually have work now, i'm excited*
     

Share This Page