Introduction My related study will be analysing past, present and futurevariations of website design, and how they have changed and developed, inresponse to different trends and the needs of mankind. I will be looking at thefunction of the pages, the aesthetics, and the vectors and artwork used on allgenerations of websites. I will also be assessing the differences between thegenerations, and how the websites developed over time. The question I will beasking is whether websites are becoming more interactive, with more websiteschallenging the barrier between virtual and reality. In terms of artists I willbe discussing, first of all I will be researching Tim Burners-Lee, the creatorof the internet, and the first ever website ever created. Tim Berners-Leecreated the first ever website in 1990, but it was only accessible for nuclearresearchers.
I will be researching Tim Berners-Lee to find out what websitedesign was in the early stages of development, as well as getting a control, tobase other website designs off of. Afterwards,I will be analysing modern techniques used on websites, and for this section,Webtex will be examined, of which is a website design company, that started upin 2013. I will be depicting this website, as well as the various websitesWebtex has created.
I will be investigating the designs, to assess the current trends,and explain how websites have evolved since the work of Tim Berners-Lee.Finally, I will be exploring the work of Universal Everything, an art company,who have started to challenge the link between the real world and virtualreality. They are developing new experiences that heavily involve interaction,of which is a common feature you can prominently see throughout the evolutionof websites. Universal Everything has created exhibitions, displays and appsfor mobiles, with websites and technology being their centre of creativity. UniversalEverything was started off by Matt Pyke in 2004.
I will be reviewing all of thedifferent aspects of the various websites and creations, and then will be comparingthem to each other, to the extent of how they have developed, and what haschanged in website design, and if the websites have become more interactive andresponsive.The start of website design- Tim Berners-LeeThe first piece of work I will beanalysing is Tim Berners-Lee’s first ever creation of a website. The websitethat he created was for the use of nuclear researchers, and he created thiswebsite in 1990. Tim Berners-Lee’s inspiration for creating the internet, wasto be able to gain information about everything, from one location. The websitecreated by Tim Berners-Lee is very basic, not looking too dissimilar to a worddocument, the website only consisted of black body, upon a white background,with the exception of blue hyperlinks, to other websites. This website was themost basic a page could get. But for Burners-Lee’s original intention ofresearch and testing the use of websites, design, aesthetics and layoutprobably was not the most important aspect. Figure 1- Berners-Lee’s first website,1990 The use of black text upon a white background makes for good legibility,and the main use of this website, was to share information with nuclearresearchers, and so this would have been the most important factor.
Blackletter, Roman Serif and San Serif were the first typefaces used on computers,and therefore websites. Tim Berners-Lee seems to have used Roman Serif for thefirst website, although I cannot find any confirmation. The use of a largerheader allows for the reader to know the title of the website, or for importantinformation to be seen. The use of the same font allows for continuity throughthe page, and tells readers that the article or information keeps on going. Theunderlining and blue colouring of hyperlinks on the page allow for an obviouschange in use for that word or phrase. At the time, hyperlinks would not havebeen a well-known feature of websites, and so making them different to ordinarytext allows for this differentiation to be made, that the text will take you ontop a different website. The original state of the link for the hyperlinks isblue, but after clicked, the state of the link turns purple coloured. This isto tell the user that this link has been used, and the state of the link is nowa visited link.
This is just so users can visit all pages, without seeingduplicates, or if users accidently clicked off of a page. The layout of thepage is very basic, with text too close together for my own liking, as theclose text makes it hard to clearly distinguish where new pages or informationare talked about. The layout of the website is reminiscentto a context page in a book, and this makes sense for many reasons. First ofall, there is no previous website layout to take inspiration from, as this wasthe first ever website, and also, because it is the first page, Tim Berners-Leewanted to showcase what the intention for what the internet was, to give theaudience information.The infrequent use of the same principles in terms of pageline starting also affects the legibility. Flush left rugged right is usedthroughout, but the strange spacing after a header doesn’t fit in with the restof the page.
Berners-Lee most likely used this spacing to mimic the writingtechnique of adding spacing after addressing someone, or for a new paragraph ortopic of interest. But because of the lack of spacing, making it looked clumpedup, this technique isn’t needed.Although the website is a very basic piece ofgraphic design and coding, with a lot of issues, the importance of thiscreation is huge. The creation of websites, along with the coding behind it,created the platform for many artists and graphic designers, to generatebillions of graphics, art pieces, websites, and much more, in the very nearfuture, due to ever improving technology. This was the start of the history ofwebsite design, and it started to layout the design trends, as well as TimBerners-Lee creating the technology, for better graphic design tools, forwebsite creation.
Modern WebsiteDesign- WebtexThe next work analyse will be on Webtex, a web design company, that havecreated over 90 websites. I am looking at Webtex, a web designcompany that creates websites and other online designs. The websites range fromconstruction, to backpacking, to studio lighting. The portfolio created byWebtex shows just a glimpse of the many various website designs that modernwebsites use in some form.
I will be analysing various web pages they havecreated, from various websites they have created, but also from their ownwebsite. I will be analysing the key general terms that most modern websitesfollow, and why they are effective, and how they have evolved, and will carryon to evolve. First of all, we have large typography being a key trend inmodern website design. An obvious header on the page, so that audiences knowthe purpose of the website, as well as starting of a new topic on a website, ora linked page. This has evolved from typography on old websites being the samefont as the body, just a bit larger. Webtex have used large typography on thewebpage ‘Zouille entertainment’, where a large green header is used.
I thinkthis is a vital component Figure 2- Zouille entertainment website header of a website, for legibility, as wellas ease of use for the user. In future web designs, I think a lot of headersand typography could be animated, and transitions will be more common. Next up,is the use of authentic photography in website designs. White is a verypopular, professional choice for website backgrounds, and they have been sincethe beginning of website design, but recently, photography has started to takeover, with a mixed use of plain backgrounds and photography making the pagefeel authentic and down to earth, but the mix of plain backgrounds gives forbetter legibility for body, as well as giving the websites better composuresand layouts. Webtex have used photography as aspects in all of the websitesthey have created. On their own website, the home page has a background ofphotography, constantly being cycled on a loop.
The photography tells usersthat the company is created for real life situations, and takes the emphasisoff of the world wide web, and more onto websites used for real life companies.Imagery if also main component of modern websites, with short and sweetinjections of body, to get points across, but imagery used as breaks for users,so they do not get bored or tired. Imagery wasn’t used often in older websites,and when they were, it wasn’t as a background, it was more of a simple image,relating to the body. I think in future website designs, imagery will becombined with functions, even more then they are today. Animations and videowill be a more common use of imagery.
As well as user variant imagery, and useradapting imagery. Customisationof website imagery will most likely be a future element of website design. Figure 3- Zouille entertainment page layout Another major component of modernwebsite design, and a line that future website design will likely develop isthe functions, transitions, and movement of website pages. This is calledresponsive design, and includes moving text after scrolling, transitioning to imageryand new parts of a website, animations and videos, and user-friendly buttonsand these contraptions have recently had a huge surge of popularity.
On the Webtexhome page, most of the examples of responsive design are on showcase. To startoff with, the home page background circulates through 4 images. All imagescontain links to different articles on the website. I included a scrolled imagebox, containing links to different web pages in my personal investigation.
Ithink that these animated devices on the website make the page feel alive, aswell as giving the page a fresh feel. The changing images also holds theattention of the users, as the content changes after every 10 seconds or so.Other animations and interactive designs include different link states, ofwhich has evolved from a similar idea from Berners-Lee’s first ever website.The links on a page, such as the top of the Webtex website, has direct links todifferent articles and pages, and the various states of the links change,depending on the user’s interaction with them. The Webtex links turn red slowlywhen on the hover state, and turn red on the activated state, after you clickthe link. These are the basic examples of animations for websites, andresponsive design. Responsive design has quickly gained in popularity, and isalmost a necessity in modern websites, because without them, websites seem verydated, and boring to use. Other examples of responsive, animation designinclude moving data charts, graphs or other data layouts, delayed scroll pages,to make the website look as if it has more depth, and to make the page feelmore 3D.
Webtex has examples of both of these. Aesthetics are the main use ofinteractive, responsive animation, but function, and new possibilities can alsobe the design behind it, and these designs have definitely improved websites,and will carry on to have more of an impact on websites, as technologydevelops, and these functions can evolve to become even more responsive. Mostof the designs of modern websites have been used because they look moreprofessional, and advanced, as well as giving a better performed function forwebsites and making the user remain interested. Coding can limit a websitescreativity, but with website design now being performed for over 20 years,there are a lot of great coders for websites to hire.
Webtex have tried toinclude a little bit of all website functions onto their website, as a tasterto potential customers, to show the customers what Webtex can produce. Thisranges from animation designs, responsive designs, imagery, photography,graphs, and much more. Creating what the customer wants to see, as well ashaving easy to read legibility, and perfect graphics is what Webtex would haveprioritised, to showcase their skills, and the attract customers. Web designcompanies are very important in the evolution of websites, as it gives thechance to small businesses to advertise their work online, and the morewebsites online with great functioning and aesthetics, the more future websitedesigners will be inspired, and therefore carrying on the website revolution.Thereare a few differences I would have made to the Webtex website, as well as designtrends they didn’t follow, that other websites have made clearer.
First of all,Webtex doesn’t have a very clear colour scheme, of which isn’t a compulsoryfeature, but it does help users know that they are still on the same page, andit gives continuity from page to page, as well as giving the company anidentity. Webtex also only has a logo type, and not a logo design. This also,isn’t compulsory, but would give an added identity to the website. Apart fromthe different topics not having much space between each other, cramping thepage a little bit, there are not too many differences I would have made to thepage, to perhaps improve the design.
Overall, I think that examples such asWebtex will become a staple for website design, with function, aesthetics andanimations required to attract the younger audiences, as well as improving theexisting customers user experience on the website. Possible futurewebsite design, and innovative ideas- Universal EverythingMy final analysis for website designis based on my thoughts on the future of website designs. I believe that theevolution of websites has shown trends that lead to the development of theinteractive and responsive elements of websites. For this analysis, I will belooking at universal everything. Universal everything is a design company ledby Matt Pyke, and have recently started to implement technology into theircreations, as well as websites, apps and artificial intelligence. The 2 piecesof work from universal everything I will be reviewing are 1000 hands andPolyfauna. 1000 hands is one of the newest interactive experience created byuniversal everything. it is located in the science museum in London, with theaim for the public to add to the work with their own creations, to create anevolving piece of art.
The audience downloads an app, and can create linedrawings, the computer AI takes the image and animates them, with specificlines, shapes and patterns creating different effects, movement and colours.This exhibition is a start for interactive design. I think that the use ofapps, and the public’s imagination and creation is a very ingenious idea, withthe interaction and responsive aspect of the exhibition being the mostinteresting. With interactive animation being a huge hit for website design,the most logical prediction would be that these elements of websites wouldcarry on to be upgraded. The interactive element of the exhibition is veryunique, and if it was combined with the sheer scale of the internet, on thecorrect website, amazing things could be created, as well as improving the userexperience of websites.
Universal everything is a UK based graphic designcompany, who created the 1000 hands exhibition, in order to carry onresearching abstraction, synaesthesia and the essence of human form, and theway it acts differently from person to person. This combined with computerartificial intelligence has created something very special, and something thatI think could, and might be used in future website designs. Using theinformation and creativity from the customers of businesses could first of all,give the websites up to date data and statistics, to improve the userexperience, and also the art and imagery aspect of 1000 hands could bereplicated in many different ways, if websites were more interactive, it couldincrease speed of use of websites, as well as attracting more users, andkeeping more users interested. Responsive designs on websites are foreverimproving, and this could be a step taken to improve interactions on websites. Thecomposition of the exhibition is very ecstatic, with patterns and designsflying around all over the place, and this sense of freedom replicates thesense of creativity the users have. Designs are becoming less systematic, and freer,and this is the same as website design. New designs often use negative space,and layouts aren’t all formal in modern website design, and this exhibitionsupports this new design.
This is a similar concept for format. Due to the workbeing sporadic and constantly moving, the exhibition is very large, and isprojected onto a circular board, that allows the audience to feel immersed withthe design. Future website design will likely aim to immerse users, to makethem feel like they are a part of the website, to get them involved with thecompany or experience, and this exhibition is doing a similar job. The shapesthe doodles create show huge diversity, and this allows for infinite ideas, andthis is the same for website design, and the direction that designers couldchoose to follow, but websites can be created in many different ways, fordifferent uses. The background of the exhibition being black, in a dark roomfilled with neon coloured doodles references space being infinite, and thespace on websites is a modern and future trend. Infinite space is used onwebsite designs today, to make the page feel larger, and free, allowing for amore relaxed viewer experience. I think this use of space will continue ontofuture web design. The 3D form of the exhibition is a modern take on imageryand animation, of which has continued into modern and will evolve in thefuture.
The websites of old, and still modern use 2D imagery and designs,depending on the genre of the website, but 3D is also common. The use of the 3Dmodels in the exhibition, but also the curved projection makes the piece 4D, ofwhich could become a reality for website design in the future, for moreinteraction, although this would likely be expensive, and perhaps not verypractical. The colours used in the exhibition are the black background, withthe neon and bright coloured strokes of the drawings and creations. This is avery clear contrast, and puts the emphasis on the drawing and doodles. This is toshow that the audience’s creations are really important to the exhibit, andthis is what universal everything wants to exaggerate. The use of colour canmake a websites very distinct in terms of company, brand or type of website.
Idon’t think colour will ever change that dramatically on website design,although the trends have turned from shaded colours, to most recently simplistic colouring,so perhaps a more detailed colouring era could be next. Figure4- 1000 hands exhibition Conclusion