web design report - tracy fulwood

EDN 205 – WEB DESIGN REPORT TRACY FULWOOD -‐ 31215521 20TH AUGUST 2012

A Report

A report considering the number of design and implementation issues web designers face.

Author: Tracy Fulwood

Website Design: Implementations and

Considerations

August 2012


Introduction

From modems to wireless; books to e-books and floppy disks to i-cloud. These innovations have made life more mobile, and information more accessible. Innovations made possible because of the World Wide Web. The past few years have seen an exponential growth in the number of websites with 2011 seeing a 50% increase alone, from 250 million to over 500 million (Softpedia, 2012). Furthermore, people accessing web-based information has reached over 2 billion people (Minigroup Marketing Group, 2012) and so the demand to create a memorable and pleasing experience for viewers is more ciritical than ever before. Yoshie Arrima (2009) states “we are currently in the digital age, where people are accustomed to professionally designed websites and judge the contents by the way they are presented.” Research shows that a number of key elements need considering by web designers if they wish to create an effective website. These include; aesthetics, content, functionality, usablity and copyright (Fleming & Levie, 1993) (Mayer, 2001)These key factors were highly influencial in the design and implementation of my own website.

Design Considerations

AESTHETICS: First impressions are essential to a website’s success. A website should be inviting and establish confidence and trust in their viewer (Clayson, 2012). Therefore, it is important to know your target audience and choose a design that best reflects them. Before settling with a design, I researched a number of different Primary Education websites as well as Mathematical ones to get a feel for the differing designs as well as to analyse their aesthetics. I was drawn to those that were simple with eye-catching graphics and bold colours.

Colour combination is an important consideration. Colours have the power to create the mood of the website. The bold reds and blues were fitting for the ‘fun’ I was desiring to bring and catered to a wide audience. Smith (2006) states; “in selecting a colour


scheme, a primary consideration will be the legibility of the text against the background colour…when you are deciding in a colour combination to increase readability, you are safest in going with a high-constast combination” (p.116). The soft grey background and dark charcoal text on my site created a high-contrast combination.

To enhance legibility and keep to the desired mood, the font choice is essential. Headings should be clear, bold and usually significantly larger than the body text. Fancy fonts are great, however can sometimes be difficult to read – especially if used for longer paragraphs. The extra flairs and twirls may be a little busy for the eye and so could deter the viewer from reading on. I found it best to use the ‘prettier’ fonts for headings. Furthermore, it is important to emphasise the key points you desire to get across to your audience. Placing key words in Bold or colour catches the reader’s eye, and saves the viewer ‘digging’ time. The saving of time is critical in today’s world and would be appealing to a large number of time-poor viewers.

Images and graphics are arguable the most important part of your design. Having none creates a bland and boring visit, but having too many overwhelmes the viewer and could create a stressful experience. But even with the ‘perfect number’ and positioning of pictures, a website could fail to stand out. The quality of the graphics and the professionalism of the photography or clip-art, in my opinion, is key to creating the ‘wow-factor’. Having pixilated pictures, unrelated artwork and frustrating animations build a distrust in the viewer as they become confused with your purpose. Finding the right images for my website proved to be challenging. After considering all copyright issues and selecting images that related to the content, my pictures were too small and so became pixilated when placing them as my website banners. I researched various layouts and technologies and came across my new favourite, free, web tool–picmonkey. This photo editing and collage creating program is free and extrememly simple to use. I created all my own headings and banners using this website. Lastly, under design considerations is the Layout. Web layouts vary considerably due to personal taste and purpose. It is best to keep the design simple allowing the user to feel comfortable and at home. Research shows the human eye tends to follow an “F”


shaped reading pattern, from top left to right (Clayson, 2012).Therefore the essential, or eye-catching, information/graphics should generally be placed on the left. The classic layout chosen for my website consisted of a banner heading and content below. The big banner was designed to draw the reader in and then guide them to the content and links below. Consistency and clutter are also important considerations. Being consistent in layout ties the content and pages together and creates a common theme and avoiding clutter makes the experience more enjoyable for the viewer. If you require a number of external links try using pictures as your link rather than the URL text. An example of this technique can be seen on my Teacher Page where I tied the link to a picture of my report. This small change can make a world of a difference in engaging your viewer.

