AhmadChaudhryyear8unit3

Web Design

**Unit question: How can shopping online made effective?**
Skills 2;
 * Pre-Unit exercise (if any)**

= INVESTIGATION =

Q1- The website I looked at for over 50’s was []. It has information for seniors above 50. It shows common deceases or illness and ways to prevent. It also introduces new gadgets clothing and activities for seniors so that they will become modern seniors. As for the web design; I’m not used to it. It has boring white and plain background. It had too much text. It’s filled with sections and sections of info and I only saw a picture. On picture can’t draw attention. The text is plain and grey. That is also uninteresting. The very few pictures that are there are also of very low quality. It is definitely very simple and not of my interest. It is different from the normal webpages I am used to look at. Comparing to the websites aimed for everyone, these are not good websites. Also I noticed that this web page has very little navigation. Only a few links. Along with the simple font the text is big. Probably for weak eyes to see. Yet another thing I noticed when comparing this site to another was that there were very few adverts.


 * Q2-**
 * __www. Bbc.co.uk__ ==== ====

||
 * ====content ==== || ====There are many pictures on the website. There is no background colors. This makes it more formal, but, for me it's boring. Along with the pictures there is summarized text. You can see all the stories on one page and select which one you want.==== ||
 * ====audience ==== || ==== For people looking for information. e.g school pupils for projects or adults wanting to know what up with the world around them. ==== ||
 * ====design ==== || ====the layout of the web page has the BBC logo in the top right and at the top there are links to the specific section of news you want to know. Below that and on the left of the page there are subheadings. The first one is top news stories. there is a slide show in that section. Now, going down from there, there are the main areas that the news xovers and the top story from that area. Beneath everything is a list of categories you want to choose from. Above that is a language selection.==== ||
 * ====how user friendly ==== || ====I think it is very user friendly. It is suitable for people of all ages. Also, you can select the language you want to use. There are many links that help to navigate the page. You can select text or pictures for hyper links. There are many top stories and they are on one page so you don't have to search the top stories. You can just click the hyperlink.==== ||

DOES NOT WORK)
||
 * ====Content==== ||  ||
 * ====audience ==== ||  ||
 * ====design ==== ||  ||
 * ====how user friendly ==== ||  ||

 []
