KevDev90 · July 31, 2019 15:14
diff --git a/gistfile1.txt b/gistfile1.txt
 Day 1
 On a website, what is the purpose of HTML code? It describes the structure of pages.

 What is the difference between an element and a tag? Each html element tells the broswer something about the information that sits between
 its opening and closing tags. elements are usually made up of two tags, opening and closing tags.

 Why do we use attributes in HTML elements? Attributes give us additional info about the contents of an element.

 Describe the purpose of the head, title, and body HTML elements. Head- contains info about the page, you will usually see it before the body element and usually find a title element inside. Title- contents of the title element are usually shown on the top of the browser or on the tab for that page. Body- everything inside this element is shown inside the main broswer window.

 In your browser (Chrome), how do you view the source of a website?- right click anywhere on the page- select view page source on the menu.

 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.
 <body> -everything inside this element is shown inside the main broswer window. <head> -ontains info about the page, you will usually see it before the body element and usually find a title element inside. <title> - contents of the title element are usually shown on the top of the browser or on the tab for that page. <b> <b/b> - bolds text inside. <i> </i> - make characters appear italic.

 What are empty elements? they do not have any words between an opening and closing tag.

 What is semantic markup? text elements that aren't intended to affect the structure of your web pages but they do add extra information to them.

 What are three new semantic elements introduced in HTML 5? Use page 431 in the book to find more about these new elements.
 <header> <nav> <artcile> <footer>

 Gear up
 What role does empathy play in your life and how has it helped you? Empathy plays a big role in my life because i was raised by my parents to treat others the way I would like to be treated. Being able to be self aware and also aware enough to notice and respond thoughtfully when someone is distressed will go a long way to help them calm down. It is important to be able to respond to people in a helpful, constructive manner versus a negative non helpful way. When I previously worked as a furniture mover I would always try to be empathetic towards the customers and treat their property like it was my own in order to maintain a positive relationship with them. 

 How does empathy help you build better software? empathy can help you build better software because it can help you identify with your target audience better. Instead of developing a program to your own personal preferences, you can use empathy and try to figure out which aspects of this program would be ideal for my target audience that's going to be using this program. It is also good to have empathy when working on a project in a group because it enhances communication and the morale of the group and thus leads to more productivity.

 Why is empathy important for working on a team? Empathy is important for working on a team because it can greatly enhance the teams communication and productivity. If more of the members are social and outgoing towards one another then that sets the rest of the group at ease and allows for my creative and positive dialougue to take place. If members of a team aren't adequately using enough empathy with one another then proudctivity will stagnate and slow down the entire process. Much more can be achieved by being sensitive to everyone in the groups thoughts and feelings and thus creating a more open and accepting environment for people to work together as a team.

 Describe a situation in which your ability to empathize with a colleague or teammate was helpful. In my moving job I once encountered a difficult situation where a younger guy named Geo who I was working with recently had a friend pass away in the hospital the night before. He still showed up to work on time that day, but I could tell that something was bothering him because he felt more distant and non engaging than usual. I asked him if anything was going on and he let me know of his situation and I actually stopped what we were doing and gave him a hug and told him that I was sorry for his loss. I took a couple more minutes just talking with him about his friend after the move and he seemed really grateful that I took the time to listen to him and allow him to grieve a little bit. On our next move he seemed really happy to see me and everything seemed to go pretty smoothly because he knew I wasn't there to just work and go, but that I genuinely cared what he was going through.

 When do you find it most difficult to be empathetic in professional settings? How can you improve your skills when faced with these scenarios? In a professional setting I can find it to be difficult to be empathetic to someone on my team when they aren't fully ready to work on what we're supposed to work on. In my moving job I sometimes get angry or impatient with smaller guys that physically can't lift things in ways that i can. I need to remind myself to be empathetic more often and not to compare myself to other people in a given situation because you don't know that someone could be battling something or just can't help the fact that they're not fully prepare to work with you at that moment.

 Day 2
 There are three main types of lists in HTML: ordered, unordered, and definition. What are their differences?
 Ordered lists have each item in the list in a sequence, unordered lists begin with a bullet point and contain a list not in a sequence, and definition lists usually consist of a series of terms and their definitions. 

 What is the basic structure of an element used to link to another website?
 <a href="http://www.yahoo.com">yahoo</a>

 What attribute should you include in a link to open a new tab when the link is clicked?
 _blank

 How do you link to a specific part of the same page?
 You have to create an anchor with the id attribute to "mark" a place on the page and then make a link to the anchor like this: <a href="#anchor">.

 What is the purpose of CSS? It allows you to create rules that specify how the content of an element should appear.

 What does CSS stand for? What does cascading mean in this case? Cascading style sheets. Cascading meands that styles can fall (or cascade) from one style sheet to another, enabling multiple style sheets to be used on one HTML document.

 What is the basic structure of a CSS rule? It consists of a selector and a declaration block: The selector points to the HTML element you want to style. Each declaration includes a CSS property name and a value, separated by a colon.

 How do you link a CSS stylesheet to your HTML document? by using the external, internal, or inline style.

 When is it useful to use external stylesheets as opposed to using interal CSS? An external stylesheet is useful for making changes to the entire website or multiple pages whereas an internal css applies to only one page.

 Describe what a color hex code is. 6 digit codes that represent the amount of red, green, and blue in a color, preceded by a pound or hash # sign.

 What are the three parts of an HSL color property? Hue, saturation, and lightness values.

 In the world of typeface, what are the three main categories of fonts? What are the differences between them? Serif- has extra details on the ends of the main strokes of the letters. Sans-serif- has straight ends to letters, has a much cleaner design. Monospace- every letter is the same width, often used in coding because they align nicely.

 When specifiying font-size, what are the main three units used? Pixels, percentages, and ems.

 Day 3
 If you're using an input element in a form, what attribute controls the behavior of that input? The type attribute

 What element is used to create a dropdown list? <select>

 If you're using an input element to send form data to a server, what should the type attribute be set to? "post"

 What element is used to group similar form items together? <fieldset>

 Describe the differences between border, margin, and padding. Border- seperates the edge of one box from another. Margin- sits outside the border. You can set the width of a margin to create a gap between the borders of two adjacent boxes. Padding- is the space between the border of a box and any content contained within it.

 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.

 Describe the difference between block-level and inline elements. An inline element does not cause a line break (start on a new line) and does not take up the full width of a page, only the space bounded by its opening and closing tag. A block-level element always starts on a new line and takes up the full width of a page, from left to right.

 What is the role of fixed positioning, and why is z-index important in the scenario of using fixed positioning? It positions the element in relation to the browser window; so that when a user scrolls down the page, it stays in the same place. The z index is important in this scenario because having the z index higher than another element will ensure that the fixed element will remain on top of other elements where it can be seen easier.

 What is the difference between a fixed and liquid layout? Fixed layout doesn't change size as the user increases or decreases the size of their browser window. Whereas a liquid layout stretches and contracts as the user increases or decreases the size of their browser window.

 Day 4
 In an image element, why is the alt attribute important? The alt attribute is important in an image element so it can be understood by screen reader software so that people with visual impairments and search engines can understand what is in the image.

 What determines if an image element is inline or block? Inline elements sit within a block level element and do not start on a new line. Whereas a block element will always appear on a new line.

 What are the benefits of jpg or png image file formats? Jpg- Most common image file format, it is better for images with many colors, and there is no editing required to print a jpg image. Png benefits include- Better image quality due to lossless compression, and it can shrink to an incredibly small size.

 What is the benefit of specifying the height and width of images in CSS compared to specifying in the HTML? 
 Specifying a width and height for all images allows for faster rendering by eliminating the need for unnecessary reflows and repaints.

 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. It is useful because the web browser only needs to request one image rather than many images, which can make the web page load faster.

 Day 5 

 How do you declare a variable. What does the equals sign really mean in JavaScript? What is it called in JavaScript? Use var as the keyword, give the variable a name. It really means assignment operator, it says that you are going to assign a value to the variable. 

 There are three big data types in JavaScript: numbers, strings, and booleans. Describe what each of them are. 
 Numbers- Used for tasks involving calculating or counting sums, or things like determining the size of the screen or moving the position of an element on a page. String- Can be used when working with any kind of text. They can contain html markup. Booleans- data types that can have one of two values; true or false. 

 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, $, or _. 2. The name can contain letters, #'s, $, or _. 3. You cannot use keywords or reserved words. 4. All variables are case sensitive, it is bad practice to create two variables that have the same name using different cases. 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 letter for the first letter of every word after the first word.
 The name of HTML and Window objects and properties, or words such as; abstract, arguments,	await,	boolean,
 break,	byte,	case,	catch, char	class*	const	continue.

 How can an array be useful when dealing with multiple related values? How do you access/change a value in an array? 
 They are useful when dealing with multiple related values because you do not need to specify how many values the array will hold. Rather than creating variables for a long list, an array is considered a better and more efficient option. To access a value, after the array name you specify the index number for that value inside square brackets. To change the value of an item, you select the array and assign it a new value by using the equals sign and the new value for that item. 

 What is the difference between an expression and a statement?
 An expression produces a value and can be written wherever a value is expected, whereas a statement performs an action. 

 What are three types of operators and how are they used? Assignment operators- assign a value to a variable. Arithmetic operators- perform basic math functions. String operators- combine two strings. 

 Day 6 

 If we have a function defined as function sayHello(){console.log("Hello!")}, what is the difference between entering sayHello and sayHello() in the console? Entering sayhello by itself returns the whole function whereas if you imput sayHello() it returns Hello! and effectively calls the function.

 What is the difference between function parameters and arguments?
 A parameter is a variable in a method definition. When a method is called, the arguments are the data you pass into the method's parameters

 What is the keyword return used for?
 It is used to return a value to the code that called the function. 

 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?  

 Each variable is a bit of complexity, but a global variable adds complexity to the whole program, while a local variable adds complexity only in a single isolated unit, the function. Global variables take up more memory and increases the risk of naming conflicts. Global variables should be used when multiple functions need to access the data or write to an object.

 Day 7

 1) Psychology

 Are you thinking of the user’s wants and needs, or your own?

 Good example- https://www.airbnb.com/ - Airbnb does a great job of getting the user in touch with hosts to book a place to stay. They have this search as the first thing listed on their site. They are also thinking of the users needs by recommending places for the user to stay and providiing recommendations of things to do while they're staying in a certain city.

 Bad example- https://arrestling.com/- The worst issue is that the registration form for the upcoming conference is a PDF. So you cannot edit it online. You need to download it and mail it which is very inconvenient for the user.

 2) Usability

 Have you provided everything the user needs to know?

 Good example- https://www.espn.com/- ESPN does an awesome job of writing very current articles previewing and detailing upcoming sporting events in every sport for both men and women alike.

 Bad example- https://denver.craigslist.org/- Craigslist doesn’t have any pictures, logos, or banners. It consists solely of links users can follow to check the necessary location-based information and complete various actions. The design and usability of the resource haven’t changed much since 1995

 3) Design

 Do users think it looks good? Do they trust it immediately?

 Good example- https://www.dropbox.com/- Dropbox’s friendly personality, created by lighthearted illustrations, helps the user feel comfortable when using the product. This addition to the interface makes the product feel like an old friend, ready to help users complete their file sharing tasks.

 Bad example- http://www.arngren.net/- The content and layout is too overwhelming which would probably lead to a lot of users leaving the site quickly due to confusion.

 4) Copywriting

 Is it clear, direct, simple, and functional?

 Good example- https://medium.com/ - With minimal use of color, generous line spacing, and a well chosen combination of typography; this website has a very clear and functional ux design for its users.

 Bad example- https://www.lingscars.com/. The entire purpose of the website is offering cars for leases, but with the trotting chickens and Dalek webcams, you will hardly have the attention span to notice any. It obscures the actual content and services offered by Ling’s.

 5) Analysis

 How can you use this analysis to make improvements?

 Good exmaple- https://boostedboards.com/ - By conducting analysis, their web programmers decided that using high-resolution images of enthusiastic skaters to fill every page of the website. Boostedboards best exemplifies the use the images to make their customer focus soley on their product and not get distracted.

 Bad example- http://paradisewithaview.com/ - The photos on their home page are of various sizes, and the fonts become progressively smaller as you scroll down the page. You can tell that little to no analysis went into this websites design.


 https://codepen.io/kj3k/pen/PMZowb




