U4 Lesson 4

 Lesson 4

Its important that you properly design a sitemap, if you are asked to produce one


Notice:

  • The homepage is at the top
  • The lines indicate the links between each tab
  • The function to login/sign up
  • Tabs and sub-tabs 


Content Analysis

Mega City Comics - Home page


Mega City Comic’s main colours used in the home screen are blue and orange as these are also the colours used in their logo. However, due to the comic and manga covers, there are a much wider variety of colours used overall. Everything on the website is placed on a white background, with low opacity comic pages in the back to make sure the website isn’t too busy. 


The words on the screen differ in size and also font depending on what the text is supposed to be doing. On the top bar of the page, all the text is a basic font coloured white on a blue background to ensure people can read it. They are also all the same size because they’re all doing the same job, they’re headers/buttons that lead to other pages within the website. However as you scroll down the page, the text changes font and size. On the header banner, the text is much larger in order to let people know what the comic the image is from. Below the title, there is text which is much smaller and in a different colour giving words that can describe the comic being advertised. Lower down on screen, there are more sub heading buttons leading to other pages of the website overlayed onto different pictures from comics. These are also a simple font, coloured white on a blue background, and also one size as they’re not advertising a specific comic, instead they are simply telling people the page they lead to.


The images displayed on the home page are covers and artworks from the different comics and manga they sell. There is a header banner which acts as a slide show so it can advertise more than one comic at a time, then some of the subheading buttons are in front of artworks and covers from different comics that you could perhaps see on the page that the buttons take you too. Lastly, the background of the website are panels of different comics that have has the opacity lowered in order to blend more into the background and make the page less busy.


Their logo is in the top left hand of the screen, and is made bigger than all the other text on the page. This logo is pinned to each page so it can be used as a button to get back t the home screen.


Interactive features on the home screen include the slide show header banner which users can click through to see the different comics being advertised, as well as a search bar in which people can search up specific titles they’re interested in. And then there are multiple buttons in which users can click in order to be directed to the many different pages of the website.


Mega City Comics - Manga Page


The colours used in the Manga page of the website are similar, if not the same as the colours used in the home screen as it makes sure that users aren’t confused by the sudden change in aesthetics. And then again, whilst orange, blue and white are the main inputted colours of the page, there are other colours in the page due to the manga covers and artworks used. 


Just like the home page, the text on screen differs in size, font and colour depending on where it is, and its job on the page. The header of the page is in white infant of a black box in order to make it easier to read in a size that is notably larger than the rest of the test on screen. This is because as it's a header, its job is to tell the viewer what page their on. The rest of the text on the screen is a smaller size as they are subheading directing viewers to other pages. This text is black overlayed on a white background so it's easy to read. The text on the lower part of the screen is listed in alphabetical order with the titles of the different manga they sell, however the top displays titles that are perhaps more popular, so they’re put at the top so its able to be found easier.


The images displayed on this page of the website are once again similar to the home screen. For the header banner they have used an art work of a widely popular and well known manga. This header banner is quite colourful so its quite eye catching and will draw viewers in. The images on top of the subheading buttons are related to that of the mange title the button leads to. This is an effective design layout as someone may not know the name of the manga they’re looking for, so by having visuals it could help people find what they’re looking for. Then lastly, the background is constant throughout the website so the lowed opacity comic panels are also behind this page of the website.


As their logo is pinned to that spot of the website, the logo stays in a constant position throughout the pages of the website. Users can then click on the logo to be taken directly back to the original home page.


Interactive aspects of this page of the website are all the buttons on the top bar mentioned previously. This menu bar is pinned to the screen to its accessible on any page on the website. Another interactive feature is the hyperlinked socials of the company. They have 4 small buttons with the logo of the social media page it will take you to. Then lastly, the subheading text is also an interactive button as when you click it, it will take you to the corresponding page of the website.


Quick Brief


Moodboard 


Sitemap 


10 Key words to boost SEO

  1. Climate Change
  2. Wilderness
  3. Deforestation
  4. Orangutan
  5. Environment
  6. Rainforest restoration
  7. Restoration
  8. Charity
  9. Habitat
  10. Greta Thunberg


Revenue - How can I make money?

Money can be made by advertising other companies. But I need to make sure these companies are fighting for the cause that the website promotes, or are at least neutral to it.


  1. National Geographic - The National Geographic would be a great organisation to sponsor our website as they are very active in the field of trying to stop global warming, deforestation, and pollution.
  2. Ecosia - Ecosia is a search engine which plants trees for each search that is made through their search engine. By having Ecosia sponsor us, we will advertise their product on our website to an audience which will be very much interested in it, meaning they will get more customers and therefore plant more trees.
  3. Marks and Spencers - This brand has cut down on the amount of palm oil they use and have made sure that the palm oil they do use is sustainably sourced. Palm oil is a big factor of deforestation so sustainably sourcing palm oil will help in the long run.
  4. Iceland - Ice land have completely removed palm oil from all their own label products. After their Orangutang advert in 2018, Iceland pledged to cut palm oil from all their own label products.
  5. Google - Google is a carbon neutral company meaning they absorb the same amount of carbon dioxide they give out. This company is widely used throughout the target audience for this website so by having this carbon neural company sponsor our website, we will attract more of our target audience.


Legal and Ethical issues


Legal Issues

Ethical Issues

False Information - We need to make sure that our website isn’t going out false information about the topic we are trying to bring attention to. Such as false statistics and facts about deforestation and Orangutan.

Sensitive to local issues - We need to make sure that what were spreading information about is cautious of the feelings of other cultures and groups of people that may have something to do with the situation at hand.

Copyright - We need to make sure that were not putting any copyrighted content on our website that could get us into a lawsuit with the original creator of the content.

Diversity - When displaying groups of people on our website, we need to make sure that we represent diversity by including those of different races, and also body types in order to not make anyone feel left out.

Defaming Statements - We can’t make statements that will potentially defame the reputation the companies sponsoring us, or individuals. Defamation covers both Libel and Slander, so we need to be careful that were not ringing the reputation of other companies and individuals.

Inappropriate language/content - As our website will be able to be viewed by a variety of ages, we need to make sure that the language and content in the website is appropriate for all those age ranges. This means no profanities or any potential harmful images.


Final Website


Site Link: https://ellawise04.wixsite.com/my-site-1


Progress Pictures






Comments