production diary 7

I have fully completed my website and I am happy with my final outcome. Throughout this unit I have learned a lot of skills that will help me with later units and later in life, such as skills which involve programmes like adobe Photoshop and adobe Dreamweaver. Also i have learned how to link relevant information together to create a convincing website. I believe it is to industry standard. I have carefully gone through the stages of alpha testing: checking my links, spelling and grammar. I have also gone into the stages of beta testing: where someone else has checked through my my website, leaving comments and I have checked through other peoples websites, leaving them comments to help them to perfect their websites. Liam checked through the spelling and grammar of my website and to his knowledge there were spelling or grammar mistakes, this made me feel confident about my website and I am very pleased with this result. The next steps I will take with my website are to validate it with the W3C and to write a reflective report on my journey of creating this website and completing this unit. The deadline for this unit is 16.05.11.

Production diary 6

Throughout this unit I have attended numerous PowerPoint presentations, these presentations have helped to give me an extensive knowledge on authoring formats, how to use relevant software and different companies/ organisations which influence the content available to us on the World Wide Web. I have also given a substantial contribution to a few discussions on these subjects.
I have reached the point now where I am pleased with my website and believe that i have created a media-rich website, I have also carefully proofread my website for any spelling/grammar mistakes. I have also thoroughly tested all links, hyperlinks and videos on my website to ensure an industry standard all way through my website.

Production diary 5

I have been learning how to put all of my Photoshop content into Dreamweaver. First of all it is important to create a site map on Dreamweaver; this is where all content will be stored. It is then important to ensure that all of the images are saved for web devices, using web colours. To begin with i created a frame which i used for all pages on my website; this frame contained my website title, a navigation bar and footer. The title and navbar where simple to insert, I simply click file>insert>image. However for my navbar i had to split it up into five buttons, I also had to create alternate images which would appear for each button for when a cursor is hovered above them, this is called a rollover button. For my rollover buttons i added a bullet hole on top of them. to create a rollover image you select insert>image objects> rollover image, you then select the original image, the rollover image and the URL which the button will link you to.

Production diary 4

Today I have learned how to create a form for my website. A form is used to create fields which can be filled in by someone visiting a site, for example a comment box would be a form. A form is created by selecting form from the insert menu; you then insert a nested table (making sure the width is set to 100%). There are a few different types of form which can be added, such as a comment box, a text field, a tick box or a button. I have used a form on my website to create a sign up page, with an option of submitting feedback and singing up to a newsletter.
I have also learned how to create an anchor. An anchor is used to easily return to the top of a page after scrolling through a lot of information, an anchor is created simply by writing in some text, creating an anchor at the top of the page, and then making the text into a link by selecting the anchor.

Production Diary 3

Recently I have been using Adobe Photoshop CS5 to create components I will be using in my website. Initially i created my own header, footer and navbar using a strict colour scheme. I have created all of these parts using a width of 960 pixels, I have done this because that is the width used online for all websites, if my website was any wider than this i would have to use a side scroll bar along the bottom, this would make my side harder to read and much less organised. Over review week I have been working on my character profile page, which is now completed. On this page I have included thumbnails for 10 actors; I have put a stroke over these images to make them more fluent with my design. These thumbnails will be active links to other pages, which include further information on the actors.

Production Diary 2

Over the past week I have learned about what HTML, XHTML, CSS and other things used in web authoring and written a report on them. I have also learned about web 2.0 and the W3C and their roles in the World Wide Web today. I also have learned how to use the programme Adobe Dreamweaver CS5, and how to create different features which go into the production of a good website. I have learned how to create website using either the design view or in HTML view, however I have decided that I am going to use the design view as I find it to be a much more effective method of creating a website.

Production Diary

Over the past few weeks I have learned a lot about what goes into the creation of a good web site, I have analyzed a very popular website and I learned a lot from doing that. I believe that I have a good enough knowledge of the subject to begin to create my own website. So far I have thought of five different ideas for websites. I then cut that down to the idea that I found to be the best. MachoMen films is the name of my web idea, this website will be an actor profiling and film review website, I have thought deeply into the construction and creation of my website and I am now confident with my ideas. I have done a SWOT analysis of my idea; I also received good feedback and some useful tips and new ideas to include on my site.

Legal & Ethical constraints for Web Use

When creating and publishing a website there are important legal and ethical issues to take into consideration. It is vital that offending or insulting any person is avoided. In this report I aim to explain and address these problems.