||  [|http://wunderground.com] ==== ====
 * ====content ==== || ====The background is nice and relaxing. This makes you want to make a purchase. The pictures are of good content. They support the links. The righting is nice and can show properly. The rates are in a table and are organized.==== ||
 * ====audience ==== || ====This is adults.==== ||
 * ====design ==== || ====in the top left corner there is the logo. Below that is a bar which consists of hyperlinks. To the right of that you can search what you want to. Below the bar of hyper links is a slide show. It give the latest news from the bank. It gives info about investment rates and also home loans.==== ||
 * ====how user friendly ==== || ====It has a internet banking place which definitely helps. down the right hand side there are quick links which are helpful as well to navigate.==== ||

||
 * ====Content ==== || ====There are pictures on the webpage that help make it attractive and less boring. There are boxes with basic summaries of the main pages. The maps show a pinpoint location of where you are now. It can show the temperature from there so you dont have to search.==== ||
 * ====audience ==== || ====This website is meant for people who care about the weather and also business people who the weather might affect the work of. It is a very formal website.==== ||
 * ====design ==== || ====Above the page is a bar with all the other things you can do on wunderground such as log it. The logo is in the top left corner. There is a scroll view of hyperlinks in another bar. There are different boxes to see the stories and weather as well. It looks like a good design.==== ||
 * ====<span style="font-family: Arial,sans-serif;">how user friendly ==== || ====It is user friendly as it has all the pages linked to it in a shortlist. If you scroll over a name in that shortlist, a long list appears. Out of that you can choose what you want to instead of a big heap of links on the side. There are different boxes and each of those boxes have a nice bold subtitle. There are different contents in each of the boxes so it is nice and organized to the viewer.==== ||
 * ====<span style="font-family: Arial,sans-serif; font-size: 20pt;"> [|http://Donegalpens.com/] ====

|| //** The problem is that I need to come up with a brand new idea to make shopping online more effective. Firstly, what we need to shop online has to investigated. Second what does **** shop need to offer online shopping. Then we need to identify how can hackers steal your money while your shopping. After that we have to think of how to prevent that from happening. **//
 * ====<span style="font-family: Arial,sans-serif;">Content ==== || ====This website has six links to it. It is about pens so there are pictures of pens. There are three main sections of paragraphs each in different languages. There are other sections such as the accreditation to another company.==== ||
 * ====<span style="font-family: Arial,sans-serif;">audience ==== || ====People looking for a good pen which work properly and also looks nice.==== ||
 * ====<span style="font-family: Arial,sans-serif;">design ==== || ====As always the logo is on the top left. At the top right you can create an account or log in to that account. It gives a picture of the pens as a range. There is a bar with hyperlinks on it. There are only a few links which i think make navigation easier.==== ||
 * ====<span style="font-family: Arial,sans-serif;">how user friendly ==== || ====The only thing that makes it user friendly is that the info is in two languages. If you find it easier to understand English then you can look at the English. At least this way they don't lose customers.==== ||
 * The current situation/problem: **
 * Unit Question- How can shopping online be made effective? **
 * Unit Question- How can shopping online be made effective? **

What do you need to shop online:

 * ==== You need a internet accessible device and its software. ====
 * ==== The next thing is an ISP. It means internet service provider ====
 * ==== After that you need the hardware to access. There are many things required to access the internet. ====

==== The first thing that you need to access the internet is a device that can access the internet from a internet modem. There are many browsers on an internet device. The most famous ones are Google Chrome, Mozilla Firefox, Internet Explorer and Netscape. The browsers are what are used to access different webpages around the world. All of these browsers are parts of the software that is needed to browse what’s on the internet and look at the sites(5). If you want to shop, you have to enter the webpage address that shows your way to the website you want to use. If you want to shop, you enter a shopping site address and click away(6). Sometimes you shop for digital things. Things that you can’t touch. The biggest seller of such things is Facebook. Facebook allows you to use various apps. They all are actually businesses. This type of businesses let you play and enjoy. Facebook tries to get addictive games so people love it and try to be the best. They love it so much that they want to purchase everything that is advertised. For example, if you are playing a shooting game and you need to buy a gun desperately, you buy the offer of gun that it gives. The thing to this is that it never gives offers for guns that are not to be bought by credit card. They don't give you an offer that can be bought by earning some sort of credit in the game. I speak from personal experience with Facebook games. Each time you make a purchase, some of the money goes to Facebook. This ways the game owners and Facebook owners earn money. Of course, to play Facebook games you need adobe flash player and an internet browser. Both are software. There are many ways to access the internet including laptops, computers, phones, iPad, iPod, and gaming consoles(5). Most people access the internet on laptops and computers because of what they can do with it and what software they have. It has all the programs and all websites and there features are designed on computer. The next thing you need is an internet service provider that is your gateway to the internet. You could buy your own gateway but the equipment needed costs millions and millions of bucks. So most people just book a user with the gateway provider(6). This way you don't have to pay a million bucks and the gateway provider can get their money back. Most ISP make accounts for you to use for a limited amount of time. The information or data that you look up in your browser goes to your ISP and they code that info and send it through a link of CPU's to where you want it to go. Then the information or data request comes back and boom! Your browser has the site you want on it. The amazing thing is that this process happens in a matter of seconds(5). The last thing that you need to access the internet is hardware. Although the internet itself is not something you can touch, you still need hardware to access it. By hardware, I mean I don’t mean computers and laptops. I mean like the telephone lines or cables that the info has to go through. It has to reach your ISP and then the internet site somehow(5). Sitting at home or school, you also need a cable if you want to connect with LAN to the internet or if you get Wi-Fi, there has to be a Wi-Fi router. Both are examples of hardware required(6). ====

Online shopping requires 4 things mainly which are as follows <span style="font-family: Calibri,sans-serif; font-size: 15px;">(3) :
==== The first thing you need is a store software suite. This is what gives your site the features of online shopping. 'This is what actually comprises your site and allows you to add, remove, and modify products, accept payments, have a "shopping cart" system, and handle your customer's user accounts', says host-gator <span style="font-family: Calibri,sans-serif; font-size: 15px; line-height: 1.5;">(3). The most popular suites are Magenta, Zen Cart, Cubecart, and OsCommerce <span style="font-family: Calibri,sans-serif; font-size: 15px; line-height: 1.5;">(3). It's basically the system and programming of the shopping site. When the customers place an order, a suite will get it to you. This connects your to your merchant account through your SSL and it allows the money to be transferred. The positives of this are that it takes away a massive burden upon shopping online and can place and receive many orders at once. The immediate negative is that they can malfunction quite easily. This can lead to money misplacement and stocking errors. But, that is a risk that has to be taken as online shopping can't operate without a suite. The next thing that is required is a merchant account. The merchant account is for the owner of the online store <span style="font-family: Calibri,sans-serif; font-size: 15px; line-height: 1.5;">(3). It has to be decided between the owner and the merchant account provider. The software that was chosen for the site send the data of a credit card to the merchant account provider. The credit cards details that were just typed in by the customer go to the account provider for acceptance. The credit card details are accepted then the card is charged the amount he bought and that amount of funds is moved to the merchant account. They normally do this and send a check, or they can even send a Paypal payment. This is why the merchant account is important. You cant pay in cash so the money has to go from account to account. The merchant account provider is most probably a bank. With these transference's, security has to be issued. The account information must not go anywhere insecure. This is why there is a SSL certificate. It is a safe for your data. It does not make getting hold of the data any easier but it encrypts it which means scrambles the data. So even if a hacker got the data, he or she cannot use it because they cant understand it <span style="font-family: Calibri,sans-serif; font-size: 15px;">(3). This only leaves the original information of the credit card between the merchant, customer and bank. nobody else can interfere. To be sure that the customer is not sending his data to a fraud, the website has to be certified. The last thing that has to be in order is the customer convenience. There are three things that should be ensured to the customer for them to be convinced to buy. You need to allow them to do the internet shopping from their home. An online store is no good if they have to go banking or collecting the products. The next thing the customer has to be ensured is that the store will always be open. 24/7. Every day of the year. There should be a massive range of resources you have to sell. The customer should not want anything that the shop does not have. So the stock always has to be updated. It should be simple to use. People who are old or disabled should have to do a limited amount of work. The goods should be cheaper than the goods in stores. And, last but not least, the payment method has to be simple using a credit card or a company like Paypal. ====
 * ==== A store software suite ====
 * ==== Merchant account ====
 * ==== The SSL certificate ====
 * ==== Customer convenience ====

There are commonly 3 ways in which hackers steal the money:

 * ==== Phishing(11)+(14) ====
 * ==== Pharming(12)+(14) ====
 * ==== Phantom with-drawer(13) ====

Also, there are 5 types of hackers (1) :

 * ==== Script kiddie ====
 * ==== Elite hacker ====
 * ==== Black hat ====
 * ==== Grey hat ====
 * ==== White hat ====

==== Lets start with the types of hackers. first is the script kiddie. A script kiddie does not know the hacking techniques. He relies on the tools that are provided to him. These tools are often created by other hackers. They are completely reliant on the tools and do not know what actually goes on in the systems(1). Some of them don't even know the basics. The second type of hacker is an Elite hacker. This a terrific hacker. Hacking is a natural talent. Like normal societies the above average people are rewarded. The reward for these masters is the money and Intel they gain. Even the hackers respect the elite hackers. They can be thought of sharks in a tiny goldfish bowl(1). They aren't satisfied with normal people. These hackers like hacking in the more classified files. They love a challenge. They can be thought of the masters of deception. Hence, they are rewarded with the name, elite hacker. Although clever works for elite hackers, violence works for the black hats. He has a very "malicious" tactic(1). He tries to corrupt or destroy what every software, system or website that is online. He is aided by the technology of unauthorized computers, networks and telephone lines(1). So insecurity will be a fatal error if a Black hat is on the prowl. The next type of hacker is a grey hat. Grey hats have the traits of a black hat and a white hat. This is a hacker which does not have a job to see which systems are vulnerable but they look on the internet for vulnerable sites. Sites which have quality information or credits flowing through. Like a white hat he informs the owner about the vulnerabilities. Like a black hat he'll hack freely and destroy the system. Although, later he offers to fix the system for a small fee. The last type of hacker is a white hat(1). A white hat does not aim at destroying the system, but often helping to make it safer. A white hat performs tests to show how safe the system of a company is. Online he deliberately tries to get hold of the credit card and merchant bank information. Then he reports this to the shop online. Most of them are hired to do this but some are paid later for fixing the site, not for reporting(1). Although these are the type of hackers, the types of hacking require very skillful people. The first type of hacking is Phishing. Phishing does not require a lot of skill. What these type of hackers do is use an online communication service such as email, and send many messages to various people(11). They get the people to open the link or attachment which has malicious software. It can infect your device. They require information like credit card pins or bank account passwords etc(11)... Not everyone clicks on the link because not everyone is stupid. It comes to luck for the Phishers that someone is too stupid(14). Therefor they are called the term Phishers. Just a piece of vocabulary i found out was that all hacking terms begin with PH. Anyways back to the subject. Phishing attempts have increased. Although it isn't smart with a tiny group of people, it is effective with lots of people as there has to be someone who clicks on that account and loses all their money. Below is graph which shows the increase in Phishing between the years of 2004 and 2005. ==== Image from http://en.wikipedia.org/wiki/File:Phishing_chart.png ==== The next type of of hacking is Pharming. Pharming is a hack that directs traffic on one webpage to another, duplicate but fake webpage. This is an extreme offence to eCommerce and online banks(12). "Pharming can be conducted either by changing the [|hosts file] on a victim's computer or by [|exploitation] of a [|vulnerability] in [|DNS server] [|software]"(12). It corrupts and diverts the link. This way they manipulate anyone who relies on the real page, and use that reliance to benefit them such as changing the contact us link so that credit card payment is delivered to the wrong merchant account. Phantom withdrawals are the last type of hacking(13). They are very costly as they drain the money from either the credit card or merchant account. This happens when the information flow of credit card information or passwords is diverted(13). They are diverted anonymously and the commands are changed. The account is slowly being leaked and starved of its money. ====

What measures can be used to prevent hacking:
==== We know that websites are hacked and also are online shops. The question is how do we stop them. If we prevent hacking then the world would make a giant leap towards future innovations which make online shopping safer and easier. My opinion is that online shopping is the thing of the future. We just need to secure it. There are a few ingenuitive ideas. Only a few simple precautions are required to help ensure that your online shopping experience is a safe one. The first being, you use a secure web browser(9). secure web browser scramble the information to any one else other than the customer and the vendor(8). It takes just one simple download and use to get away from being hacked and robbed all your money from. The second bit of insurance that you must have is records(9). The records that you are given from shopping online are normally receipts(9). They should be printed out and kept. These should be saved so that you can get refunds or confirmations of your order(8). The third thing that it falls to is that you check your purchases. Also you should do your own total count. Only then will you be sure that the order you gave is correct. The online store may even rip you of by adding a thing or two <span style="font-family: Calibri,sans-serif; font-size: 15px; line-height: 1.5;">(3). Or, it might be a mistake. Or, a more likely thing that could still happen is that hackers would corrupt your order. Still, no chances should be taken and if you find anything on the receipt that you did not buy, you should call the bank immediately. The bank will stop the money transfer for the time being until issues are sorted out. The fourth thing that can be done is check the stores policies. We all know the truth. Most us go past that massive page with boring amounts of letters. But, be assured this is still better than the website not protecting the information and you losing a million bucks. If it does not offer anything about protecting your privacy(9), you should shop somewhere else as it is a weak website. To stop phishing being successful all that is needed is to raise awareness among people to not click that harmful link. The one that deserves to be in spam. If we raise awareness maybe people will have the sense not to click that link that will bring them into a financial crisis(8). When we make a password and a username for an account it can be too simple to crack. The following are tip for passwords given from Mark Honan (10) : ==== ==== So, it is much to simple for hackers who just guess the passwords of people. That's why you should always have complex passwords and usernames to protect yourselves. Unquestioningly as the technology word develops, so will the hackers techniques. We just need to see which one takes over. Hacking or Anti-Hacking. ====
 * Password Don'ts **
 * ==== Don't reuse passwords. ====
 * ==== Don't use a "dictionary word." That means don't use a single word alone. ====
 * ==== Don't use words that use "standard number substitutions" such as the number 4 for the letter "a" or the number 5 for the letter "s," which resemble each other. Hackers have tools that can crack those substitutions. ====
 * ==== Don't use short passwords. They're also easier to crack. ====

The Design Brief
I am going to design and make a website about the stakeholders involved in online shopping. It should be suitable for students aged 12 to 18.

The Design Specification

 * Have a Homepage
 * 1 pages about what you need to shop online
 * 1 pages about what the shop needs to offer this service
 * 1 pages about hacker's methods
 * 1 pages about security measures
 * Have a consistent layout
 * Appropriate use of pictures
 * No copy and pasted information
 * Have tables with merged cells
 * All pages that adjust to the window size
 * Must function the same in three different browsers.

Tests
Make a questionnaire on the quality of my create and get at least three people to answer. There will be four answered questionnaires in total. The questions and testing are below: = DESIGN =
 * 1) Does it have enough information for 12 to 18 years old for their research projects?
 * 2) Does it look the same in three different browsers? (Preferences are Chrome, Explorer and Opera)
 * 3) Does each page have the same layout?
 * 4) Are there 1 pages of shopping online, 1 pages on what shops need to offer this service, 1 pages about hacking and 1 pages about how to prevent hacking?
 * 5) Do the pictures match the writing and info they are next to?
 * 6) Are some of cells in the tables merged?
 * 7) Does it have a homepage that summarizes everything?

