##Structure and Text from HTML
####On a website, what is the purpose of HTML code?
..It's a standard for describing the structure and presentation of information via the Internet.
####What is the difference between an element and a tag?
..A tag is an angle bracket with a character inside of it. Most semantic codes have an opening and closing tag. An element is comprised of two tags, an opening and closing tag. The closing tag will have a forward slash before the character.
####Why do we use attributes in HTML elements?
..Attributes provide additional information about the element.
####Describe the purpose of the head, title, and body HTML elements.
..The head tag provides information about the page but not displayed in the browser. This is where you add most of your links to files that will be used in the page.
..The body tag is where all of the information you want displayed in the browser to go. The title element is what is displayed on the browser tab or on the title bar.
####In your browser (Chrome), how do you view the source of a website?
..You right click on the page and a box pops up with options to choose from. Choose the "view page source" option.
####List five different HTML elements and what they are used for. For example, <p></p> is a paragraph element, and it is used to represent a paragraph of text.
..<section></section> defines sections in an html page. <h1></h1> is a tag used for the title of an html page. It's bigger than the subtitles on the page, and suggests a hierarchy for the page.<nav></nav> is used for the main navigation links on the page.<article></article> specifies independent self contained content.<footer></footer> contain information such as the author of the document, copyright information, links to terms of use, ..privacy policy, etc.
####What are empty elements?
..An empty element is a tag that doesn't have a separate closing element, instead it has an opening angle bracket a character followed by a space and a forward slash and a greater than bracket.
####What is semantic markup?
..Semanitc markup provides extra information on text, such as where emphasis is placed etc.
####What are three new semantic elements introduced in HTML 5? Use page 431 in the book to find more about these new elements.
..The new elements in HTML5 are <header></header>, <nav></nav>, and <article></article>
##Link to Codepen-HTML code
http://codepen.io/kristing40/pen/RppwMO?editors=1010#0
##GEAR UP
####What role does empathy play in your life and how has it helped you? ..Empathy plays a huge role in my life. I have no doubt experienced my share of ups and downs, this alone allows me to have empathic concern for others. I am willing to assist, however, I don't allow myself to become emotionally engulfed to the point where I have take on others issues as my own and can no longer function in my own life. ####How does empathy help you build better software? ..It allows the creator to step into the shoes of the end-user and look at the software and its abilities from the end-users perspective. This knowledge would help the developer create a product that really meets or exceeds the needs of the end-user. ####Why is empathy important for working on a team? ..Having empathy for your teammates is imperative as you all will be experiencing the ups and downs of life in different ways so one has to be empathetic to someone else's trials and tribulations. ####Describe a situation in which your ability to empathize with a colleague or teammate was helpful. ..A college friend was going through a divorce and was really not in a good place emotionally. I understood how they were feeling and would lend a non-judgemental ear when needed. ####When do you find it most difficult to be empathetic in professional settings? How can you improve your skills when faced with these scenarios? ..When someone has displayed cutthroat, gossipy, self-absorbed tendancies or when people aren't supportive and show no empathy towards others.
##Day 2 HTML & CSS
####There are three main types of lists in HTML: ordered, unordered, and definition. What are their differences?
..Ordered lists-Each item in the list is numbered in consective order. Unorderd lists are in no particular order but by default have a bullet point in front of each item. Definition lists are a set of terms along with their definitions.
####What is the basic structure of an element used to link to another website?
..<a href="https://website.com></a>
####What attribute should you include in a link to open a new tab when the link is clicked?
..target="_blank"
####How do you link to a specific part of the same page?
..By using id's in the part of the page you want to link to. Then in your a tag you do the following<a href="#name"></a>
###CSS
####What is the purpose of CSS?
..to provide styling to the web page.
####What does CSS stand for? What does cascading mean in this case?
..Cascading Style Sheets. Cascading means it starts at the top of the file and cascades down applying the style rules. last rule taking precedence.
####What is the basic structure of a CSS rule?
..Selector follwoed by open/closing curly braces, inside the curly braces a declaration (key/value pair) which is a property name followed by a colon and value for the property followed by a semicolon.
####How do you link a CSS stylesheet to your HTML document?
..<link href="styles.css" rel="stylesheet" type="text/css">
####Why is it useful to use external stylesheets as opposed to using interal CSS?
..You only have to update in one place.
####Describe what a color hex code is.
...A six digit code for determining how much red, green, and blue are in a color.
####What are the three parts of an HSL color property?
..HUE-color, SATURATION-Amount of gray expressed in percentages., LIGHTNESS-The amount of black or white expressed in percentages.
####In the world of typeface, what are the three main categories of fonts? What are the differences between them?
..Serif has detail at the ends of letters, Sans-Serif modern cleaner take on Serif this font as straight ends, Monospace all of the letters have same width. Used with code to make readability easier.
####When specifiying font-size, what are the main three units used?
..pixels, ems, percentages.
##Day 3 Chp7
####If you're using an input element in a form, what attribute controls the behavior of that input?
..the type attribute controls the behavior of the input element.
####What element is used to create a dropdown list?
..<select></select>
####If you're using an input element to send form data to a server, what should the type attribute be set to?
..type="submit"
####What element is used to group similar form items together?
..<fieldset></fieldset>
###Chp 15 & 15 ####Describe the differences between border, margin, and padding. ..border places space around the border of the element, margin places spaces between the element and its parent, padding is the space inside the element around any text, images etc. that are inside the element. ####For a CSS rule padding: 1px 2px 5px 10px, what sides of the content box does each pixel value correspond to? ..1px - top, 2px-right, 5px-bottom, 10px-left. ####Descirbe the different between block-level and inline elements. ..Block-level elements start on a new line. Inline-elements flow within text. ####What is the role of fixed positioning, and why is z-index important in the scenario of using fixed positioning? ..The element is positioned in relation to the browser window. Elements that have a fixed position do not move when the user scrolls the page. Z-index will push this element to the front/top, so any scrolling elements will scroll behind the fixed position element allow the user to still see the contents of the element with a fixed position. ####What is the difference between a fixed and liquid layout? ..Fixed width layouts don't change size as user increases/decreases the size of the window. On the other hand, liquid layouts stretch and contract as the window size is increased/decreased.
##Day 4 HTML,CSS,Javascript ####In an image element, why is the alt attribute important? ..so that screen readers can read what is there. ####What determines if an image element is inline or block? ..the element it's placed in. ####What are the benefits of jpg or png image file formats?
###Chp 16 images css ####What is the benefit of specifying the height and width of images in CSS compared to specifying in the HTML? ..Specifying the images in css helps the page load more smoothly. The amt out space needed for an image is left while the rest of the html is loaded around that space. ####What is an image sprite, and why is it useful? ..An image sprite is an image used for several different parts of an interface. Sprites are all contained on one sheet so the images don't have to be loaded again only the position changed for each image rendered, saving valuable load time, etc. ##Day 5 Javascript ####There are three big data types in JavaScript: numbers, strings, and booleans. Describe what each of them are. ..Numbers are decimals, Strings are words or text must be in quotes, Booleans are true/false. ####What are the three logical operators that JavaScript supports? ..&&, ||, < > ####What is the naming convention used for variables? ..underscore,camel case, or a dollar sign in front of the word. ####What is the difference between an expression and a statement? ..an expession is assigned to a variable, a statement runs inside of a code block i.e. method or function. ####What are a few JavaScript reserved words, and why are they important to avoid using them for variable names? ..new, var, return ####What is control flow, and why is it useful for programming?
##Day 6 Javascript & Console ####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 reports an error, the compiler doesn't recognize### as valid syntax. calling the function sayHello() will render the statement in the code block, which is Hello! ####What is the keyword return used for? ..to return a value to the calling function. ####What are function parameters? ..they hold data passed into the function when it's called. ####What is the naming convention used for function names? ..the name of the function should be relevant to its operations. If is two or more words, should be camel cased.