?
Solved

displaying banner in different browsers

Posted on 2004-03-20
10
Medium Priority
?
188 Views
Last Modified: 2010-08-05
I had made in photoshop 6 a banner that I want it to be displayed in the full width of the browser, the banner size is 500x60 and its resolution is 72 pix/inch and it is in jpg format>
I tried to set the width and hight property in the html file, but the image was destroyed, also I tried to change the image size in photoshop but also the image was destroyed...
can somebody tell the solution and tell me also how to make the image fet all browsers????
0
Comment
Question by:romram
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 3
  • 2
  • +1
10 Comments
 
LVL 30

Expert Comment

by:weed
ID: 10641453
Any time you resize an image with HTML itll look UGLY. No real way around that one.
As for resizing in photoshop, NEVER resize up. If youre going to resize, resize down.
There's really no way to take a raster image, and have it resize nicely so that it fits ALL browsers. If you want something that resizes nicely, youll have to do it as a vector, flash, or SVG.
0
 
LVL 3

Expert Comment

by:echobravo316
ID: 10642824
Resize each layer in PS individually in order to maintain as much resolution as is possible.  You can make one size that is pretty close to "fits all browsers" however with so many variables like screen size/resolution etc it wont be 100%.  
0
 
LVL 30

Expert Comment

by:weed
ID: 10642835
resizing each layer individually makes NO difference in the resulting quality. Nor is it going to have anything to do with the resulting rez.
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
LVL 3

Expert Comment

by:echobravo316
ID: 10642959
Well its better then resizing the picture with HTML.
0
 
LVL 30

Expert Comment

by:weed
ID: 10643030
Not really. The problem is that the image doesnt "grow" to fit larger browsers. Resizing it in Photoshop (all the layers at once, not one at a time which achieves nothing different than doing them all at once) will give you a slightly better image, but you've still hosed your quality. If you resize down in photoshop your image will look better than a resize up, but you've just gotten farther away from having it fit all browsers.
0
 
LVL 3

Expert Comment

by:echobravo316
ID: 10643580
Oh I see now.  I misunderstood the question.  Well I dont see why you couldnt find a JavaScript code that would resize the image accorgind to browser, screen resolution etc.  Try www.javascriptsource.com.  If your a more advanced web designer, try setting up several IF statements
0
 
LVL 9

Expert Comment

by:j3one
ID: 10644150
If you are just wanting it to not look odd, you could make it expand and collapse with the browser. you would just make a table and insert a small slice of the end of your immage (lke 10 px) as the background img for the table. Next nest another table inside the first one with your img in it. The code would look somthing like this...

<table background="images/exp2.gif" width="100%" height="60" border="0" cellpadding="0" cellspacing="0">
<tr><td>
<table id="Table_01" width="735" height="173" border="0" cellpadding="0" cellspacing="0">
      <tr><td><img src="images/YOUR.jpg" width="500" height="60" alt=""></td></tr>
</table></td></tr></table>

the end result would be that no matter ther screen resalution or browser size, your banner will streach all the way accross the screen.
0
 
LVL 1

Accepted Solution

by:
snapdragon030500 earned 375 total points
ID: 10689418
The majority of browers on the Web are still using 800 x 600 resolution.  I like to design headers that are 760 pixels wide, then fill in out to 1024 pixels wide with prettiness that is not important information.  That way, people with 800 x 600 resolution are missing nothing, and people with 1024 x 768 resolution see something all the way across.  People with smaller resolution than 800 see most websites cut off horizontally anyway because their monitor is just too small for modern times.  And people with larger resolution than 1024 x 768 are used to websites not filling their screens.
0
 
LVL 1

Expert Comment

by:snapdragon030500
ID: 10689419
The majority of browers on the Web are still using 800 x 600 resolution.  I like to design headers that are 760 pixels wide, then fill in out to 1024 pixels wide with prettiness that is not important information.  That way, people with 800 x 600 resolution are missing nothing, and people with 1024 x 768 resolution see something all the way across.  People with smaller resolution than 800 see most websites cut off horizontally anyway because their monitor is just too small for modern times.  And people with larger resolution than 1024 x 768 are used to websites not filling their screens.
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction When sharing photos, especially via e-mail, the large resolution images that most cameras take today make for extremely large file sizes. The time required to upload these files to forums, send in e-mails, post to blogs or even placi…
This article outlines the struggles that Macs encounter in Windows-dominated workplace environments – and what Mac users can do to improve their network connectivity and remain productive.
In this tutorial viewers will learn how to increase their history states in Photoshop To undo more than one history state, use Ctrl + Alt + Z, not just Ctrl + Z: View the History window by going to Window > History: The default number of history sta…
I designed this idea while studying technology in the classroom.  This is a semester long project.  Students are asked to take photographs on a specific topic which they find meaningful, it can be a place or situation such as travel or homelessness.…
Suggested Courses
Course of the Month9 days, 15 hours left to enroll

762 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question