The Design Specification

 * Have a Homepage
 * 1 pages about what you need to shop online
 * 1 pages about what the shop needs to offer this service
 * 1 pages about hacker's methods
 * 1 pages about security measures
 * Have a consistent layout
 * Appropriate use of pictures
 * No copy and pasted information
 * Have tables with merged cells
 * All pages that adjust to the window size
 * Must function the same in three different browsers.

Design 2
== =The Menu is a scroll down menus from www.dynamicdrive.com= =The Menu is a scroll down menus from www.dynamicdrive.com= =The Menu is a scroll down menus from www.dynamicdrive.com= =The Menu is a scroll down menus from www.dynamicdrive.com= =The Menu is a scroll down menus from www.dynamicdrive.com=

Design 3
=The Menu is a drop down menus from www.dynamicdrive.com=

=The Menu is a drop down menus from www.dynamicdrive.com=

=The Menu is a drop down menus from www.dynamicdrive.com= =The Menu is a drop down menus from www.dynamicdrive.com=

=The Menu is a drop down menus from www.dynamicdrive.com= =What Design?=
 * <span style="font-family: 'Times New Roman',serif; font-size: 12pt;">SPECIFICATION || DESIGN 1 || DESIGN 2 || DESIGN 3 ||
 * <span style="background-color: white; font-family: Arial,sans-serif; font-size: 10pt;">Have a Homepage