diff --git a/kevinjohnson-mod-0-capstone.md b/kevinjohnson-mod-0-capstone.md
	Day 1
	On a website, what is the purpose of HTML code? It describes the structure of pages.

	What is the difference between an element and a tag? Each html element tells the broswer something about the information that sits between
	its opening and closing tags. elements are usually made up of two tags, opening and closing tags.

	Why do we use attributes in HTML elements? Attributes give us additional info about the contents of an element.

	Describe the purpose of the head, title, and body HTML elements. Head- contains info about the page, you will usually see it before the body element and usually find a title element inside. Title- contents of the title element are usually shown on the top of the browser or on the tab for that page. Body- everything inside this element is shown inside the main broswer window.

	In your browser (Chrome), how do you view the source of a website?- right click anywhere on the page- select view page source on the menu.

	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.
	<body> -everything inside this element is shown inside the main broswer window. <head> -ontains info about the page, you will usually see it before the body element and usually find a title element inside. <title> - contents of the title element are usually shown on the top of the browser or on the tab for that page. <b> <b/b> - bolds text inside. <i> </i> - make characters appear italic.

	What are empty elements? they do not have any words between an opening and closing tag.

	What is semantic markup? text elements that aren't intended to affect the structure of your web pages but they do add extra information to them.

	What are three new semantic elements introduced in HTML 5? Use page 431 in the book to find more about these new elements.
	<header> <nav> <artcile> <footer>

	Gear up
	What role does empathy play in your life and how has it helped you? Empathy plays a big role in my life because i was raised by my parents to treat others the way I would like to be treated. Being able to be self aware and also aware enough to notice and respond thoughtfully when someone is distressed will go a long way to help them calm down. It is important to be able to respond to people in a helpful, constructive manner versus a negative non helpful way. When I previously worked as a furniture mover I would always try to be empathetic towards the customers and treat their property like it was my own in order to maintain a positive relationship with them.

	How does empathy help you build better software? empathy can help you build better software because it can help you identify with your target audience better. Instead of developing a program to your own personal preferences, you can use empathy and try to figure out which aspects of this program would be ideal for my target audience that's going to be using this program. It is also good to have empathy when working on a project in a group because it enhances communication and the morale of the group and thus leads to more productivity.

	Why is empathy important for working on a team? Empathy is important for working on a team because it can greatly enhance the teams communication and productivity. If more of the members are social and outgoing towards one another then that sets the rest of the group at ease and allows for my creative and positive dialougue to take place. If members of a team aren't adequately using enough empathy with one another then proudctivity will stagnate and slow down the entire process. Much more can be achieved by being sensitive to everyone in the groups thoughts and feelings and thus creating a more open and accepting environment for people to work together as a team.

	Describe a situation in which your ability to empathize with a colleague or teammate was helpful. In my moving job I once encountered a difficult situation where a younger guy named Geo who I was working with recently had a friend pass away in the hospital the night before. He still showed up to work on time that day, but I could tell that something was bothering him because he felt more distant and non engaging than usual. I asked him if anything was going on and he let me know of his situation and I actually stopped what we were doing and gave him a hug and told him that I was sorry for his loss. I took a couple more minutes just talking with him about his friend after the move and he seemed really grateful that I took the time to listen to him and allow him to grieve a little bit. On our next move he seemed really happy to see me and everything seemed to go pretty smoothly because he knew I wasn't there to just work and go, but that I genuinely cared what he was going through.

	When do you find it most difficult to be empathetic in professional settings? How can you improve your skills when faced with these scenarios? In a professional setting I can find it to be difficult to be empathetic to someone on my team when they aren't fully ready to work on what we're supposed to work on. In my moving job I sometimes get angry or impatient with smaller guys that physically can't lift things in ways that i can. I need to remind myself to be empathetic more often and not to compare myself to other people in a given situation because you don't know that someone could be battling something or just can't help the fact that they're not fully prepare to work with you at that moment.

	Day 2
	There are three main types of lists in HTML: ordered, unordered, and definition. What are their differences?
	Ordered lists have each item in the list in a sequence, unordered lists begin with a bullet point and contain a list not in a sequence, and definition lists usually consist of a series of terms and their definitions.

	What is the basic structure of an element used to link to another website?
	<a href="http://www.yahoo.com">yahoo</a>

	What attribute should you include in a link to open a new tab when the link is clicked?
	_blank

	How do you link to a specific part of the same page?
	You have to create an anchor with the id attribute to "mark" a place on the page and then make a link to the anchor like this: <a href="#anchor">.

	What is the purpose of CSS? It allows you to create rules that specify how the content of an element should appear.

	What does CSS stand for? What does cascading mean in this case? Cascading style sheets. Cascading meands that styles can fall (or cascade) from one style sheet to another, enabling multiple style sheets to be used on one HTML document.

	What is the basic structure of a CSS rule? It consists of a selector and a declaration block: The selector points to the HTML element you want to style. Each declaration includes a CSS property name and a value, separated by a colon.

	How do you link a CSS stylesheet to your HTML document? by using the external, internal, or inline style.

	When is it useful to use external stylesheets as opposed to using interal CSS? An external stylesheet is useful for making changes to the entire website or multiple pages whereas an internal css applies to only one page.

	Describe what a color hex code is. 6 digit codes that represent the amount of red, green, and blue in a color, preceded by a pound or hash # sign.

	What are the three parts of an HSL color property? Hue, saturation, and lightness values.

	In the world of typeface, what are the three main categories of fonts? What are the differences between them? Serif- has extra details on the ends of the main strokes of the letters. Sans-serif- has straight ends to letters, has a much cleaner design. Monospace- every letter is the same width, often used in coding because they align nicely.

	When specifiying font-size, what are the main three units used? Pixels, percentages, and ems.

	Day 3
	If you're using an input element in a form, what attribute controls the behavior of that input? The type attribute

	What element is used to create a dropdown list? <select>

	If you're using an input element to send form data to a server, what should the type attribute be set to? "post"

	What element is used to group similar form items together? <fieldset>

	Describe the differences between border, margin, and padding. Border- seperates the edge of one box from another. Margin- sits outside the border. You can set the width of a margin to create a gap between the borders of two adjacent boxes. Padding- is the space between the border of a box and any content contained within it.

	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.

	Describe the difference between block-level and inline elements. An inline element does not cause a line break (start on a new line) and does not take up the full width of a page, only the space bounded by its opening and closing tag. A block-level element always starts on a new line and takes up the full width of a page, from left to right.

	What is the role of fixed positioning, and why is z-index important in the scenario of using fixed positioning? It positions the element in relation to the browser window; so that when a user scrolls down the page, it stays in the same place. The z index is important in this scenario because having the z index higher than another element will ensure that the fixed element will remain on top of other elements where it can be seen easier.

	What is the difference between a fixed and liquid layout? Fixed layout doesn't change size as the user increases or decreases the size of their browser window. Whereas a liquid layout stretches and contracts as the user increases or decreases the size of their browser window.

	Day 4
	In an image element, why is the alt attribute important? The alt attribute is important in an image element so it can be understood by screen reader software so that people with visual impairments and search engines can understand what is in the image.

	What determines if an image element is inline or block? Inline elements sit within a block level element and do not start on a new line. Whereas a block element will always appear on a new line.

	What are the benefits of jpg or png image file formats? Jpg- Most common image file format, it is better for images with many colors, and there is no editing required to print a jpg image. Png benefits include- Better image quality due to lossless compression, and it can shrink to an incredibly small size.

	What is the benefit of specifying the height and width of images in CSS compared to specifying in the HTML?
	Specifying a width and height for all images allows for faster rendering by eliminating the need for unnecessary reflows and repaints.

	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. It is useful because the web browser only needs to request one image rather than many images, which can make the web page load faster.

	Day 5

	How do you declare a variable. What does the equals sign really mean in JavaScript? What is it called in JavaScript? Use var as the keyword, give the variable a name. It really means assignment operator, it says that you are going to assign a value to the variable.

	There are three big data types in JavaScript: numbers, strings, and booleans. Describe what each of them are.
	Numbers- Used for tasks involving calculating or counting sums, or things like determining the size of the screen or moving the position of an element on a page. String- Can be used when working with any kind of text. They can contain html markup. Booleans- data types that can have one of two values; true or false.

	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, $, or _. 2. The name can contain letters, #'s, $, or _. 3. You cannot use keywords or reserved words. 4. All variables are case sensitive, it is bad practice to create two variables that have the same name using different cases. 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 letter for the first letter of every word after the first word.
	The name of HTML and Window objects and properties, or words such as; abstract, arguments, await, boolean,
	break, byte, case, catch, char class* const continue.

	How can an array be useful when dealing with multiple related values? How do you access/change a value in an array?
	They are useful when dealing with multiple related values because you do not need to specify how many values the array will hold. Rather than creating variables for a long list, an array is considered a better and more efficient option. To access a value, after the array name you specify the index number for that value inside square brackets. To change the value of an item, you select the array and assign it a new value by using the equals sign and the new value for that item.

	What is the difference between an expression and a statement?
	An expression produces a value and can be written wherever a value is expected, whereas a statement performs an action.

	What are three types of operators and how are they used? Assignment operators- assign a value to a variable. Arithmetic operators- perform basic math functions. String operators- combine two strings.

	Day 6

	If we have a function defined as function sayHello(){console.log("Hello!")}, what is the difference between entering sayHello and sayHello() in the console? Entering sayhello by itself returns the whole function whereas if you imput sayHello() it returns Hello! and effectively calls the function.

	What is the difference between function parameters and arguments?
	A parameter is a variable in a method definition. When a method is called, the arguments are the data you pass into the method's parameters

	What is the keyword return used for?
	It is used to return a value to the code that called the function.

	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?

	Each variable is a bit of complexity, but a global variable adds complexity to the whole program, while a local variable adds complexity only in a single isolated unit, the function. Global variables take up more memory and increases the risk of naming conflicts. Global variables should be used when multiple functions need to access the data or write to an object.

	Day 7

	1) Psychology

	Are you thinking of the user’s wants and needs, or your own?

	Good example- https://www.airbnb.com/ - Airbnb does a great job of getting the user in touch with hosts to book a place to stay. They have this search as the first thing listed on their site. They are also thinking of the users needs by recommending places for the user to stay and providiing recommendations of things to do while they're staying in a certain city.

	Bad example- https://arrestling.com/- The worst issue is that the registration form for the upcoming conference is a PDF. So you cannot edit it online. You need to download it and mail it which is very inconvenient for the user.

	2) Usability

	Have you provided everything the user needs to know?

	Good example- https://www.espn.com/- ESPN does an awesome job of writing very current articles previewing and detailing upcoming sporting events in every sport for both men and women alike.

	Bad example- https://denver.craigslist.org/- Craigslist doesn’t have any pictures, logos, or banners. It consists solely of links users can follow to check the necessary location-based information and complete various actions. The design and usability of the resource haven’t changed much since 1995

	3) Design

	Do users think it looks good? Do they trust it immediately?

	Good example- https://www.dropbox.com/- Dropbox’s friendly personality, created by lighthearted illustrations, helps the user feel comfortable when using the product. This addition to the interface makes the product feel like an old friend, ready to help users complete their file sharing tasks.

	Bad example- http://www.arngren.net/- The content and layout is too overwhelming which would probably lead to a lot of users leaving the site quickly due to confusion.

	4) Copywriting

	Is it clear, direct, simple, and functional?

	Good example- https://medium.com/ - With minimal use of color, generous line spacing, and a well chosen combination of typography; this website has a very clear and functional ux design for its users.

	Bad example- https://www.lingscars.com/. The entire purpose of the website is offering cars for leases, but with the trotting chickens and Dalek webcams, you will hardly have the attention span to notice any. It obscures the actual content and services offered by Ling’s.

	5) Analysis

	How can you use this analysis to make improvements?

	Good exmaple- https://boostedboards.com/ - By conducting analysis, their web programmers decided that using high-resolution images of enthusiastic skaters to fill every page of the website. Boostedboards best exemplifies the use the images to make their customer focus soley on their product and not get distracted.

	Bad example- http://paradisewithaview.com/ - The photos on their home page are of various sizes, and the fonts become progressively smaller as you scroll down the page. You can tell that little to no analysis went into this websites design.


	https://codepen.io/kj3k/pen/PMZowb