jQuery in TED.com

I am a big fan of TED talks. I used to be a lesser fan of the website. But, quite recently, the website got a “makeover.” It used to have a collage of stills from talks. The collage consisted of large to small pictures. If you hovered over the large pictures, you could see the title of the talk. However, you could not do that for the smaller pictures in the collage, which was a little annoying. With the makeover, now the collage has large and medium pictures, which means you can see the title of the talk. It is a great improvement, in my opinion.

homepage

With jQuery, the website has done two great things for its homepage, which makes all the difference in how user-friendly the website is. First, it increased the sizes of the images in the talk-collage (as seen in the picture above). Second, it made a slideshow of sorts of all the recent talks, which you can scroll through with the handy-dandy right arrow button you see.

It’s a simple use of jQuery, but it made all the difference in the world. It is much more clean and fun to use.

Coldplay’s website

For this week’s blog, I focused on Coldplay’s (the band) website. The website provides a lot of information but does it without overwhelming the reader.

IMG_3150.PNG

The current theme of the website is Ghost Stories, which is their upcoming album. To that end, the colour scheme of the website is ethereal with the blue, black and touches of white.

The header of the page remains consistent, as does the font style. The only page that is different is the oracle page.

Another thing the site does well is a small text box they have on the right hand side of the news page. It shows all the different tags on the stories, so you can search for whatever topic interests you.

IMG_3151.PNG

The only page of the website that needs a little organising is the main archives page. The blogposts are titled with dates. The interviews are not grouped.

IMG_3152.PNG

For all the information on the website, it is designed quite well. The navigation is simple. It is easy to find your way around. On a scale of one to 10, I would give the site an 8.

Kolkata International Film Festival: The Website

Since our storyboard assignment was on a film festival, I decided to do a blog about a film festival as well. I chose the website of Kolkata International Film Festival (KIFF) because aesthetically, the website is well-designed, but it is not as good a website as it could be.

KIFF Homepage

On the face of it, there seems to be nothing the website does not have. On the left-hand side of every page, there is also a box of icons that connect to different social media websites and it shows only when you hover over it. I think that is a neat idea because it keeps things clean and simple.

The KIFF website has one major element working against it: it does not have any videosYouTube button on the website itself except for the one on the home page. For the curious person with enough patience, they will realise that you click on the YouTube buttom on the top right of the page, it will take you to the festival’s channel where there are more videos.

Under the categories tab, if you click on any of the categories, nothing happens. To see wSidebarhich movies are featured under each category, you have to do it from the side bar, also on every page (except the Categories page, obviously).

As mentioned before, the website has a good design but it takes patience to navigate through the website because it is not easy to find what you are looking for. Also, the website does not feature any trailers on the website neither does it have information on any upcoming festivals.

It seems to me as if they only have a website as a log or a diary of the festival. It does not function as a website for active festival-goers. One possible reason is that in newspaper readership in Kolkata (India) is high and many events prefer to advertise that way. It could also be because the organizers are not looking to cater to an audience that is very web-savvy, at least as far as information about the festival is concerned.

The Verge: CSS3 Coding

One of the websites I visit often is The Verge, a website catering (mostly) to technolo-geeks (much like Wired). However, I like the layout and design of the Verge better than I do Wired. One of the main reasons why is because of the color scheme going on for individual stories. VergeStoriesI hope that I will be able to use colors on my websites the way Verge does. So, hoping to learn, I took a look at their coding.

The first thing you notice: <div> tags EVERYWHERE!

DivTags

^This is just the coding for the section I mentioned above.

Most of the tags within the div are familiar, but not the class ids. One new tag I noticed in particular was <span>. This tag is used to give color to elements. Then, in your stylesheet, you use properties like box-shadow and gradient. It looks easy enough, but I have a feeling it will take me quite a lot of simpler website building to get to the level Verge is on.

Blog 2: Critiquing BuzzFeed!

Screen Shot 2014-09-12 at 12.08.48 AM

In my opinion, the BuzzFeed website follows Krugs’ criteria. Clear visual hierarchy. Check. Breaking page into defined areas. Check. Make clickable obvious. Check. Minimize noise. Check, check, check. Unlike Facebook, BuzzFeed does not auto start its videos, which gets it major brownie points in my books. But where the website loses out on is the how you have to scroll and scroll and scroll to get anywhere. The main page should follow the style of the category pages – go back in link-history page by page. It makes things more organized and the viewer is not stuck scrolling forever.

I really appreciate BuzzFeed’s categorical divide. From ‘LOL’ to ‘win’ to the white arrow of trending, the web designer made sure viewers got to where they wanted to quickly (unless the link they’re looking for is days old).

I also like how the little stickers on the top left corner of some stories takes you to more content of the same kind. It feels as if BuzzFeed just wants to help you continue procrastinating. Screen Shot 2014-09-12 at 12.19.14 AM

 

Having said that though, I think BuzzFeed should start organize its main feed better. For example, the stories that are dropped in between by promoters should get their own column (or page). I also think #TBT should be a tag of its own. After, there is one posted under that topic so often, you’d think they would have run out of features. However, this is just nit-picking.

I really think, overall, BuzzFeed has a site that makes losing track of time seem like no big deal.

 

The Other 9/11 by SBS

Other9:11

 

In many parts of the world, 9/11 is synonymous with the collapse of the Twin Towers. In other parts, the day holds no special historical significance. In Chile, it was the day democracy died. The story, put together by the SBS team (Australia), combines audio, video, text and images in such a way that each element complements the other. 

Starting with a dark image background with the gist of the story juxtaposed, you scroll down to begin the narrative. Starting with the suicide of then-president Salvador Allende, the first chapter tells the story of CIA’s involvement in what followed after. In addition to a gallery of images containing declassified CIA documents, the first chapter also includes a speech by President Allende that he gave the day of the coup in 1973. The placement of the video and gallery, in my opinion, is what helps the flow of the story. It breaks it up so that there is not a huge chunk of text for the reader to consume. The video creates a natural transition point within the first chapter. 

The second chapter follows a similar format in elemental placement. Text, gallery of images and video: all placed in a sequence that provides flow while simultaneously breaking the monotony of a (relatively) long page of text. 

The third and fourth chapters are individual accounts of Chileans who lived in Australia (at the time of the story being published). The text is accompanied by a couple of images that give the text pieces a little extra personality. 

Overall, the story did not utilize multimedia as much as it could have. I liked this piece because it neatly balanced the few visuals it had with its sizable amount of text, breaking it up in such a way that it did not feel like a long-read. However, instead of telling the individual stories primarily through text, I think the authors should have used audio slideshows.