Portfolio

Monday, August 18, 2014

Waybackmachine-3 websites' before and after

BEFORE AND AFTER


The old Deviant-art Website





The previous Deviant-art website had little to know contrast, with very dark green as their main color. The only different colors used were a lighter shade for highlighting titles, and the change of green for the link icon. The usability is still good to use, very current to now, with searches.







The current 2014 Deviant-art Website

The new Deviant art website contains a much contrast that is appealing to look at. The graphics are displayed first hand, and the pops of color stand out apart from the background, images, and titles. The usability is easier to use because it is less cluttered with wording and organzied well. The layout is also better without list, instead the graphics are the main attraction.

Previous Coding for Deviant Art
The coding in comparison has more color css, along with divs, although both still contain tables. The coding goes further in depth, even simplified, and changes the colors of borders, text, highlights, and divs. The new site also adds the graphics in new in the coding. You have different font-weight, and alignment.
Current 2014 coding for Deviant Art

The design layout is much different with the color scheme and layout principles. Both still contain graphics, however you can see the logo changes with the wiki checkmark to a nice clean cut layout tiny by the search, with the graphics now the main attention spot. The  green in the new layout makes a great contrast, along with the bigger graphic images and less words.  The tabs are now icons and do not look like "actual tabs" like before...





The old Wiki how coding


the new coding for wiki how



 The differences I mainly notice in the coding is the use of tables vs. divs. The divs have their own class and image, with titles as the other coding has tables with things separated into rows. There is also id's and style sheets now, opposed to the tables with more padding and longer codes. The new html is simpler, looks more organized and controlled. They also plugged in background images with html, not a plain color without texture that set each individual with their own unique coding...
The previous ebay
the current eBay




Some of the main differences I notice for ebay is the logo. The logo is now toned down, same in color, but less transparent, while not overlapping. The links are also not blue and underlined anymore, as well as the tabs for different pages. The newer site has more graphics, and keep the layout with two columns. They're is also an additional and available pull down menu.



























the previous ebay coding.    
























The 2014 ebay coding
The new html for eBay is a lot more in depth. There is now more available items and detailing than before, along with divs, classes, and more link references.Previously the coding contained links with strong text, and less font styling. Now there is a description, along with a common size for all, not one by one, as you see they wrote size= "1" for all of them! Now they sorted the coding into titles with the product, the link, the user. so on.  The other one also uses multiple table coding, for 3 different sections, as the new one has divs separated into two main sections on the current page.

What is the purpose of the Wayback Machine and the Internet Archive in general?

The purpose of the Wayback Machine is to show the changes in the design and html to understand the uses of basic principles of design and easier ways to code. The sites allow you to see how far a website has come in terms of these two elements, but also learn from them to see what to do and not to do.

What are they archiving, in addition to websites? 
They are also archiving coding from the html, and ads.

Anything interesting about the Internet Archive ?

Yes. They also have available free ebooks, videos, text. Also they offer you to put your own snapshot of a website you find on their site!

No comments:

Post a Comment