SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Member
    Join Date
    Jun 2011
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    I'm a newbie - Connecting up your graphics in your web-site

    Hi eveyone

    Can anyone advise me how to build up a web-site so that that it looks nice.

    I know it might sound like a daft question. I've been using the Sitepoint "Build You Own Web Site The Right Way" book which shows me how to do a graphics header logo (which works fine). But I've also been viewing the Source on some random css websites and find that the nicer looking ones split the graphics up into blocks- some even place the .jpeg graphics into tables. On reading the book it implies that we should only be using tables for statistical type data which is what it tables were originally intended for.

    So my questions are
    i) Why do web-designers split their graphics up on a web-site where it looks like it would be possible to just to the same thing using one .jpeg file instead of about twenty or more .jpeg files if you see what I mean .
    ii) Also is it better to place your graphics in a table or use css to move the div element to the correct place?

    If anyone knows a web-site that might explain how it should be done then that would also be appreciated.

    Thanks
    David

  2. #2
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    That book uses the correct method and the TABLE elements is NOT for arranging sliced images. It depends by what you mean with sliced images; sometimes it can effect loading times if some of the images compress more than the others as individual images (or as one whole large image).

    Though if the sliced image is just a background header then the odds are if they have double figure images then they have done something wrong with their design. However, if you mean for navigation bars/menu then usually it's best to that CSS and background images are applied.

  3. #3
    Community Advisor silver trophybronze trophy
    dresden_phoenix's Avatar
    Join Date
    Jun 2008
    Location
    Madison, WI
    Posts
    2,742
    Mentioned
    32 Post(s)
    Tagged
    1 Thread(s)
    i) a lot of what you see in the net is bad. I wish I could say.. hey look at source code and you will be able to learn the techniques of the masters. but what actually happen is clients hire the cheapest or worst.. and whatever gets by gets up on the net. :/

    aside from the fact that tables aren't semantically correct for layout, splitting your graphic can slowdown your site by adding to the number of server requests.

    rule of thumb: if you can get rid of patterned space or large areas of single color by using multiple images.. do so. otherwise... NO!!!

  4. #4
    SitePoint Zealot blackberryfan's Avatar
    Join Date
    Nov 2010
    Location
    middleOnowhere, South Africa.
    Posts
    101
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I can't comment much on the use of split images as it is a bit hard to understand what exactly you are talking about. Maybe you could provide an example of a website so that we could see what you're talking about.

    That book is good, i started off reading that book almost a year ago, and i've grown leaps and bounds since then. `the right way` really did make an effect I think.

    As for your second question, well, in my opinion the use of a table based website is... TERRIBLE! So limiting to say the least. So my answer to that would be to learn more about html and css positioning. It's definately the better way to go.

    I have one more thing to say, learn a little bit about php includes when you are comfortable with html and css. It will really make the learning bit alot easier when you realise you have done something wrong, and need to change your design on alot of pages. An example of this would be having one single file that contains the html of your header for instance, then including that file on all of your pages. That way when you need to change your header, you only need to change one file, instead of every single page that uses your header

    Hope that helps!

    O and p.s. Make use of this forum like they say in the book, it helps!

  5. #5
    SitePoint Member
    Join Date
    Jun 2011
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks blackberryfan - that was a very interesting tip about using one html file to be the header. Any chance that you could include some example code to call the header file?

    Thank you so much
    David


Bookmarks

Posting Permissions

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