VeronicaAndrade-mod-0-capstone.md

Mod 0 Capstone reading & responses

Veronica Andrade

HTML and CSS Chapters 1 & 2

1. On a website, what is the purpose of HTML code?
HTML code describes the structure of the pages
2. What is the difference between an element and a tag?
Tags act like containers, they tell you something about the information that lies between their opening and closing tags
3. Why do we use attributes in HTML elements?
Attributes provide additional information about the contents of an element.
4. Describe the purpose of the head, title, and body HTML elements.
The head element contains information about the the page rather than information that is shown within the main part of the browser window. The title is as you would assume, the content of title element are shown either in the top of the browser above where you usually type the in the URL of the page you want to visit or the tab of that page. As for the body element, it displays everything inside is shown in the main browser window.
5. In your browser (Chrome), how do you view the source of a website?
In chrome, right click and click "view source", or go up to the view tab and also click on view source.
6. List five different HTML elements and what they are used for. For example,
   is a paragraph element, and it is used to represent a paragraph of text.
1. "h1" is used for main headings
2. "sup" used to contain characters that should be superscript, such as suffixes of dates.
3. "br /" used to add a line break in the middle of your paragraph
4. "hr /" creates a break between themes by adding a horizontal rule between the sections
5. "i" makes the characters inbetween appear italic


7. What are empty elements?
An element that does not have any words between the opening and closing tag.
8. What is semantic markup?
Text elements that are not intended to affect the structure of your webpages, but they do add extra information. For example, a screen reader may add emphasis the words inside the element.
9. What are three new semantic elements introduced in HTML 5? Use page 431 in the book to find more about these new elements.
• "aside" contains information that is related to the article but not essential to it's overall meaning
• "section" element groups related content together.
• "figure" can be used to contain any content that is referenced from the mainflow of the article
• "figcaption" provides a text decription for the content of the element.

Chapters 3&4

1. There are three main types of lists in HTML: ordered, unordered, and definition. What are their differences?
Ordered means that each item on the list is numbered and has a sort of step by step process whereas an unordered list consists of bullet points and has no real order to the list.Definition list are made up of a set of terms along with the definitions of those terms.
2. What is the basic structure of an element used to link to another website?
a href = "link" title of link
3. What attribute should you include in a link to open a new tab when the link is clicked?
URL should be included after the href attribute.
4. How do you link to a specific part of the same page?
You use a relative URL to tell the browser where a page is in relation to the current page.

Chapters 10, 11, & 12

1. What is the purpose of CSS?
CSS allows you to create rules that specify how the content of an element should appear.
2. What does CSS stand for? What does cascading mean in this case?
CSS stands for Cascading Syle Sheet, cascading means that the styles can fall from one style sheet to another, enabling multiple style sheets to be used on one HTML document
3. What is the basic structure of a CSS rule?
A CSS rule contains two parts: A selector and a declaration.
4. How do you link a CSS stylesheet to your HTML document?
A link element can be used in an HTML document to tell the browser where to find the CSS file used to style the page.You use three attributes; href,type, and rel.
5. When is it useful to use external stylesheets as opposed to using interal CSS?
Allows all pages to use the same style rules rather than repeating them in the same page
Keeps the content seperate from how the page looks
Means you can change the styles used across all pages by altering just one file
6. Describe what a color hex code is.
They are three digit codes that represent the amount of lred, green and blue in a color, preceded by a pound or a hash.
7. What are the three parts of an HSL color property?
HSL color property allows you to specify color properties using hue, saturation and lightness.
8. In the world of typeface, what are the three main categories of fonts? What are the differences between them?
Main catagories are serif, sans-serif, and monospace. Serif fonts have extra details on the end of the main strokes, Sans-serif fonts have straight ends to letters and therefore have a much cleaner design, and evry letter in a monospace typeface is the same width.
9. When specifiying font-size, what are the main three units used?
Pixels, percentages and ems are the three main units used.

Chapter 7

1. If you're using an input element in a form, what attribute controls the behavior of that input?
The "type attribute" specifies the type of input you want displayed.
2. What element is used to create a dropdown list?
It would use the select element and the option element to create a drop down list.
3. If you're using an input element to send form data to a server, what should the type attribute be set to?
The type attribute should be type = "submit", along with a form action element.
4. What element is used to group similar form items together? The fieldset element, which is helpful for longer forms.

Chapters 13&15

