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

My site review?

Discussion in 'Website Design Critique:' started by Harlequinstudio, Jul 19, 2010.

  1. I thought since the 2.0 beta of my site is now up and running i would ask for some feedback. I am looking to re-write some things and add more content to the homepage but generally i like it.

    I will be adding a page for customer feedback and maybe a client list also (when i get enough lol)

    I kept it simple because i like sleek minimal design and wanted to reflect that.

    http://www.harlequin-studio.co.uk/
     
  2. TomStutt

    TomStutt Senior Member

    It looks good. One thing though, put a space after the 5th number in phone numbers.
     
  3. Kevin

    Kevin Senior Member

    I don't think the homepage needs a back button on the bottom
    You misspelt 'techniques' in the Tron image.
    The Tron image should be wider, so it aligns to the rest of the content (i.e the edges of the page).
     
  4. I have fixed the spelling mistake (i suck at spelling) and aligning problem.

    The back button im sort of stuck on, i don't know how to remove it from one page as its wordpress based
     
  5. Adam

    Adam Senior Member

    on Contact page it says use our form on the right, but its on the left :p
     
  6. see this is why you dont build a website in the night lol

    Fixed :)
     
  7. DeanZappy

    DeanZappy Senior Member

    Also you spelled 'various' wrong on that Tron image.
     
  8. Oh lawd lol, i really need to check these before i save the images lol
     
  9. Kevin

    Kevin Senior Member

    Well it shouldn't be an image really... It should be coded into your html.
     
  10. jminnsmedia

    jminnsmedia Junior Member

    In your services page your marketing yourself as a small company using 'we'? but then says 'Other ways to reach me' above your social networking logos. If your currently working alone I'd tend to target yourself as a freelancer not a company... don't want your clients getting the wrong idea!

    Also the portfolio takes a long time to load, I viewed the first image and waited for a good minute and half for the next image to load.
     
  11. Yes i agree with what you said.

    As far as the portfolio loading times, im having problems finding a good plug-in for wordpress that plays well
     
  12. Taking into account everything you guys said i have changed the faults and have a new image slideshow. clickable thumbnails to be exact.

    Hope it is better.
     
  13. Levi

    Levi Moderator Staff Member

    ok haven't looked at the work on the site but one thing hit me and it would bug the hell out of me.

    In my opinion your titles (and all below it) above the images need to be in alignment with the top of your menu, it's just sitting wrong to me. The ............ divider also seems darker than the menu ones so I would try to lighten that up if you can :)

    edit: just looked at a couple of images - they're copyright a persons name while the site is a business name, that to me could be confusing and lead to people thinking that the work isn't the companies - you have to think like the viewer is an idiot (not that they all are)
     
  14. ueah, the stamp on the work is because allot of them were done before i decided to set up in business. i will try and get rid of them.

    The other points i dont know how to fix really as its wordpress based and i have never worked on them before ;:S
     
  15. Levi

    Levi Moderator Staff Member

    not being a web designer and also not being a blogger either it looks like you need to change the margin part of this section of the css file to something lower than 30px, I'd say about 23px by the looks of it.
    Code:
    .postsingle {     margin:0 0 [B]30px[/B] 0;     padding:0;     line-height: 20px;     width: 657px;      }
    BACKUP the current css file (
    http://www.harlequin-studio.co.uk/wp-content/themes/BlueBubble/style.css on server) before tinkering though :)
     
  16. I tried that and it didnt seem to work, i tried chaning the padding on a few different things also.

    Here is the css code

    Code:
    /* basics */*{margin:0; padding:0;}body {    background:#FFFFFF;    font-family: verdana, arial, tahoma, sans-serif;    font-size: 11px;    margin:20px;    }    h1 {font-size: 26px; line-height: 42px;}h2 {font-size: 14px; text-transform: uppercase;}h3 {font-size: 12px; text-transform: uppercase; padding-bottom: 20px;}h4 {font-size: 10px; text-transform: uppercase;}img{ border: none; padding:0; }img a{border:none;}img.left{ float: left; border: none; padding: 6px 0 0 0; }img.right{ float: right; border: none; padding: 0 0 0 6px; }blockquote{    border-left:1px solid #333333;    margin-left:15px;    padding:0 12px 0 12px;    }code{    font-family:"Courier New", Courier, monospace;    }/* links */a{    color:#0ab9e5;    text-decoration:none;    outline: none;    }a:hover{text-decoration: underline;}#sidebar ul li a {    color: #333333;    display: block;    text-decoration: none;}#sidebar ul li a:hover {    color:#333333;    background-color: #ededed;}/* container */#container {    width: 960px;    margin: 0 auto;    padding:0;    background:#FFFFFF;    color:#333;    overflow: hidden;    }    /* header */#header {    background:#FFFFFF;      width: 960px;       height: 100px;    color: #fff;     }#header h1{    font:normal 20px georgia, times;    padding:20px 0 0 16px;    margin:0;        }    #header h1 a{color: #404040; text-decoration: none;}#header h1 a:hover{color: #666; text-decoration: none;}#header h2{    font:normal 10px georgia, times;    color:#333;    padding: 0 0 0 18px;    margin:0;        }/* content */#content {    float: right;    width:700px;    overflow: hidden;    }        .box {    width: 310px;    height: 150px;    border: 1px solid #CCCCCC;    margin-bottom: 10px;    background: url(images/loader.gif) center center no-repeat;}    .post {    margin:0 35px 30px 0;    padding:0;    line-height: 20px;    float: left;    width: 312px;    height: 260px;    overflow: hidden;     }    .boxsingle {    width: 657px;    height: 318px;    border: 1px solid #CCCCCC;    margin-bottom: 10px;    background: url(images/loader.gif) center center no-repeat;}    .postsingle {    margin:0 0 30px 0;    padding:0;    line-height: 20px;    width: 657px;     }    .post h2 {    font:bold 26px;    text-transform: uppercase;    }    .post h2 a, .postsingle h2 a {    color: #333333;    text-decoration: none;    }    .post h2 a:hover, .postsingle h2 a:hover {    color: #777;    text-decoration: none;    }.postsingle h1 {    font:bold;    text-transform: uppercase;    line-height: 42px;    display: block;    border-bottom: 1px dotted #333333;}.postsingle h1 a {    color: #333333;    text-decoration: none;    font-size: 26px;}    postsingle h1 a:hover {    color: #777;    text-decoration: none;}.post ul {}.post li {}.entry p{margin:12px 0; }.postmetadata{    clear: both;    padding:6px;    margin: 10px 0;    color: #000000;    background: #EFEFEF;    }    .navigation {    font-size:11px;    width:100%;    float:left;    margin:0;    padding:0;    overflow:hidden;    }    .alignleft a{float:left; margin:25px 0;}.alignright a{float:right; margin:25px 0;}hr {    margin: 5px 0 20px 0;}#sidebar hr {    border: none 0;     border-top: 1px dotted #CCCCCC;    height: 1px;}ul, ol {    margin-left: 30px;}/* sidebar */#sidebar {    font-family: verdana, arial, tahoma;    font-size:12px;    width:210px;    float:left;    margin:0;    padding: 0;    line-height: 20px;    }    #sidebar div {    margin-bottom: 20px;}    #sidebar h2{    font:normal 12px verdana, arial, tahoma;    color: #333333;        margin: 0;    padding: 0;    line-height: 20px;}#sidebar label{    font:normal 11px verdana, arial, tahoma;    color: #000;        margin: 0;    padding: 0;}#sidebar p {margin:0; padding:0;}#sidebar img {padding: 0; margin: 0;}#sidebar ul {    margin:0px 0 15px 0;    padding:0;    display: block;    width:100%;    }#sidebar ul li {    margin: 0;    padding: 0;    line-height: 20px;    list-style-type: none;    display: block;    width: 100%;    border-bottom: 1px dotted #CCCCCC;    }#sidebar ul ul {    margin:14px 0;    padding:0;}#sidebar ul ul li {    list-style-type: none;    }#sidebar ul ul ul{    margin: 0;    padding: 0;}#sidebar ul ul ul li{    padding: 0 0 0 15px;    list-style-type: square;    color: #898989;}#sidebar input, #sidebar textarea {    margin-bottom: 5px;    width:200px;}input#emailmebtn {    height:27px;    background: #FFFFFF;    padding: 3px;    width: 206px;}input#emailmebtn:hover {    cursor: pointer;    background: #CCCCCC;    padding: 3px;}textarea#message {    font: verdana, arial, tahoma, sans-serif;}        /* comments */input, textarea {    border: 1px solid #CCCCCC;    padding: 2px;    font-family: verdana, arial, tahoma, sans-serif;    font-size: 11px;}#searchsubmit:hover {    cursor: pointer;    background: #CCCCCC;}#commentlist {    width: 657px;}ol.commentlist {    padding: 0px;    margin: 0px;}#commentlist ol li {    list-style: none;    position: relative;}#commentform {    background: #EFEFEF;    border: 1px solid #ccc;    padding: 20px;    width: 617px; /* because of 20px padding */}#commentform textarea {    font-family: verdana, arial, tahoma, sans-serif;    font-size: 11px;    width: 500px;    padding: 2px;}#commentform input {    width: 230px;    height:15px;    padding: 2px;}#commentform p {    margin-bottom: 7px;}input#submit {    height:27px;    background: #FFFFFF;    padding: 3px;    margin-top: 7px;}input#submit:hover {    cursor: pointer;    background: #CCCCCC;    padding: 3px;}.comment-meta {    }    .comment-author {    width: 72px;    margin: 0 25px 20px 0;}.comment-body {    background: #EFEFEF;    border: 1px solid #ccc;    margin-top: 10px;    margin-bottom: 30px;    margin-left: 100px;    padding: 20px;}#commentlist p {    margin-bottom: 12px;    line-height: 20px;}.avatar {    position: absolute;    padding: 3px;    border: 1px solid #ccc;    margin: 0 20px 5px 0;    top:1px;    left: 1px;}.fn {    float: left;    padding-right: 10px;    font-style: normal;    font-weight: bold;}.says {    display: none;}.reply {    margin: 5px 0 5px 0;}        .clearfix {    clear: both;}    .commentlist blockquote{    border-left:1px dotted #333333;    margin-left:20px;    padding:0 12px 0 0px;    margin-bottom: 10px;}    /* misc */img.centered {    display: block;    margin-left: auto;    margin-right: auto;    padding: 0px;    border: 1px solid #CCCCCC;    }img.alignright {    padding: 0px;    margin: 0 0 2px 14px;    display: inline;    border: 1px solid #CCCCCC;    }img.alignleft {    padding: 0px;    margin: 0 14px 2px 0;    display: inline;    border: 1px solid #CCCCCC;    }.alignright {    float: right;    }.alignleft {    float: left    }    .wp-capxion {   border: 1px solid #ddd;   text-align: center;   background-color: #f3f3f3;   padding-top: 4px;   margin: 10px;   /* opxional rounded corners for browsers that support it */   -moz-border-radius: 3px;   -khtml-border-radius: 3px;   -webkit-border-radius: 3px;   border-radius: 3px;}.wp-capxion img {   margin: 0;   padding: 0;   border: 0 none;}.wp-capxion p.wp-capxion-text {   font-size: 11px;   line-height: 17px;   padding: 0 4px 5px;   margin: 0;}
    anyone have a idea
     
  17. Mark Alexander

    Mark Alexander Senior Member

    What, the spacing above your h1 at the top? That's the just the line-height doing that.
     
  18. fixed it, i moved the h1 up and the sidebar line size bigger, seems to work :)
     

Share This Page