top of page

Website Development

Images shows a snapshot of html code from a website, a mouse, and the page title

Website development occurs behind the scenes of any webpage to create a product that is appealing and desirable by the user and its owner. While it is not possible to address the needs of all users and cater to all needs of the owner, its usability should meet the needs of diverse users, and include features for universal access to its content.

Site development links strategically with my budding technological and instructional design skills. It fused well with knowledge and skills gained in other courses. During the MSc. IDT programme, I used websites to present, host and share learning material and information as I did with my first website; to submit assignments; as a prototype for an electronic performance support system to help teachers to use a wiki tool; and to showcase my ID capabilities as I am doing with this e-folio. Similar activities can be used for e-learning development, use of learning and course management systems to host training and distance learning sites, to share and present resources, and also to help learners flourish as they build their own sites and their knowledge. This process is not as simple as it sounds.

Site development is highly iterative as the needs of all stakeholders are considered and tested prior to finalising the product. The designer has an option of liaising with experts (e.g. graphic designers, programmers, course developers, or camerapersons). However, my MSc. IDT course environment was rewarding as I gained experience in several areas that are essential to website development.

 

Some sites e.g. Wordpress (www.wordpress.com), a free and open source website builder and content management system, require the use of HTML code and CSS for development. Others such as Weebly, simpler feature drop and drag elements. HTML is usually a more complex but I believe better option since its code stabilises page content and prevents shifting and rearranging of graphics and text that can easily occur with the drag and drop variety. Nonetheless, these tools facilitated the development of other skills in using, creating, and manipulating various multimedia artefacts by editing, selecting graphics formats, shooting videos, recording screencasts, and creating audio with and without background soundtracks, so that they could be apt for inclusion on the sites.

Diversity and accessibility are critical features as they help the designer to be proactive and offer visitors multiple presentations of content, as well as choice. Ultimately, accessibility assists visitors with diverse preferences (e.g. “I simply prefer to view a video, rather than read…”), abilities, and inabilities (e.g. handicapped, broken hand, arthritis), whether they are temporary (e.g. injury to a wrist that inhibits mouse action), permanent (blindness, or hearing impaired), or progressive (e.g age-related). These are critical considerations that make the site appealing to visitors, and repeat visitors. For example, mouse and keyboard navigational options; and compatible browser options, for example Chrome, Firefox, or aiBrowser for the visually impaired  (The Eclipse Foundation, 2016), aid in the sites usability and appeal to bring about repeat visitors. Other considerations include the combination of appropriate and interoperability of media and help strategies like screen-tips and alternate text, and titles. These may assist users who are met with technological challenges. For example, a slow bandwidth or improper selection of multimedia can create frustrating unclear, fuzzy images, or slow-buffering video and audio. This effort is time-consuming but my experience is that effectiveness is best achieved at planning stage, rather than when we are forced to rectify it.

To this end, I am able to re-assess my understanding and gain a greater appreciation and capability for this aspect of instructional design. I am now mindful of the features and considerations that go into the planning and development of an effective website.

Website development is ultimately about the purpose of the site. The developer must engage the owner of the site about his/her requirements. Questions for the owner can include: What do you hope to gain from developing a site? Who are you hoping to attract, and why? How do you intend to maintain a steady stream of visitor traffic, gain popularity, and keep visitors returning for more of your offerings? How will you update the site? These questions help to define the scope of the design so its extent can be clarified and or discussed with the owner.

Still during the planning stage, the designer’s strategy should also revolve around the notion that ‘first impressions count!’ The average website visitor stays about 10 to 15 seconds to scan a page and decide if the page is worth a further 30 seconds or second glance (Nielsen, 2011). Attraction may be communicated through apt colour mapping and selection of font, background, and foreground in contrast to each other; the font size and style, background colour, and page structure enhances the layout and adds general appeal to site. Theme selection may also help to organise thoughts and help to make a representation content so that it mirrors the visitor’s interpretation. As thoughts are organised, then each webpage can be accordingly formatted with heading styles, page and subject titles, and a concise menu for effective layout.

The final step in site development is to conduct multiple evaluations of its usability, its effectiveness, its message, its purpose, and its general appeal. A representative sample of targeted users should easily manage, navigate, access, and review the site. Testing is iterative but it weeds out errors and issues that may are not seen by the developer.

As part of the course on Developing Instructional Media, I was required to develop a website using HTML code and CSS code. This site was developed using Wordpress (www.wordpress.com). 

 

My role included:

  • Developing website content (inclusive of text, graphics, media, instruction)

  • Site design

  • Copyright notations and validations for works published by others

  • Developing graphics, and multimedia for incorporation

  • Conducting a usability test for the website

  • Programming and writing code using HTML and CSS to build the site

 

Other tools used during the website development:

  • Soundcloud to publish and present audio recordings

  • Screencast by Techsmith to publish media

  • Camtasia Studio by Technsmith for the Instructional content

  • Photoshop by Adobe to develop some images and graphics

  • Microsoft PowerPoint used in conjunction with Camtasia Studio

  • Jing by Techsmith for screen recordings and screenshots

  • YouTube for uploading and incorporating both personal and existing video resources

 

Click on button below to view my website on Developing Instructional Media.

© 2016 by Laura Taylor

Design Project - My E-Portfolio

Last Update June 19, 2016

bottom of page