Jokes on You! summary

My application is called Joke’s On You! (a pun for the phrase “joke’s on you” and also the physical meaning of jokes in your pocket).

My goal for the application is have it be named the ultimate joke book, contains hundreds of the funniest jokes ever heard. I enjoyed reading joke books as a child because I was learning to read, which every kid needs to learn, but in something that made me laugh. 

My application will be targeting ages 6-18 years, which will give me opportunity to inserts jokes of every age appropriateness, and be relatable to the ages set. 

My app will start on a main “start” page, then will direct the user to the “menu” page which will contain the bottons; randomize, categories, favorites, and search, giving the user lots of options of where to direct themselves according to their mood.

My interview with my ideal subject went alright, he understands the use of the app perfectly, and agrees that it is nicely laid out, however, he stated that I should be aiming for a younger demographic, more to young children who read joke books daily.

I think my application would be benefitial for any user to take a break from working 24/7 and to appreciate some tasteful jokes.


Persona Template

Name: Kyle

Age: 16

Location: Toronto

He is a student at The York School, he is an athlete who trains multiple times a week, and a popular kid with his friends. He is a funny kids, who enjoys humorous social media like most kids of this younger generation. He voiced to me that humor helps everyone connect as its spreads good vibes.

The accessibility of humor is easy with big social media sites today, constantly sharing and rebloging information. By creating an application innovators are much more at ease to communicate with the public.

Kyle walked me through his experience of Vine, which is essentially a video based comedy. You start at the home screen, and depending on which users you follow will vary the contents that fill your home page. 

Kyle said he used to love reading joke book a child, which is why I decided to interview him. I connected my Joke’s on You! app to regular appreciated humor such as vine or youtube, to see what interests them most, perhaps a topic or genre of humor. 

He also stated that although he might not find use in the app, that a younger demographic would find it a lot more appealing and interesting.



Group work by: Sam, Jodie and Stanley

CSS is an acronym for Cascading Style Sheet. This coding style is very similar to HTML, however the effects are translated differently. These CSS files define the look and layout of an HTML page. CSS define many features of the HTML such as borders, margins, fonts, sizes, etc. As this site puts it “HTML is used to structure content. CSS is used for formatting structured content”. HTML was created to simply structure text on a page, CSS developed to then format said structure. One CSS file has the power to control the structure of many files or documents. The beauty of CSS is that they can apply to many documents. Instead of writing, or copying the background colour to every single web page, you can create a single CSS file which will add the formatting to the pages you define it to. CSS files are in the format of “example.css” and can be linked to HTML pages inside the coding.

CSS works well with HTML because the coding is very similar.

HTML: <body bgcolor=”FF0000″>

