Skip to main content
Sign In

Resources For: Prospective Students | Current Students | Parents | Faculty & Staff | Alumni & Friends | Patients

 

How To Change Browser Text Size or Colors

 

How To Change Text Size

Assistive Technology Partners' site is designed to let you change the text size, text and background colors, and other display settings through standard browser settings. The advantage of using the browser settings is that these settings will also work for all other websites which follow web accessibility guidelines.

Most Web browsers include functionality to let you increase or decrease the text size in a Web page. For example, to increase text size:

Browser Example Menu Items Macintosh Shortcut Windows Shortcut
Internet Explorer(6 and below)

Internet Explorer screen capture as described in the page

 View >
Text Size >
Largest		    
Firefox 3 Firefox screen capture as described in the page View >
Zoom >
Zoom In 		Command+

Ctrl + +

or

Ctrl + Mouse Scroll Wheel Up or Down

Firefox(2 and below),
Netscape		 Firefox/Netscape screen capture as described in the page
 View >
Text Size >
Increase		 Command+ Ctrl + +
Opera Opera screen capture as described in the page
 View >
Zoom >
%

Command+

+

or

Ctrl + Mouse Scroll Wheel Up or Down

Chrome 1 Chrome screen capture as described in the page (Page Control icon) >
Text zoom >Larger 		 

Ctrl + +

or

Ctrl + Mouse Scroll Wheel Up or Down

Chrome 3 Chrome screen capture as described in the page (Page Control icon) >
Zoom >Larger 		 

Ctrl + +

or

Ctrl + Mouse Scroll Wheel Up or Down

Safari Safari screen capture as described in the page View >
Make Text Bigger		 Command+

Ctrl + +

or

Ctrl + Mouse Scroll Wheel Up or Down

Many browsers also include a "zoom" button in the lower right portion of the window. This button aides in increasing the text size on the page and in many cases it increases the entire page, not just the text. Internet Explorer versions 7 and 8 and Opera versions 9 and 10 include this button. There are also different Add-Ons available for Firefox that can provide this functionality including QuickPageZoom and Zoom toolbar.

Browser Example Comments
Internet Explorer 7 and 8 Internet Explorer screen capture as described in the page Located in the lower right of the browser window.
Firefox with the QuickPageZoom Add-On installed Firefox screen capture as described in the page QuickPageZoom adds three options upon a right mouse click: zoom in page, zoom out page and reset page size. It also adds a zoom in and zoom out button to the status bar.
Firefox with the Zoom toolbar Add-On installed Firefox screen capture as described in the page The Zoom toolbar adds three buttons to the navigation toolbar.
Opera 9 and 10 Opera screen capture as described in the page Located in the lower right of the browser window.

Video Summary

The following video shows how to change the text size for Internet Explorer 6 and 7 and Firefox 2. It summarizes the information above and also includes other methods. For Firefox 3, the Text Size Toolbar extension does not work. Instead, the Zoom Toolbar or QuickPageZoom extensions, as described above can be used as alternatives. The video does not include any information about Opera, Chrome or Safari.

Why doesn't this work with some other Web sites?

The browser settings on this page should work when browsers and Web sites meet WAI guidelines and are designed for accessibility, flexibility, and user control. However, some browsers do not provide as much user control, and some Web sites are designed to defeat browser settings. Text resizing does not work well in browsers and Web sites that do not meet accessibility guidelines.

  • In Internet Explorer Version 6 and earlier, the text may not resize because the Web site is designed with "hard-coded" or "absolute" text sizes. To override Web site setting:
    1. Menu items: Tools > Internet Options
    2. In Internet Options dialog box: Accessibility button (bottom right)
    3. In Accessibility dialog box:
      [/] Ignore colors specified on Web pages
      [/] Ignore font styles specified on Web pages
      [/] Ignore font sizes specified on Web pages
  • In Internet Explorer Version 7 and 8, all aspects of a Web site, including fonts and images are resized. Resizing works fairly well with newer versions of Internet Explorer, even with sites that are not "coded" for flexibility.
  • In Firefox early versions(lower than 3.0), the text should resize even if the Web site text is not "coded" for flexibility. However the sections of the Web site may not resize, making it difficult to use the site with large text. This is because the Web site was designed with "hard-coded" or "absolute" sizes. Firefox does not resize images.
  • In newer versions of Firefox (3.0 and up), all elements of a web page are resized, including text and images. Resizing should work fairly well in newer versions of Firefox, even for sites that are not "coded" for flexibility.
  • Opera resizes all aspects of a Web site, including font, images and sections. Resizing should work fairly well in Opera, even if the Web site is not "coded" for flexibility.
  • In early versions of Google Chrome (version 1.0) supports enlarging the text size, however it does not also enlarge other elements on the page, such as images.
  • In newer versions of Google Chrome (3.0 and up), all elements of a web page are resized, including text and images. Resizing should work fairly well in newer versions of Google Chrome, even for sites that are not "coded" for flexibility.
  • In early versions of Apple Safari (version 3.2) supports enlarging the text size, however it does not also enlarge other elements on the pages, such as images.
  • In newer versions of Apple Safari (4.0 and up), all elements of a web page are resized, including text and images. Resizing should work fairly well in newer versions of Apple Safari, even for sites that are not "coded" for flexibility.

