INFO 2420 MIDTERM REVIEW
Checklist for website: What monitor size or resolution will be used?
Make sure that your graphics and text are scalable and it looks good at different sizes and resolutions.
Checklist for website: Design based on estimated live space of view area.
Make sure you fill the space and the site is scalable.
What does marking up text provide to the page?
Marking up text provides the structural layer to a page
What format is used to store HTML pages? What extension should an HTML page have?
Nesting of HTML tags goes from the middle out. Know what makes a good title for a page.
What are the parts of a URL?
Protocol (scheme): https:// Subdomain: www. Second Level Domain (SLD): rambling Top Level Domain (TLD): .com Path: /home/login Query String: ?source=google
What can be set up in a browser to provide a user with their own preferred style rules?
Reader style sheets
What kind of pathnames do you use for pages in your site? What pathnames do you use for non-local pages?
Relative. Absolute.
How do you link to pages within the same directory?
Remember filenames and pathnames must be spelled exactly or they usually will not work!!! Go through a higher directory using ../, and work to a lower directory.
What is the difference between sans-serif and serif fonts?
Serif has decorative strokes while sans-serif has straight strokes
Checklist for website: Storyboard your site
So It makes sense logically to go through the site
Why is it important to identify your target audience?
So you can decide what content and how to put it on your page.
What is the WWW?
Stands for the world wide web
What does a Web Server do?
The web server is a computer that hosts webpages, and as they are requested it distributes them.
Who controls the WWW?
The world wide web consortium
What is the purpose of block-level tags or elements?
They create new lines. Block level is anything that creates a new line
What is the purpose of the W3C?
This is the organization that oversees the development of web technologies such as HTML, CSS, and JavaScript.
What is the main purpose of CSS?
To separate structure (content) from presentation.
Why is it important to set site goals?
To understand where you want the site to go, to have direction
What is the validation standard for the class?
To use the w3 validator
T or F A font-family list separated by , commas can be used to provide alternative typefaces if one is not available on the client computer.
True
T or F Every (X)HTML element has an associated element type selector?
True
T or F Every declaration in a declaration group is separated by ; except the last declaration?
True
T or F Hypertext appears between the open and closing anchor tags?
True
T or F If there are conflicting style rules, the ones defined nearer the element are given more weight?
True
How do you validate pages stored locally on your computer?
Uploading them to the W3C validator via the file upload option.
Checklist for website: Use color wisely
Use it to aid the site and not distract
How do you jump to an internal link on another page? What are the different types of URL protocols?
Use the filename and the #name, EX: <a href= "circle.html#Top">My Favorite Things </a> HTTP (Hypertext Transfer Protocol) and HTTPS (HTTP Secure)
How can you change the order of an ordered list?
Using the <li></li> tag to set the order
What should go in the <head> of a document?
Valid <head> elements include meta , link , title , style , script , noscript , and base . These elements provide information for how a document should be perceived, and rendered, by browsers, search engines, bots, etc.
How do you validate your document after it has been loaded on the web server? What is the purpose of a web server?
Validate by URI. The purpose of a web server is to host webpages, and as they are requested to distribute them.
What type of careers are available in Web development?
Web security, web programming, etc.
Specificity is used to break a tie in conflicting style rules, the more specific the selector, the more ______ it is given.
Weight
Are <meta> tags self-terminating tags?
Yes
What are the 5 different values for the generic font-family property?
fantasy, monospace, serif, san-serif, and cursive
What is the URL of the W3C validator?
http://validator.w3.org
What is the non-breaking space character? What is the copyright character? What is the ampersand character?
© &
How do you provide hypertext for the link destination?
EX: <h1 id="Top"> My Favorite Things </h1> Use the href and the # to jump to an internal link: <a href= "Top"> Return to Top</a>
How do you use inline styles with other HTML tags like h1, p, or li?
EX: <h1>Page <span class="highlight">Title</span></h1>
How do you use a span tag with inline CSS styles?
EX: <p>My mother has <span style="color:blue">blue</span> eyes.</p>
How do you use the font-family property to identify the typeface to use with text?
EX: @font-face{ font-family:'DarkHorse4';}
How do you use the text-transform to vary the capitalization of text on the fly?
EX: Capitalize, lowercase, uppercase. {text-transform: capitalize;}
Why does HTML describe the structure of a page but not describe the page layout?
HTML only describes the documents content and structure, not the appearance.
What is the standard for this class?
HTML5
What are some Web-related languages and what are they used for?
HTML: website design CSS: styling webpages Java: web/app development Java script: only runs in a browser
What protocol do you use to check your project after you upload it to the web server?
HTTP
What protocol is used to send information on the Web?
HTTP
Checklist for website: Create site navigation plan!
Hierarchal, linear, and mixed navigation plans for a good site
Checklist for website: Designing above the fold
Hook visitors, above the bottom of the screen so the will stay on your site.
► What is HTML?
Hypertext markup language
How can you reset the numbering in the middle of an ordered list?
If you want a numbered list to start at a number other than 1, you can use the start attribute in the ol element to specify another starting number, as shown here:<ol start="17">
Why is the WWW a multimedia system?
In order to do everything it needs to be able to display visual and text in different formats.
What does validation mean?
In simple terms, validation ensures that your website complies with the standards accepted by most web designers.
What is the difference between relative and absolute file pathnames?
In simple words, an absolute path refers to the same location in a file system relative to the root directory, whereas a relative path points to a specific location in a file system relative to the current directory you are working on.
What are the three approaches to style sheets?
Inline, embedded, and external
Know the meaning of deprecated features.
Is the discouragement of use of some terminology, feature, design, or practice
How do you do a nested ordered list, unordered list or definition list?
It must be placed inside a <li> or a <dd> or it will not validate.
What does an FTP client application do? What does FTP stand for?
It uses the FTP transfer protocol to upload pages. File transfer protocol (FTP) is a set of rules that computers follow for the transferring of files from one system to another over the internet.
What is the purpose of the start.htm file used for our class?
It's a file format used for containing HTML language which constructs a web page. HTM contains formatted text, images, and other elements that can be translated with web browsers.
When should ordered lists, <ol> , be used? What types of ordered lists are there?
It's good practice to use ol where the steps in the list must be carried out in sequence. Unordered list : <ul></ul> Ordered list: <ol></ol> Description list: <dl></dl>
Checklist for website: Use images wisely, large files increase page load times Every page should link back to the site
Make it a good experience for the users, even ones with slow connections. All roads lead back to home.
What are some guidelines for giving a title to a page?
Make it relevant and interesting
Checklist for website: Provide good contrast between background color and text and link colors
Make sure everything can clearly be seen and there isnt an issue with colorblind people being unable to see certain things.
Checklist for website: Basic Design Principles
Make sure it functions as intended
Checklist for website: Does this site work on well on every commonly used browser?
Make sure that it does work well in order for success.
What are some of the many values for the font-size property?
EX: 12pt, 5px, 30em, 300%
Know all the requirements for "well formed" HTML 5 code.
1) there should be a single root element that contains all other elements. For HTML, the root element is the HTML element. 2) all content should be defined within HTML elements. In this example, the content is wrapped inside a paragraph element. 3) all elements should be HTML elements defined by the W3C. In HTML, authors cannot invent their own elements. These elements are defined in the HTML 5.2 specification. 4) apart from void elements, all elements should include a start and an end tag. In this example, the h1, p, span, and the emphasis element all have a start and end tag. 5) as void elements have no content, there's no need for an end tag. These elements are self-closing. In this example, both the br and the hr elements are void elements. 6) the beginning and end tags of elements should be correctly nested with non-missing and non-overlapping. In this case, the span element is nested properly inside the paragraph element, which is nested inside the div element. 7) all content characters should be properly encoded. Special characters, such as the greater than and ampersand symbol, should not appear inside elements without being correctly escaped. In this example, the two characters are shown in their correctly encoded state.
1. Are <hr> tags are self-terminating? 2. Should they be styles with CSS? 3. What are special characters and why are they used?
1. Yes. 2. Yes, The <hr> element is most often displayed as a horizontal rule that is used to separate content (or define a change) in an HTML page. 3. Special characters are nowadays used to lure users to websites and increase the click-through rate.
Organize content into main topics Usability Guidelines:
3 click rule Set logical path - scent 30 second rule Use meaningful titles Use navigation bars Avoid the "back" button or "click here" for link text Create a look and feel for your site to brand your site for users Test usability of site of pages
When and how are comments used in a document?
<!-- Write your comments here -- > exclamation to start the tag but not to end the tag
How do you add comments to your page?
<!--Comment goes here -->
What are structure tags or document-level tags?
<!DOCTYPE>, html, head, title, meta charset, and body
What is the definition term and the definition definition?
<dt></dt> <dd></dd> both go inside a definition list <dl></dl>
What are empty tags?
<element-name> A handful of elements do not have content because they are used to provide a simple directive and they are said to be empty. Img, line break (br) meta element.
Use the id attribute to create a named fragment in a heading or other tag.
<h2 id="startH">H</h2>
Is HTML 5 more or less strict than other HTML standards?
?
What should you put in your document after it validates?
?
What is the DTD tag?
A DTD is a Document Type Definition. A DTD defines the structure and the legal elements and attributes of an XML document.
What is often used by businesses to protect servers behind a Firewall?
A Virtual Private Network (VPN)
How do you use the href attribute to create a link to a file?
EX: <a href= "circle.html"> Circles </a>
What is the use of a definition list, <dl> ?
A description list is a list of terms, with a description of each term. The <dl> tag defines the description list, the <dt> tag defines the term (name), and the <dd> tag describes each term
What two things does a link need?
A filename and some hypertext.
What is the definition of the Internet?
A global computer network providing a variety of information and communication facilities, consisting of interconnected networks using standardized communication protocols.
Checklist for website: Spell check and proofread
A site riddled with grammatical errors looks unprofessional and takes away the credibility of your site.
How to use site root relative pathnames?
A site root-relative path begins with a leading forward slash, which stands for the site root folder. For example, /support/tips.html is a site root-relative path to a file (tips.html) in the support subfolder of the site's root folder.
What does adding a style sheet add to a page?
A style sheet adds the presentational layer(s) to a page
What is a style sheet made of?
A style sheet is made up of style rules
What kind of company can be used to store and manage your Web pages on their Servers?
A web hosting company
The W3C has a validator we can use for our pages: validator.w3.org. What are wellformed documents (according to HTML5)?
A well-formed document in XML is a document that "adheres to the syntax rules specified by the XML 1.0 specification in that it must satisfy both physical and logical structures CSS is the language for describing the presentation of Web pages, including colors, layout, and fonts.
Keep it simple, stupid (KISS)? (consistency)
Be consistent with navigation and layout
How do you use the target attribute and target=" _blank" to open a new window?
EX: <a href="https://www.iamtired.com" target="_blank">Visit I am tired</a>
What <body> attributes are being deprecated?
EX: <dir> <embed> <font> <isindex>
Know the basic skills needed by all Web development workers.
HTML and basic graphic design
Know the difference between block-level and inline elements.
Blockline element block elements are headings and paragraphs; each block element begins on a new line. By contrast, the text in a paragraph would be an inline element it does not start a new line but stays in the paragraph.
Inheritance in CSS passes down certain parent element traits to child elements, what is the exception to which kind of properties are not inherited?
Boxlike properties are not inherited.
Understand the justification for validating your HTML 5 Web pages.
By validating you are making your code behind the website as clean and uncluttered as possible. Cleaner code is easier for search engines to 'read through' and will increase the chances of being read the whole way.
__________ is the orderly application of properties to an element: inherited or default properties are passed down unless overridden.
Cascading
What is character encoding? What character encoding do we use?
Characters that are needed for a specific purpose are grouped into a character set also called a repertoire. utf-8 is the character encoding we use
What are the most popular browsers?
Chrome, Firefox, Safari, Edge
What is the <a> anchor tag is used for? T or F There is an opening and a closing anchor tag?
Creating links. True <a></a>
What is the process you follow to find and fix errors in your code?
Debugging
What can be grouped using { }
Declarations
When should unordered lists, <ul> , be used? What types of unordered lists are there? When the information could be put in a bulleted list where order does not matter.
Description lists, and unordered lists
What does a Browser do?
Displays HTML pages
What message is displayed if your page validates successfully?
Document checking completed. No errors or warnings to show.
A ______ name is a registered name by which a Web site is located on the Internet.
Domain
How do you provide values for modifying fonts using the font-family property: Courier, Arial, Verdana, etc.. Font-family: Courier, Arial, Verdana; Font-size: 36px; or font-size-small;
EX: body{ font-family:arial, verdana, sans-serif; }
How do you use size keywords or percentages for relative-sized fonts?
EX: bold, bolder, lighter, 700
How do you use line-height property to vary the spacing between lines?
EX: p { line-height: 2; } p { line-height: 2em; } p { line-height: 200%; }
How do you use the font property as a short cut to provide values for: style, weight, variant, size/line-height and font-family?
EX: { font: style weight stretch variant size/line-height font-family; }
How do you use the text-indent property to indent the first line of text? T or F A negative value for text-indent can create a hanging indent?
EX: { text-indent: 2em; }, { text-indent: 25%; }, { text-indent: -35px; } True
How do you use letter-spacing and word-spacing to vary the spacing between letters or between whole words?
EX: {letter-spacing: 16px;} {word-spacing: 36px;}
Every ________ or external style sheet should have a body selector to define default styles for the page.
Embedded
What should be used to package presentation with a specific Web page?
Embedded CSS
What is the process of creating and use style sheets?
Embedded style sheets are defined in the <head> section of an HTML document using the <style> tag. You can define any number of <style> elements inside the <head> section.
Checklist for website: Be careful with emphasis
Emphasize the right things
What is the preferred style sheet for an entire Web site?
External CSS
T or F You can't provide size units as absolute or relative values?
False
What are the valid values for the text-decoration property?
Formatting EX: a { text-decoration: none; } Valid values: underline, over-line, line-through, and blink.
What is the purpose of the <meta> tag?
Tell the system which type of html you are using
What is the <body> tag used for?
Text and content of the page.
Know the heading tags: < h1>- <h6> and their attributes.
The <h1> to <h6> tags are used to define HTML headings. <h1> defines the most important heading. <h6> defines the least important heading.
What is the purpose of the <html> tag?
The <html> tag represents the root of an HTML document. The <html> tag is the container for all other HTML elements except for the <! DOCTYPE> tag
Know the use of the <p> tag and its attributes.
The <p> tag defines a paragraph. Browsers automatically add a single blank line before and after each <p> element.
What are the three HTML 5 validation standards?
The W3C MarkUP Validator The W3C Link Checker The W3C CSS Validator
Who is the W3C?
The World Wide Web Consortium is the main international standards organization for the World Wide Web. Working in the development of standards for the WWW.
What is the history of CSS, and its benefits?
The birth of CSS is largely credited to Norwegian Håkon Wium Lie, who back in 1994 sought to create a universal standardized style sheet for the World Wide Web. CSS is one of three cornerstone technologies used on the web (the other two are HTML and JavaScript). CSS stands for Cascading Style Sheets
Know the history of the Internet.
The internet was created for govt researchers to share information. This led to the ARPANET, which was used in academics and then shifted into the internet.
What is the history of HTML?
The most widely used version throughout the 2000s was HTML 4.01, which became an official standard in December 1999. Another version, XHTML, was a rewrite of HTML as an XML language.
What are the two parts of a style rule?
The selector and the declaration
What is the default file for an HTML Web site?
index.htm or index.html.
What are the valid values for the font-style property?
normal, oblique, italic
What are the valid values for the font-variant property?
normal, small-caps
Child selectors can override inherited properties by providing _____ ___ properties.
their own