<span style="background-color: white; font-family: Arial,sans-serif; font-size: 10pt; line-height: 1.5;">1 pages about what you need to shop online

<span style="background-color: white; font-family: Arial,sans-serif; font-size: 10pt; line-height: 1.5;">1 pages about what the shop needs to offer this service

<span style="background-color: white; font-family: Arial,sans-serif; font-size: 10pt; line-height: 1.5;">1 pages about hacker's methods

<span style="background-color: white; font-family: Arial,sans-serif; font-size: 10pt;">1 pages about security measures

<span style="background-color: white; font-family: Arial,sans-serif; font-size: 10pt;">Have a consistent layout

<span style="background-color: white; font-family: Arial,sans-serif; font-size: 10pt;">Appropriate use of pictures

<span style="background-color: white; font-family: Arial,sans-serif; font-size: 10pt; line-height: 1.5;">No copy and pasted information

H<span style="background-color: white; font-family: Arial,sans-serif; font-size: 10pt;">ave tables with merged cells

<span style="background-color: white; font-family: Arial,sans-serif; font-size: 10pt;">All pages that adjust to the window size

<span style="background-color: white; font-family: Arial,sans-serif; font-size: 10pt;">Must function the same in three different browsers. || **<span style="font-family: Arial,sans-serif; font-size: 10pt;">YES **


 * <span style="font-family: Arial,sans-serif; font-size: 10pt; line-height: 1.5;">YES **


 * <span style="font-family: Arial,sans-serif; font-size: 10pt; line-height: 1.5;">YES **


 * <span style="font-family: Arial,sans-serif; font-size: 10pt; line-height: 1.5;">YES **


 * <span style="font-family: Arial,sans-serif; font-size: 10pt; line-height: 1.5;">YES **


 * <span style="color: red; font-family: Arial,sans-serif; font-size: 10pt; line-height: 1.5;">NO **


 * <span style="font-family: Arial,sans-serif; font-size: 10pt; line-height: 1.5;">YES **


 * <span style="font-family: Arial,sans-serif; font-size: 10pt;">YES **