For a Plain Layout View

Turning off the style sheet gives a plain layout view, which:

  • makes text black on a white background (or however your browser is set)
  • puts all the information in one column (called "linearized")
  • leaves content images
  • removes background images
Browser Example Menu Items
Firefox Firefox screen capture as described in the page View >
Page Style >
No Style
Safari 3 Safari screen capture as described in the page
Safari screen capture as described in the page

Windows:

If the Develop menu is not showing,

Edit > Preferences > Advanced tab in the upper pane > click on "Show Develop menu in menu bar"

 

After the Develop menu appears
Develop > Disable Styles

 

Safari 4

Safari screen capture as described in the page

Windows:

(Current Page Menu icon) >
Develop >
Disable Styles
Opera Opera screen capture as described in the page View >
Style >
User Mode

Other Text and Color Changes

Many browsers provide functionality to set different aspects of font and color. Below are examples of how to access this functionality.

Browser Example To access functionality:
Firefox 3 Firefox screen capture as described in the page

Windows:

Tools > Options

In dialog box: Content (in the upper pane), Fonts & Colors section

Firefox 2 Firefox screen capture as described in the page

Windows:

Tools > Options
Macintosh Menu items: Firefox > Preferences

In dialog box: General (in the left pane), Fonts & Colors (button)
Chrome 1 Chrome screen capture as described in the page

Customize and control Google Chrome button > Options

In dialog box: Minor Tweaks tab, Change font and language settings (button)
Chrome 3 Chrome screen capture as described in the page

Customize and control Google Chrome button > Options

In dialog box: Under the Hood tab, Change font and language settings (button)
Safari 3 Safari screen capture as described in the text

Windows:

Edit > Preferences

In dialog box: Appearance (in the upper pane)

Safari 4

Safari screen capture as described in the page

Safari screen capture as described in the page

General Safari Settings button > Preferences

 

 

 

 

 

 

 

 

In dialog box: Appearance (in the upper pane)

Opera(version 9 and 10) Opera screen capture as described in the page

Windows:

Tools > Preferences


Macintosh Menu items: Opera > Preferences

In dialog box: Web Pages (in the upper pane)

Opera(version 8 or below) .

Windows Menu items: Tools > Preferences
Macintosh Menu items: Opera > Preferences

In dialog box: Fonts and Page Style (in the left pane)

Should all Web sites include instructions like this?

It is not an accessibility requirement that Web sites include information on changing text sizes and colors like this page. Assistive Technology Partners chose to include this information to help people who want to know how to change their browser settings and may not know how.

Web browsers and Web sites should be designed following WAI guidelines so that people can easily change text sizes and colors.

Note: No Browser Endorsement

Assistive Technology Partners does not endorse specific Web browsers and does not recommend one browser over another. While some common browsers are included in this page, mention of a specific browser does not imply endorsement or recommendation.

Acknowledgment

This page was adapted, with permission, from a page created by the Web Accessibility Initiative of the World Wide Web Consortium.

How to Change Text Size or Colors, S.L. Henry, ed. World Wide Web Consortium (MIT, ERCIM, Keio). http://www.w3.org/WAI/changedesign


Bookmark and Share