From ba30445e04c27a470c0c37d9775cccdaa26e890d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Re=CC=81mi=20Be=CC=81tin?= Date: Thu, 25 Apr 2024 20:41:46 +0200 Subject: [PATCH] Restore customize-design file --- pages/wai-customize-design.md | 123 ++++++++++++++++++++++++++++++++++ 1 file changed, 123 insertions(+) create mode 100755 pages/wai-customize-design.md diff --git a/pages/wai-customize-design.md b/pages/wai-customize-design.md new file mode 100755 index 00000000000..be9fb1d0063 --- /dev/null +++ b/pages/wai-customize-design.md @@ -0,0 +1,123 @@ +--- +title: How to Change Text Size or Colors +lang: en +layout: default +parent: "/" +permalink: /meta/customize/ +github: + repository: w3c/wai-website + path: 'pages/wai-customize-design.md' + label: wai-customize-design +license: creative-commons +feedbackmail: wai@w3.org +footer: > +

Date: Updated 4 March 2019. First published 2005.

+

Editors: Robert Jolly and Shawn Lawton Henry.

+--- + +
+ +To make text bigger, press two keys at the same time: + +* **Ctrl** _and_ **+** keys in Windows, Linux, and Chrome OS +* **⌘** _and_ **+** keys in Mac OS + +
+ +{::nomarkdown} +{% include box.html type="start" title="Summary" class="" %} +{:/} + +This page shows you how to change text size, text and background colors, and other display settings through your browser. + +{::nomarkdown} +{% include box.html type="end" %} +{:/} + +{::nomarkdown} +{% include toc.html type="start" title="Page Contents" %} +{:/} + +- TOC is created automatically. +{:toc} + +{::nomarkdown} +{% include toc.html type="end" %} +{:/} + +## Change Text Size with Zoom + +

Most web browsers let you increase and decrease the size of text, images, and other web page content with "zoom" features. Some browsers let you choose to zoom only the text size.

+

To change the zoom in most browsers, press the following two keys at the same time:

+ + +Browsers provide specific guidance on different ways to change the page zoom or text-only zoom: + +* [Google Chrome - Change text, image, and video sizes (zoom)](https://support.google.com/chrome/answer/96810) +* [Apple Safari - Zoom in on webpages](https://support.apple.com/guide/safari/zoom-in-on-webpages-ibrw1068/mac) +* [Mozilla Firefox - Font size and zoom](https://support.mozilla.org/en-US/kb/font-size-and-zoom-increase-size-of-web-pages) +* [Opera - Zoom](https://help.opera.com/en/latest/browser-window/#zoom) +* [Internet Explorer - Ease of access options](https://support.microsoft.com/en-us/help/17456/windows-internet-explorer-ease-of-access-options) +* [Microsoft Edge - Ease of Access in Microsoft Edge](https://support.microsoft.com/en-gb/help/4000734/windows-10-microsoft-edge-ease-of-access) +* [Vivaldi - Zooming options in Vivaldi](https://help.vivaldi.com/article/zooming-options-in-vivaldi/) + +## Other Text and Color Changes + +Some browsers provide functionality to set different aspects of font and color in the default view. + +* [Mozilla Firefox - Change the fonts and colors websites use](https://support.mozilla.org/en-US/kb/change-fonts-and-colors-websites-use) +* [Opera - Look and feel > Fonts](https://help.opera.com/en/presto/look-and-feel/#fonts) +* [Microsoft Internet Explorer - Ease of Access Options](https://support.microsoft.com/en-us/help/17456/windows-internet-explorer-ease-of-access-options) + +Other text and color settings are available in Reader View. + +## Reader View + +Most browsers offer a "Reader View" or "Reading View" that shows just the main content; it gets rid of navigation, ads, etc. Some browsers let you set the text font, text size, text color, background color, and line spacing in Reader View. + +* [Apple Safari - Hide ads when reading articles](https://support.apple.com/en-ca/guide/safari/hide-ads-when-reading-articles-sfri32632/mac) +* [Mozilla Firefox - Reader View for clutter-free web pages](https://support.mozilla.org/en-US/kb/firefox-reader-view-clutter-free-web-pages) +* [Microsoft Edge - Change font style and size for Reading view in Microsoft Edge](https://support.microsoft.com/en-us/help/4028023/microsoft-edge-change-font-style-and-size-for-reading-view) +* [Vivaldi - Reader View](https://help.vivaldi.com/article/reader-view/) + +## Advanced Options + +There are many browser extensions and add-ons that provide additional control over how the browser displays text and other content. + +While most browsers no long support user style sheets, extensions provide similar advanced user control. For example, the Stylus extension is available for several major browsers. + +## More Information + +### Why doesn't this work with some other websites? + +The browser settings on this page should work when websites and browsers meet **[accessibility guidelines](/standards-guidelines/)** and are designed for accessibility, flexibility, and user control. However: +* **some websites are designed to defeat user's browser settings** +* **some browsers do not provide as much user control** + +Text resizing, browser zoom, and other user choices may not work consistently on websites that do not meet accessibility guidelines. + +### Should all websites include instructions like this? + +It's up to the website owner. It's not an accessibility requirement that websites include information on changing text sizes and colors like this page. We chose to include this information to help people who want to know how to change their browser settings. + +### Should websites provide a widget to change text, color, etc. + +We chose to provide these instructions so that users can learn how to change the display for all websites. Widgets change only the website they are on. + +### Note: No Endorsement + +The World Wide Web Consortium (W3C) does not endorse specific web browsers or extensions and does not recommend one over another. While some common browsers are included in this page, mention of a specific browser does not imply endorsement or recommendation. +