Stop, Browser Time – Part 2: A Browser with a View

Have you ever been to a website and thought, “This looks weird. Part of the page is cut off on the right.”

Do you ever have trouble reading a webpage because the text is so small?

A lot of what you see online is “what you see is what you get” but there are some things you can control. This week we’ll talk about some of the things you can control about what you view in your browser.

Screen Resolution

800 x 600 ….. 1024 x 768 ….. do those numbers seem vaguely familiar? What about the phrase “best viewed in 800 x600″?

These numbers refer to your computer’s screen resolution. 800 x 600 means your monitor will display 800 pixels across and 600 pixels down. 1024 x 768 means the monitor will display 1,024 pixels across and 768 pixels down. It doesn’t matter if you know what a pixel is, what matters is that you understand that a monitor that displays more pixels can fit more stuff on your screen.

The weird thing about screen resolution is that the bigger the numbers get – like 1024 x768 – the smaller everything will look. You’ll have more room on your screen because your monitor has more pixels to use to display your stuff, but everything will look smaller.

We hope this video will help to clear up any confusion about screen resolution:
Screen Resolution – a video where you really have to have sound.

Text Size

If you’ve set the screen resolution of your computer monitor to 1024 x 768, you should be able to view the Tennessean website or MSNBC without any trouble – but can you read the text on the screen? Or could you read it better before you changed the screen resolution? Isn’t there a way to see all of a website, but still be able to read it???

That’s a good question.

The answer is, most of the time, but not always.

Most websites are set up to allow you to change the size of the words on the screen. Let’s change text size of this page right now.

view.jpgClick on View in the menu bar (see picture).

Now, scroll down to “text size” and choose “largest.” Did the words on the screen get bigger?

Click on View in the menu bar again. Scroll down to “text size” and choose “smallest.” Can you still read this?

But, I said you could change the text size most of the time. There’s always a catch, isn’t there? Some websites have settings that don’t allow you to change the text size. If you’ve ever tried to change the text size and nothing happened, you were looking at a website that doesn’t allow you to change that setting. It seems mean, but usually a designer is concerned with preserving the look of the site.

Take a look at msnbc – this is with the text size set to medium (the default setting).

msnbc.jpg

Now, take a look at msnbc with the text size set to largest. See the difference?

msnbcbig.jpg

Some browsers, like firefox and Internet Explorer 7 try to compensate for this. These browsers allow you to override the setting the designer specified so you can still change the text size. And there’s an even quicker way to do it than using the View menu! Hold down the “ctrl” key on your keyboard and move the scroll wheel on your mouse – the text will get bigger/smaller!

Your mission, should you choose to accept it: 1. Watch the screen resolution video. (Be sure you are using Firefox or Internet Explorer or the link will not work.)

2. Change the screen resolution on your monitor. Jot down the original screen resolution first!

3. Open your web browser and go to msnbc.com. Change the size of the text using the View menu (or use the scroll wheel tip above).

4. You’re not finished yet! This is a four-part training. You must complete all four parts.

Go to Browser Time Part 3

6 Comments

  1. Glenn Worden says:

    I understand how to change screen resolutions and text size. I noticed that the text size changed on msnbc.com, but only some of the text changes on tennessean.com. I also noticed that playing with screen resolution and text size involves compromise. You can go from 800 x 600 to 1024 x 768 and see all of most web pages, but when you enlarge the text size to compensate, you start losing screen real estate again.

    I have a question: If you print a web page and the right side gets cut off, will changing the screen resolution fix the right-side printing problem?

  2. Jenny says:

    You’re right, there definitely is compromise. And these tricks won’t work in all cases. The text that doesn’t change on tennessean.com is likely defined by a style sheet. They library website is the same way right now.

    To print a website without having part of it cut off on the side, go to print preview and change the settings for the page. Sometimes selecting landscape instead of portrait will give enough room on the page for the site to print correctly. This is in Internet Explorer 6 – Firefox actually has an option to shrink the page to fit the paper.

    Does anyone else have any suggestions for fitting a website on a page without part of it being cut off during printing?

  3. B.N. Jones says:

    I tell patrons to copy and paste the text into a Microsoft Word document. Then the text will be plastic.

    [For the record, I find my screen fiercely resolute.]

  4. Crystal says:

    This was a helpful lesson. And ditto what Bryan says about copy and paste into Word. I also remind folks to always do a print preview – can’t tell you how many folks print out essentially blank pages before they come and ask for help.

  5. Linda Barnickel says:

    So – to answer Glenn’s original question above – screen resolution has no connection to the right side getting clipped, is that correct?

    Great lesson, Jenny! this is very helpful.

    But dang! Is there not a way I can tell my computer or programs to, for example:

    “When using Internet Explorer display using 1024×768 resolution but all other times use 800×600?” Having to manually tell it to switch back and forth seems…well, so primitive.

    thanks for this lesson!

  6. Jenny says:

    Wow, it would be cool if you could set your computer to change resolution automatically depending on what site/program you’re using. Or some kind of “quick change” button. Good idea!

Leave a Reply