|| **<span style="font-family: Arial,sans-serif; font-size: 10pt;">YES **


 * <span style="font-family: Arial,sans-serif; font-size: 10pt; line-height: 1.5;">YES **


 * <span style="font-family: Arial,sans-serif; font-size: 10pt; line-height: 1.5;">YES **


 * <span style="font-family: Arial,sans-serif; font-size: 10pt; line-height: 1.5;">YES **


 * <span style="font-family: Arial,sans-serif; font-size: 10pt; line-height: 1.5;">YES **


 * <span style="font-family: Arial,sans-serif; font-size: 10pt; line-height: 1.5;">YES **


 * <span style="font-family: Arial,sans-serif; font-size: 10pt; line-height: 1.5;">YES **


 * <span style="font-family: Arial,sans-serif; font-size: 10pt;">YES **


 * ---** || **<span style="font-family: Arial,sans-serif; font-size: 10pt;">YES **


 * <span style="font-family: Arial,sans-serif; font-size: 10pt; line-height: 1.5;">YES **


 * <span style="font-family: Arial,sans-serif; font-size: 10pt; line-height: 1.5;">YES **


 * <span style="font-family: Arial,sans-serif; font-size: 10pt; line-height: 1.5;">YES **


 * <span style="font-family: Arial,sans-serif; font-size: 10pt; line-height: 1.5;">YES **


 * <span style="font-family: Arial,sans-serif; font-size: 10pt; line-height: 1.5;">YES **


 * <span style="font-family: Arial,sans-serif; font-size: 10pt; line-height: 1.5;">YES **


 * <span style="font-family: Arial,sans-serif; font-size: 10pt;">YES **



, not judge able in design
====I have chosen design two. It is the best design because it follows all the specifications. Design three does that as well. And design one is only of by one option. This tells me that my designs are really good. Plus, i made them neat and clean. This i think will make me alright with any design but Design one has to automatically be eliminated as it doesn't follow all the specifications. Design 2 and 3 are good. Still I chose design two as it has enhanced color and more space and detail for information available. This means i can put more description into the website. Also it will be more clear hence easy to follow. The colors i decided to put in are attractive but suitable for ages 12-18. Plus, after people research or in the middle of it, you need a break and that is why i put in the game of tic-tac toe. This is another reason i chose design 2 and three over one. The main reason that i chose 2 over 3 and 1 is because 3 and one are a bit plain. I want to do something which is a challenge. However, design three did have a challenge in it of putting the drop down menu on it. In Mr. O opinion that was hard and i agree with him. So by evaluating the three really good designs, against the design specification, I have chosen my design and justified my choice.====

I practiced my smart art skills by making a layout of my designs:


= PLAN = Step 1= Collect Pictures that can be collected from the internet Step 2= Modify Pictures from internet or make pictures that i want in graphic packages Step 3= Home page Step 4= How you shop online page Step 5=Internet accessible device and how you shop online Step 6=ISP Step 7= Hardware Step 8= What the Shop needs page Step 9= Software suit and merchant account Step 10= SSL certificate Step 11= Customer convenience Step 12= Make Hacking Page Step 13= Types of hackers Step 14= Methods of hacking Step 15= Security page Step 16= Content of Security page Step 17= Double check and make everything correct and talk about any modifications Step 18= Take surveys Step 19= Show answers to test surveys Step 20= Make table of specification and evaluate against and talk about improvements Step 21=Fill in unit table on wiki spaces


 * **H=Homework C= In class** || **Step 1** || **Step 2** || **Step 3** || **Step 4** || **Step 5** || **Step 6** || **Step 7** || **Step 8** || **Step 9** || **Step 10** || **Step 11** || **Step 12** || **Step 13** || **Step 14** || **Step 15** || **Step 16** || **Step 17** || **Step 18** || **Step 19** || **Step 20** || **Step 21** || **Comments** || **Resources** ||
 * **18/02/13** || H ||  ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   || Done but some of the pictures that i could not find i found pictures that could be put together. || Internet ||
 * **19/02/13** ||  || C ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   || I modified all the pictures that i needed to. But, i also found out that there was an easier way of modifying all the pictures. If i did my work on paint.net i could convert it to another extension on paint.net. || Gimp, Paint.net ||
 * **20/02/13** ||  ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||
 * **21/02/13** ||  ||   || C ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   || THIS WAS A HOLIDAY SO I WORKED AT HOME.

The main page i predict will take the most time. So the remaining steps should be easier i guess because i have to copy and paste the information and the table on the other pages. What i didn't do and cannot do is use the complicated codes on dynamic drive. So that means i had to take out the game and the navigational bar. The game i guess wasn't that important so i didn't try to recover the game. I did add another place for the menu bar and that was at the bottom. This is the change to the format which will be on every one of the pages. || Microsoft expression ||
 * **22/01/13** ||  ||   ||   || C || C ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   || The page was also made without hesitation but i did not do anything with the codes from dynamic drive. I used the same template as the one on the homepage.

