Flash Cards

Question 1

Q

Name all screen readers and their OS

Answer

A

Windows - Narrator, Apple - VoiceOver, Android - TALKBACK,

JAWS, and NVDA

Question 2

Q

Name 4 Disability Categories?

Answer

A

Visual, Auditory, Motor, Cognitive(most common)

Question 3

Q

Why is it important to know accessibility?

Answer

A

Accessibility is the law

Question 4

Q

Name 2 ways to test for accessibility?

Answer

A

Accessibility Tree and wave.webaim.org

Question 5

Q

How to start Windows Narrator, move to next item, and stop it?

Answer

A

WIN+CTRL+ENTER to start, TAB to move to next item, and CTRL to stop it.

Question 6

Q

What is the meaning of Semantic?

Question 7

Q

What are Semantic tags?

Answer

A

used to generally determine content or what the parts of the page are about.

Also known as Outliners

Question 8

Q

What is NodeJS?

Answer

A

NodeJS provides a new server called express and it is growing in the do-it-yourself tech industry.

Question 9

Q

What are the 5 Basic Semantic Outliner Tags we learned?

Answer

A

Question 10

Q

What should Semantic tags have?

Answer

A

Semantic Tags should have heading tags (h1, h2, h3, etc) applied so that outliners are descriptive.Hide the heading tag with the display : none; style

Question 11

Q

Name 5 Semantic tags besides the basic ones

Answer

A

Question 12

Q

Most common server?

Answer

A

Apache which runs on Linux

Question 13

Q

What does FTP stand for, and what does it do?

Answer

A

File Transfer Protocol: programs like FileZilla, which upload to the server and download from the server to our local files. Local files are on the left side, and Server files on the right

Question 14

Q

What are some file permissions on the server? and who can we set permissions for?

Answer

A

We can set the permissions on the files on the server to read, write and execute for older scripts like perl. We can set permissions for the owner, a group and other (public).

Question 15

Q

What do we use as placeholder text? and why?

Answer

A

Lorem ipsum, and it’s used so people know it’s placeholder text

Question 16

Q

What is the leading application for hosting a page?

Question 17

Q

What does SFTP stand for?

Answer

A

Secure File Transfer Protocol

Question 18

Q

Explain the Responsive and Adaptive designs?

Answer

A

Responsive: When the site scales or wraps to fit the screen size. (ZimJS is responsive)
Adaptive: When the site changes layout depending on screen size or orientation. Perhaps content is removed or a there is a change from a link bar to a pulldown menu. This can be done with media queries or JavaScript.

Question 19

Q

How do you scale with Responsive?

Answer

A

use % or vw

Question 20

Q

What does Media Queries do?

Answer

A

It tests how big the screen is

Question 21

Q

Name of the game used to practice flexbox?

Answer

A

Flexbox Froggy

Question 22

Q

Reproduce a basic flexbox and basic gride, and also media queries.

Answer

A

FlexBox:
view-source:http://imm.sheridanc.on.ca/webdevelopment/lesson11/flexbox.html

Grid:
view-source:http://imm.sheridanc.on.ca/webdevelopment/lesson11/grid.html

Media Queries: http://imm.sheridanc.on.ca/webdevelopment/lesson11/mediaqueries.html

Question 23

Q

What is the website with documentation on using flexbox and grid?

Answer

A

css-tricks.com

Question 24

Q

Make a basic HTML page with Semantic Tags, and hidden titles. (Do This in VS Code)

Answer

A

<html>
<head>
<header> <h1> Header for site</h1>
</header>
</head>
<body>
<nav> <h1>nav for site</h1>
</nav>
<main><h1>main for site</h1>
<article><h1>article for site</h1>
</article>
</main>
</body>
<footer><h1>footer for site</h1>
</footer>
</html>

Question 25

Q

How has the internet benefited people with disabilities?

Answer

A

sites/pages can be structured to make meaning easier to understand.

screen readers can read content aloud

Question 26

Q

What do screen readers read?

Answer

A

Content and whatever is in the alt parameter of images

Question 27

Q

Definitions for:
Header
Footer
Main
Nav
Article

Answer

A

Header: The top part of a page or section.
Footer: the bottom part
Main: The main content area
Nav: The place for interfaces like menus
Article: An article that makes sense on its own.

Question 28

Q

Definitions for:
section
aside
figure
figcaption

Answer

A

section: A chapter, etc. of an article or the main content.
aside: Supporting content or related information.
figure: Diagrams, pictures, illustrations, etc.
figcaption: Text to describe a figure.

Question 29

Q

Definitions for:
details
summary
mark
time

Answer

A

details: Extra information that can be viewed.
summary: A summary title for the detail tag only.
mark: For highlighted parts of text.
time: Show a date and time.

Question 30

Q

What does the code below do?:

repeat(auto-fill, minmax(200px, 1fr))

Answer

A

Fill page with elements that have a minimum width, and will make them the same size

Question 31

Q

On a separate piece of paper

Write a basic media queries for mobile(max 640px) and desktop(min641px)

Answer

A

@media all and (max-width: 640px){
#mobile {display:inline-block;}
#desktop {display:none;}
}
@media all and (min-width: 641px){
#mobile {display:none;}
#desktop {display:inline-block;}
}

Question 32

Q

On a separate piece of paper

Write a basic flexbox

Answer

A

.outer {
display:flex;
flex-flow:row wrap;
gap:20px;
justify-content: space-around;
}
.outer div {
max-width:300px;
padding:20px;
background-color:blue;
border-radius:20px;
}

Question 33

Q

On a separate piece of paper

Write a basic grid

Answer

A

.grid {
display:grid;
grid-template-columns: repeat(auto-fill,
minmax(200px, 1fr));
gap: 20px;
}

.grid div {
    padding:20px;
    background-color:blue;
    border-radius:20px;
}

Brainscape's Knowledge GenomeTM

Flash Cards

Brainscape's Knowledge Genome^TM