{"id":19882,"date":"2019-05-09T18:19:28","date_gmt":"2019-05-09T10:19:28","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=19882"},"modified":"2023-06-29T13:35:06","modified_gmt":"2023-06-29T05:35:06","slug":"changing-faces-of-web-design-25-years","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/changing-faces-of-web-design-25-years\/","title":{"rendered":"Changing The Face of Web Design: A Case Study of 25 Years"},"content":{"rendered":"<p>The <a target=\"_blank\" href=\"https:\/\/www.hongkiat.com\/blog\/40-people-who-changed-the-internet\/\" rel=\"noopener\">World Wide Web<\/a> celebrated its 25th birthday on March 11 2014 and during its evolution, web design has also advanced in leaps and bounds. No longer do we have to put up with endless clunky text and low-resolution images.<\/p>\n<p>Today\u2019s <strong>informative, innovative and easy-to-navigate websites<\/strong> are so commonplace that you\u2019ve probably forgotten what websites looked like back in the 1990\u2019s.<\/p>\n<p>So, let\u2019s take a look at the websites of three major brands, <a target=\"_blank\" href=\"https:\/\/www.hongkiat.com\/blog\/classic-pictures-giant-tech-companies\/\" rel=\"noopener\">how it was back then<\/a> and how they look now, to exactly how web design has changed over the years. The journey that they\u2019ve gone through may lead to some inspiration for your own <a target=\"_blank\" href=\"https:\/\/www.hongkiat.com\/blog\/web-design-scrolling\/\" rel=\"noopener\">website design adventures<\/a>.<\/p>\n<div class=\"ref-block ref-block--post\" id=\"ref-post-1\">\n\t\t\t\t\t<a href=\"https:\/\/www.hongkiat.com\/blog\/web-design-trends-2014\/\" class=\"ref-block__link\" title=\"Read More: Web Design Trends for 2014\" rel=\"bookmark\"><span class=\"screen-reader-text\">Web Design Trends for 2014<\/span><\/a>\n<div class=\"ref-block__thumbnail img-thumb img-thumb--jumbo\" data-img='{ \"src\" : \"https:\/\/assets.hongkiat.com\/uploads\/thumbs\/250x160\/web-design-trends-2014.jpg\" }'>\n\t\t\t\t\t\t\t<noscript>\n<style>.no-js #ref-block-post-19011 .ref-block__thumbnail { background-image: url(\"https:\/\/assets.hongkiat.com\/uploads\/thumbs\/250x160\/web-design-trends-2014.jpg\"); }<\/style>\n<\/noscript>\n\t\t\t\t\t\t<\/div>\n<div class=\"ref-block__summary\">\n<h4 class=\"ref-title\">Web Design Trends for 2014<\/h4>\n<p class=\"ref-description\">\n\t\t\t\t\t\tAfter spending hours online at different websites, you tend to pick up discernable trends in design. Over the...\t\t\t\t\t\t<span>Read more<\/span><\/p>\n<\/div>\n<\/div>\n<h2>Apple<\/h2>\n<p>We take a look at Apple\u2019s main page designs through the decades, courtesy of the <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/web.archive.org\/web\/19961022105458\/https:\/\/www.apple.com\/\">Wayback Machine.<\/a><\/p>\n<h3><strong>1997<\/strong><\/h3>\n<p>In its favour, the Apple web design in 1997 included the logo, provided succinct information, and had a clear navigation bar on the left hand side. However, it <strong>didn\u2019t have the flair we associate with Apple today<\/strong>; the font is very basic, the sidebar takes up a lot of space and distracts the viewer, and the overall design is crowded.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/apple-1997.jpg\" alt=\"apple 1997\" height=\"501\" width=\"570\"><\/figure>\n<h3>1999 \u2013 2002<\/h3>\n<p>Then, Apple created<strong> a professional web homepage design <\/strong>that was so simplistically memorable it <strong>formed<\/strong> <strong>the basis of all future designs<\/strong>. It featured an eye-catching banner photo supplemented by a few select images below.<\/p>\n<p>Each and every one of these used white space to the maximum effect, whether it was of the latest product or a satisfied client. A simple top navigation bar helped vistors find their favourite product easily.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/apple-1999.jpg\" alt=\"apple 1999\" height=\"608\" width=\"570\"><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/apple-2000.jpg\" alt=\"apple 2000\" height=\"576\" width=\"570\"><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/apple-2001.jpg\" alt=\"apple 2001\" height=\"531\" width=\"570\"><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/apple-2002.jpg\" alt=\"apple 2002\" height=\"489\" width=\"570\"><\/figure>\n<h3>2003 \u2013 2006<\/h3>\n<p>During this time, the clean design remained but Apple <strong>started to deviate with a black background<\/strong> as well. Either way, the stark backgrounds of the homepages showcased the products very effectively.<\/p>\n<p>And the use of <strong>quirky one liners<\/strong>, such as \u201cIntroducing Mighty Mouse\u201d reflected Apple\u2019s daring nature.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/apple-2003.jpg\" alt=\"apple 2003\" height=\"536\" width=\"570\"><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/apple-2004.jpg\" alt=\"apple 2004\" height=\"525\" width=\"570\"><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/apple-2005.jpg\" alt=\"apple 2005\" height=\"544\" width=\"570\"><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/apple-2006.jpg\" alt=\"apple 2006\" height=\"489\" width=\"570\"><\/figure>\n<h3>2007 \u2013 2010<\/h3>\n<p>The 2007 homepage design<strong> got rid of the lower sections altogether<\/strong> \u2013 no doubt so that the mobile phone could create an even bigger impact. This continued in 2008 and 2009, but when the iPad was introduced in 2010, the majority of the homepage was devoted to Apple\u2019s newest baby.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/apple-2007.jpg\" alt=\"apple 2007\" height=\"402\" width=\"570\"><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/apple-2008.jpg\" alt=\"apple 2008\" height=\"411\" width=\"570\"><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/apple-2009.jpg\" alt=\"apple 2009\" height=\"428\" width=\"570\"><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/apple-2010.jpg\" alt=\"apple 2010\" height=\"430\" width=\"570\"><\/figure>\n<h3>2011 \u2013 2013<\/h3>\n<p>The main design elements haven\u2019t changed at all. The<strong> 2013 web design for the iPad Air <\/strong>does deserve a special mention however \u2013 when a product\u2019s unique selling point is its thinness, what better way to show this to the world than with this <strong>unusually angled image<\/strong>?<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/apple-2011.jpg\" alt=\"apple 2011\" height=\"435\" width=\"570\"><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/apple-2012.jpg\" alt=\"apple 2012\" height=\"483\" width=\"570\"><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/apple-2013.jpg\" alt=\"apple 2013\" height=\"391\" width=\"570\"><\/figure>\n<h3>Now<\/h3>\n<p>Today\u2019s web design is <strong>still based on the simple approach used since the late 90\u2019s<\/strong>. The main photo is compelling but no longer is the product shown in isolation and is instead shown in the hands of real people.<\/p>\n<p>The font is modern and the limited colour palette of complementary colours looks <strong>highly professional<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/Photo-6.jpg\" alt=\"apple now\" height=\"331\" width=\"600\"><\/figure>\n<p>The navigation bar is now firmly fixed at the top of the page to make navigation simple. In addition to using<strong> clever words to encourage click throughs<\/strong> (\u201c<em>What will your verse be?<\/em>\u201d), the four bottom sections show the visitor exactly what information can be found within them, accessible with a simple click.<\/p>\n<h3>What did they do well? <\/h3>\n<p>Instead of focusing on the hard sell, they <strong>focus more on people\u2019s emotions<\/strong> and the concept of inclusive <a target=\"_blank\" href=\"https:\/\/www.hongkiat.com\/blog\/emotion-through-storytelling\/\" rel=\"noopener\">story telling<\/a>. Web designers who want to create a similar impact with their new websites should <strong>showcase their products using real people<\/strong>.<\/p>\n<p>The more customers can imagine themselves using the product, and can see how it will benefit their lifestyle, the more likely they are to purchase it.<\/p>\n<h2>GAP<\/h2>\n<p>Next up, we look at another major brand, this time in the fashion industry.<\/p>\n<h3>1997<\/h3>\n<p>Hats off to the designers for getting a clear message acros<strong>s<\/strong> through their design. The top navigation bar, instead of a sidebar, gives more space to showcase the products, and the<strong> overall look is clean and simple<\/strong>.<\/p>\n<p>On the downside though, the web designers\u2019 brief was probably to <strong>really emphasise that customers could purchase their favourite GAP clothes online<\/strong> as indicated by the logo appearing twice, and the phrases \u2018online store\u2019 and \u2018shop online\u2019 being crammed into one small homepage.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/gap-1997.jpg\" alt=\"gap 1997\" height=\"452\" width=\"570\"><\/figure>\n<h3>2000 \u2013 2009<\/h3>\n<p>By 2000, the web design evolved for the better. It was <strong>clearly branded with the GAP logo<\/strong> with the use of an <strong>attractive main image <\/strong>and a <strong>modest navigation bar<\/strong> at the top. But let\u2019s keep an eye on the navigation bar as time goes forward.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/gap-2000.jpg\" alt=\"gap 2000\" height=\"492\" width=\"570\"><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/gap-2003.jpg\" alt=\"gap 2003\" height=\"398\" width=\"570\"><\/figure>\n<p>In 2004, the main image worked well as did the GAP logo, now<strong> encapsulated in a bright blue box to give it more prominence<\/strong>. But where were the navigation options? Right at the bottom via click-through links. Definitely a step backwards.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/gap-2005.jpg\" alt=\"gap 2005\" height=\"529\" width=\"570\"><\/figure>\n<p>The navigation bar was back at the top of the homepage in 2006. The company now supplied <strong>clothes for kids<\/strong> illustrated by the use of child models in the photos. Beneath the main banner photo were <strong>4 different sections<\/strong> promoting a variety of incentives. Unfortunately, the design of each didn\u2019t showcase any connection, leading to a <strong>messy and confusing mix<\/strong>, which isn\u2019t easy on the eyes.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/gap-2006.jpg\" alt=\"gap 2006\" height=\"723\" width=\"570\"><\/figure>\n<p>In 2009, <strong>the main navigation options<\/strong> were cunningly placed in a completely new location \u2013 <strong>within the main image<\/strong>. Whilst we applaud innovative design, <strong>the majority of customers expect to navigate from the edges of a homepage<\/strong> \u2013 commonly via bars at the top or less frequently, to the left.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/gap-2009.jpg\" alt=\"gap 2009\" height=\"868\" width=\"570\"><\/figure>\n<p>The more difficult it is for the customer to find what they want, the more likely they are to bounce off the website.<\/p>\n<h3>2010 \u2013 2012 <\/h3>\n<p>GAP finally got the hang of it by 2010. The navigation bar was firmly at the top of the page and has stayed there ever since. The 2010 homepage was also a huge improvement as it used a <strong>really eye-catching <\/strong>and<strong> well-designed collage of fashionable models<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/gap-2010.jpg\" alt=\"gap 2010\" height=\"649\" width=\"570\"><\/figure>\n<p>Perhaps <strong>the use of more images<\/strong> on the homepage was a hit with visitors as this persisted in the web designs of 2011 and 2012. However, both of these fell horribly short of target. There was <strong>no clear strategy in the overall design<\/strong>, the photos didn\u2019t gel together and the variety of colors were overwhelming.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/gap-2011.jpg\" alt=\"gap 2011\" height=\"558\" width=\"570\"><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/gap-2012.jpg\" alt=\"gap 2012\" height=\"510\" width=\"570\"><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/gap-2013.jpg\" alt=\"gap 2013\" height=\"452\" width=\"570\"><\/figure>\n<h3>Now<\/h3>\n<p>It seems that GAP has finally taken stock of all its previous efforts and created a website that has a range of great design elements in one pleasing homepage. This website is <strong>designed to appeal to the younger generation with its urban feel and choice of main image<\/strong>. The words \u2018LIVED IN\u2019 is interestingly split into three parts which captures the visitor\u2019s attention.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/Photo-11.jpg\" alt=\"gap now\" height=\"604\" width=\"600\"><\/figure>\n<p>The navigation bar is still at the top of the page providing an easy shortcut to each type of clothing and the search function allows the visitor to find what they really want. The shopping bag sits on the top right hand corner, making it easier for customers to plan their purchase(s), as they move from page to page.<\/p>\n<h3>What did they do well? <\/h3>\n<p>GAP has gone through a host of web designs to be where it is today, but now designers of e-commerce websites could well follow this example to create an user-friendly online purchasing experience. It\u2019s<strong> not always about showing the product from every angle; clever use of lifestyle photos can help the visitor<\/strong> imagine how the product will enhance their life.<\/p>\n<h2>Heineken<\/h2>\n<p>Lastly, lt\u2019s see how Heineken fairs in web design branding. Images retrieved from <a rel=\"nofollow noopener\" target=\"_blank\" href=\"https:\/\/web.archive.org\/web\/19970206003328\/http:\/\/www.heineken.com\/\">Wayback Machine<\/a>.<\/p>\n<h3>1997<\/h3>\n<p>The website <strong>works well in terms of branding and being eye-catching<\/strong> but by offering the website visitor a huge amount of buttons and options, they most likely caused confusion as to what customers should do next.<\/p>\n<p>There is <strong>no clear navigation<\/strong>, way too many fonts, and frankly, the ones superimposed directly on the water droplets are hard to read.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/hein-1997.jpg\" alt=\"hein 1997\" height=\"312\" width=\"570\"><\/figure>\n<h3>2010 \u2013 2012<\/h3>\n<p>By 2010, the Heineken web design had reached the heights of perfection we associate with it today. At first glance, the homepage seems simple but the <strong>dark green background uses an effective mix of geometrical shapes and an interesting condensation-drenched star<\/strong> alongside the beer bottle recognised the world over.<\/p>\n<p>Today\u2019s trend for very simple navigation buttons was apparent even then, each supplemented by a visual icon.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/hein-2010.jpg\" alt=\"hein 2010\" height=\"362\" width=\"570\"><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/hein-2011.jpg\" alt=\"hein 2011\" height=\"312\" width=\"570\"><\/figure>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/hein-2012.jpg\" alt=\"hein 2012\" height=\"298\" width=\"570\"><\/figure>\n<p>The web designs of 2011 and 2012 follow the same formula of clarity. But they also introduced Heineken\u2019s innovative approach of<strong> using videos and association to high-profile movies<\/strong> to help sell more beer!<\/p>\n<h3>Now<\/h3>\n<p>Each and every page on this website are superbly designed using some great, unique fonts, and thankfully the Heineken green has been continuously toned down since the 1997 version. <strong>The web pages are so uncluttered, they are positively minimalistic<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/hein-now.jpg\" alt=\"hein now\" width=\"1000\" height=\"495\"><\/figure>\n<p>This is then complemented by the several videos featured in their web design \u2013 a moving image can tell a thousand words. Instead of a regular drop down navigation bar with options, a thumbnail image of each item is shown instead making it more fun.<\/p>\n<h3>What did they do well?<\/h3>\n<p>The overall design is modern, lively and bound to appeal to 20 something\u2019s as much as Heineken-loving 60 something\u2019s. The <strong>videos fit in perfectly with today\u2019s social media madness<\/strong> and are more likely to be shared, increasing brand recognition across the world.<\/p>\n<h2>Web Design Then<\/h2>\n<p>From the earlier examples, back in the 90\u2019s, even the biggest companies\u2019 websites appeared amateurish, poorly designed and a far cry from today\u2019s sophisticated web designs.<\/p>\n<p>This can be explained by the fact that <strong>web designers faced far more technological limitations 25 years ago<\/strong> such as ridiculously slow internet and limited font options as well as <strong>insufficient data about what made a website experience pleasurable for the visitor<\/strong>.<\/p>\n<h3>Design trends that died out<\/h3>\n<p>As web designers gain more tools at their disposal to create more sophisticated and professional-looking websites, some trends couldn\u2019t survive the conditions and has since faded from use. These include:<\/p>\n<ol>\n<li><strong>Flash animation<\/strong> \u2013 Flash animation on a homepage may be considered dynamic a few years ago but visitors got bored. Flash animation looks cheap and tacky, website visitors don\u2019t like it, and search engine optimization is made trickier when the home page has a flash intro. It\u2019s not for modern website design.<\/li>\n<li><strong>Background Music<\/strong> \u2013 Wonderful beats and ballads, great idea. Jingles that jangle with the nerves, not so much (the 90\u2019s users would know how this feels). Silence is golden when it comes to today\u2019s web design.<\/li>\n<li><strong>Excessive Content<\/strong> \u2013 Some companies felt their website requires plenty of pages explaining in fine detail about their company, their philosophy, and their products. Truth is, too much info can be confusing and be downright annoying \u2013 most of us just want the bare facts. In 2014, <a target=\"_blank\" href=\"https:\/\/www.hongkiat.com\/blog\/clean-simple-minimalist-website-design\/\" rel=\"noopener\">minimalistic design<\/a>, and the use of photos and icons replace text-heavy pages.<\/li>\n<\/ol>\n<h2>What Works Today<\/h2>\n<p>Today\u2019s most popular and effective websites are truly<strong> captivating and memorable<\/strong>, often <strong>using evocative images or plenty of humour<\/strong>. They are well-structured and encourage the visitor to make a purchase at every turn. Every website should follow some basic rules to help it get closer to perfection. But if web designers really want to keep up with the times, here are some essential key elements:<\/p>\n<ol>\n<li><strong>Fixed navigation bars<\/strong> \u2013 These might be a fairly new trend but they make complete sense. The visitor can browse to their heart\u2019s content and never lose sight of where they are.<\/li>\n<li><strong>Unique font<\/strong> \u2013 Using an unusual or unique font can really help a website sell its message. Web designers shouldn\u2019t settle for the same-old ones when <a target=\"_blank\" href=\"https:\/\/www.hongkiat.com\/blog\/free-fonts-commercial-projects\/\" rel=\"noopener\">new and exciting fonts await.<\/a><\/li>\n<li><strong>Sliders<\/strong> \u2013 The trend for sliding banner photos is a great one. Each image is large and can really impress the visitor. And as the images automatically change, the viewer is treated to a range of great visuals without having to do a thing.<\/li>\n<li><strong>Personalized Photos<\/strong> \u2013 Unless absolutely necessary, web designers should avoid stock photos and opt for <a target=\"_blank\" href=\"https:\/\/www.hongkiat.com\/blog\/photography-portfolios-blogs\/\" rel=\"noopener\">personalised professional photos<\/a> to do the website justice and make it more unique.<\/li>\n<li><strong>Call-To-Action buttons<\/strong>\u2013 Why settle for boring \u2018Contact Us\u2019 buttons when there are a <a target=\"_blank\" href=\"https:\/\/www.hongkiat.com\/blog\/call-to-action-button-templates\/\" rel=\"noopener\">wealth of interesting buttons<\/a> to choose from? The more captivating the button, the more likely the visitor is to click on it.<\/li>\n<li><strong>Infinite scroll \/ card designs<\/strong> \u2013 Pinterest may have lead the way with this type of web design, but it is being embraced by many companies, as it is a great way to present individual nuggets of information.<\/li>\n<li><strong>Flat design vs skeuomorphism<\/strong> \u2013 Whether you prefer the <a target=\"_blank\" href=\"https:\/\/www.hongkiat.com\/blog\/flat-design-resources\/\" rel=\"noopener\">flat design<\/a> so loved by Microsoft (think minimalistic simple icons) or skeuomorphism, which uses more traditional 3D effects, the great news is that both are trending right now.<\/li>\n<li><strong>Web ribbons<\/strong>\u2013 Love them or hate them, these 3D ribbons, designed to hug an information box or photo, just look nice and give a professional finish to any design<\/li>\n<\/ol>\n<div class=\"ref-block ref-block--post\" id=\"ref-post-2\">\n\t\t\t\t\t<a href=\"https:\/\/www.hongkiat.com\/blog\/web-design-trends-2014\/\" class=\"ref-block__link\" title=\"Read More: Web Design Trends for 2014\" rel=\"bookmark\"><span class=\"screen-reader-text\">Web Design Trends for 2014<\/span><\/a>\n<div class=\"ref-block__thumbnail img-thumb img-thumb--jumbo\" data-img='{ \"src\" : \"https:\/\/assets.hongkiat.com\/uploads\/thumbs\/250x160\/web-design-trends-2014.jpg\" }'>\n\t\t\t\t\t\t\t<noscript>\n<style>.no-js #ref-block-post-19011 .ref-block__thumbnail { background-image: url(\"https:\/\/assets.hongkiat.com\/uploads\/thumbs\/250x160\/web-design-trends-2014.jpg\"); }<\/style>\n<\/noscript>\n\t\t\t\t\t\t<\/div>\n<div class=\"ref-block__summary\">\n<h4 class=\"ref-title\">Web Design Trends for 2014<\/h4>\n<p class=\"ref-description\">\n\t\t\t\t\t\tAfter spending hours online at different websites, you tend to pick up discernable trends in design. Over the...\t\t\t\t\t\t<span>Read more<\/span><\/p>\n<\/div>\n<\/div>\n<h2>Conclusion<\/h2>\n<p>Web designers should also bear in mind the most ingenious and important shift in web design over the past quarter of a century, which is <strong>making the website experience as pleasurable as possible<\/strong>. With a lot of <a target=\"_blank\" href=\"https:\/\/www.hongkiat.com\/blog\/identity-branding-design-part-2\/\" rel=\"noopener\">brands competing against each other<\/a>, websites imparting simple facts no longer cut it.<\/p>\n<p>Nowadays, the most popular websites are those that <strong>entertain or amaze<\/strong> whilst providing relevant information. The web designs of Apple, Gap and Heineken illustrate this innovative approach perfectly. 25 years of the World Wide Web has taken web design to heights that were never considered a possibility back in 1989. And who knows how far website design will soar over the next 25 years!<\/p>\n<p><strong>Have an opinion on the subject? Share them with us below.<\/strong><\/p>","protected":false},"excerpt":{"rendered":"<p>Discover how web design has evolved over the last 25 years and what trends are shaping the future.<\/p>\n","protected":false},"author":477,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[352],"tags":[2512],"topic":[4522,4523],"class_list":["entry-content","is-maxi"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v22.8 (Yoast SEO v27.3) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Changing The Face of Web Design: A Case Study of 25 Years - Hongkiat<\/title>\n<meta name=\"description\" content=\"Discover how web design has evolved over the last 25 years and what trends are shaping the future.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.hongkiat.com\/blog\/changing-faces-of-web-design-25-years\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Changing The Face of Web Design: A Case Study of 25 Years\" \/>\n<meta property=\"og:description\" content=\"Discover how web design has evolved over the last 25 years and what trends are shaping the future.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/changing-faces-of-web-design-25-years\/\" \/>\n<meta property=\"og:site_name\" content=\"Hongkiat\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/hongkiatcom\" \/>\n<meta property=\"article:published_time\" content=\"2019-05-09T10:19:28+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-06-29T05:35:06+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/apple-1997.jpg\" \/>\n<meta name=\"author\" content=\"Dmitri Logounov\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:site\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Dmitri Logounov\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"17 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/changing-faces-of-web-design-25-years\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/changing-faces-of-web-design-25-years\\\/\"},\"author\":{\"name\":\"Dmitri Logounov\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/869b49d1b9a66549b7ce0af71152ad15\"},\"headline\":\"Changing The Face of Web Design: A Case Study of 25 Years\",\"datePublished\":\"2019-05-09T10:19:28+00:00\",\"dateModified\":\"2023-06-29T05:35:06+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/changing-faces-of-web-design-25-years\\\/\"},\"wordCount\":2224,\"commentCount\":4,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/changing-faces-of-web-design-25-years\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/changing-faces-of-web-design-25-years\\\/apple-1997.jpg\",\"keywords\":[\"Website Design\"],\"articleSection\":[\"Web Design\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/changing-faces-of-web-design-25-years\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/changing-faces-of-web-design-25-years\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/changing-faces-of-web-design-25-years\\\/\",\"name\":\"Changing The Face of Web Design: A Case Study of 25 Years - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/changing-faces-of-web-design-25-years\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/changing-faces-of-web-design-25-years\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/changing-faces-of-web-design-25-years\\\/apple-1997.jpg\",\"datePublished\":\"2019-05-09T10:19:28+00:00\",\"dateModified\":\"2023-06-29T05:35:06+00:00\",\"description\":\"Discover how web design has evolved over the last 25 years and what trends are shaping the future.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/changing-faces-of-web-design-25-years\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/changing-faces-of-web-design-25-years\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/changing-faces-of-web-design-25-years\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/changing-faces-of-web-design-25-years\\\/apple-1997.jpg\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/changing-faces-of-web-design-25-years\\\/apple-1997.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/changing-faces-of-web-design-25-years\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Changing The Face of Web Design: A Case Study of 25 Years\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"name\":\"Hongkiat\",\"description\":\"Tech and Design Tips\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\",\"name\":\"Hongkiat.com\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"contentUrl\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"width\":1200,\"height\":799,\"caption\":\"Hongkiat.com\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/hongkiatcom\",\"https:\\\/\\\/x.com\\\/hongkiat\",\"https:\\\/\\\/www.pinterest.com\\\/hongkiat\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/869b49d1b9a66549b7ce0af71152ad15\",\"name\":\"Dmitri Logounov\",\"description\":\"Dmitri is the founder of New Design Group Inc in Toronto; a web design company focused on defining effective branding strategies for a variety of businesses and delivering imaginative solutions that work.\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/author\\\/dmitrilogounov\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Changing The Face of Web Design: A Case Study of 25 Years - Hongkiat","description":"Discover how web design has evolved over the last 25 years and what trends are shaping the future.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.hongkiat.com\/blog\/changing-faces-of-web-design-25-years\/","og_locale":"en_US","og_type":"article","og_title":"Changing The Face of Web Design: A Case Study of 25 Years","og_description":"Discover how web design has evolved over the last 25 years and what trends are shaping the future.","og_url":"https:\/\/www.hongkiat.com\/blog\/changing-faces-of-web-design-25-years\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2019-05-09T10:19:28+00:00","article_modified_time":"2023-06-29T05:35:06+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/apple-1997.jpg","type":"","width":"","height":""}],"author":"Dmitri Logounov","twitter_card":"summary_large_image","twitter_creator":"@hongkiat","twitter_site":"@hongkiat","twitter_misc":{"Written by":"Dmitri Logounov","Est. reading time":"17 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/changing-faces-of-web-design-25-years\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/changing-faces-of-web-design-25-years\/"},"author":{"name":"Dmitri Logounov","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/869b49d1b9a66549b7ce0af71152ad15"},"headline":"Changing The Face of Web Design: A Case Study of 25 Years","datePublished":"2019-05-09T10:19:28+00:00","dateModified":"2023-06-29T05:35:06+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/changing-faces-of-web-design-25-years\/"},"wordCount":2224,"commentCount":4,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/changing-faces-of-web-design-25-years\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/apple-1997.jpg","keywords":["Website Design"],"articleSection":["Web Design"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hongkiat.com\/blog\/changing-faces-of-web-design-25-years\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/changing-faces-of-web-design-25-years\/","url":"https:\/\/www.hongkiat.com\/blog\/changing-faces-of-web-design-25-years\/","name":"Changing The Face of Web Design: A Case Study of 25 Years - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/changing-faces-of-web-design-25-years\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/changing-faces-of-web-design-25-years\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/apple-1997.jpg","datePublished":"2019-05-09T10:19:28+00:00","dateModified":"2023-06-29T05:35:06+00:00","description":"Discover how web design has evolved over the last 25 years and what trends are shaping the future.","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/changing-faces-of-web-design-25-years\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/changing-faces-of-web-design-25-years\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/changing-faces-of-web-design-25-years\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/apple-1997.jpg","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/changing-faces-of-web-design-25-years\/apple-1997.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/changing-faces-of-web-design-25-years\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hongkiat.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Changing The Face of Web Design: A Case Study of 25 Years"}]},{"@type":"WebSite","@id":"https:\/\/www.hongkiat.com\/blog\/#website","url":"https:\/\/www.hongkiat.com\/blog\/","name":"Hongkiat","description":"Tech and Design Tips","publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.hongkiat.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.hongkiat.com\/blog\/#organization","name":"Hongkiat.com","url":"https:\/\/www.hongkiat.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","contentUrl":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","width":1200,"height":799,"caption":"Hongkiat.com"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/hongkiatcom","https:\/\/x.com\/hongkiat","https:\/\/www.pinterest.com\/hongkiat\/"]},{"@type":"Person","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/869b49d1b9a66549b7ce0af71152ad15","name":"Dmitri Logounov","description":"Dmitri is the founder of New Design Group Inc in Toronto; a web design company focused on defining effective branding strategies for a variety of businesses and delivering imaginative solutions that work.","url":"https:\/\/www.hongkiat.com\/blog\/author\/dmitrilogounov\/"}]}},"jetpack_featured_media_url":"https:\/\/","jetpack_shortlink":"https:\/\/wp.me\/p4uxU-5aG","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/19882","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/users\/477"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/comments?post=19882"}],"version-history":[{"count":4,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/19882\/revisions"}],"predecessor-version":[{"id":67853,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/19882\/revisions\/67853"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=19882"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=19882"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=19882"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=19882"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}