Web accessibilityThis is a process which aims to make websites more accessible for people with disabilities. It means that people with disabilities can access a website and fully understand, navigate and interact with the website or software. Disabilities effecting web use include: visual, auditory, physical, speech, cognitive and neurological problems. Web accessibility does not only help people with disabilities, It can also benefit people who suffer from age related problems and people with temporary problems such as broken bones.
In the modern day most websites have elements which make it very difficult for people with disabilities to access or contribute to the website; however there are many possible methods of combating these problems. Aids can be given to people which specifically negate these problems, these aids can be software or hardware aids. Special options can be easily added to the website to make it more disabled-friendly, such as options to change the colour scheme to make partially sighted or colour-blind visitors more equipped to understand the website fully.
An example of this is: an aged user visiting a website could find the text to be too small for him to read, and some pop ups/adverts could lead to distraction. To rectify these problems a magnification tool could be added to make the font a larger size, a pop-up blocker could also be added, or simply reducing the amount of pop-ups would make an aged user feel much more comfortable.

Disability Discrimination ActThe Disability Discrimination Act is a law which aims to give equal opportunities to the disabled; this means that regardless of disability people should have a right to jobs, education and entry to certain places. (Basically every opportunity that is given to everyone else.) This law also states that people should not be directly discriminated against or become the subject of prejudice or harassment purely because of their disability. This law coincides with other discrimination acts.
An example of this law being ignored would be a woman applies for a job over the phone and explains her qualifications ect, and on this basis she is accepted for the job. However when she arrives at her new job her boss realised that she is wheel-chair bound, she is then fired instantly from her job because of her disability.
Data protection actThe data protection aims to create rights for those who have their data stored through the Internet. This act assures that all personal information which is held by websites is kept well protected and is not shared or accessed by any others. It prevents unauthorised access to private information. The act is in place because of the serious problems that can occur from the lack of data protection. If someone’s credit card details where shared for example, it would be easy for anyone to simply access this information and use their details.
An example of failure of data protection would be if a memory stick was ‘lost’ with a lot of peoples’ council tax information held on it. This information would contain peoples’ names, addresses and accounts information, if this memory stick found its way into the hands of the wrong kind of people this could create an extremely large problem for a lot of people.

Computer Misuse ActThe Computer Misuse Act 1990 is an Act of the UK Parliament, introduced to negate the misuse of computers.
The computer misuse act aims to prevent the use of computers in a negative way. It tackles problems such as people who take advantage of some aspects of the internet, such as hackers. Hackers use the internet to gain access to information which they do not have the permission to, and then often use it for their own personal gain. Viruses are also a big problem when it comes to the misuse of computers; a virus is a harmful file which is created to cause problems for computers or networks of computers. Misusing a computer can also mean viewing obscene or offensive files or websites.
In education/employment this act is usually visible in the form of an agreement which is signed to say that it is understood. This agreement means that you have said you will not use the computers or your time on the computers to view illegal or offensive material.
An example of misusing a computer would be the media using hackers to access personal e-mails from a celebrity to then sell or publish, making money.

Obscene Publications ActThis act prevents the publication of extreme explicit material on the internet. It is thanks to this act that we have censorship on the internet; this can mean anything from blurring/blacking out certain points on a graphic/video to the complete removal of a publication. This act defends viewers from sensitive and delicate subjects. Originally the act was put in place to protect people from seeing these images that they do not want to see, however the act also protects the people who could potentially be involved in these publications. This material is usually explicit or pornographic, (the extremes of pornography.) Obscene publications can also include violent or gory images in a realistic or graphic way.
A good example of the obscene publication act would be: a young boy posts a video of him and his friends having a fight on a video website like YouTube. The video contains real, violent scenes and some bloodshed. The video is then checked by administrators of the site or another member of the site, the video is removed and the police informed.  It is the duty of regulators of the site to remove Obscene publications and failure to do this can lead to various sanctions.

Website principles and protocols analysis

I have chosen to evaluate www.play.com the name of the company is registered as play.com, not just play. This shows that the business is purely online. I chose this website because I use it often and I am very familiar with it, Play.com started off as being simply for games and music, but due to its vast popularity it  has widened its store and now sells just about anything. (see website home page below)

