Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9
  1. #1
    New to the CF scene
    Join Date
    Dec 2006
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    A little help slicing and coding with photoshop and image ready

    Hey everyone, I am new here. And I am also new to designing website layouts with photoshop/image ready.

    I use Photoshop 7.0, and Imageready 7.0

    I designed my intial layout, and I want to use it for the next look for my website. It isn't that complicated to slice, i don't think. but I have never sliced a layout, and then coded it before.

    Can someone please help me out a little?

    Here is my design. Quite simple, but I like it.



    I would like to use CSS for this to. I really hope someone can help me out a little.

    By the way. i don't have anything like Dreamweaver. just notepad. lol.

    Oh, does this hlep any? to let you know what everything is.

    Last edited by Spit_Me_Out; 12-22-2006 at 08:59 PM.

  • #2
    $object->toCD-R(LP); vinyl-junkie's Avatar
    Join Date
    Jun 2003
    Posts
    3,100
    Thanks
    2
    Thanked 23 Times in 23 Posts
    Welcome to CodingForums!

    What do you know about HTML? And CSS? Have you Googled for any of the sites that demonstrate how to slice an image? We're willing to coach you as you learn how to do this, but first we need to know your skill level. Then we can suggest next steps for you.
    Music Around The World - Collecting tips, trade
    and want lists, album reviews, & more
    SNAP to it!

  • #3
    New to the CF scene
    Join Date
    Dec 2006
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I know HTML great, and CSS ok.

    And i know PHP quite well, as well as javascript.

    I have my website which is down right now. editing a few things PHP wise, and it is gonna take a couple days. Right now i don't have a CSS based layout, well theres some CSS, but not much. here's the website www.maggot-army.com

    And yes, I have searched, I have been searching for the last week. I just got photoshop in august. And i finally got to the point where I figured I could design a layout. And every tutorial I find uses dream weaver. And if I do find a good tutorial that creates it from scratch it is something that only needs like to or three slices, so it is simple, and my layout which i designed I know will be more complicated than that.

    See where I am at?

  • #4
    $object->toCD-R(LP); vinyl-junkie's Avatar
    Join Date
    Jun 2003
    Posts
    3,100
    Thanks
    2
    Thanked 23 Times in 23 Posts
    Sounds like you've put quite a bit of thought into this. However, I think you're making this quite a bit more complicated in your mind than it needs to be. I use Paint Shop Pro, not Photoshop, so I can't advise you on the technical aspects of slicing this image. What I can do though is tell you how I would personally slice it, which is only four slices.

    I would make the first slice the top third of your image. Use CSS to set a background color to the dark gray of the outer edge of that image. That way, the image fills the whole top half of the page, no matter what browser resolution it's being viewed from. I would make three slices from that footer, starting with the left and right sides of the footer. The middle slice would be a very small section from the middle of the footer with a "background-repeat: repeat-x" style to fill in the whole footer. The middle section can be set using CSS background-color, so that doesn't need to be sliced at all.

    Also, and this is probably a little basic, but I'll say it anyway. Take a copy of the original image and work with that. That way, if you just really mess it up, you can make another copy of the original image and start over.

    I hope this helps get you started. If you get stuck on anything or have additional questions, feel free to ask. That's what we're here for.
    Music Around The World - Collecting tips, trade
    and want lists, album reviews, & more
    SNAP to it!

  • #5
    New to the CF scene
    Join Date
    Dec 2006
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts
    thanks for the help. I will do that.

    And yes, I have put alot of work into this. Slipknot is my favorite band, and one of the ways I want to show that is by having a good looking fan website.

    I do have a copy of the orriganal. I don't do anything without a copy. A PSD copy at that. That way all the layers are preserved so that I can Edit the look of the image/layout when I please.

    Thanks again. Won't hesitate to ask another question if needed.

  • #6
    New Coder
    Join Date
    May 2006
    Posts
    17
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Hi,
    If i was u, i would code it in the following way:
    * Crop one pixel of the background and then in the html, change its width to 1024 or what ever u need accordingly.

    * Crop one pixel of the main box and then change its height and width accordingly.

    * Crop the header and the spike ball and File-Save for web it.

    * Crop one pixel of the footer and then change its width in the html file.

    EDIT: -
    I have done something very quickly 4 u (took me about 30 minutes) to show what i mean to say. U can download it from here: -
    http://rapidshare.com/files/8898813/coding_forums.rar


    Hope that helps.
    Plz reply back if ur stuck some where.
    Hasnain Mir Mohammed
    Last edited by hasnain721; 12-25-2006 at 03:58 PM.

  • #7
    New to the CF scene
    Join Date
    Dec 2006
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts
    i can't see it.

    I downloaded it. but it won't work. I can't ever get rapidshare files to work for me.

    Could you host it somewhere else or something? I really apreciate your help, and i don't want it to go to waste. maybe try e-mailing it to me

    Spit_Me_Out666@yahoo.com

  • #8
    New Coder
    Join Date
    Aug 2006
    Posts
    97
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Here you go.. i even did the html and css for you

    enjoy
    ciggy
    Attached Files Attached Files

  • #9
    New Coder
    Join Date
    May 2006
    Posts
    17
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Spit_Me_Out View Post
    i can't see it.

    I downloaded it. but it won't work. I can't ever get rapidshare files to work for me.

    Could you host it somewhere else or something? I really apreciate your help, and i don't want it to go to waste. maybe try e-mailing it to me

    Spit_Me_Out666@yahoo.com
    sure
    try this: - http://www.megaupload.com/?d=ITSURA5U


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •