diff --git a/curriculum/challenges/_meta/applied-visual-design/meta.json b/curriculum/challenges/_meta/applied-visual-design/meta.json index b5b96771a1..45f29521b5 100644 --- a/curriculum/challenges/_meta/applied-visual-design/meta.json +++ b/curriculum/challenges/_meta/applied-visual-design/meta.json @@ -47,7 +47,7 @@ ], [ "587d781b367417b2b2512abd", - "Adjust the Size of a Header Versus a Paragraph Tag" + "Adjust the Size of a Heading Element Versus a Paragraph Element" ], [ "587d781b367417b2b2512abe", diff --git a/curriculum/challenges/chinese-traditional/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag.md b/curriculum/challenges/chinese-traditional/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-heading-element-versus-a-paragraph-element.md similarity index 97% rename from curriculum/challenges/chinese-traditional/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag.md rename to curriculum/challenges/chinese-traditional/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-heading-element-versus-a-paragraph-element.md index e98b88033e..83500f67b3 100644 --- a/curriculum/challenges/chinese-traditional/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag.md +++ b/curriculum/challenges/chinese-traditional/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-heading-element-versus-a-paragraph-element.md @@ -4,7 +4,7 @@ title: 調整標題與段落的大小 challengeType: 0 videoUrl: 'https://scrimba.com/c/c3bRPTz' forumTopicId: 301037 -dashedName: adjust-the-size-of-a-header-versus-a-paragraph-tag +dashedName: adjust-the-size-of-a-heading-element-versus-a-paragraph-element --- # --description-- diff --git a/curriculum/challenges/chinese/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag.md b/curriculum/challenges/chinese/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-heading-element-versus-a-paragraph-element.md similarity index 97% rename from curriculum/challenges/chinese/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag.md rename to curriculum/challenges/chinese/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-heading-element-versus-a-paragraph-element.md index 0c1c056185..ca8eb3a0eb 100644 --- a/curriculum/challenges/chinese/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag.md +++ b/curriculum/challenges/chinese/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-heading-element-versus-a-paragraph-element.md @@ -4,7 +4,7 @@ title: 调整标题与段落的大小 challengeType: 0 videoUrl: 'https://scrimba.com/c/c3bRPTz' forumTopicId: 301037 -dashedName: adjust-the-size-of-a-header-versus-a-paragraph-tag +dashedName: adjust-the-size-of-a-heading-element-versus-a-paragraph-element --- # --description-- diff --git a/curriculum/challenges/english/01-responsive-web-design/applied-accessibility/use-headings-to-show-hierarchical-relationships-of-content.md b/curriculum/challenges/english/01-responsive-web-design/applied-accessibility/use-headings-to-show-hierarchical-relationships-of-content.md index c2702e7d55..fbb95eaf6b 100644 --- a/curriculum/challenges/english/01-responsive-web-design/applied-accessibility/use-headings-to-show-hierarchical-relationships-of-content.md +++ b/curriculum/challenges/english/01-responsive-web-design/applied-accessibility/use-headings-to-show-hierarchical-relationships-of-content.md @@ -17,7 +17,7 @@ If you were writing a paper with an introduction, a body, and a conclusion, it w Headings with equal (or higher) rank start new implied sections, headings with lower rank start subsections of the previous one. -As an example, a page with an `h2` element followed by several subsections labeled with `h4` tags would confuse a screen reader user. With six choices, it's tempting to use a tag because it looks better in a browser, but you can use CSS to edit the relative sizing. +As an example, a page with an `h2` element followed by several subsections labeled with `h4` elements would confuse a screen reader user. With six choices, it's tempting to use a tag because it looks better in a browser, but you can use CSS to edit the relative sizing. One final point, each page should always have one (and only one) `h1` element, which is the main subject of your content. This and the other headings are used in part by search engines to understand the topic of the page. @@ -27,7 +27,7 @@ Camper Cat wants a page on his site dedicated to becoming a ninja. Help him fix # --hints-- -Your code should have 6 `h3` tags. +Your code should have 6 `h3` elements. ```js assert($('h3').length === 6); @@ -39,7 +39,7 @@ Your code should have 6 `h3` closing tags. assert((code.match(/\/h3/g) || []).length === 6); ``` -Your code should not have any `h5` tags. +Your code should not have any `h5` elements. ```js assert($('h5').length === 0); diff --git a/curriculum/challenges/english/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag.md b/curriculum/challenges/english/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-heading-element-versus-a-paragraph-element.md similarity index 82% rename from curriculum/challenges/english/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag.md rename to curriculum/challenges/english/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-heading-element-versus-a-paragraph-element.md index 526d93f650..58a206ad42 100644 --- a/curriculum/challenges/english/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag.md +++ b/curriculum/challenges/english/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-heading-element-versus-a-paragraph-element.md @@ -1,19 +1,19 @@ --- id: 587d781b367417b2b2512abd -title: Adjust the Size of a Header Versus a Paragraph Tag +title: Adjust the Size of a Heading Element Versus a Paragraph Element challengeType: 0 videoUrl: 'https://scrimba.com/c/c3bRPTz' forumTopicId: 301037 -dashedName: adjust-the-size-of-a-header-versus-a-paragraph-tag +dashedName: adjust-the-size-of-a-heading-element-versus-a-paragraph-element --- # --description-- -The font size of header tags (`h1` through `h6`) should generally be larger than the font size of paragraph tags. This makes it easier for the user to visually understand the layout and level of importance of everything on the page. You use the `font-size` property to adjust the size of the text in an element. +The font size of heading elements (`h1` through `h6`) should generally be larger than the font size of paragraph tags. This makes it easier for the user to visually understand the layout and level of importance of everything on the page. You use the `font-size` property to adjust the size of the text in an element. # --instructions-- -To make the heading significantly larger than the paragraph, change the `font-size` of the `h4` tag to 27 pixels. +To make the heading significantly larger than the paragraph, change the `font-size` of the `h4` element to 27 pixels. # --hints-- @@ -116,3 +116,4 @@ assert($('h4').css('font-size') == '27px'); ``` + diff --git a/curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/link-to-internal-sections-of-a-page-with-anchor-elements.md b/curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/link-to-internal-sections-of-a-page-with-anchor-elements.md index 814e286713..b951c3fa6e 100644 --- a/curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/link-to-internal-sections-of-a-page-with-anchor-elements.md +++ b/curriculum/challenges/english/01-responsive-web-design/basic-html-and-html5/link-to-internal-sections-of-a-page-with-anchor-elements.md @@ -21,7 +21,7 @@ Below is an example of an internal anchor link and its target element:

Contacts

``` -When users click the `Contacts` link, they'll be taken to the section of the webpage with the **Contacts** header element. +When users click the `Contacts` link, they'll be taken to the section of the webpage with the **Contacts** heading element. # --instructions-- diff --git a/curriculum/challenges/english/03-front-end-development-libraries/front-end-development-libraries-projects/build-a-markdown-previewer.md b/curriculum/challenges/english/03-front-end-development-libraries/front-end-development-libraries-projects/build-a-markdown-previewer.md index 2be74eba1c..082f32f224 100644 --- a/curriculum/challenges/english/03-front-end-development-libraries/front-end-development-libraries-projects/build-a-markdown-previewer.md +++ b/curriculum/challenges/english/03-front-end-development-libraries/front-end-development-libraries-projects/build-a-markdown-previewer.md @@ -22,7 +22,7 @@ You can use any mix of HTML, JavaScript, CSS, Bootstrap, SASS, React, Redux, and **User Story #4:** When I enter GitHub flavored markdown into the `#editor` element, the text is rendered as HTML in the `#preview` element as I type (HINT: You don't need to parse Markdown yourself - you can import the Marked library for this: ). -**User Story #5:** When my markdown previewer first loads, the default text in the `#editor` field should contain valid markdown that represents at least one of each of the following elements: a header (H1 size), a sub header (H2 size), a link, inline code, a code block, a list item, a blockquote, an image, and bolded text. +**User Story #5:** When my markdown previewer first loads, the default text in the `#editor` field should contain valid markdown that represents at least one of each of the following elements: a heading element (H1 size), a sub heading element (H2 size), a link, inline code, a code block, a list item, a blockquote, an image, and bolded text. **User Story #6:** When my markdown previewer first loads, the default markdown in the `#editor` field should be rendered as HTML in the `#preview` element. diff --git a/curriculum/challenges/english/03-front-end-development-libraries/react/compose-react-components.md b/curriculum/challenges/english/03-front-end-development-libraries/react/compose-react-components.md index f39e29008a..afbe52e51b 100644 --- a/curriculum/challenges/english/03-front-end-development-libraries/react/compose-react-components.md +++ b/curriculum/challenges/english/03-front-end-development-libraries/react/compose-react-components.md @@ -14,7 +14,7 @@ As the challenges continue to use more complex compositions with React component In the code editor, the `TypesOfFood` component is already rendering a component called `Vegetables`. Also, there is the `Fruits` component from the last challenge. -Nest two components inside of `Fruits` — first `NonCitrus`, and then `Citrus`. Both of these components are provided for you behind the scenes. Next, nest the `Fruits` class component into the `TypesOfFood` component, below the `h1` header and above `Vegetables`. The result should be a series of nested components, which uses two different component types. +Nest two components inside of `Fruits` — first `NonCitrus`, and then `Citrus`. Both of these components are provided for you behind the scenes. Next, nest the `Fruits` class component into the `TypesOfFood` component, below the `h1` heading element and above `Vegetables`. The result should be a series of nested components, which uses two different component types. # --hints-- diff --git a/curriculum/challenges/english/03-front-end-development-libraries/react/create-a-controlled-form.md b/curriculum/challenges/english/03-front-end-development-libraries/react/create-a-controlled-form.md index 890f40c7db..b673ac24df 100644 --- a/curriculum/challenges/english/03-front-end-development-libraries/react/create-a-controlled-form.md +++ b/curriculum/challenges/english/03-front-end-development-libraries/react/create-a-controlled-form.md @@ -109,7 +109,7 @@ assert( ); ``` -The `h1` header should render the value of the `submit` field from the component's state. +The `h1` heading element should render the value of the `submit` field from the component's state. ```js (() => { diff --git a/curriculum/challenges/english/03-front-end-development-libraries/react/create-a-react-component.md b/curriculum/challenges/english/03-front-end-development-libraries/react/create-a-react-component.md index 6a92615c1d..50ec8a5bf2 100644 --- a/curriculum/challenges/english/03-front-end-development-libraries/react/create-a-react-component.md +++ b/curriculum/challenges/english/03-front-end-development-libraries/react/create-a-react-component.md @@ -38,7 +38,7 @@ The React component should return a `div` element. assert(Enzyme.shallow(React.createElement(MyComponent)).type() === 'div'); ``` -The returned `div` should render an `h1` header within it. +The returned `div` should render an `h1` heading element within it. ```js assert( @@ -48,7 +48,7 @@ assert( ); ``` -The `h1` header should contain the string `Hello React!`. +The `h1` heading element should contain the string `Hello React!`. ```js assert( diff --git a/curriculum/challenges/english/03-front-end-development-libraries/react/render-state-in-the-user-interface-another-way.md b/curriculum/challenges/english/03-front-end-development-libraries/react/render-state-in-the-user-interface-another-way.md index e1dd33ed04..f2086a2fef 100644 --- a/curriculum/challenges/english/03-front-end-development-libraries/react/render-state-in-the-user-interface-another-way.md +++ b/curriculum/challenges/english/03-front-end-development-libraries/react/render-state-in-the-user-interface-another-way.md @@ -27,7 +27,7 @@ assert( ); ``` -`MyComponent` should render an `h1` header enclosed in a single `div`. +`MyComponent` should render an `h1` heading element enclosed in a single `div`. ```js assert( @@ -44,7 +44,7 @@ The rendered `h1` tag should include a reference to `{name}`. assert(/

\n*\s*\{\s*name\s*\}\s*\n*<\/h1>/.test(getUserInput('index'))); ``` -The rendered `h1` header should contain text rendered from the component's state. +The rendered `h1` heading element should contain text rendered from the component's state. ```js async () => { diff --git a/curriculum/challenges/english/03-front-end-development-libraries/react/render-state-in-the-user-interface.md b/curriculum/challenges/english/03-front-end-development-libraries/react/render-state-in-the-user-interface.md index 9a4f2fbf9a..e8b71947de 100644 --- a/curriculum/challenges/english/03-front-end-development-libraries/react/render-state-in-the-user-interface.md +++ b/curriculum/challenges/english/03-front-end-development-libraries/react/render-state-in-the-user-interface.md @@ -33,7 +33,7 @@ assert( ); ``` -`MyComponent` should render an `h1` header enclosed in a single `div`. +`MyComponent` should render an `h1` heading element enclosed in a single `div`. ```js assert( @@ -43,7 +43,7 @@ assert( ); ``` -The rendered `h1` header should only contain text rendered from the component's state. +The rendered `h1` heading element should only contain text rendered from the component's state. ```js async () => { diff --git a/curriculum/challenges/english/03-front-end-development-libraries/react/set-state-with-this.setstate.md b/curriculum/challenges/english/03-front-end-development-libraries/react/set-state-with-this.setstate.md index 6066c3f0e1..8e3d1c7777 100644 --- a/curriculum/challenges/english/03-front-end-development-libraries/react/set-state-with-this.setstate.md +++ b/curriculum/challenges/english/03-front-end-development-libraries/react/set-state-with-this.setstate.md @@ -35,13 +35,13 @@ assert( ); ``` -`MyComponent` should render an `h1` header. +`MyComponent` should render an `h1` heading element. ```js assert(Enzyme.mount(React.createElement(MyComponent)).find('h1').length === 1); ``` -The rendered `h1` header should contain text rendered from the component's state. +The rendered `h1` heading element should contain text rendered from the component's state. ```js async () => { diff --git a/curriculum/challenges/espanol/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag.md b/curriculum/challenges/espanol/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-heading-element-versus-a-paragraph-element.md similarity index 97% rename from curriculum/challenges/espanol/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag.md rename to curriculum/challenges/espanol/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-heading-element-versus-a-paragraph-element.md index ed56b8eab5..117969bd1b 100644 --- a/curriculum/challenges/espanol/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag.md +++ b/curriculum/challenges/espanol/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-heading-element-versus-a-paragraph-element.md @@ -4,7 +4,7 @@ title: Ajusta el tamaño de un título contra una etiqueta de párrafo challengeType: 0 videoUrl: 'https://scrimba.com/c/c3bRPTz' forumTopicId: 301037 -dashedName: adjust-the-size-of-a-header-versus-a-paragraph-tag +dashedName: adjust-the-size-of-a-heading-element-versus-a-paragraph-element --- # --description-- diff --git a/curriculum/challenges/italian/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag.md b/curriculum/challenges/italian/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-heading-element-versus-a-paragraph-element.md similarity index 97% rename from curriculum/challenges/italian/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag.md rename to curriculum/challenges/italian/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-heading-element-versus-a-paragraph-element.md index 8fa861b951..56204bf5d4 100644 --- a/curriculum/challenges/italian/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag.md +++ b/curriculum/challenges/italian/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-heading-element-versus-a-paragraph-element.md @@ -4,7 +4,7 @@ title: Regolare la dimensione di un'intestazione rispetto a quella di un paragra challengeType: 0 videoUrl: 'https://scrimba.com/c/c3bRPTz' forumTopicId: 301037 -dashedName: adjust-the-size-of-a-header-versus-a-paragraph-tag +dashedName: adjust-the-size-of-a-heading-element-versus-a-paragraph-element --- # --description-- diff --git a/curriculum/challenges/portuguese/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag.md b/curriculum/challenges/portuguese/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-heading-element-versus-a-paragraph-element.md similarity index 97% rename from curriculum/challenges/portuguese/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag.md rename to curriculum/challenges/portuguese/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-heading-element-versus-a-paragraph-element.md index 1fb4883d23..9191d7cdec 100644 --- a/curriculum/challenges/portuguese/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-header-versus-a-paragraph-tag.md +++ b/curriculum/challenges/portuguese/01-responsive-web-design/applied-visual-design/adjust-the-size-of-a-heading-element-versus-a-paragraph-element.md @@ -4,7 +4,7 @@ title: Contrastar o tamanho de um título com o de um parágrafo challengeType: 0 videoUrl: 'https://scrimba.com/c/c3bRPTz' forumTopicId: 301037 -dashedName: adjust-the-size-of-a-header-versus-a-paragraph-tag +dashedName: adjust-the-size-of-a-heading-element-versus-a-paragraph-element --- # --description-- diff --git a/cypress/integration/learn/redirects/heading-challenge.js b/cypress/integration/learn/redirects/heading-challenge.js new file mode 100644 index 0000000000..47035a56bb --- /dev/null +++ b/cypress/integration/learn/redirects/heading-challenge.js @@ -0,0 +1,13 @@ +describe('Header to heading element redirect', () => { + const basePath = '/learn/responsive-web-design/applied-visual-design'; + + it(`should redirect from ${basePath}/adjust-the-size-of-a-header-versus-a-paragraph-tag to ${basePath}/adjust-the-size-of-a-heading-element-versus-a-paragraph-element`, () => { + cy.visit(`${basePath}/adjust-the-size-of-a-header-versus-a-paragraph-tag`); + + cy.location().should(loc => { + expect(loc.pathname).to.eq( + `${basePath}/adjust-the-size-of-a-heading-element-versus-a-paragraph-element` + ); + }); + }); +});