Trying to get my application to look good on different resolutions.

I've created a pretty cool document management application but have a few small bugs that I need to fix if possible.  One of them is that when I look at the app in a window with resolution of 800 x 600 it looks cramed together and some of the text needs to wrap in order to stay in the window.  The fonts all look like they could be reduced in size and still be readable.  I seem to run into this problem a lot and I'm wondering if anyone has any tips on how to make this work and look good on different resolutions.  I'm thinking that I might be able to capture the users screen resolution and then use a different style sheet depending on what resolution they get.  Maybe that isn't possible.  Any suggestions are welcomed.

Tim
LVL 4
Ike23Asked:
Who is Participating?
 
humeniukCommented:
If you've decided that's the way you want to go, here's a javascript solution that will redirect your user to different pages based on screen resolution: http://javascript.internet.com/user-details/resolution-page.html.  You could certainly modify it to call a different style sheet rather than redirect.
0
 
amirinamdarCommented:
Oooops.... I did not read the Q properly, that it does not specifically refer to a browser. I was assuming it did, since it is in the 'Browser Issues' section. Please ignore if not relevant.
;-)
0
Cloud Class® Course: CompTIA Healthcare IT Tech

This course will help prep you to earn the CompTIA Healthcare IT Technician certification showing that you have the knowledge and skills needed to succeed in installing, managing, and troubleshooting IT systems in medical and clinical settings.

 
humeniukCommented:
If you want specific advice regarding this individual website, post a link here or, better yet, in the Web Dev section and you'll get a lot of good advice.  Your idea about using a different style sheet for different resolutions would work (it can be done with Javascript), but isn't that extremely impractical?

You may want to stop reading right there if you're the kind of person who doesn't like answers that lead to a whole bunch of new questions, but there's a Pandora's Box kind of sitting there and I can't help but open it . . .

Since you mention style sheets, I presume you're familiar with CSS, which is good.  I'm not expert, in fact it's something I'm in the process of learning, in part because I've come to believe that it is the best way to accomplish the necessary goal of creating websites with fluid layouts that are cross-browser and cross-resolution compatible.  It's been challenging at times, largely because in my case it involves unlearning a lot of things I've been using for a while.  Needless to say, this is a big question and a there is a lot of opinions and info out there including a great deal here on E-E (browse through the CSS, HTML, and Web Dev TA's for a while, you'll see what I mean).

Here are a few threads that have influenced my thinking on this topic:

http://cd-articles.fateback.com/Formsin4.html (ok, it's an article, not a thread, but it's by COBOLdinosaur, so it's kind of an honorary thread)
www.experts-exchange.com/Web/Web_Languages/CSS/Q_21110511.html
www.experts-exchange.com/Web/Web_Languages/CSS/Q_21078818.html
www.experts-exchange.com/Web/Web_Languages/CSS/Q_21087312.html
www.experts-exchange.com/Web/Web_Languages/CSS/Q_21077593.html
www.experts-exchange.com/Web/Web_Languages/HTML/Q_21121008.html


If you want to see some examples of how CSS can be used to serve this purpose, consider this:

"It is difficult to see the value in it until you look at sites like this: http://www.csszengarden.com/

Look at a few of the alternate layouts and understand, they are all the same page.  The presentation differences are just creative use of CSS; and anyone can do it once they decide to leave the two dimensional world of flat grids for web pages." (from Q_21110511.html above)  Take a look at the examples in different resolutions and different browsers and you'll have a good idea what to aim for.

I hope this helps.
0
 
COBOLdinosaurCommented:
>>>The fonts all look like they could be reduced in size and still be readable.

Readable by who?  Someone with perfect vision?  What about those of us who where biofocal? or have serious vision deficiencies.  On every browser ther is a control to let the user change the size of fonts.  It you build pages that specify fonts sizes you make it less accessible.

Which is more important the blocks of text fit into the area where you you want them to render, or everyon being able to read the text.  A great layout means absolutely zero if the content is not accessible and usable to all users.  The absolute number one mistake that developers make is thinking that the page is about them, their design and the cool layout.  after seeing it once the average user does not notice any of teh cute little pieces the developer put ther for them. They notice that they get exactly what they needed; they got it fast; and it was easy to use the controls.

A web page is not a printed page and you should not try and control it like one.  Let it flow and flex.  Use CSS to give it the 4 dimensional aspect it deserves.  Take a look at how many the same content can be presented if you let CSS drive the bus: http://www.csszengarden.com/

Cd&
0
 
Ike23Author Commented:
I was just thinking that I could use a dynamic variable to set the font sizes in my style sheet.  If I could tell what the resolution of the browser was then I could set a variable say 12 for font-size and have that value updated every place that uses font-size of 12.  Then if the res was say 800 x 600 I could change the variable to 10 and have the fonts show up smaller so they don't have to wrap as much.  I am already done with the site and am not about to re-design it so I need a way to make it look a little better is all.  It still works but I want it to be a bit more browser friendly.  Thanks.
0
 
COBOLdinosaurCommented:
Oops dup the link.  Sorry about that.  Great minds think alike; and there are a lot of us that really love zengarden.

Cd&
0
 
humeniukCommented:
<< Oops dup the link.  Sorry about that.  Great minds think alike; and there are a lot of us that really love zengarden. >>

I'm just repeating some great advice that I've received in the past.  The quote and link in my post come from your post in the specified thread, so the credit belongs to you  :)
0
 
COBOLdinosaurCommented:
Points to humeniuk IMHO.

Cd&
0
 
humeniukCommented:
TY Cd.

I would suggest that the content of Cd's comment and his influence on the content of mine (I quoted him and referred the asker to other comments he's made) are deserving of recognition as well.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.