Implementation Considerations

USABILITY: Although an increasing number of people around the world are starting to use the Internet, one should never assume that once a user has navigated one website, they can easily navigate them all (Cox & Dale, 2002). A clearly labeled navigation bar allows the user to access all pages at any time. This feature enables quick information access and maintains confidence in their experience (Clayson, 2012). Furthermore, Spool et al.(1999) discovered that menues at the top of a page allowed for easier user-navigation than side-bar menues. Having supporting menues and links to related items will also reinforce the website’s overall usability and viewer satisfaction. ACCESIBILITY: To increase accessibility it is important to ensure that your website and its links, videos and images work on multiple web-browsers and technical devices, and don’t require additional software to run. If software is required ensure you use programs that are common to most users, for example PDF files require Adobe. Distrust is developed when a user clicks on a desired link but the external path no longer exists. As a user, I waste no time exiting that site when I bump into such inconviences. It is your


responsibility as the developer of the website to constantly ensure all links still exist and all glitches fixed. COPYRIGHT: The World Wide Web provides us with multitudes of pictures, articles, videos and presentations. Because of the expanse and easy access of these items it can be easy to plagerise. It is critical as the designer to ensure you have not breached any copyright laws and provided the original link or reference to all images, videos or content that is not your own. I recommend you publish your work under a Creative Commons licence. Creative Commons is a free, non-profit, organisation that allows viewers and developers to share work without copyright infringement. CC gives you flexibility (for example, you can choose to allow only non-commercial uses) and protects the people who use your work, provided they abide by the conditions you have specified (Creative Commons, 2012).

Other Considerations WEB DESIGING TOOLS: In my quest to design a website I discovered a range of website designing tools that made the development of any website as simple as clicking a button. After considering Weebly, Yola and WordPress I settled on choosing Wix as my website developing tool. I found the feedback from previous users greatly positive, and a large number of tutorials and frequently asked questions available. Throughout my website developing experience I found there to be great support and the web-designing tools extremely simple. The huge range of creative templates that designers could choose from was another huge attraction, it seemed they catered for variety of tastes and purposes.

Conclusion A website’s impression is made not only by what is included – content, graphics, easy navigation – but also by what is left out. Bypass banner ads, third party advertising, non-interactive flash animation and overwhelming colour schemes confuse the eye and


fight for the viewers attention. Therefore it is important to carefully consider all the key elements of design and implementation discussed in this report before designing your website. My advice is – whatever you do – be clear in content and simple in design!!

References

Arrima, Y. (2009). Importance of Aesthetics in Language Learning Websites: Student's preferences regarding Kana Learning Websites. Dissertation Thesis .

Clayson, M. (2012). Top Ten Key Usability Issues in Web Design. Retrieved August 2012, from Mark Clayson: http://markclayson.com/featured/top-ten-key-usability-issues-in-web-design/

Cox, J., & Dale, B. (2002). Key quality factors in Web site design and use: An examination. The International Journal of Quality & Reliability Management , 19 (6/7), 862-888.

Creative Commons. (2012). About. Retrieved August 2012, from Creative Commons: http://creativecommons.org/about

Fleming, M., & Levie, W. H. (1993). nstructional message design: Principles from the behavioral and cognitive sciences. Englewood cliffs, New Jersey: Educational Technology Publications.

Mayer, R. E. (2001). Multimedia learning. New York: Cambridge University Press. Minigroup Marketing Group. (2012). Internet Growth Statistics. Retrieved August 2012, from Internet World Stats: http://www.internetworldstats.com/emarketing.htm

Smith, S. (2006). Web based Instruction: A guide for Libraries. Chicago: American Library Association.

Softpedia. (2012, January). The Number of Websites Doubled in 2011, to Reach 582 Million. Retrieved August 2012, from Softpedia: http://news.softpedia.com/news/There-Were-582-Million-Websites-At-the-End-of-2011-244205.shtml

Spool, J., Scanlon, T., Schroeder, W., Snyder, C., & DeAngelo, T. (1999). Web Site Usability: A Designer’s Guide. San Francisco: Morgan Kaufmann Publishers.

web design report - tracy fulwood

Documents