redesigning my website... need ideas!

Discussion in 'Web Design and Development' started by Kingsly, Jul 22, 2006.

  1. Kingsly macrumors 68040

    Kingsly

    #1
    So I'm redesigning my site, now that I have the full version (no demo) of Adobe CS.

    Last revision I was using the demo, so there wasn't too much thought put into it or anything.
    I really like the clean lines and look of iWeb's 'modern' template, but am declining to use it, for what I imagine are obvious reasons.
    So... Ideas? I have lots of groovy pictures and graphics (i LOVE Illustrator) to integrate, and the black on white theme is getting soo old.
     
  2. tominated macrumors 68000

    tominated

    Joined:
    Jul 7, 2006
    Location:
    Queensland, Australia
    #2
  3. Kingsly thread starter macrumors 68040

    Kingsly

    #3
  4. Kingsly thread starter macrumors 68040

    Kingsly

    #4
    Okay, now I'm really in a pickle. My new site is up, but it takes for-freaking-ever to load. How do I limit the size of a page (so the user cannot stretch it out further), thus avoiding having to load the ENTIRE background image?

    www.mariposaprod.com
     
  5. frankblundt macrumors 65816

    frankblundt

    Joined:
    Sep 19, 2005
    Location:
    South of the border
    #5
    the user will have to load the entire background image regardless of how big the window is. make the bloody thing smaller, or compress it harder, or use a smaller palate. Or lose the clouds and make the sky colour the background and use a transparent gif for the trees.

    Looks nice tho, once it finally comes in. God help anyone on dialup...
     
  6. kaboutertje macrumors regular

    kaboutertje

    Joined:
    Jul 7, 2006
    Location:
    Amsterdam, Netherlands
    #6
    I think you are working on the site atm, cause it doesn't seem to load anything except for the menu/top picture.

    Edit: now I see why it took so long, you have this 1mb picture set up as a background
    http://www.mariposaprod.com/IMG_0259.jpg
    Use save for web in photoshop and play around with it, till you got a fast loading but still a good quality background. Iwouldn't use a background like this one though since it will make everything else hard to read.

    A good thing would be to design the whole site in photoshop slice it up and put it all back together in dreamweaver. I still make a lot of sites like that.
     
  7. Kingsly thread starter macrumors 68040

    Kingsly

    #7
    Thats the one image I'm not happy with... so its probably getting replaced. Anyway, I used 'save for web' in illustrator, but I guess its not compressed enough.
    I've seen sites that have cool b/g pix that never take so long to load!

    frankblundt, what I meant was limit the size of a window and then crop the image to fit.
     
  8. MacBoobsPro macrumors 603

    MacBoobsPro

    Joined:
    Jan 10, 2006
    #8
  9. kaboutertje macrumors regular

    kaboutertje

    Joined:
    Jul 7, 2006
    Location:
    Amsterdam, Netherlands
    #9
    Your site looks a lot better in comparison to the paintball site. The background images used on that site are far too big btw (not 1mb big but 200kb is too big if you ask me).
    I don't think the TS is a fan of your site though, since he is talking about a background image which your site seems to be missing, not that I mind though.
    Your site is clean, simple, but still looks good.
     
  10. frankblundt macrumors 65816

    frankblundt

    Joined:
    Sep 19, 2005
    Location:
    South of the border
    #10
    If you use Image Ready (not sure about Illustrator, but it opens automatically when you "Save for Web" in Photoshop) it shows you the original and the compressed versions and their sizes (in the "2-up" tab) and lets you tweak the compression settings to your heart's content before saving.

    For that image i'd imagine a Gif with an adaptive palette of 8 or so colours would be a lot smaller than what you've got, but you can try Jpg too - it re-renders it after every change you make to the settings and displays the new estimated file size at the bottom of the window.

    And please don't try and limit/control the browser's experience with window sizing, positioning, pop-ups etc. Unless you're promoting pr0n sites, where these kinds of techniques are very popular. Just make your page size smaller and design it in a way that it still looks acceptable in a larger window with a background colour or (small, repeating) texture.

    Although broadband penetration is increasing, there are still large numbers of browsers out there on dialup, for whom you should be trying to keep the total page size (images etc included) under 50KB (and even that will still take 10 seconds or more to load - imagine counting to ten every time you go to turn the page of a magazine..).
     
  11. Kingsly thread starter macrumors 68040

    Kingsly

    #11
    I really like that site. You did it in iWeb?

    frankblundt, I am really at a loss. the site has gone through more generations than I can count, and so far this one is the only one I really like...
    ... guess Im just not creative enough. :D
     
  12. Kingsly thread starter macrumors 68040

    Kingsly

    #12
    Okay, I've taken a new approach.
    click
    It looks a lot cleaner and well... better, IMO. I still need to optimize the pics so it'll load faster. Text and other stuff will reside in partially opaque white boxes floating over the pix. Good? And better ideas out there?
     
  13. frankblundt macrumors 65816

    frankblundt

    Joined:
    Sep 19, 2005
    Location:
    South of the border
    #13
    Here's a re-compressed version of the image - yours is a jpg at about 275KB, this is a gif done with a 16 colour palate (in ImageReady), which comes out at 60KB

    lunch.gif

    I like your style - your images are cool, but actually i preferred the old page.. the grey is a little, well, grey :p The nav links are a little lost now, and where's your logo gone (i like your logo too).

    Actually the grey is growing on me..
     
  14. Kingsly thread starter macrumors 68040

    Kingsly

    #14
    Thanks for the feedback...I need it. I could lighten up the grey a bit... perhaps it wouldn't be so bold. I realized I made a mistake on the contact page and the links turn green when I mouseover... I cant figure out how I did it or how to make it in the other pages. Help?
    Also, I want the logo in there, but I really like how clean it is now. Where should I put it?
     
  15. pavetheforest macrumors regular

    pavetheforest

    Joined:
    Apr 2, 2006
    Location:
    Pennsylvania
    #15
    White's the way to go

    I think you should reconsider the grey background and replace it with white. The gray just doesnt seem to compliment anything. The white would give good constrast to the purple and really help bring out to the middle white of the sign. Maybe stick a thin 1px black border around your image. Think it over....:cool:
     
  16. Kingsly thread starter macrumors 68040

    Kingsly

    #16
    Well, there are the other images to think about... what about a very light grey?
     
  17. mactib macrumors member

    mactib

    Joined:
    Jul 21, 2006
    #17
    for the navigation menu you put up there:

    Try to put them all in either small letters or caps and preferrably in a sans-seriff font. It will make them look much nicer. try to separate the words out and may be put in a dot between them.

    I really like the way you have posterised the background images,
     

Share This Page