Skip to content

Commit

Permalink
chore(learn): Move MDN Curriculum into Learning Area (#36967)
Browse files Browse the repository at this point in the history 
* fix links

* Finish the getting started module structures

* more changes

* finish structuring content module

* Update files/en-us/learn_web_development/core/structuring_content/html_forms/index.md

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* Update files/en-us/learn_web_development/core/structuring_content/html_forms/index.md

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* Update files/en-us/learn_web_development/core/structuring_content/html_forms/index.md

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* Update files/en-us/learn_web_development/core/structuring_content/index.md

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* Update files/en-us/learn_web_development/core/structuring_content/mozilla_splash_page/index.md

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* fix typo

* fix broken links

* Update files/en-us/learn_web_development/core/structuring_content/html_images/index.md

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* Update files/en-us/learn_web_development/core/structuring_content/creating_links/index.md

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* Update files/en-us/learn_web_development/core/structuring_content/advanced_text_features/index.md

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* fix broken link and uncomment sidebar macros

* Update links to moved pages

* Move HTML Howto and update links

* Partial work towards first CSS module

* Complete work on first CSS module

* Update files/en-us/learn_web_development/core/styling_basics/getting_started/index.md

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* Update files/en-us/learn_web_development/core/styling_basics/getting_started/index.md

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* Update files/en-us/learn_web_development/core/styling_basics/basic_selectors/index.md

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* Complete work on Text styling module

* Complete work on CSS modules, start JS module

* Finish JS module and do Frameworks module

* Accessibility, design, and VCS modules

* Starting work on extensions

* animation and objects learning extensions

* Update files/en-us/learn_web_development/core/design_for_developers/index.md

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* Update files/en-us/learn_web_development/core/design_for_developers/index.md

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* Update files/en-us/learn_web_development/core/design_for_developers/index.md

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* Update files/en-us/learn_web_development/core/accessibility/tooling/index.md

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* Update files/en-us/learn_web_development/core/accessibility/index.md

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

* Client-side APIs learning extension

* Asyn JS learning extension

* Remove old Learn/JavaScript page, and update cross-links

* Performance extension module

* Create security and privacy extension module stub

* Testing module

* Server-side extension modules

* Forms extension module

* Remove Property_compatibility_table_for_form_controls article

* Client-side tools extension module

* Remove/redirect old Tools and testing landing page

* Remove/redirect common questions sections to new howto directory

* Remove/redirect old common questions landing page

* Move HTML cheatsheet to learn_web_development

* Move last few HTML docs out of old Learn directory

* remove/redirect old HTML learn landing pages

* Update links to old CSS learn landing pages

* Move MathML learning guides to Web/MathML

* Remove/redirect MathML learn landing page

* Remove/redirect top-level learn landing page

* chore(learn): Run prettier over WIP branch

* chore(learn): Update /;earn/ links

* chore(learn): Update /learn/ links, remove unused files

* chore(learn): Update /learn/ links, remove unused files

* chore: Add redirects for deleted pages

* chore: Add redirects for deleted pages

* Update rari learnsidebar

* Fix typo and add missing articles on scripting landing page

* Update mathmlref sidebar to account for learn changes

* Update htmlsidebar and landing to account for Learn changes

* Update cssref sidebar and landing to account for Learn changes

* Update jssidebar and landing to account for Learn changes

* Populate Resources for educators page and add to learnsidebar

* Populate changelog and add to sidebar

* Add About page and link it in the sidebar

* Add relevant FAQs to the about page

* Change Advanced guides to Additional guides

* Improve names of your first website articles, and links to more in-depth info

* Fix a typo and a link flaw

* Fix broken link

* Add explainer notes to articles that are currently incomplete

* Fix typo

* update common problems links to avoid confusion

* Update accessibilitysidebar to correspond with Learn updates

* Tweak other sidebars and landing pages for consistency, re: tutorials

* Change Guide to Tutorial where appropriate on Learn

* chore: Fix non-prefixed Learn Web Dev URLs

* Fix broken link on HTML landing page

* Fix broken links in accessibility testing checklist

* Make item lists into bulleted lists in Code editors page

* Learn move fixes (#7)

* fix macro

* sync and fmt sidebars

* chore: Mark missing LWD sections as TODOs

---------

Co-authored-by: Chris Mills <[email protected]>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: Florian Dieminger <[email protected]>
  • Loading branch information
@bsmth @chrisdavidmills
@github-actions @fiji-flo
4 people authored Dec 19, 2024
1 parent 44665eb commit 5b20f5f
Show file tree
Hide file tree
Showing 1,589 changed files with 15,416 additions and 20,740 deletions.
1,266 changes: 831 additions & 435 deletions files/en-us/_redirects.txt
View file

Large diffs are not rendered by default.

7,927 changes: 3,795 additions & 4,132 deletions files/en-us/_wikihistory.json
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion files/en-us/games/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ Welcome to the MDN game development center! In this area of the site, we provide
We've also included a reference section so you can easily find information about all the most common APIs used in game development.

> [!NOTE]
> Creating games on the web draws on a number of core web technologies such as HTML, CSS, and JavaScript. The [Learning Area](/en-US/docs/Learn) is a good place to go to get started with the basics.
> Creating games on the web draws on a number of core web technologies such as HTML, CSS, and JavaScript. The [Learn web development](/en-US/docs/Learn_web_development) section is a good place to go to get started with the basics.
## Port native games to the Web

Expand Down
2 changes: 1 addition & 1 deletion files/en-us/games/tutorials/2d_breakout_game_phaser/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ In this step-by-step tutorial, we create a simple mobile **MDN Breakout** game w

Every step has editable, live samples available to play with, so you can see what the intermediate stages should look like. You will learn the basics of using the Phaser framework to implement fundamental game mechanics like rendering and moving images, collision detection, control mechanisms, framework-specific helper functions, animations and tweens, and winning and losing states.

To get the most out of this series of articles you should already have basic to intermediate [JavaScript](/en-US/docs/Learn/Getting_started_with_the_web/JavaScript_basics) knowledge. After working through this tutorial, you should be able to build your own simple Web games with Phaser.
To get the most out of this series of articles you should already have basic to intermediate [JavaScript](/en-US/docs/Learn_web_development/Getting_started/Your_first_website/Adding_interactivity) knowledge. After working through this tutorial, you should be able to build your own simple Web games with Phaser.

![Gameplay screen from the game MDN Breakout created with Phaser where you can use your paddle to bounce the ball and destroy the brick field, with keeping the points and lives.](mdn-breakout-phaser.png)

Expand Down
2 changes: 1 addition & 1 deletion files/en-us/games/tutorials/2d_breakout_game_pure_javascript/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ In this step-by-step tutorial we create an **MDN Breakout** game written entirel

Every step has editable, live samples available to play with so you can see what the intermediate stages should look like. You will learn the basics of using the {{htmlelement("canvas")}} element to implement fundamental game mechanics like rendering and moving images, collision detection, control mechanisms, and winning and losing states.

To get the most out of this series of articles you should already have basic to intermediate [JavaScript](/en-US/docs/Learn/Getting_started_with_the_web/JavaScript_basics) knowledge. After working through this tutorial you should be able to build your own Web games.
To get the most out of this series of articles you should already have basic to intermediate [JavaScript](/en-US/docs/Learn_web_development/Getting_started/Your_first_website/Adding_interactivity) knowledge. After working through this tutorial you should be able to build your own Web games.

![Gameplay screen from the game MDN Breakout where you can use your paddle to bounce the ball and destroy the brick field, with keeping the score and lives.](mdn-breakout-gameplay.png)

Expand Down
2 changes: 1 addition & 1 deletion files/en-us/glossary/accessibility/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ Web accessibility is formally defined and discussed at the {{Glossary("W3C")}} t
## See also

- [Accessibility](/en-US/docs/Web/Accessibility)
- [Learn accessibility](/en-US/docs/Learn/Accessibility)
- [Learn accessibility](/en-US/docs/Learn_web_development/Core/Accessibility)
- [ARIA](/en-US/docs/Web/Accessibility/ARIA)
- [Web accessibility](https://en.wikipedia.org/wiki/Web_accessibility) on Wikipedia
- [Web Accessibility Initiative (WAI)](https://www.w3.org/WAI/) on W3C
Expand Down
2 changes: 1 addition & 1 deletion files/en-us/glossary/accessibility_tree/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ While still in draft form within the Web Incubator Community Group as of April 2
## See also

- [Accessibility](/en-US/docs/Web/Accessibility)
- [Learn accessibility](/en-US/docs/Learn/Accessibility)
- [Learn accessibility](/en-US/docs/Learn_web_development/Core/Accessibility)
- [Web accessibility](https://en.wikipedia.org/wiki/Web_accessibility) on Wikipedia
- [Web Accessibility In Mind](https://webaim.org/)
- [ARIA](/en-US/docs/Web/Accessibility/ARIA)
Expand Down
2 changes: 1 addition & 1 deletion files/en-us/glossary/accessible_description/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ The steps for defining accessible description in HTML are defined in the [HTML-A

- [Accessible Name and Description Computation 1.2 (accname)](https://w3c.github.io/accname/#mapping_additional_nd_description)
- [Accessibility](/en-US/docs/Web/Accessibility)
- [Learn accessibility](/en-US/docs/Learn/Accessibility)
- [Learn accessibility](/en-US/docs/Learn_web_development/Core/Accessibility)
- [Web accessibility](https://en.wikipedia.org/wiki/Web_accessibility) on Wikipedia
- [Web Accessibility In Mind](https://webaim.org/)
- [ARIA](/en-US/docs/Web/Accessibility/ARIA)
Expand Down
2 changes: 1 addition & 1 deletion files/en-us/glossary/accessible_name/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ Assistive technologies provide users with the accessibility name property, which
- [ARIA attribute](/en-US/docs/Web/Accessibility/ARIA/Attributes)
- [Accessible Name and Description Computation 1.2 (accname)](https://w3c.github.io/accname/#mapping_additional_nd_description)
- [Accessibility](/en-US/docs/Web/Accessibility)
- [Learn accessibility](/en-US/docs/Learn/Accessibility)
- [Learn accessibility](/en-US/docs/Learn_web_development/Core/Accessibility)
- [Web accessibility](https://en.wikipedia.org/wiki/Web_accessibility) on Wikipedia
- [Web Accessibility In Mind](https://webaim.org/)
- [ARIA](/en-US/docs/Web/Accessibility/ARIA)
Expand Down
2 changes: 1 addition & 1 deletion files/en-us/glossary/advance_measure/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,5 +14,5 @@ The _advance measure_ of unit `ch` is either the width or height of character "0
## See also

- {{cssxref("&lt;length&gt;")}}
- [Learn: CSS values and units](/en-US/docs/Learn/CSS/Building_blocks/Values_and_units)
- [Learn: CSS values and units](/en-US/docs/Learn_web_development/Core/Styling_basics/Values_and_units)
- [TextMetrics API](/en-US/docs/Web/API/TextMetrics)
2 changes: 1 addition & 1 deletion files/en-us/glossary/ajax/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ This technique is so common in modern web development that the specific term "Aj

## See also

- [Fetching data from the server](/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Fetching_data)
- [Learn: Making network requests with JavaScript](/en-US/docs/Learn_web_development/Core/Scripting/Network_requests)
- [Fetch API](/en-US/docs/Web/API/Fetch_API)
- Related glossary terms:
- {{Glossary("SPA", "Single-page application")}}
Expand Down
2 changes: 1 addition & 1 deletion files/en-us/glossary/alpha/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ As you can see, the color without an alpha channel completely blocks the backgro
## See also

- [CSS colors](/en-US/docs/Web/CSS/CSS_colors)
- [CSS values and units introduction](/en-US/docs/Learn/CSS/Building_blocks/Values_and_units)
- [Learn: Values and units](/en-US/docs/Learn_web_development/Core/Styling_basics/Values_and_units)
- [Image file type and format guide](/en-US/docs/Web/Media/Formats/Image_types)
- [Alpha compositing](https://en.wikipedia.org/wiki/Alpha_compositing) on Wikipedia
- [RGBA color model](https://en.wikipedia.org/wiki/RGBA_color_model) on Wikipedia
Expand Down
2 changes: 1 addition & 1 deletion files/en-us/glossary/aria/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ The specification, for example, allows you to add the attribute `role="alert"` t
- [Accessible Rich Internet Applications (WAI-ARIA)](https://w3c.github.io/aria/)
- [ARIA Authoring Practices Guide (APG)](https://www.w3.org/WAI/ARIA/apg/)
- [Accessibility](/en-US/docs/Web/Accessibility)
- [Learn accessibility](/en-US/docs/Learn/Accessibility)
- [Learn: Accessibility](/en-US/docs/Learn_web_development/Core/Accessibility)
- Related glossary terms
- {{Glossary("Accessibility")}}
- {{Glossary("WAI")}}
6 changes: 3 additions & 3 deletions files/en-us/glossary/asynchronous/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,16 +16,16 @@ Asynchronous communication is a method of exchanging messages in which the sendi

Email is a type of asynchronous human communication. A sender sends an email. The recipient reads the email and responds to it (or not) at their convenience, not necessarily right away. All parties can continue to send and receive messages at any time. Emails don't have to be scheduled in a particular sequence.

In asynchronous software, making a request, such as to a server, does not block other processes while waiting for the response. The software can continue performing other tasks. For example, in [promise-based APIs](/en-US/docs/Learn/JavaScript/Asynchronous/Implementing_a_promise-based_API), {{JSxRef("Promise")}} objects are created for long operations. After the operation is complete, the promise is handled. With promises, the software doesn't have to wait for the operation to finish.
In asynchronous software, making a request, such as to a server, does not block other processes while waiting for the response. The software can continue performing other tasks. For example, in [promise-based APIs](/en-US/docs/Learn_web_development/Extensions/Async_JS/Implementing_a_promise-based_API), {{JSxRef("Promise")}} objects are created for long operations. After the operation is complete, the promise is handled. With promises, the software doesn't have to wait for the operation to finish.

## In software design

Asynchronous software design expands upon the concept by building code that allows a program to ask that a task be performed alongside the original task (or tasks), without stopping to wait for the task to complete. When the secondary task is completed, the original task is notified using an agreed-upon mechanism so that it knows the work is done, and that the result, if any, is available.

There are a number of programming techniques for implementing asynchronous software. See the article [Asynchronous JavaScript](/en-US/docs/Learn/JavaScript/Asynchronous) for an introduction to them.
There are a number of programming techniques for implementing asynchronous software. See the article [Asynchronous JavaScript](/en-US/docs/Learn_web_development/Extensions/Async_JS) for an introduction to them.

## See also

- [Fetching data from the server](/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Fetching_data) (Learning Area)
- [Learn: Making network requests with JavaScript](/en-US/docs/Learn_web_development/Core/Scripting/Network_requests) (Learning Area)
- Related glossary terms:
- {{glossary("Synchronous")}}
2 changes: 1 addition & 1 deletion files/en-us/glossary/baseline/compatibility/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ Features listed with **limited availability** are _not_ yet available in all bro

## See also

- [Cross browser testing](/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing)
- [Testing](/en-US/docs/Learn_web_development/Extensions/Testing)
- [web-platform-dx/web-features repository](https://github.com/web-platform-dx/web-features)
- [W3C WebDX Community Group](https://www.w3.org/community/webdx/)
- [mdn/browser-compat-data repository](https://github.com/mdn/browser-compat-data)
Expand Down
2 changes: 1 addition & 1 deletion files/en-us/glossary/class/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ In {{glossary("OOP","object-oriented programming")}}, a **class** defines an {{g

## See also

- [Classes in JavaScript](/en-US/docs/Learn/JavaScript/Objects/Classes_in_JavaScript)
- [Classes in JavaScript](/en-US/docs/Learn_web_development/Extensions/Advanced_JavaScript_objects/Classes_in_JavaScript)
- [Inheritance and the prototype chain](/en-US/docs/Web/JavaScript/Inheritance_and_the_prototype_chain)
- [Class-based programming](https://en.wikipedia.org/wiki/Class-based_programming) on Wikipedia
- [Object-oriented programming](https://en.wikipedia.org/wiki/Object-oriented_programming) on Wikipedia
2 changes: 1 addition & 1 deletion files/en-us/glossary/conditional/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,6 @@ An instruction or a set of instructions is executed if a specific condition is f

- Related glossary terms:
- {{glossary("Control flow")}}
- [Making decisions in your code — conditionals](/en-US/docs/Learn/JavaScript/Building_blocks/conditionals)
- [Learn: Making decisions in your code — conditionals](/en-US/docs/Learn_web_development/Core/Scripting/Conditionals)
- [Control flow and error handling in JavaScript](/en-US/docs/Web/JavaScript/Guide/Control_flow_and_error_handling)
- [Conditional](<https://en.wikipedia.org/wiki/Conditional_(computer_programming)>) on Wikipedia
2 changes: 1 addition & 1 deletion files/en-us/glossary/constructor/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,6 @@ const defaultReference = new Default();

## See also

- [Classes and constructors in JavaScript](/en-US/docs/Learn/JavaScript/Objects/Classes_in_JavaScript#classes_and_constructors)
- [Classes and constructors in JavaScript](/en-US/docs/Learn_web_development/Extensions/Advanced_JavaScript_objects/Classes_in_JavaScript#classes_and_constructors)
- [`new` operator in JavaScript](/en-US/docs/Web/JavaScript/Reference/Operators/new)
- [Constructor](https://en.wikipedia.org/wiki/Constructor_%28object-oriented_programming%29) on Wikipedia
2 changes: 1 addition & 1 deletion files/en-us/glossary/css/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ p {

## See also

- [Learn CSS](/en-US/docs/Learn/CSS)
- [Learn CSS](/en-US/docs/Learn_web_development/Core/Styling_basics)
- [The CSS documentation](/en-US/docs/Web/CSS)
- [CSS](https://en.wikipedia.org/wiki/CSS) on Wikipedia
- [The CSS Working Group current work](https://www.w3.org/Style/CSS/current-work)
2 changes: 1 addition & 1 deletion files/en-us/glossary/css_selector/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,7 @@ The resulting page content is styled like this:

## See also

- [Learn more about CSS selectors](/en-US/docs/Learn/CSS/Building_blocks/Selectors) in our introduction to CSS.
- [Learn more about CSS selectors](/en-US/docs/Learn_web_development/Core/Styling_basics/Basic_selectors) in our introduction to CSS.
- Basic selectors

- [Type selectors](/en-US/docs/Web/CSS/Type_selectors) `elementname`
Expand Down
2 changes: 1 addition & 1 deletion files/en-us/glossary/dns/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,5 +12,5 @@ The most prominent function of DNS is the translation of human-friendly domain n

## See also

- [Understanding domain names](/en-US/docs/Learn/Common_questions/Web_mechanics/What_is_a_domain_name)
- [Understanding domain names](/en-US/docs/Learn_web_development/Howto/Web_mechanics/What_is_a_domain_name)
- [Domain Name System](https://en.wikipedia.org/wiki/Domain_Name_System) on Wikipedia
2 changes: 1 addition & 1 deletion files/en-us/glossary/domain_name/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,4 +11,4 @@ A **domain name** is a website's address on the {{Glossary("Internet")}}. Domain
## See also

- [Domain name](https://en.wikipedia.org/wiki/Domain_name) on Wikipedia
- [Understanding domain names](/en-US/docs/Learn/Common_questions/Web_mechanics/What_is_a_domain_name)
- [Understanding domain names](/en-US/docs/Learn_web_development/Howto/Web_mechanics/What_is_a_domain_name)
2 changes: 1 addition & 1 deletion files/en-us/glossary/element/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,6 @@ Elements and {{glossary("tag", "tags")}} are _not_ the same things. Tags begin o

## See also

- [Getting started with HTML](/en-US/docs/Learn/HTML/Introduction_to_HTML/Getting_started)
- [Basic HTML Syntax](/en-US/docs/Learn_web_development/Core/Structuring_content/Basic_HTML_syntax)
- [Defining custom elements](/en-US/docs/Web/API/Web_components/Using_custom_elements)
- The {{domxref("Element")}} interface, representing an element in the DOM.
2 changes: 1 addition & 1 deletion files/en-us/glossary/ftp/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,5 +12,5 @@ For many years it was the defacto standard way of transferring files, but as it

## See also

- [Beginner's guide to uploading files via FTP](/en-US/docs/Learn/Common_questions/Tools_and_setup/Upload_files_to_a_web_server)
- [Beginner's guide to uploading files via FTP](/en-US/docs/Learn_web_development/Howto/Tools_and_setup/Upload_files_to_a_web_server)
- [FTP](https://en.wikipedia.org/wiki/File_Transfer_Protocol) on Wikipedia
5 changes: 2 additions & 3 deletions files/en-us/glossary/graceful_degradation/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,15 +8,14 @@ page-type: glossary-definition

**Graceful degradation** is a design philosophy that centers around trying to build a modern website/application that will work in the newest browsers, but falls back to an experience that while not as good still delivers essential content and functionality in older browsers.

{{Glossary("Polyfill","Polyfills")}} can be used to build in missing features with JavaScript, but acceptable alternatives to features like styling and layout should be provided where possible, for example by using the CSS cascade, or HTML fallback behavior. Some good examples can be found in [Handling common HTML and CSS problems](/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/HTML_and_CSS).
{{Glossary("Polyfill","Polyfills")}} can be used to build in missing features with JavaScript, but acceptable alternatives to features like styling and layout should be provided where possible, for example by using the CSS cascade, or HTML fallback behavior.

It is a useful technique that allows Web developers to focus on developing the best possible websites, given that those websites are accessed by multiple unknown user-agents. {{Glossary("Progressive enhancement")}} is related but different — often seen as going in the opposite direction to graceful degradation. In reality both approaches are valid and can often complement one another.

## See also

- [Graceful degradation](https://en.wikipedia.org/wiki/Graceful_degradation) on Wikipedia
- [Handling common HTML and CSS problems](/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/HTML_and_CSS)
- [Implementing feature detection](/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Feature_detection)
- [Implementing feature detection](/en-US/docs/Learn_web_development/Extensions/Testing/Feature_detection)
- Related glossary terms:
- {{Glossary("Polyfill")}}
- {{Glossary("Progressive enhancement")}}
2 changes: 1 addition & 1 deletion files/en-us/glossary/head/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,4 +11,4 @@ The **Head** is the part of an {{glossary("HTML")}} document that contains {{glo
## See also

- {{htmlelement("head")}} element reference on MDN
- [The HTML \<head>](/en-US/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML) on the MDN Learning Area
- [What's in the head? Webpage metadata](/en-US/docs/Learn_web_development/Core/Structuring_content/Webpage_metadata) on the MDN Learning Area
2 changes: 1 addition & 1 deletion files/en-us/glossary/html/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ An HTML file is normally saved with an `.htm` or `.html` extension, served by a
## See also

- [HTML](https://en.wikipedia.org/wiki/HTML) on Wikipedia
- [Our HTML tutorial](/en-US/docs/Learn/HTML)
- [Our HTML tutorial](/en-US/docs/Learn_web_development/Core/Structuring_content)
- [The web course on codecademy.com](https://www.codecademy.com/learn/learn-html)
- [The HTML documentation on MDN](/en-US/docs/Web/HTML)
- [The HTML specification](https://html.spec.whatwg.org/multipage/)
2 changes: 1 addition & 1 deletion files/en-us/glossary/html5/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,5 +18,5 @@ Any modern site should use the [HTML doctype](/en-US/docs/MDN/Writing_guidelines
## See also

- [our HTML documentation](/en-US/docs/Web/HTML)
- [HTML beginner's learning guides](/en-US/docs/Learn/HTML)
- [HTML beginner's learning guides](/en-US/docs/Learn_web_development/Core/Structuring_content)
- [Web APIs](/en-US/docs/Web/API)
2 changes: 1 addition & 1 deletion files/en-us/glossary/hyperlink/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ Hyperlinks connect webpages or data items to one another. In HTML, {{HTMLElement
## See also

- [Hyperlink](https://en.wikipedia.org/wiki/Hyperlink) on Wikipedia
- The [Hyperlink](/en-US/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks) guide on MDN
- [Creating links](/en-US/docs/Learn_web_development/Core/Structuring_content/Creating_links)
- [Links in HTML Documents - W3C](https://www.w3.org/TR/1999/REC-html401-19991224/struct/links.html)
- [HTML a - hyperlink - W3C](https://w3c.github.io/html-reference/a.html)
- [`<a>` on MDN](/en-US/docs/Web/HTML/Element/a)
Expand Down
2 changes: 1 addition & 1 deletion files/en-us/glossary/ink_overflow/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ The **ink overflow** of a box refers to the part of the box and its contents tha

Ink overflow is the overflow of painting effects such as [box shadows](/en-US/docs/Web/CSS/box-shadow), [border images](/en-US/docs/Web/CSS/CSS_backgrounds_and_borders), [text decoration](/en-US/docs/Web/CSS/CSS_text_decoration), [outlines](/en-US/docs/Web/CSS/outline), etc. that do not affect layout or otherwise extend the scrollable overflow area. Ink overflow is also the overhanging of glyphs, such as ascenders and descenders extending outside the em box.

As [replaced elements](/en-US/docs/Web/CSS/Replaced_element) always establish an independent [formatting context](/en-US/docs/Web/CSS/CSS_flow_layout/Introduction_to_formatting_contexts), any overflow of replaced content is always ink overflow (as opposed to [scrollable overflow](/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content)).
As [replaced elements](/en-US/docs/Web/CSS/Replaced_element) always establish an independent [formatting context](/en-US/docs/Web/CSS/CSS_flow_layout/Introduction_to_formatting_contexts), any overflow of replaced content is always ink overflow (as opposed to [scrollable overflow](/en-US/docs/Learn_web_development/Core/Styling_basics/Overflow)).

## See also

Expand Down
2 changes: 1 addition & 1 deletion files/en-us/glossary/internet/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,4 +10,4 @@ The Internet is a worldwide network of networks that uses the Internet protocol

## See also

- [How the Internet works](/en-US/docs/Learn/Common_questions/Web_mechanics/How_does_the_Internet_work) (introduction for beginners)
- [How the Internet works](/en-US/docs/Learn_web_development/Howto/Web_mechanics/How_does_the_Internet_work) (introduction for beginners)
Loading

0 comments on commit 5b20f5f

Please sign in to comment.