Top Banner
Site Analysis kompas.com and nytimes.com 1. Adriani Yulida Kusuma 2. Ryan Permadi 3. Yohanes Mardi Dewandaru
15

Site Analysis (2) · site is not automatic suitable with the monitor resolution. So, if the monitor resolution is bigger than the width of this site, then the left and right of this

Aug 20, 2020

Download

Documents

dariahiddleston
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: Site Analysis (2) · site is not automatic suitable with the monitor resolution. So, if the monitor resolution is bigger than the width of this site, then the left and right of this

Site Analysiskompas.com and nytimes.com

1. Adriani Yulida Kusuma

2. Ryan Permadi

3. Yohanes Mardi Dewandaru

Page 2: Site Analysis (2) · site is not automatic suitable with the monitor resolution. So, if the monitor resolution is bigger than the width of this site, then the left and right of this

Site View

Page 3: Site Analysis (2) · site is not automatic suitable with the monitor resolution. So, if the monitor resolution is bigger than the width of this site, then the left and right of this

Site View

Page 4: Site Analysis (2) · site is not automatic suitable with the monitor resolution. So, if the monitor resolution is bigger than the width of this site, then the left and right of this

Object Analysis

• Consistency

• Clarity

• Fonts

• Coding Technique

• Alignment• Alignment

• Metaphor

• Proximity

• Contrast

• Economy of Visual Element

• Color

• Typography

Page 5: Site Analysis (2) · site is not automatic suitable with the monitor resolution. So, if the monitor resolution is bigger than the width of this site, then the left and right of this

Consistency• New York Times

– The background color on the homepage or the other page is white.

– Font style is Heading 1 with the same size and type.

– The news title has same color. The color is blue.

– But, there is inconsistency. The inconsistency is on the site layout. The homepage

layout uses 4 columns layout, but when you read the article/news, the layout use 2layout uses 4 columns layout, but when you read the article/news, the layout use 2

columns layout.

• Kompas

– The background color for homepage is grey, but on the other page use various

background.

– For the homepage layout, this site uses 3 columns layout, but when read the article,

this site uses 2 columns layout.

– So, this site has many things that is inconsistence

Page 6: Site Analysis (2) · site is not automatic suitable with the monitor resolution. So, if the monitor resolution is bigger than the width of this site, then the left and right of this

Clarity• New York Times

– This site is unsightly to see.

– This site has one weakness. The weakness is the width of this site. The width of this

site is not automatic suitable with the monitor resolution. So, if the monitor

resolution is bigger than the width of this site, then the left and right of this site will

perform white background. It is very blinding for the eyes.

• Kompas

– This site is enjoyable when we read the article, but the homepage isn’t enjoyable as

well because there is so many advertisement.

– This site also has fixed size of site. The background on the left side and right side

that perform is grey, so this site still enjoyable to look.

Page 7: Site Analysis (2) · site is not automatic suitable with the monitor resolution. So, if the monitor resolution is bigger than the width of this site, then the left and right of this

Fonts

• New York Times

– The fonts that used for the content and the title is Times New Roman.

– The fonts that used for the title of the newspaper maybe use fonts that they create.

• Kompas

– The fonts that used is Calibri.

– The font color is suitable with the background color.– The font color is suitable with the background color.

Page 8: Site Analysis (2) · site is not automatic suitable with the monitor resolution. So, if the monitor resolution is bigger than the width of this site, then the left and right of this

Coding Technique

• New York Times

– This site doesn’t have many coding.

– This site only shows more information.

– But, there is very interest section. This section record the opinion of reader. If the

reader wants to give the opinion, the reader must login into this site before.

• Kompas• Kompas

– This site has many coding. The coding is used for showing the advertisement.

– There is a section that good and unique. That section is the advertisement with

news.

– The other section is headlines slide that include new news

Page 9: Site Analysis (2) · site is not automatic suitable with the monitor resolution. So, if the monitor resolution is bigger than the width of this site, then the left and right of this

Alignment

• New York Times

– This site uses left alignment for the content and center alignment for the

title.

– This site uses grid to divide news based on the category.

• Kompas• Kompas

– This site uses left alignment for all. The text starts on left side to right

side.

– This site uses grid to divide news based on the category.

Page 10: Site Analysis (2) · site is not automatic suitable with the monitor resolution. So, if the monitor resolution is bigger than the width of this site, then the left and right of this

Metaphor

• New York Times

– This site is made like an original newspaper.

• Kompas

– This site isn’t made like an original newspaper, just like a common

webpage.webpage.

Page 11: Site Analysis (2) · site is not automatic suitable with the monitor resolution. So, if the monitor resolution is bigger than the width of this site, then the left and right of this

Proximity

• New York Times

– This site divides the news by the topic, so the reader can find the

information easily.

• Kompas

– This site also divides their news by the topic. It make user easily find the– This site also divides their news by the topic. It make user easily find the

information that they need.

Page 12: Site Analysis (2) · site is not automatic suitable with the monitor resolution. So, if the monitor resolution is bigger than the width of this site, then the left and right of this

Contrast

• New York Times

– The contrast looks clear

– The text that connected with the other page has different color.

• Kompas

– The contrast looks clear– The contrast looks clear

– The text that connected with the other page has different color.

Page 13: Site Analysis (2) · site is not automatic suitable with the monitor resolution. So, if the monitor resolution is bigger than the width of this site, then the left and right of this

Economy of Visual Element

• New York Times

– This site doesn’t show many visual information, so the bandwith doesn’t

reduce.

• Kompas

– This site show many visual information such as advertisement, so the– This site show many visual information such as advertisement, so the

bandwith will be reduce, and need very long time to load the web.

Page 14: Site Analysis (2) · site is not automatic suitable with the monitor resolution. So, if the monitor resolution is bigger than the width of this site, then the left and right of this

Color• New York Times

– This site doesn’t use many color.

– For the text, this site use black or blue color.

– For the background, this site use white color.

• Kompas• Kompas

– This site uses many color.

– The various color is from advertisement.

– The text only uses black or blue color.

– The background is grey color and white color.

Page 15: Site Analysis (2) · site is not automatic suitable with the monitor resolution. So, if the monitor resolution is bigger than the width of this site, then the left and right of this

Typography

• New York Times

– All of this site is readability.

– The text content of this site doesn’t have all uppercase font.

• Kompas• Kompas

– All of this site is readability.

– The text content of this site doesn’t have all uppercase font.