Putting in the information was a simple matter as all i had to do was copy and paste the information i had collected on the investigation and since i had time left i spent it on giving another go at dynamic drive. I did and the navigational bar worked but the game didn't. Then i was facing an epic fail because i had to change the words and links in the code. I couldn't find the correct place among the sea of codes that were ready to drown me. || Microsoft expression, Internet, Investigation ||
 * **23/02/13** ||  ||   ||   ||   || H ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   || I didn't need this one extra day for information, so, i did the next work day's stuff today . Again putting in the information was an easy task, again i found myself at a stage that i was ahead of tasks. || Internet, Investigation ||
 * **24/02/13** ||  ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||
 * **25/02/13** ||  ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||
 * **26/02/13** ||  ||   ||   ||   ||   || C || C ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   || If i had to lose all my pictures this was the most convenient time. I was already a whole lesson ahead and was looking forward to relax and go through what i did. Although i had already done what i had to, on this day . I had to search for and create more pictures that i could use. I had lost them. || Investigation, Microsoft Expression, Internet ||
 * **27/02/13** ||  ||   ||   ||   ||   ||   ||   || H ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   || The page was also made without hesitation but i did not do anything with the codes from dynamic drive. I used the same template as the one on the homepage. || Investigation, Microsoft Expression, Internet ||
 * **28/02/13** ||  ||   ||   ||   ||   ||   ||   ||   || C ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   || Again very easy as all i had to do was copy and paste. It was really nothing. What was really something was that i had to be running all the way around the class helping people. But i continued to help them. I had done what i had to. Maybe i should challenge myself harder anyways. But it is true that if you teach others you are developing your own skills as well. And no matter how hard you try you can't be perfect. There were loads of problems and i even learned a few new ways of solving them. || Investigation, Microsoft Expression, Internet ||
 * **01/03/13** ||  ||   ||   ||   ||   ||   ||   ||   ||   || C || C ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   || THIS WAS A HOLIDAY SO I WORKED AT HOME

Using this skill of copy and pasting from my investigation i have learnt that this is mainly **why** the investigation is important.It is important because then i don't have to range the internet like a raging bull at the last second trying to put the information in my create and all i have to do is concentrate my skill of creating a website. These two steps were again very easy because of this. Then i thought what to do the rest of the time. It was a good fifteen minutes left. So i decided to add a few things to the page. Surely there was more information. Or even corrections. I spent the rest of the time editing the information from each page. || Investigation, Microsoft Expression, Internet ||
 * **02/03/13** ||  ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   || H || H ||   ||   ||   ||   ||   ||   ||   ||   || It was little homework and it was done successfully. || Investigation, Microsoft Expression, Internet ||
 * **03/03/13** ||  ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   || H ||   ||   ||   ||   ||   ||   ||   || The methods of hacking that hackers use was successful copied as homework. I noticed while doing this that i had quite a useful and informative image. So i copied that too. This image was an addition to the design. || Investigation, Microsoft Expression, Internet ||
 * **04/03/13** ||  ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||
 * **05/03/13** ||  ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   || C || C ||   ||   ||   ||   ||   || Done. I also helped other people. I thought that i needed to make a list of what has been changed in the design so i made a list. || Investigation, Microsoft Expression, Internet ||
 * **06/03/13** ||  ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||
 * **07/03/13** ||  ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   || C ||   ||   ||   ||   || I made sure everything was correct. I also talked about modifications on the wiki page. || Investigation, Microsoft Expression, Internet ||
 * **08/03/13** ||  ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   || C ||   ||   ||   || I had to work very hard because evertybody was taking the surveys at the same times. In theory taking surveys should be easy but its not. Although i did tough it out but it took 5 more minutes than what i had planned. || Investigation, Internet ||
 * **09/03/13** ||  ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||
 * **10/03/13** ||  ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||
 * **11/03/13** ||  ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||
 * **12/03/13** ||  ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   || C ||   ||   || This took a long time because i knew that i had to take the tests from the adobe format and change them into jpeg. I used gimp || Surveys, Scanner, Internet ||
 * **13/03/13** ||  ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   || H ||   || This was done with ease. || Internet, Investigation, Create ||
 * **14/03/13** ||  ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   || C || I cant fill the whole table in. I just filled in the improvements section so i could complete the rubric. || Internet ||
 * **15/03/13** ||  ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   ||   || C ||   ||   ||   || I looked through everything feeling proud of what i had done. || Internet ||

**Detail on each step**
Step 1= Step 2= Step 3= Step 4=
 * I am going to open Google Chrome at home and search for the pictures i need.
 * I will use Google as my search engine.
 * If i cannot find some of the pictures i need i will leave them to the next step.
 * I will have to open Paint.net and modify some pictures i found on the internet.
 * I will change these pictures by using the various tools.
 * After i have sorted out the layers and flattened them i will copy it and paste in Gimp.
 * Gimp can change the file type and i will convert it into JPEG and save it.
 * This will be for use in the website.
 * I will create my main page.
 * My whole website is on Microsoft Expression so i will have to open it first and create a root folder in my flash drive.
 * I will copy it and paste it onto My documents at school. At the end of each lesson i will take it home and copy and paste it onto my computer at home. This way i will have back ups where ever i go and i can work on them at home and at school.
 * Once i have created the root folder i will have to create a new page by using the new document icon on the left of the bar at the top.
 * From there i will insert a table of 6 rows and 12 columns.
 * I will put in the title and background color of each cell after i merge them to suite my design.
 * I will put the websites names on the sides (HACKERS!).
 * Then i will visit dynamic drive and add the game i decided to add and the scroll down menus menu bar.
 * I will add the pictures i have to on the main page.
 * The only section left empty is the info.
 * I will create my How you shop online page.
 * My whole website is on Microsoft Expression so i will have to open it first and open the saved site folder.
 * Once i have opened the root folder i will have to create a new page by using the new document icon on the left of the bar at the top.
 * From there i will copy the table on the homepage and paste it on this page.
 * I will change the title to How Can you shop online.
 * Then i will visit dynamic drive and add the game i decided to add and the scroll down menus menu bar.
 * I will add the pictures i have to.
 * The only section left empty is the info.

