Week 3 Flashcards
What do these do?
<table><table>
<td></td>
<th></th>
<tr></tr>
</table></table>
Create table
Table data (default left-aligned)
Table header (bold by default and centered)
Table row
<td>
<th>
What do these do?
</th></td>
They can make table cells cover several columns or rows
What are the advantages of using a semantic structure in html?
Maintainability
Performance
Accessibility
Search Engine Optimization (most important)
article, aside, figure, figcation, footer, header, hgroup, nav, section
What are these examples of?
Semantic structure elements
Rules and Exceptions:
Block elements
<body>, <form>: some block elements can only contain other block elements
</form></body>
Rules and Exceptions:
<p> tags
</p>
<p> tags can only contain inline elements and plain text
</p>
<div> and <li> can contain
</li></div>
Block AND inline elements
<ul> can only contain
</ul>
<li>, but <li> can only other elements (think <ul>) for nested lists
</ul></li></li>
<html> <body> <head> <main>
What do these have in common?
</main></head></body></html>
They’re only allowed once per document
T/F - you can use <h4> without using h1-3
False
T/F - use <hr> when you want to have a horizontal lines that separates sections, rather than a <div> with a border
True
T/F - Accessible designs account for all abilties
True
Why use valid HTML5 and web standards?
Useful across different browsers
More likely that the pages display correctly now and in the future
Ensures accessibility
The W3c created the WAI in 1997. One of their important guidelines are to provide ____ alternatives for any non-text content, so that it can be changed into other forms people need
text
To create an accessible table, we can use the _____ attribute to give textual descriptions of table headers
scope
Accessible forms: use the fieldset, legend, and label elements - but what should each element be associated with?
Each label element should be associated with a single input element
What is a wireframe? What is its advantage?
It’s a web site plan. It helps clarify what needs on the different page types of the website.
More in depth, why do wireframing?
- Clear view of page structure
- Can focus on the functionality now
- Organizaiton
- Make it easier to share/communicate your ideas/what you want
Each file header comment should contain
Name, course/section/date/brief description of the assignment
Each file comment should describe that file/class and its main purpose in the program
Spacing and indentation should be _________ throughout your code
consistent
In HTML you should not have any lines longer than ___ characters
- Exception is URLs
T/F - All letters should be lowercase for elements, attributes, values, classes, ids
True. Multi-world names should be concatenated with a -
Benefits of CSS
Separation of _______ from __________
Separation of Content from presentation
CSS Rule Syntax - declarations
declaration
selector{ property: value; }
declaration block:
selector {property1: value1;
property2: value2;
property3: value3; }
T/F- External stylesheets may only control 1 document
False. External stylesheets may control multiple stylesheets
T/F - Elements of different types can share the same class
True
T/F - elements can have multiple IDs
False
Types of selectors:
___ selectors
_____ selectors
__ selectors
__________ or __m_______ selectors
tag selectors
class selectors
id selectors
contextual or combinator selectors
ID selectors should be used with a ______ element, class selectors should be used with ________ selectors
single, multiple
Tag based selectors will format the entire
HTML tag specified
T/F - you can group selectors to provide the same CSS style with added comas
True
CSS Links
Link
Visited
Hover
Active
Link - before a visit
Visited - after a visit
Hover - when your mouse is over it but you have not clicked
Active - you have clicked it and you have not yet seen the new page