Audience:The target audience for this website is mainly a male audience, it particularly attracts geeks/gamers. The socio economic group for this website is D-B, because I think that gamers are usually students, or low levelled workers with a relatively small amount of disposable income, you can tell that it aims towards a lesser-earning audience because of the big offer banner that is always featured on the home page featuring a low price offer. The domain name and the company are the same, and it is a simple one word address, the URL is Play.com, this name is concise and fun, the name connotes gaming and music in the way that you play a video game or listen to music. The name is extremely relevant to the content. The colours of this website are simple and neutral; this is to attract a wide and varied audience. Terminology used is also simple, but can be quite slang in places, for example ‘Knockout deals,’ the typography is sans, serif and usually all in capitals, this makes it easier to read and the capitals bring the text out of the colour.

ContentThe content of the website features mainly small graphics, this is done to advertise many products at once without being too over-powering, the graphics are much bigger than the text, I think they have done this because the audience can tell a product simply by seeing a photograph of it and pictures sell better than words. The main feature of the website is the big sale banner. The sale banner usually varies weekly with different opportunities featured, the banner is an animation which uses a transition to change between several offers, the transition used is a fade in/fade out. Fade-ins are one of the best transitions because it softly edits between two images. The banner is a hyperlink to another page; this means that if you click on the offer banner then it directs you to a page with all of the sale items on it that you have selected. Play.com uses a variety of different buttons which are located at the top of the website, it is important that the buttons are at the top of the page because the layout is consistent, the logo is also located at the top of the page next to the buttons, this is because the eyes are naturally drawn to the top left of any webpage.

All off the buttons on the top navigation bar are rollover buttons, this means that when you hover the cursor over them they change in some way, in this case as you can see in the picture above a drop-down menu appears with specific options to select from the chose category. Another good use of navigation from this site is the search bar, the search bar also features a drop-down menu, and this is used to define your search more accurately. Choices include: games, music, clothing ect.

Semiotics and visual cuesSemiotics are graphics which prompt the viewer to do or think something, the logo for the website itself uses semiotics. The symbol is a play sign, used on DVD players and other modern appliances; this is a powerful logo because it is a visual cue because it is telling us to ‘go’ or to ‘play’. The website is also a dark colour on a light background, using capital letters, this is captures the viewers attention using a recognisable logo in an aesthetically pleasing way. The colour theory used on this website is calming colours, which do not strain the eye if viewed for a prolonged period of time. This website does not use any sounds at all, this shows a more professional approach, because not many people want to be disturbed or even annoyed by sounds on a website.

From the picture above we can see some visual prompts which are located in the top-right corner of the page. The shopping cart image is one of the most commonly used semiotics in online shopping. The symbol represents an actual shopping kart, which is used in a similar way to the virtual kind, to hold items. Another example of semiotics is the flags which are displayed above the basket; these flags represent the currencies which the website accepts.

Form (layout)This website uses space very effectively, there is not much white space and a good balance of pictures and text. I think there is a good balance between the pictures and text  because there is roughly the same amount of space dedicated to each as the large pictures also contain some text. The website is very simple and easy to understand, it is suitable for ever audience. A good example of well used spacing is the location of the contact and legal information (see picture below).

This information is at the very bottom of the page, it has been placed here because it is not really what a visitor wants to see, and even though it is important information which is easily located it is not taking away any room for advertising or more relevant information. The main colours used for this website are orange and blue, I think these colours represent a playful element but the shades of the colours also give the website a more professional feel.

Navigation and usabilityThis website uses an extremely simple but effective navigation bar and buttons. In all the time I have been using this website I have not encountered any broken hyperlinks, for example I have never receive a ‘404 file not found’ at any point on this website. The general rule for web navigation is to be able to find what you are looking for in less than three clicks, I think that play.com definitely has this element of usability, as if you use the search bar you can find what you are looking for in 1 or two clicks every time, if I was looking for halo reach for xbox 360 I would have to follow the steps below:

As you can see this is using less than three clicks. The navigation bar is also well thought out because as you can see in the picture above it also recommends things to you, so if you can only remember one word in the title of a game you could easily locate it using the suggestion drop-down menu.

LimitationsA big problem that some websites encounter is file size and download speed, if too many high resolution graphics are used on one page this can vastly slow down the download speed of the internet. When creating a website it is important to consider the internet speed of your target audience. Although play.com uses heavy imagery, the resolutions of these images are carefully chosen, they are all small-sized files to make for a quick and easy experience for users of the website.

From the image above you can see that the resolution 117x178, which is only 6026 bytes, this is an extremely small image, however it is still easily understandable and eligible. The content on play.com follows legal and ethical constraints, I do not believe it has any potentially offensive material, on the other-hand it does sell some potentially offensive products like controversial games/films, but this is not directly the responsibility of the supplier, it is the responsibility of the manufacturers.

    ▲
 ▲ ▲