Step 5= Step 6= Step 7=
 * I will open the site and root folder i had created.
 * I will view the how can you shop online page.
 * I will open Google chrome
 * I will open the investigation i had on my wiki spaces page.
 * On the how can you shop online page i will simply copy and paste the information i had got in the investigation on Internet accessible device and how you shop online.
 * I will open the site and root folder i had created.
 * I will view the how can you shop online page.
 * I will open Google chrome
 * I will open the investigation i had on my wiki spaces page.
 * On the how can you shop online page i will simply copy and paste the information i had got in the investigation on internet service provider


 * I will open the site and root folder i had created.
 * I will view the how can you shop online page.
 * I will open Google chrome
 * I will open the investigation i had on my wiki spaces page.
 * On the how can you shop online page i will simply copy and paste the information i had got in the investigation on hardware that is required.

Step 8=
 * I will create my What the Shop Needs Page
 * My whole website is on Microsoft Expression so i will have to open it first and open the saved site folder.
 * Once i have opened the root folder i will have to create a new page by using the new document icon on the left of the bar at the top.
 * From there i will copy the table on the homepage and paste it on this page.
 * I will change the title to What the shop needs
 * Then i will visit dynamic drive and add the game i decided to add and the scroll down menus menu bar.
 * I will add the pictures i have to.
 * The only section left empty is the info.

Step 9= Software suit and merchant account


 * I will open the site and root folder i had created.
 * I will view the w hat the Shop needs page
 * I will open Google chrome
 * I will open the investigation i had on my wiki spaces page.
 * On the how can you shop online page i will simply copy and paste the information i had got in the investigation on Software suit and merchant account.

Step 10= SSL certificate


 * I will open the site and root folder i had created.
 * I will view the w hat the Shop needs page
 * I will open Google chrome
 * I will open the investigation i had on my wiki spaces page.
 * On the how can you shop online page i will simply copy and paste the information i had got in the investigation on SSL certificate.

Step 11= Customer convenience


 * I will open the site and root folder i had created.
 * I will view the w hat the Shop needs page
 * I will open Google chrome
 * I will open the investigation i had on my wiki spaces page.
 * On the how can you shop online page i will simply copy and paste the information i had got in the investigation on customer conveniance

Step 12= Make Hacking Page Step 13= Types of hackers
 * I will create my Hacking page
 * My whole website is on Microsoft Expression so i will have to open it first and open the saved site folder.
 * Once i have opened the root folder i will have to create a new page by using the new document icon on the left of the bar at the top.
 * From there i will copy the table on the homepage and paste it on this page.
 * I will change the title to Hacking
 * Then i will visit dynamic drive and add the game i decided to add and the scroll down menus menu bar.
 * I will add the pictures i have to.
 * The only section left empty is the info.


 * I will open the site and root folder i had created.
 * I will view the Types of hackers info
 * I will open Google chrome
 * I will open the investigation i had on my wiki spaces page.
 * On the how can you shop online page i will simply copy and paste the information i had got in the investigation on Types of hackers

Step 14= Methods of hacking


 * I will open the site and root folder i had created.
 * I will view the methods of hacking section
 * I will open Google chrome
 * I will open the investigation i had on my wiki spaces page.
 * On the how can you shop online page i will simply copy and paste the information i had got on methods of hacking

Step 15= Security page
 * I will create my Security page
 * My whole website is on Microsoft Expression so i will have to open it first and open the saved site folder.
 * Once i have opened the root folder i will have to create a new page by using the new document icon on the left of the bar at the top.
 * From there i will copy the table on the homepage and paste it on this page.
 * I will change the title to Security
 * Then i will visit dynamic drive and add the game i decided to add and the scroll down menus menu bar.
 * I will add the pictures i have to.
 * The only section left empty is the info.

Step 16= Content of Security page


 * I will open the site and root folder i had created.
 * I will view the security section
 * I will open Google chrome
 * I will open the investigation i had on my wiki spaces page.
 * On the how can you shop online page i will simply copy and paste the information i had got on security section

Step 17= Double check and make everything correct and talk about any modifications
 * I will open the website i have created in Microsoft expression web 4
 * I will open Google chrome
 * I will open my wiki spaces page
 * I will compare the create to the design and the plan.
 * I will talk about any modifications i have made from them on the wiki page