1. Describe the differences between border, margin, and padding.
The border seperates the edge of one box from another. Margins sit outside the edge of the border, margin properties are very helpful in adding space between various items on the page.Padding is the space between the border and the content contained within it. Adding padding can make it easier to read.
2. For a CSS rule padding: 1px 2px 5px 10px, what sides of the content box does each pixel value correspond to?
top, right, bottom, left. top:1px right:2px bottom:5px left:10px
3. Describe the difference between block-level and inline elements.
Inline element does not cause a line break where as a block element does.
4. What is the role of fixed positioning, and why is z-index important in the scenario of using fixed positioning?
Fixed positioning positions the element in relation to the browser window so it stays n the same place, using z-index helps so that the element does not get covered by whatever text is coming up when you scroll down on a web page, it helps coordinate where the overlaps happen and which text data is on top.
5. What is the difference between a fixed and liquid layout?
fixed layouts are designed not to change despite the size of the users browser window, whereas liquid layout designs do change as the the user increases or decreases the size of thier browser window.

Chapter 5

1. In an image element, why is the alt attribute important?
alt provides a text description of the image which describes the image if you cannot see it.
2. What determines if an image element is inline or block?
The block element will cause the image to be before the paragraph on a new line. A inline image will be on the same line as the paragraph.
3. What are the benefits of jpg or png image file formats?
jpg image file formats are for images with more color, whereas png is used for fewer color or large areas of the same color.

Chapter 16

1. What is the benefit of specifying the height and width of images in CSS compared to specifying in the HTML?
Whenever you use consistently sized images across a site you can use CSS to control the dimensions of the images, instead of putting the dimensions in HTML.
2. What is an image sprite, and why is it useful?
An image sprite is when a single image is used for several different parts of an interface. The advantage of using sprites is that the web browser only needs to request one image rather than many images, which can make the webpage load faster.

Java Script & Jquery

---

Chapter 1&2

1. How do you declare a variable. What does the equals sign really mean in JavaScript? What is it called in JavaScript?
You declare a variable with the `var` keyword. The equal sign is an assignment operator which means that it is giving a value to the variable.
2. There are three big data types in JavaScript: numbers, strings, and booleans. Describe what each of them are.
Numbers are numerical values, strings are data types that consists letters and other characters, and booleans are data types that can have 1 of two data types:true or false.
3. What are the six rules for naming variables? What are a few JavaScript reserved words that you should avoid using for variable names?
1. The name must begin with a letter, dollar sign, or underscore. Must not start with a number.
2. No dashes or periods in a variable name.
3. You cannot use keywords or reserved words.
4. All variables are case sensitive.
5. Use a name that describes the kind of information that the variable stores.
6. If your variable name is made up of more than one word, use a capital the words after the first word.
4. How can an array be useful when dealing with multiple related values? How do you access/change a value in an array?
With an array, you do not need to specify how many values it will hold and this is helpful because having multiple related values under one variable makes for a better solution. To access a value from an array, after the array name you specify the index number for that value inside square brackets. Selecting and assigning a new value.
5. What is the difference between an expression and a statement?
An expression results in a single value and a statement preforms and action.
6. What are three types of operators and how are they used?
• Arithmetic operators perform basic math
• String operators combine two strings.
• Comparison operator compares two values and returns true or false.

Chapter 3

1. If we have a function defined as function sayHello(){console.log("Hello!")}, what is the difference between entering sayHello and sayHello() in the console?
sayHello() with parenthesis allows the funtion to work without any arguement
2. What is the difference between function parameters and arguments?
The difference is that parameter is variable in the declaration of function, arguement is the actual value of this variable that gets passed to function.
3. What is the keyword return used for?
It is used for obtaining the return value in which you seek
4. How are local variables better than global variables? Are there instances you can think of where you might want to use a variable that is globally scoped over local?
Global variables are declared outside any function, and they can be accessed (used) on any function in the program. Local variables are declared inside a function, and can be used only inside that function.

UX Crash Course

Psychology - Good: https://prezi.com/ Bad:https://www.reddit.com/r/mildlyinfuriating/ Usability - Good:https://prezi.com/ Bad:https://www.reddit.com/r/mildlyinfuriating/ Design - Good: Bad:https://www.reddit.com/r/mildlyinfuriating/ Copywriting - Good: https://www.amazon.com/ Bad:https://www.reddit.com/r/mildlyinfuriating/ Analysis - Good: https://www.facebook.com/ Bad:https://www.reddit.com/r/mildlyinfuriating/

Codepen work - https://codepen.io/Vandrade726/pen/NZVxeJ