1. Welcome to the new MacRumors forums. See our announcement and read our FAQ

Blog

Discussion in 'Web Design and Development' started by Porsche1209, Apr 3, 2008.

  1. macrumors newbie

    Porsche1209

    #1
    I feel guilty not making this blog in iWeb, but I started a blog:

    http://intellectualbrouhaha.blogspot.com/

    I've written a couple insightful entries, and I was just hoping for constructive criticism from this group. If you have any interesting blogs to mention, whether or not mac-related, feel free to post them here.

    On a separate note, does anyone have the new photoshop elements for mac? How is it? I'm considering buying it.
     
  2. Moderator emeritus

    angelwatt

    #2
    Well, it's a Blogger page for sure.
    • The header image seems to have a lot of artifacts. Namely the blue area when it's near the other elements.
    • I'd increase the width of the reading area a little bit (maybe by 30-60px).
    • I'd decrease the line-height of the blog text a little as well, and increase the line-height for the quoted text.
    • The code seems to suffer from divitis and spanitis.
    • Wow, I validated the page and it found 416 errors, ouch. Not sure how much Blogger is to blame there.
    • It does have a nice simple look to it. I like blue.
     
  3. macrumors newbie

    Porsche1209

    #3
    Thanks a lot for the suggestions.
    I lowered the text size a little. I get the feeling that a majority of those errors are associated with one blog post that I copied from a research paper without many formatting corrections. Once I make a few more posts it will be pushed off the main page and all should be better. I made the header image in photoshop. I'm used to having high-resolution pictures and projects, but it looks like I'll have to go back and dumb down that image so it shows up in that small resolution.
    I was looking at the html code and I'm having trouble figuring out how to expand the reading pane.
    Here's the HTML it has on the posts:
    /* Posts
    -----------------------------------------------
    */
    h2.date-header {
    margin:1.5em 0 .5em;
    }

    .post {
    margin:.5em 0 1.5em;
    border-bottom:1px dotted $bordercolor;
    padding-bottom:1.5em;
    }
    .post h3 {
    margin:.25em 0 0;
    padding:0 0 4px;
    font-size:140%;
    font-weight:normal;
    line-height:1.4em;
    color:$titlecolor;
    }

    .post h3 a, .post h3 a:visited, .post h3 strong {
    display:block;
    text-decoration:none;
    color:$titlecolor;
    font-weight:bold;
    }

    .post h3 strong, .post h3 a:hover {
    color:$textcolor;
    }

    .post p {
    margin:0 0 .75em;
    line-height:1.6em;
    }

    .post-footer {
    margin: .75em 0;
    color:$sidebarcolor;
    text-transform:uppercase;
    letter-spacing:.1em;
    font: $postfooterfont;
    line-height: 1.4em;
    }

    .comment-link {
    margin-$startSide:.6em;
    }
    .post img {
    padding:4px;
    border:1px solid $bordercolor;
    }
    .post blockquote {
    margin:1em 20px;
    }
    .post blockquote p {
    margin:.75em 0;
    }
     
  4. macrumors member

    #4
    I never approve of bloggers using blogger. But in anycase, for your generic template, I think your header image should fill the borders to make it even complete.
     
  5. Moderator emeritus

    angelwatt

    #5
    I was suggesting decreasing the line-height (the space between lines of text), not the font-size. The size was fine, but now looks small.

    As far as expanding the reading area, there seems to be two CSS parts that I see that can expand it. The width for #outer-wrapper, #header-wrapper, and #footer are both set to 660px. The #main-wrapper is set to 410px. The main wrapper is where the post is at from what I can tell. It'll take modifying at leas the widths of the CSS mentioned here and possibly some others.

    I've never used or edited a Blogger site so not sure what you have control over.
     

Share This Page