Step 18= Take surveys Step 19= Show answers to test surveys Step 20= Make table of specification and evaluate against and talk about improvements Step 21=Fill in unit table on wiki spaces = CREATE = What was changed in the plan and j ustifications: My judgment: I followed most of the steps and am proud of what i have done. What was changed in the design and justifications: = EVALUATE = The answers to the surveys: BENJAMIN MANIYOZO; HAMZA BHIMANI MAHESH PRASANTH MYSELF; What could i have improved on?
 * I will print out a table of my tests.
 * I will hand them to people to either tick or cross or yes or no
 * After everyone including me have taken the tests, i will scan them onto my flash drive
 * I will upload the results onto my wiki page
 * I will make a table of the specifications i had set.
 * Also i will have to comment on whether they are true or not.
 * Then evaluating from the specifications and test, i will write my final evaluation.
 * The evaluation will also include improvements that i can make
 * I will fill in the table template which is already on the wiki page
 * I will have to fill in the two sections of the grade i got and how i will improve
 * On the 21st and the 1st i could not work in school because they were holidays. I made up for the work at home and clearly stated where and that in the comments.
 * On the 19th, i needed to change and make pictures. I had to change them in Paint.net and then copy and paste it in the gimp so i could change the file extension. I discovered that i could speed up this process as i could just change the file extension on Paint.net. And i did this.
 * On the 21st i changed when i had to put in a nav. bar and a game from dynamic drive to put in simple interactive buttons.
 * On the 22nd i had time left which i spent on visiting dynamic drive and trying the codes again.
 * On the 23rd the job was done so i got ahead of time by doing the next step earlier.
 * On the 26th i lost my picture and created them again.
 * The nav bar was replaced by plain old interactive buttons which were put at the bottom of the page.
 * The game was taken out.
 * on the hacking page, i added a picture in the middle of the text. It was informative.
 * 1) Does it have enough information for 12 to 18 years old for their research projects? Yes
 * 2) Does it look the same in three different browsers? (Preferences are Chrome, Explorer and Opera) Yes
 * 3) Does each page have the same layout? Yes
 * 4) Are there 1 pages of shopping online, 1 pages on what shops need to offer this service, 1 pages about hacking and 1 pages about how to prevent hacking? Yes
 * 5) Do the pictures match the writing and info they are next to? Yes
 * 6) Are some of cells in the tables merged? Yes
 * 7) Does it have a homepage that summarizes everything? Yes
 * Adding more detail to the homepage
 * Adding more pictures
 * Enlarging the pictures i already have
 * I could decrease some info

ANALYSIS
I based the improvements that i could make in the create in my own tests on the results that i got from my friends. Of coarse i realized from their words a few things. When I had seen the create and matched it to the changes or improvements that my friends recommended, i figured out that what they said was true. Although all of them didn't say the same thing they gave me a fair bit to think upon. From Benjamin's test i found out that i needed to decrease the info. It was a bit to much to comprehend. It was a really good investigation and that is my excuse. But i should only add the important points. The next thing that i should have added was pictures. The pictures were limited. Also even with the pictures i already had, i should have enlarged them. These two points came from Mahesh's Test. There was another thing and this came from Hamza's test. The homepage should have summarized everything and it did but very briefly. Other than improvements every single person had said yes to all the tests making my create very good. That's why i think i did a really good job.

The specifications table:
 * **Specification** || **Brief Answer** || **Comment** ||
 * * Have a Homepage || Yes ||  ||
 * * 1 pages about what you need to shop online || Yes || There was so much information that i had it was hard to fit on just one page. ||
 * * 1 pages about what the shop needs to offer this service || Yes || " " ||
 * * 1 pages about hacker's methods || Yes || " " ||
 * * 1 pages about security measures || Yes || " " ||
 * * Have a consistent layout || Yes || My designs were good because they showed a constant layout. That made it easier. ||
 * * Appropriate use of pictures || Yes || On each page there is a picture which is related to the text. ||
 * * No copy and pasted information || N/A (PLAGIARIZED?) ||  ||
 * * Have tables with merged cells || Yes || My layout of the web page was made with a table so i had to merge the layers. ||
 * * All pages that adjust to the window size || Yes ||  ||
 * * Must function the same in three different browsers. || Yes || I even taught other people how to check this. ||

Overall evaluation: My product that i have made is very good to the specification standards. So i think it can be called a success. I have learnt a lot from this unit on web design. Maybe later i can learn how to use codes and complicated methods. I know that if i had a little bit more time i could have cracked the codes. Also i have learnt that the investigation is very very important. I was proud of the investigation i had done because it had a lot of info researched. This took a tremendous strain away from the create because all i had to do was copy plus paste it. Maybe next time in my investigation i could already pick out pictures i would use so the create really does become a piece of cake. When i did my test of my product and then compared it to the other tests my friends filled out; i can find some common improvements i need to work on. The first one was that the homepage should have more information as it was way smaller than the other pages. The next improvement would be to add more pictures because my website was a bit plain. Then, another improvement with the pictures is, i need to enlarge them. The last improvement i came up with is that i could decrease my info. I could add the most important points as one of my friends had thought that i went over board with the info.


 * ==Stage== || ==Grade== || ==Reason For Level .== || ==How to improve next time .== ||
 * ==INVESTIGATE== ||  ||   || As I am doing my investigation, i should put in citations. Not afterwards in a wild rush ||
 * ==**DESIGN**== ||  ||   || Draw one design in one day so i can do it nice and easily ||
 * ==**PLAN**== ||  ||   || Write what i have to do word for word and in suchdetail that it describes my life in the IT lab ||
 * ==**CREATE**== ||  ||   || Try harder to complete the plan and design ||
 * ==**EVALUATE**== ||  ||   || Create clearer and more professional tests ||
 * ==**ATTITUDES IN**==

**TECHNOLOGY**
||  ||   ||   ||