How to extend an image

Discussion in 'HTML' started by David Segall, Mar 20, 2006.

  1. David Segall

    David Segall Guest

    My site <http://profectus.com.au> makes use of an image to decorate
    the top and bottom of the page. This usually works for a small range
    of screen widths but is seriously challenged by the contrast between
    conventional monitors and the new trend to wide-screen monitors.

    Has anybody thought of some trick that is generally acceptable? I use
    repeat-x but this often results in a confusing image.
     
    David Segall, Mar 20, 2006
    #1
    1. Advertising

  2. David Segall wrote:

    > My site <http://profectus.com.au> makes use of an image to decorate
    > the top and bottom of the page. This usually works for a small range
    > of screen widths but is seriously challenged by the contrast between
    > conventional monitors and the new trend to wide-screen monitors.
    >
    > Has anybody thought of some trick that is generally acceptable? I use
    > repeat-x but this often results in a confusing image.


    I don't have an answer for you, but I can confirm that even on my standard
    monitor at default resolution and window size (1200x1024) The upper graphic
    is confusing. I am glad that I don't normally maximize over both monitors
    with a resulting 2400x1024 window.


    Carolyn
    --
    Carolyn Marenger
     
    Carolyn Marenger, Mar 20, 2006
    #2
    1. Advertising

  3. David Segall

    Neredbojias Guest

    With neither quill nor qualm, David Segall quothed:

    > My site <http://profectus.com.au> makes use of an image to decorate
    > the top and bottom of the page. This usually works for a small range
    > of screen widths but is seriously challenged by the contrast between
    > conventional monitors and the new trend to wide-screen monitors.
    >
    > Has anybody thought of some trick that is generally acceptable? I use
    > repeat-x but this often results in a confusing image.


    You need a symmetrical graphic, cropped so that it abuts to itself
    gracefully.

    --
    Neredbojias
    Contrary to popular belief, it is believable.
     
    Neredbojias, Mar 20, 2006
    #3
  4. David Segall

    Greg N. Guest

    David Segall wrote:

    > Has anybody thought of some trick that is generally acceptable? I use
    > repeat-x but this often results in a confusing image.


    This is not an HTML problem, but an image design problem.

    There are three approaches you could use:

    1. create a background image for the image (this may need some kind of
    layering technique) that extends the image gracefully to the right.

    Examples:
    the image on top of the page http://hothaus.de/greg-tour-2004
    There is a background image there that extends the right edge of that
    image ad infinitum.

    2. edit the image such that its right edge blends seamlessly with its
    left edge. This requires a suitable image plus some photoshop (and the
    like) experience.

    Examples:
    An image of ship loading cranes halfway down the page:
    http://hothaus.de/greg-tour-2005/ua1.htm
    Image of a power plant, 60% down the page:
    http://hothaus.de/greg-tour-2004/roman3.htm
    panorama of venice, 50% down the page:
    http://hothaus.de/greg-tour-2004/venice.htm

    3. Use a *very* wide image with less significant content in the right
    third. Such an image can be created in photoshop by copying the
    rightmost 20% of an image, scaling it horizontally to some excessive
    width and pasting it back to the right of the original image. Again,
    this requires a suitable image to begin with.

    Example:
    http://hothaus.de/greg-tour-2005/img/0603/i2793.jpg


    --
    Gregor mit dem Motorrad auf Reisen:
    http://hothaus.de/greg-tour/
     
    Greg N., Mar 20, 2006
    #4
  5. David Segall

    dorayme Guest

    In article <dvn2b3$q2m$>,
    "Greg N." <> wrote:

    > David Segall wrote:
    >
    > > Has anybody thought of some trick that is generally acceptable? I use
    > > repeat-x but this often results in a confusing image.

    >
    > This is not an HTML problem, but an image design problem.
    >
    > There are three approaches you could use:
    >
    > 1. create a background img...
    > 2. edit the image such that its right edge blends seamlessly with
    >
    > Examples:
    >
    > 3. Use a *very* wide image with less significant content in the right


    > Example:


    There should be a category in the statistics to mark the
    excellence of this post. Succinct general analysis, suggested
    approaches with good examples... On my next return to Earth, I am
    going to make like this....

    --
    dorayme
     
    dorayme, Mar 20, 2006
    #5
  6. David Segall

    Nik Coughlin Guest

    David Segall wrote:
    > My site <http://profectus.com.au> makes use of an image to decorate
    > the top and bottom of the page. This usually works for a small range
    > of screen widths but is seriously challenged by the contrast between
    > conventional monitors and the new trend to wide-screen monitors.
    >
    > Has anybody thought of some trick that is generally acceptable? I use
    > repeat-x but this often results in a confusing image.


    Thank you for your post, it inspired me to finish a half-written page on
    this very topic:
    http://nrkn.com/backgroundWidth/

    My personal favourite way to do it is to fade the image to a background
    colour:
    http://nrkn.com/backgroundWidth/#fadeColour

    I've used your image as the example for now, but I will have to re-do the
    examples in future using images more suited to each particular technique.

    Greg N., I have linked to one of your pages as you have a much better
    example of one of the techniques there than I do.
     
    Nik Coughlin, Mar 21, 2006
    #6
  7. David Segall

    David Segall Guest

    "Nik Coughlin" <> wrote:

    >David Segall wrote:
    >> My site <http://profectus.com.au> makes use of an image to decorate
    >> the top and bottom of the page. This usually works for a small range
    >> of screen widths but is seriously challenged by the contrast between
    >> conventional monitors and the new trend to wide-screen monitors.
    >>
    >> Has anybody thought of some trick that is generally acceptable? I use
    >> repeat-x but this often results in a confusing image.

    >
    >Thank you for your post, it inspired me to finish a half-written page on
    >this very topic:
    >http://nrkn.com/backgroundWidth/
    >
    >My personal favourite way to do it is to fade the image to a background
    >colour:
    >http://nrkn.com/backgroundWidth/#fadeColour
    >
    >I've used your image as the example for now, but I will have to re-do the
    >examples in future using images more suited to each particular technique.
    >
    >Greg N., I have linked to one of your pages as you have a much better
    >example of one of the techniques there than I do.
    >
     
    David Segall, Mar 21, 2006
    #7
  8. David Segall

    David Segall Guest

    "Nik Coughlin" <> wrote:

    >David Segall wrote:
    >> My site <http://profectus.com.au> makes use of an image to decorate
    >> the top and bottom of the page. This usually works for a small range
    >> of screen widths but is seriously challenged by the contrast between
    >> conventional monitors and the new trend to wide-screen monitors.
    >>
    >> Has anybody thought of some trick that is generally acceptable? I use
    >> repeat-x but this often results in a confusing image.

    >
    >Thank you for your post, it inspired me to finish a half-written page on
    >this very topic:
    >http://nrkn.com/backgroundWidth/
    >
    >My personal favourite way to do it is to fade the image to a background
    >colour:
    >http://nrkn.com/backgroundWidth/#fadeColour
    >
    >I've used your image as the example for now, but I will have to re-do the
    >examples in future using images more suited to each particular technique.
    >
    >Greg N., I have linked to one of your pages as you have a much better
    >example of one of the techniques there than I do.
    >

    Thanks Nik. I'm glad you completed this very useful page. Although I
    agree that some of the techniques you used were not ideal with my
    photograph I found it instructive to compare the effects on a common
    image. Finding a single image that works in each case is probably too
    difficult but perhaps you could show the effects on a common set of
    two or three images.
     
    David Segall, Mar 21, 2006
    #8
  9. David Segall

    David Segall Guest

    "Greg N." <> wrote:

    >David Segall wrote:
    >
    >> Has anybody thought of some trick that is generally acceptable? I use
    >> repeat-x but this often results in a confusing image.

    >
    >This is not an HTML problem, but an image design problem.

    You are right but I try to post to the group that will provide a
    useful reply. I apologise for not putting [OT] in the heading.
    >
    >There are three approaches you could use:
    >
    >1. create a background image for the image (this may need some kind of
    >layering technique) that extends the image gracefully to the right.
    >
    >Examples:
    >the image on top of the page http://hothaus.de/greg-tour-2004
    >There is a background image there that extends the right edge of that
    >image ad infinitum.
    >
    >2. edit the image such that its right edge blends seamlessly with its
    >left edge. This requires a suitable image plus some photoshop (and the
    >like) experience.
    >
    >Examples:
    >An image of ship loading cranes halfway down the page:
    >http://hothaus.de/greg-tour-2005/ua1.htm
    >Image of a power plant, 60% down the page:
    >http://hothaus.de/greg-tour-2004/roman3.htm
    >panorama of venice, 50% down the page:
    >http://hothaus.de/greg-tour-2004/venice.htm
    >
    >3. Use a *very* wide image with less significant content in the right
    >third. Such an image can be created in photoshop by copying the
    >rightmost 20% of an image, scaling it horizontally to some excessive
    >width and pasting it back to the right of the original image. Again,
    >this requires a suitable image to begin with.
    >
    >Example:
    >http://hothaus.de/greg-tour-2005/img/0603/i2793.jpg

    Thank you for your very helpful, beautifully illustrated, reply. You
    and Nik Coughlin have demonstrated that my choice of group was spot on
    :).
     
    David Segall, Mar 21, 2006
    #9
  10. David Segall

    Colin Wilson Guest

    Try <img src="my_image.jpg" height="10" width="100%">

    works in IE6


    "David Segall" <> wrote in message
    news:...
    > My site <http://profectus.com.au> makes use of an image to decorate
    > the top and bottom of the page. This usually works for a small range
    > of screen widths but is seriously challenged by the contrast between
    > conventional monitors and the new trend to wide-screen monitors.
    >
    > Has anybody thought of some trick that is generally acceptable? I use
    > repeat-x but this often results in a confusing image.
     
    Colin Wilson, Mar 29, 2006
    #10
    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. Yuriy

    How to Extend Session time

    Yuriy, Oct 16, 2003, in forum: ASP .Net
    Replies:
    4
    Views:
    9,700
    Bratislav Jevtic
    Oct 17, 2003
  2. Yuriy

    How to extend Session?

    Yuriy, Oct 17, 2003, in forum: ASP .Net
    Replies:
    2
    Views:
    1,286
    Lei Guangfu
    Oct 17, 2003
  3. Steve - DND

    Can you extend HtmlControls?

    Steve - DND, May 18, 2004, in forum: ASP .Net
    Replies:
    2
    Views:
    990
    Natty Gur
    May 18, 2004
  4. Laszlo Zsolt Nagy
    Replies:
    1
    Views:
    1,362
    Kartic
    Jan 26, 2005
  5. Guest
    Replies:
    2
    Views:
    151
    Guest
    Sep 1, 2004
Loading...

Share This Page