This challenge will test your ability to clean data. Minimal preparation has been done to this data set, so as to give you a chance to deal with a more realistic set of formatting issues.
The following are data sets of total flights each year and a data set of air crashes.
(if you are using excel, do not worry about this part. Skip Q1, but answer all the others)
Make a line graph showing both the number of flights, and the number of crashes.
Q1 Does the trend in total number of flights explain the trend in the number of crashes?
Add two more columns to your crash data set that calculate the number of survivors and the survival rate.
Q2 Suppose a genie tells you that you will be in an air crash. You are allowed to choose what year you will be in the crash. What year should you choose to maximize your chance of survival?
Q3 Which month has the most crashes?
Q4 Where was the worst air disaster in aviation History?
Q5 How many people died?
Q6 How many people died in the air disaster with the most Survivors?
Q7 Which air operator has had the most fatalities, which has had second most?
Q8 What year was the most deadly for air travel?
Q9 What year produced the most survivors of air crashes?
Send your answers to lachlan.vaughantaylor@withyouwithme.com by May 14th.
Intro to Web Development challenge #2
Welcome to the second Intro to Web Development challenge! Now's your chance to show off some of your new HTML, CSS and JavaScript skills.
Task and motivation
Once again, you will be creating a static webpage that is based on a reference image. The styling for this task is more complex than the previous one, and the final product will look more like a modern website as a result. You will practice styling buttons, using flex display and HTML entities/symbols.
Scenario: A friend has been blogging their interior design articles, but isn’t happy with how bland they appear. They have asked you to help them create a more polished looking blog in the hopes of gaining more viewers. They have provided you with this image for reference:
The aim of this activity is to create a page with HTML and CSS that looks like the below image. You will need to use tools such as a colour picker to obtain the HEX codes/RGB value of the colours used. If you are finding it hard to match the font sizes/spacing between elements you can use an image editor to measure sections of the reference.
Hints:
Use the font family serif for the paragraph text and Arial for the sub-headings
Use a text generator such as this to generate the content of the paragraphs. Of course this text won’t look the same as the reference, just ensure your paragraphs are a similar length to the reference.
You will need
Reference image: To base your implementation off of.
Starter files:
Index.html - this is where you HTML goes. Your text and images will go here. The starter code imports your stylesheet in the <head> tag.
Exercise1.css - This is your style sheet. You can set the styles for default tags (such as body or h1) or you can create your own class and assign it to an element in your HTML file. An example of styling <body> and a custom class is already in the CSS file.
Images - Ensure these images are in the same directory as your HTML and CSS files (this avoids you having to include the relative file path when you reference this image in your HTML file).
A colour picker - use whichever one you prefer,but here is an example.
A HTML validator - To ensure you’re using best practices while you’re doing any kind of web development work. This will ensure your code not only works, but is readable for people other than yourself. You can find one here. You’re creating habits that will stick with you for your career in tech, make sure they’re good ones!
Starter files:
Index.html - this is where you HTML goes. Your text and images will go here. The starter code imports your stylesheet in the <head> tag.
Exercise2.css - This is your style sheet. You can set the styles for default tags (such as body or h1) or you can create your own class and assign it to an element in your HTML file. An example of styling <body> and a custom class is already in the CSS file.
Images - Ensure these images are in the same directory as your HTML and CSS files (this avoids you having to include the relative file path when you reference this image in your HTML file).
Welcome to the first Intro to Web Development challenge! Now's your chance to show off some of your new HTML, CSS and JavaScript skills.
Task and motivation
Now that you have grasped the basics of CSS and HTML, you will be creating a static page base that complies with a visual specification. When working as a web developer, it is very common to be presented with a visual specification (usually created by a designer) that you need to translate to code. You will practice using images, text and background styling in this activity.
Scenario
A family member is starting their own travel blog. They love travelling and writing, but don’t know how to code. They have asked you to help them by creating a web page that nicely displays photos and headings, so they can showcase the places they are visiting. They have provided you with this image for reference:
The aim of this activity is to create a page with HTML and CSS that looks like the below image. You will need to use tools such as a colour picker to obtain the HEX codes/RGB value of the colours used. If you are finding it hard to match the font sizes/spacing between elements you can use an image editor to measure sections of the reference.
Hints
Use the font family Georgia
You will need
Reference image: To base your implementation off
Starter files:
Index.html - this is where you HTML goes. Your text and images will go here. The starter code imports your stylesheet in the <head> tag.
Exercise1.css - This is your style sheet. You can set the styles for default tags (such as body or h1) or you can create your own class and assign it to an element in your HTML file. An example of styling <body> and a custom class is already in the CSS file.
Images - Ensure these images are in the same directory as your HTML and CSS files (this avoids you having to include the relative file path when you reference this image in your HTML file).
A colour picker - use whichever one you choose but here is an example.
A HTML validator - To ensure you’re using best practices/style while you’re doing any kind of web development work. This will ensure your code not only works, but is readable for people other than yourself. You can find one here. You’re creating habits that will stick with you for your career in tech, make sure they’re good ones!
Submit your answers
Submissions close 28/01/2021 at 12:00pm AEST. Submit your files directly to Kristin via Discord or through the below form. Good luck!
