CSS layouts for images

Discussion in 'HTML' started by GeneSmith@att.net, Aug 13, 2004.

  1. Guest

    I'm trying to design a web page that will have a few thumnails of
    different dimensions grouped on the left side, and a full size image of
    a clicked thumnail on the right side, along with a couple of lines of
    text below the image.

    Are there CSS layouts that will approximate this, and keep the
    thumbnails and the full size image positioned properly on different
    monitor sizes? Thanks.
     
    , Aug 13, 2004
    #1
    1. Advertising

  2. m Guest

    wrote:

    >
    > I'm trying to design a web page that will have a few thumnails of
    > different dimensions grouped on the left side, and a full size image of
    > a clicked thumnail on the right side, along with a couple of lines of
    > text below the image.
    >
    > Are there CSS layouts that will approximate this, and keep the
    > thumbnails and the full size image positioned properly on different
    > monitor sizes? Thanks.


    First, don't use a frame.
    Link to another page that has both the thumbmail and the full size image
    displayed if you want. You can either generate the pages server-side
    or preprocess the extra pages so that the thumbnail (or a group of
    thumbnails) and the enlargement always show up in the same place on
    the page. They should all be styled with a common spreadsheet file.

    http://www.mbstevens.com/howtothumb/
    http://www.mbstevens.com/preprocessor/
    --
    m
     
    m, Aug 13, 2004
    #2
    1. Advertising

  3. tm Guest

    m <> wrote:
    > wrote:


    > > I'm trying to design a web page that will have a few thumnails of
    > > different dimensions grouped on the left side, and a full size image of
    > > a clicked thumnail on the right side, along with a couple of lines of
    > > text below the image.
    > >
    > > Are there CSS layouts that will approximate this, and keep the
    > > thumbnails and the full size image positioned properly on different
    > > monitor sizes? Thanks.

    >
    > First, don't use a frame.


    Frames work for thumbnailed pictures.
    http://www.campalicious.com/2002/photos/dav/

    > Link to another page that has both the thumbmail and the full size image
    > displayed if you want. You can either generate the pages server-side
    > or preprocess the extra pages so that the thumbnail (or a group of
    > thumbnails) and the enlargement always show up in the same place on
    > the page. They should all be styled with a common spreadsheet file.
    >
    > http://www.mbstevens.com/howtothumb/
    > http://www.mbstevens.com/preprocessor/
     
    tm, Aug 13, 2004
    #3
  4. m Guest

  5. tm Guest

    tm, Aug 13, 2004
    #5
  6. m Guest

    tm wrote:

    >> > Frames work for thumbnailed pictures.
    >> > http://www.campalicious.com/2002/photos/dav/

    >>
    >> Ugggh!
    >> http://www.html-faq.com/htmlframes/?framesareevil
    >> http://www.useit.com/alertbox/9612.html

    >
    > Yeah, I've seen those. Frames still work for thumbnailed pictures.


    Question is not entirely whether it works -- the question is whether it is a
    good way to do it. An internet newbie wouldn't know how to find subframe
    information in order to save the address of, say, the image with the fur
    bikini, and might not be able to find it. And the back-arrow is broken.
    And a search engine would just index the frameset page, so anyone looking
    for pictures of fur bikinis would come to the page and have to search
    around for a while to find it, probably deciding it was not worth the
    trouble. A real subpage could have been given a <title> that a search
    engine could use. The page works, but has lousy usability.
    --
    m
     
    m, Aug 13, 2004
    #6
  7. m Guest

    m wrote:

    > tm wrote:
    >
    >>> > Frames work for thumbnailed pictures.
    >>> > http://www.campalicious.com/2002/photos/dav/
    >>>
    >>> Ugggh!
    >>> http://www.html-faq.com/htmlframes/?framesareevil
    >>> http://www.useit.com/alertbox/9612.html

    >>
    >> Yeah, I've seen those. Frames still work for thumbnailed pictures.

    >
    > Question is not entirely whether it works -- the question is whether it is
    > a
    > good way to do it. An internet newbie wouldn't know how to find subframe
    > information in order to save the address of, say, the image with the fur
    > bikini, and might not be able to find it. And the back-arrow is broken.
    > And a search engine would just index the frameset page, so anyone looking
    > for pictures of fur bikinis would come to the page and have to search
    > around for a while to find it, probably deciding it was not worth the
    > trouble. A real subpage could have been given a <title> that a search
    > engine could use. The page works, but has lousy usability.


    Correction, the back-arrow on this particular site doesn't seem to be
    broken, but the other frame-related problems are still there. The
    non-frame releated problems have to do with completely meaningless
    titles and filenames for the images and thumbnail images.


    --
    m http://www.mbstevens.com/
     
    m, Aug 13, 2004
    #7
  8. tm Guest

    m <> wrote:
    > tm wrote:


    > >> > Frames work for thumbnailed pictures.
    > >> > http://www.campalicious.com/2002/photos/dav/
    > >>
    > >> Ugggh!
    > >> http://www.html-faq.com/htmlframes/?framesareevil
    > >> http://www.useit.com/alertbox/9612.html

    > >
    > > Yeah, I've seen those. Frames still work for thumbnailed pictures.

    >
    > Question is not entirely whether it works -- the question is whether it is a
    > good way to do it. An internet newbie wouldn't know how to find subframe
    > information in order to save the address of, say, the image with the fur
    > bikini, and might not be able to find it. And the back-arrow is broken.
    > And a search engine would just index the frameset page, so anyone looking
    > for pictures of fur bikinis would come to the page and have to search
    > around for a while to find it, probably deciding it was not worth the
    > trouble. A real subpage could have been given a <title> that a search
    > engine could use.


    All wonderful arguments against frames. Otoh, if you want to display
    thumbnails and pictures in the same window, frames work.

    >The page works, but has lousy usability.


    Lousy usability in terms of bookmarking and searching, in terms of
    browsing thumbnails it has excellent usability.
     
    tm, Aug 13, 2004
    #8
  9. tm Guest

    m <> wrote:
    > m wrote:
    > > tm wrote:


    > >>> > Frames work for thumbnailed pictures.
    > >>> > http://www.campalicious.com/2002/photos/dav/
    > >>>
    > >>> Ugggh!
    > >>> http://www.html-faq.com/htmlframes/?framesareevil
    > >>> http://www.useit.com/alertbox/9612.html
    > >>
    > >> Yeah, I've seen those. Frames still work for thumbnailed pictures.

    > >
    > > Question is not entirely whether it works -- the question is whether it is
    > > a
    > > good way to do it. An internet newbie wouldn't know how to find subframe
    > > information in order to save the address of, say, the image with the fur
    > > bikini, and might not be able to find it. And the back-arrow is broken.
    > > And a search engine would just index the frameset page, so anyone looking
    > > for pictures of fur bikinis would come to the page and have to search
    > > around for a while to find it, probably deciding it was not worth the
    > > trouble. A real subpage could have been given a <title> that a search
    > > engine could use. The page works, but has lousy usability.

    >
    > Correction, the back-arrow on this particular site doesn't seem to be
    > broken, but the other frame-related problems are still there. The
    > non-frame releated problems have to do with completely meaningless
    > titles and filenames for the images and thumbnail images.


    Yes, the page is not perfect, wasn't looking for a critique, its not
    my page. Just pointing out that that method is a fine way to display
    pictures.
     
    tm, Aug 13, 2004
    #9
  10. m Guest

    tm wrote:

    > Lousy usability in terms of bookmarking and searching, in terms of
    > browsing thumbnails it has excellent usability.


    The page could get that _without_ the other problems
    by dropping the frames.

    The otehr problems are just not acceptable.
    --
    m
     
    m, Aug 13, 2004
    #10
  11. tm Guest

    m <> wrote:
    > tm wrote:


    > > Lousy usability in terms of bookmarking and searching, in terms of
    > > browsing thumbnails it has excellent usability.

    >
    > The page could get that _without_ the other problems
    > by dropping the frames.


    Wasn't the original question how to have the thumbnails and the full
    pictures open in the same window?

    > The otehr problems are just not acceptable.


    To whom?
     
    tm, Aug 13, 2004
    #11
  12. tm wrote:
    > Lousy usability in terms of bookmarking and searching, in terms of
    > browsing thumbnails it has excellent usability.


    Shooting yourself out of a cannon has lousy usability in terms of not
    getting injured, in terms of travel it has excellent usability.
     
    Leif K-Brooks, Aug 13, 2004
    #12
  13. tm Guest

    Leif K-Brooks <> wrote:
    > tm wrote:


    > > Lousy usability in terms of bookmarking and searching, in terms of
    > > browsing thumbnails it has excellent usability.

    >
    > Shooting yourself out of a cannon has lousy usability in terms of not
    > getting injured, in terms of travel it has excellent usability.


    Cool.
    Analogys are usually lousy in terms of enlightenment, but they are
    excellent in terms of entertainment.
     
    tm, Aug 13, 2004
    #13
  14. m Guest

    tm wrote:

    > m <> wrote:
    >> tm wrote:

    >
    >> > Lousy usability in terms of bookmarking and searching, in terms of
    >> > browsing thumbnails it has excellent usability.

    >>
    >> The page could get that _without_ the other problems
    >> by dropping the frames.

    >
    > Wasn't the original question how to have the thumbnails and the full
    > pictures open in the same window?


    Yes. Completely achievable without frames.
    >
    >> The otehr problems are just not acceptable.

    >
    > To whom?


    To newbies who can't figure how to bookmark subframes.
    To people using search engines who love fir bikinis.
    To me and those in my room.
    Lots of folk besides youm,
    Thas 'om.
    --
    m http://www.mbstevens.com/
     
    m, Aug 13, 2004
    #14
  15. tm Guest

    m <> wrote:
    > tm wrote:
    > > m <> wrote:
    > >> tm wrote:


    > >> > Lousy usability in terms of bookmarking and searching, in terms of
    > >> > browsing thumbnails it has excellent usability.
    > >>
    > >> The page could get that _without_ the other problems
    > >> by dropping the frames.

    > >
    > > Wasn't the original question how to have the thumbnails and the full
    > > pictures open in the same window?

    >
    > Yes. Completely achievable without frames.


    Ah, finally. Please elaborate.
     
    tm, Aug 13, 2004
    #15
  16. tm Guest

    Leif K-Brooks <> wrote:
    > tm wrote:


    > >>>Wasn't the original question how to have the thumbnails and the full
    > >>>pictures open in the same window?
    > >>
    > >>Yes. Completely achievable without frames.

    > >
    > > Ah, finally. Please elaborate.

    >
    > http://www.porjes.com/butterflies/


    Thank you. Exactly what i was looking for.
     
    tm, Aug 13, 2004
    #16
  17. tm wrote:
    >>>Wasn't the original question how to have the thumbnails and the full
    >>>pictures open in the same window?

    >>
    >>Yes. Completely achievable without frames.

    >
    > Ah, finally. Please elaborate.


    http://www.porjes.com/butterflies/
     
    Leif K-Brooks, Aug 13, 2004
    #17
  18. m Guest

    tm wrote:

    > m <> wrote:
    >> tm wrote:
    >> > m <> wrote:
    >> >> tm wrote:

    >
    >> >> > Lousy usability in terms of bookmarking and searching, in terms of
    >> >> > browsing thumbnails it has excellent usability.
    >> >>
    >> >> The page could get that _without_ the other problems
    >> >> by dropping the frames.
    >> >
    >> > Wasn't the original question how to have the thumbnails and the full
    >> > pictures open in the same window?

    >>
    >> Yes. Completely achievable without frames.

    >
    > Ah, finally. Please elaborate.


    Subpages have left-hand div (with scrollbar turned on
    if the (perhaps benighted) designer feels it absolutely necessary).
    Repeating elements are easy do with either server-side page generation
    or preprocessing.

    Precise behavior of the bikini site would take some trouble,
    but the original question didn't require that.
    --
    m
     
    m, Aug 13, 2004
    #18
  19. Guest

    Leif K-Brooks wrote:
    >
    > tm wrote:
    > >>>Wasn't the original question how to have the thumbnails and the full
    > >>>pictures open in the same window?
    > >>
    > >>Yes. Completely achievable without frames.

    > >
    > > Ah, finally. Please elaborate.

    >
    > http://www.porjes.com/butterflies/


    Thanks, this is very close to what I have in mind. I would like to group
    the thumbnails on the left side and the enlarged image on the left, and
    should be able to do it. The big problem is how to get the thumbnails
    aligned "properly" on different monitor sizes and with different
    browsers. For example, if the thumbnails consist of a mixture of
    landscapes and portraits and are of different dimensions. Any hints?

    BTW, I would like this page to be standardized and without frames.
     
    , Aug 16, 2004
    #19
  20. bulge Guest

    On Fri, 13 Aug 2004 11:49:32 GMT, wrote:

    >
    >I'm trying to design a web page that will have a few thumnails of
    >different dimensions grouped on the left side, and a full size image of
    >a clicked thumnail on the right side, along with a couple of lines of
    >text below the image.
    >
    >Are there CSS layouts that will approximate this, and keep the
    >thumbnails and the full size image positioned properly on different
    >monitor sizes? Thanks.


    First half of this article should help:
    http://www.alistapart.com/articles/practicalcss/

    Outlines how to do thumbnails.
     
    bulge, Aug 16, 2004
    #20
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Half Dolla 2003

    Can CSS benefit non-liquid layouts?

    Half Dolla 2003, Jul 22, 2003, in forum: HTML
    Replies:
    10
    Views:
    778
    Adrienne
    Jul 26, 2003
  2. Brian
    Replies:
    0
    Views:
    378
    Brian
    Jul 24, 2003
  3. Talc Ta Matt

    What a debacle CSS layouts can create

    Talc Ta Matt, Jul 31, 2003, in forum: HTML
    Replies:
    9
    Views:
    423
    Hieronymus
    Aug 1, 2003
  4. Ramon F Herrera

    Swing layouts vs. SWT layouts?

    Ramon F Herrera, Nov 10, 2007, in forum: Java
    Replies:
    5
    Views:
    2,654
    Benjamin Toren
    Dec 7, 2009
Loading...

Share This Page