CSS: body {background-color: #FF0000;>

This coding produces the same thing.

CSS coding is in the structure of

selector {property: value;}

Coding with CSS will have this shape:

body {

    background-color: #FF0000;


Properties will stack up below the background-color for example if more modification is required. Linking the CSS file to your HTML code is the same concept as linking a file or image to your HTML page:



<title>My document</title>

<link rel=”stylesheet” type=”text/css” href=”style.css” />


When something needs to be formatted and it is in a group of elements, you would use the CLASS and ID system. For example, using CLASS would be to change the colour of the title for different paragraphs. If you wanted paragraph 1 and 3 to have a red title, but paragraph 2 to have a blue title, you would changes the CLASS of paragraphs 1 and 2 to red, while paragraph 2 to blue. Then all you would need to do is link the CLASS CSS formatting to the appropriate coding. This example is showing that the CLASS whitewine will change the colour of the text to a yellow-orange, where the class redwine will change the colour of the test to a dark red.

Example – HTML page:

<p>Grapes for white wine:</p>


<li><a href=”ri.htm”>Riesling</a></li>

<li><a href=”ch.htm”>Chardonnay</a></li>

<li><a href=”pb.htm”>Pinot Blanc</a></li>


<p>Grapes for red wine:</p>


<li><a href=”cs.htm”>Cabernet Sauvignon</a></li>

<li><a href=”me.htm”>Merlot</a></li>

<li><a href=”pn.htm”>Pinot Noir</a></li>


CSS File:

a {
color: blue;

a.whitewine {
color: #FFBB00;

a.redwine {
color: #800000;

Now, the ID system would be to change the formatting of some elements already inside other elements. Giving something an ID will give it a unique property because every ID is different.

Example – HTML:


<li ID=”A1-1″>30</li>

<li ID=”A1-2″>50</li>

<li ID=”A1-3″>200</li>









It is ideal to use external style when editing an entire websites or multiple pages. If you have multiple styles, it could be easily changed by changing the link to the style.

Uses the <link> tag to link to the sheet style.

If you want to change the font colour of your website, instead of going to each page and changing it. Make the change in one spot and it will change the all the pages.


It is ideal for editing a single page.

Define style by using the <style> tag.

If you want to change a specific paragraph to a different font colour on that single page.


This style applies to the specific HTML element it is in.

If you want to change a specific part of the page like the font colour,size, bold, italicized etc.

The box model is essentially the borders and margins that a web page has. It consists of four different parts, margin, border, padding and content. The margin is the transparent area around the border. The border is the area around the padding and is affected by the background colour. The padding is the area around the content and is also affected by the background colour. The content is where the text, images or videos appear. The box model is what gives the web page a specific layout. For example, Youtube has a specific spacing (margins and borders) along the edges of the content as well as padding between the video, comments, and recommended videos.

Floating refers to the movement of the image. This movement refers strictly to moving the image right or left, and not up or down.

For example, {float:right} or {float:left} would be the key to floating an image so the side.

A positioning happens after you float the image, referring it where to float to.

For example, {position:absolute; right: 40px; top: 40px}

By grouping (nesting) files, you make the code simpler for yourself and for organization. In style sheets, the style is maintained throughout,

h1 { color : red ; } h1 { color : #660066 ; }

h2 { color : red ; } OR h2 { color : #660066 ; }

p { color : red ; } p { color : #660066 ; }

but by grouping them, the code becomes much simpler, and enhancing

h1, h2, p { color : red ; } OR h1, h2, p { color : #660066 ; }

Through examples, explain how to align elements.
There are different ways to align elements; one is by using floating and positioning properties to guide that element to a specific location. Another way to use the margins to be points of reference to where the element will be placed.
Example for aligning an element by using the positioning property
Example for aligning an element by using the margins as a point of reference

A navigation bar is created using a list of link with <ul> and <il> elements/tags.

Firstly, open the code with <ul>.

For every link you want use this code:

<li><a hred=”example.asp”>Example</a></li>

Open and close each link with <li> and </li>

List as many links as you want, with Example being replaced by your link and your title.

Close the code with </ul>



<li><a href=”home.asp”>Home</a></li>

<li><a href=”archives.asp”>Past Articles </a></li>

<li><a href=”search.asp”>Search </a></li>

<li><a href=”about.asp”>About</a></li>


The code for an image gallery is a combination of other simpler codes.

You open with <html>, <head>, <style> and use your divider image that separates text from photos, and photos from photos. This file name can be called div.img

The margins, padding, border, height, float, and text align should all be applied next. Opening and closing with { , }.

Close with </style>, </head>.

Open a <body> element. (This is where you photos with go, using the specifications used above.)

An example of a code for one image would be:

<div class=”img”>

<a target=”_blank” href=”example_one.htm”>

<img src=”example_one.jpg” alt=”EXAMPLE”

width=”110” height=”90”>


<div class=”desc”>DESCRIPTION GOES HERE</div>

Use as many of those codes for however many images you have.

Close the entire code with </body> and </html>.


“CSS Box Model”. w3schools. np.nd. 13 Nov 13. <>

“CSS Group and Nesting Selectors”. w3schools. 20 Nov 13. <>

“CSS Horizontal Align”. w3schools. 20 Nov 2013. <;

“Lesson 7: Identification and Grouping of Elements (class and Id).” Free Tutorials on HTML, CSS and PHP. N.p., n.d. Web. 10 Nov. 2013. <>.

“Most CSS Floats Can Be Replaced With Relative And Absolute Positioning” Ben Nadel. 2 Oct, 2013. <>

“Which Stylesheet Type to Use and When?” HTML Basic Tutor. np. nd.13 Nov 13. <>

MLA Styles

Group: Sam Legros, Stanley Tsai, Jodie Quach

1) Books

Author Lastname, Firstname. Title of Book. Place of Publication: Publisher, Year. Medium.

Grenfell, Wilfred Thomason. Adrift on an Ice Pan. St. John’s: Creative, 1992. Print.

2) Articles

Author Lastname, Firstname. “Title of Article.” Name of Journal Volume. Issue (Year): Pages. Medium.

Cox, Gordon. “A Newfoundland Christmas Caroling Tradition.” Folk Music Journal 3.3 (1977): 242-60. Print.

3) Websites/pages and blogs

Entire Website:

Editor, Author or compiler name. Name of website. Version number. Name of institution/ organization of the site, date of creation. Medium. Date of access.

A page on a website:

“Title” Name of site. Publishing date. Medium. Date of access.

*Write np, if you cannot find the publisher name

Write in nd, if you cannot find the publishing date.


Editor, Author or compiler name. “Title of post”. Name of site. Version number. Name of institution/ organization. Medium. Date of access.

* If author(s)’s names are not found, use the screen name.

If there are more than one author, include the other author(s)’s name in brackets.

4) Videos

Title of Film, Series (If available), Creator/Filmmaker/Corportation, Important Individuals (Writers, Producers aside from lead directors), Key Performers (Lead Actors), Studio followed by the release date, Format in which you watched it (DVD, YouTube), Distributor (if a DVD), Distribution/Release Date

5) Lectures

Speaker’s name. “Title of speech”. Name of meeting/organization. Location. Date. Type of presentation.

* Types of presentation: Address, lecture, keynotes, guest lecture, conference presentation.

6) Bibliography

Grenfell, Wilfred Thomason. Adrift on an Ice Pan. St. John’s: Creative, 1992. Print.

Cox, Gordon. “A Newfoundland Christmas Caroling Tradition.” Folk Music Journal 3.3 (1977): 242-60. Print.

“MLA Work Cited: Electronic sources (Web publications)” Purdue Owl. 14 Dec 2012. Web. 02 Nov 2013.

“MLA Work Cited: Other common sources” Purdue Owl. 24 Jun 2013. Web. 02 Nov 2013.

Networking 101 – My questions

  1. What is a computer network? is known as a “telelcommunication network” that transfers and exchanges data from machine to machine. It communicates and works with machines in order to accomplish tasks such as email, file share and basic communication. The Internet is the biggest and most well known computer network, as it can be accessed by virtually every computer. 
  • LANs (Local Area Networks), smaller and used for private and/or personal uses. LANs are smaller scale, and usually not as powerful as WANs since WANs can support many more users.
  • WANs (Wide Area Networks), bigger range, can be supportive of a big group of users engaging with this network. WANs are so powerful because for example, they are used in schools, office buildings, and general public, which will be used much more than LANs which are usually used for private purposes.
  • Internet, the world wide network that can be accessed by anyone from anywhere. This network contains search engines, social media websites, and endless amounts of information, at the tip of your fingers.
  • Intranet, is a private network that cannot be accessed out of the intranet.
  • MANs (Metropolitan area Networks) refers to granting connections of two devices, given that they are in the same city. The signal and strength of the MAN will depend of the size of the city, if the city is a larger scale, the MAN will have to stretch of the whole city.
  • VPN (Virtual Private Network), it can stretch and grant more access to a private network by using the public network such as the Internet. The VPN can be accessed only online, with security, it is a smart way of setting up internet connection, because the private service will be much faster.


4.) What is the difference between a client and a server?

A server is a base computer, or a master computer, where information can be taken by client computers which connects to the base computer for this use. Normally our computers we use would be considered the client computer, as the server computer is computers connected over the network for other computers to connect to.

Analysis – Cell Phones

Cell Phone Analysis

Cell Phones have developed in the last 15 years, and is seen today as a crucial necessity in order for our economy to survive. Our world depends on technology like cellular mobile to communicate and interact with business, family and social lives. The telephone requires a radio signal that can be accessed from virtually anywhere unless out of range of the satellites, and sometimes underground. The article, The Mobile Phone meets the Internet, written by Malcolm W. Oliphant, speaks on how the telephone has come a long way from what it was; as before 15, the mobile required only physical use of dialling and no digital information, as it very greatly thrives on today. Oliphant separates the mobile eras into three generations, the first generation consists of analog cell phones, the generation is made up of similar phones but with digital radio built in, and making the smartphone era as the third generation. “These trends should last into a fourth generation of even better spectrum efficiencies, higher radio carrier frequencies, even higher user data rates, and a blizzard of new non-voice applications plus the terminals to support them.” There is much took look upon in the future of mobile phones, and growth of our society with the help. it was when the internet was integrated into the mobile phone, that increased its popularity, along with convenience.

The article, Cell Phones + microwaves + other radiation = Disease!, written by Michael Wald, discusses the opposing side of the opinions of the cell phones in this time. By already seeing the title of this article, you can understand that Wald is firm on his beliefs that the cell phone, no matter what it has done for this society, will not benefit any of us if the health effects are so harmful to us. He starts off the article by saying “The use of cell phones is associated with an increased risk of brain tumours after 10 years of use, according to the journal Biomedicine & Pharmacotherapy”. It is puzzling that cell phones have the power to cause us so much potential harm. This article also speaks about how the use of a landline or a wireless headset can easily reduce the amount of radiation near the head of the user. “There is no way of knowing what this “individual tolerance” limit is for each of us, but it is prudent for us to take these reasonable, “natural” precautions and use our common sense”.

Both these two articles read make powerful statements on the pro’s and con’s of cell phones and their uses. The Mobile meets the Internet, by M.W. Oliphant, clearly states that the cell phone has revolutionized the way we live today, as everything we need is so portable, and accessible to us. On the other hand, we have to think about the health hazards, and Cell phones + microwaves + other radiation = disease!, by Michael Wald discusses how unsafe having open radiation close to our heads can be, and what it could become. While both articles make concrete arguments, my opinion of it is that we should be looking on what the cell phone has accomplished. It has restructured our day-to-day life. The cell phone can hold your entire life in a pocket-sized case, including communication, internet use, and recreational uses.  The cell phone is a much more important part of our life than we think, and it will remain this way as it grows and expands with research in the future.

Works Cited

Wald, Michael. “Cell Phones + Microwaves + Other Radiation = Disease!.” Original Internist, June 1, 2012.

Oliphant, M.W.. “The Mobile Phone Meets the Internet.” IEEE Xplore, August 1999. (accessed October 30, 2013).