Elearning Toolkit - Web Design

8/3/2019 Elearning Toolkit - Web Design

1/11

E-Learning Toolkit Templateby Anne-Rae Vasquez

(author of Teach Yourself Web Design, Sams.net, Macmillan Publishing)www.arnb.com

Name of resource: Web Design

Description

Web Design is the creation of documents, usually in the form of webpages,that can be electronically published to a computer server. These webpagescan be accessed over the internet either by searching for it using a searchengine (such as Google) or by simply typing the websites unique address(Uniform Resource Locator, or URL) into an internet browser.

Background Information

Web design uses principles (or elements) of design similar to the ones usedin print publications: layout, white space, font, typography, etc.. But unlikedesigning for print, web design is much more dynamic. It allows designersthe ability to display or embed interactive tools, applications, video, audioand other media onto the webpage.

Authoring a webpage in the past required designers to understand HTML(hypertext mark up language) coding. But now there are a number ofsoftware tools and WYSIWYG (What you see is what you get) editors, whichallow a novice web designer to design a simple webpage as easily asformatting content in a word processing document.

Also with the introduction of Content Management Systems (CMS) andblogging software such as Joomla or Word Press, anyone can design theirown webpage without any knowledge of HTML. In terms of e-learning,Learning Management Systems (LMS) are a special type of CMS for onlineeducation; LMSs also have web design capabilities built-in.

Regardless of how webpages are created, proper web design still requiresapplying best practices and principles for designing for the web.

Design Questions/Issues

page 1Anne-Rae Vasquez

www.almostaturkishsoapopera.comwww.arnb.com

E-Learning Toolkit Template byAnne-Rae Vasquez is licensed under aCreative Commons Attribution-NonCommercial-ShareAlike3.0 Unported License.Based on a work at www.arnb.com. 2009
http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://www.almostaturkishsoapopera.com/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://www.arnb.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://www.arnb.com/http://www.arnb.com/


2/11



The key design questions you need to think of when designing a website are:

What is HTML?

HTML is an acronym that stands for HyperText MarkUp Language and is thelanguage used to create webpages. HTML files are uploaded to a computerserver that can be accessed by others via the internet and viewed by webbrowsers. By applying HTML tags around the elements within the content ofthe webpage, the document serves as a set of instructions to the webbrowser on how to present the content on the screen.

In the early 1990s, web designers had to understand HTML in order to

design websites. However, due to the availability of HTML editing software,most web designers today prefer using WYSIWYG HTML editors to designtheir webpages rather than typing in the HTML codes by hand. Newbie webdesigners can design a webpage without even knowing one HTML tag. Formore information about HTML, visit this HTML tutorial site.

Cross platform compatibility.Your audience (primarily students in e-learning contexts) will be viewing your webpages using different types ofcomputer operating systems, and different browserseven different versionsof the same browser! Make sure that your web site is compatible by followingW3 standards so that your students can focus on the content instead of

struggling with the technology.

Think of your audience and ensure ease of navigation andreadability of your content. Make sure that you storyboard how peoplewill be navigating through your website. Ensure that webpages areconsistent with one another. Provide options for the student to return to thehome page from anywhere within the website.

Do not add any unnecessary media no matter how interesting youthink it may be to your students. The content should be the focus of thewebpage, not the distracting rotating animated flash image that your cousin

Bjorn sent to you!



http://www.arnb.com/http://en.wikiversity.org/wiki/What_is_HTMLhttp://www.w3.org/http://www.almostaturkishsoapopera.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://www.almostaturkishsoapopera.com/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://www.arnb.com/http://www.arnb.com/http://www.w3.org/http://www.almostaturkishsoapopera.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://www.arnb.com/http://www.arnb.com/http://en.wikiversity.org/wiki/What_is_HTML


3/11



Never embed an audio or video file that autoplays once someone

lands on the page. Worse yet, do not let your animation and/or audio filekeep looping endlessly (you will drive your students bonkers with this!).

Understand the use of typography in your design. Simplicity in designgoes a long way. Use lots of white space, as well as readable font style andsize. The quality of a sites typography can improve or impede the readabilityof your content.

Use sans serif fonts for your webpage content. Serif fonts have tails orstrokes at the end of the letters which make the content on the screen more

difficult to read. The Arial, Geneva and Verdana fonts are the easiest toread; most computers usually have this font installed as a default.

Try to stay with black font on a white background for your text. Foryour images, if you are applying text on the image, use high-contrast colourcombinations for the font and the background to ensure readability. Thereare certain colour combinations to avoid using because persons who arecolour blind will be unable to differentiate the colours. For more details clickhere.

White space! White space! White space! Looking at a webpage that has

little or no white space between text lines and other objects is very tiring forthe eyes. Break up the text on your webpage with consistent lines of whitespace (example: after a paragraph, make sure you have two lines of space,between each line; if using a CSS stylesheet, try to make the line betweenthe text bigger than the font size).

The same rule for white space applies in graphical images. Considerthe white space between textual and graphical elements when designing thebanners or home page (splash page) images. Without proper white space,your banner or splash page image can become very cluttered and busy. Tryto limit the amount of elements in your graphical image so as not to lose the

focus of what your image is trying to convey to the student.



http://www.arnb.com/http://webdesign.about.com/od/accessibility/a/aa062804.htmhttp://www.almostaturkishsoapopera.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://www.almostaturkishsoapopera.com/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://www.arnb.com/http://www.arnb.com/http://webdesign.about.com/od/accessibility/a/aa062804.htmhttp://www.almostaturkishsoapopera.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://www.arnb.com/http://www.arnb.com/


4/11



Divide your content or lessons into individual webpages, rather than

one long page. Long scrolly webpages can be overwhelming for studentsto read through, and difficult to reference. In addition, more and morestudents are accessing online course content using mobile devices such assmartphones or personal digital assistants. Web sites divided into readablesmaller pages are easier to view on a hand-held device than are longerwebpages.

Try to contain your content into around 700 pixels wide. When youare viewing content that is stretched on a very wide screen or monitor theeye has to travel from left to right over and over, which makes it very tiringfor your eye muscles. Narrowing the content width allows the eyes to relax

at the end of the line before going to the next line.

Design with accessibility in mind. Here are some guidelines:

Be consistent with things such as ensuring that all image "ALT" textand "Title" tags are descriptive and meaningful. This is very helpfulboth for those who turn off the graphic display option on their browserfor faster loading of the webpage, and for visually impaired personswho use a screen reader to access the content. If the image serves afunction (ie. back to the top), include this information in the "ALT"

text. Simply saying "icon" in the "ALT" text is meaningless to the user.

Use captions under your figure images to describe what the image is,including acknowledgement or credit for the images source.

Provide text (alongside or as subtitles) and/or narrative transcripts foraudio or video media files for students who have a hearing or visualimpairment, as well as for those who do not have the technology orplug-in to view or hear the media file.

When linking to other webpages or other websites, use descriptivelinks. Simply stating "Click here" is less meaningful than saying, "To

find out more about the geology of the Grand Canyon, click here."



http://www.arnb.com/http://www.bobspixels.com/kaibab.org/geology/gc_geol.htmhttp://www.bobspixels.com/kaibab.org/geology/gc_geol.htmhttp://www.almostaturkishsoapopera.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://www.almostaturkishsoapopera.com/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://www.arnb.com/http://www.arnb.com/http://www.bobspixels.com/kaibab.org/geology/gc_geol.htmhttp://www.bobspixels.com/kaibab.org/geology/gc_geol.htmhttp://www.almostaturkishsoapopera.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://www.arnb.com/http://www.arnb.com/


5/11



Use Cascading Style Sheets (CSS)

Cascading Style Sheets (CSS) are a means of controlling the look and feel ofyour site design by defining formatting style rules for elements in yourcontent, while keeping this information independent from each HTML page.CSS files have the suffix .css.

Keeping all the formatting style rules in one document is a cleaner way ofdesigning a website: it reduces the repetitive application of formatting stylesfor every individual element in your HTML file. When you change a style rulein the .css file, the changes are reflected throughout the entire website. Forexample, if you change the font colour for the Heading 1 element, all

content that has the HTML code will change on the screenautomatically.

Examples

Below are some different online resources that offer examples of how to (andhow not to) design websites.

Web Design Tutorials

Although designing a website has become much easier with the introduction

of WYSIWYG editors, its helpful to understand some of the technical aspectsof HTML and web design. The following tutorials provide you a hands-onintroduction on topics such as HTML coding, to how to embed videos ontoyour webpage, and how to storyboard:

How to Build Websites Tutorial http://www.how-to-build-websites.com/

How to Storyboardhttp://www.public.iastate.edu/~nielandj/webarticle4.html

How to embed audio and video fileshttp://cit.ucsf.edu/embedmedia/step1.php

How to upload files to WebCT/Blackboard using WebDav(https://www.elearning.ubc.ca/plugin/index.cfm)



http://www.arnb.com/http://www.how-to-build-websites.com/http://www.public.iastate.edu/~nielandj/webarticle4.htmlhttp://cit.ucsf.edu/embedmedia/step1.phphttps://www.elearning.ubc.ca/plugin/index.cfmhttp://www.almostaturkishsoapopera.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://www.almostaturkishsoapopera.com/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://www.arnb.com/http://www.arnb.com/http://www.how-to-build-websites.com/http://www.public.iastate.edu/~nielandj/webarticle4.htmlhttp://cit.ucsf.edu/embedmedia/step1.phphttps://www.elearning.ubc.ca/plugin/index.cfmhttp://www.almostaturkishsoapopera.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://www.arnb.com/http://www.arnb.com/


6/11



Web Design Software

The Adobe Dreamweaver CS4 web premium suite (collection of software)includes an entire range of tools for web design. However, its main webdesign tool is Dreamweaver. In fact, Dreamweaver is the main tool thatprofessional web designers use to create webpages. It allows you to edityour page either in WYSIWYG mode (What-You-See-Is-What-You-Get) orHTML code mode. In addition, you can also create and edit CSS files. You canfind more details about Dreamweaver at Adobe's website:

Adobe Dreamweaver CS4

Amaya or NVU are open source WYSIWYG HTML editors which are compatiblefor both Mac and PC operating systems. They are designed for the non-technical user who has little or no HTML knowledge. Although these editorsare not as stable as Dreamweaver, they are fairly robust and easy to use.Most importantly they are 100% free to download and use. You can findmore information about these software programs from their websites at:

Amaya

NVU

Web Design Checklists

Looking at bad web sites is a very good way to help you understand theimportance of applying good design principles to your own website. WebPages That Suck is an excellent site that provides you with lots of resourcesthat will help you take an objective look at your website so that you canimprove its design. Below you will find useful checklists that help determineif your webpages "suck" .

Web Pages That Suck

Top Web Design Mistakes

Checklist #1: 149 Mortal Sins That Will Send Your Site to Web DesignHell



http://www.arnb.com/http://www.adobe.com/products/dreamweaver/http://www.w3.org/Amaya/http://nvu.com/http://www.webpagesthatsuck.com/http://www.webpagesthatsuck.com/http://www.webpagesthatsuck.com/http://www.webpagesthatsuck.com/does-my-web-site-suck/what-we-clicked-on-checklist-one.htmlhttp://www.webpagesthatsuck.com/does-my-web-site-suck/does-my-web-site-suck-checklist-part-one.htmlhttp://www.webpagesthatsuck.com/does-my-web-site-suck/does-my-web-site-suck-checklist-part-one.htmlhttp://www.almostaturkishsoapopera.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://www.almostaturkishsoapopera.com/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://www.arnb.com/http://www.arnb.com/http://www.adobe.com/products/dreamweaver/http://www.w3.org/Amaya/http://nvu.com/http://www.webpagesthatsuck.com/http://www.webpagesthatsuck.com/http://www.webpagesthatsuck.com/http://www.webpagesthatsuck.com/does-my-web-site-suck/what-we-clicked-on-checklist-one.htmlhttp://www.webpagesthatsuck.com/does-my-web-site-suck/does-my-web-site-suck-checklist-part-one.htmlhttp://www.webpagesthatsuck.com/does-my-web-site-suck/does-my-web-site-suck-checklist-part-one.htmlhttp://www.almostaturkishsoapopera.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://www.arnb.com/http://www.arnb.com/


7/11



Checklist #2: 82 Potential Mortal Sins

Storyboarding

Storyboarding is the process of planning, creating and outlining the websitestructure prior to actually creating a webpage. After determining the overallstructure of your course site, you should begin creating the structure of eachModule or Lesson. Storyboarding your content helps you focus on ensuringthat the content in your Modules or Lessons are consistent. For example thefirst page in each module can be a brief introduction to the module; thesecond page can then be a list of objectives for the module; the third pagecan be a list of readings, and so on. Planning the structure of your online

course will help you visually see how your students will navigate through thecontent. As a web designer, you must ensure that the navigation in yourwebsite is consistent and easy to to understand. Students need to be able togo through your course easily without spending time trying to figure outwhere to find things such as their Course schedule or assignments. You canfind out more about storyboarding at:

http://www.public.iastate.edu/~nielandj/webarticle4.html

Web Design Basics

Jennifer Kyrnis site is an excellent resource, where you will find informationabout elements of good design, web design basics, fonts and typography,use of colour, graphics and images, navigation, layout and interface designand accessibility.

http://webdesign.about.com/od/webdesignbasics/u/webdesignbasics.htm

CSS



http://www.arnb.com/http://www.webpagesthatsuck.com/does-my-web-site-suck/does-my-web-site-suck-checklist-part-two.htmlhttp://www.public.iastate.edu/~nielandj/webarticle4.htmlhttp://webdesign.about.com/od/webdesignbasics/u/webdesignbasics.htmhttp://www.almostaturkishsoapopera.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://www.almostaturkishsoapopera.com/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://www.arnb.com/http://www.arnb.com/http://www.webpagesthatsuck.com/does-my-web-site-suck/does-my-web-site-suck-checklist-part-two.htmlhttp://www.public.iastate.edu/~nielandj/webarticle4.htmlhttp://webdesign.about.com/od/webdesignbasics/u/webdesignbasics.htmhttp://www.almostaturkishsoapopera.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://www.arnb.com/http://www.arnb.com/


8/11



The following website from the University of Aberdeen explains what CSS are

and how to use them. Learning how to work with CSS can be somewhatdaunting for a newbie web designer; this in easy to understand English anduses informative screenshot images:

What are Cascading Style Sheets and why should I use them?

Accessibility

The following article by Todd D. Schwanke, Bhagwant S. Sindhu, and RogerO. Smith (from the University of Wisconsin) addresses web design andaccessibility, and is directed specifically to instructors who teach online using

an LMS such as WebCT/Vista, Blackboard or Learning Spaces:

http://www.uwsa.edu/ttt/schwanke.htm#Introductory



http://www.arnb.com/http://www.abdn.ac.uk/webpack/factsheet13.shtmlhttp://www.uwsa.edu/ttt/schwanke.htm#Introductoryhttp://www.almostaturkishsoapopera.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://www.almostaturkishsoapopera.com/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://www.arnb.com/http://www.arnb.com/http://www.abdn.ac.uk/webpack/factsheet13.shtmlhttp://www.uwsa.edu/ttt/schwanke.htm#Introductoryhttp://www.almostaturkishsoapopera.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://www.arnb.com/http://www.arnb.com/


9/11



ActivityExplore:

The best way to analyze your website design is to follow a best practiceschecklist. The following exercise is a fun way of understanding the commonweb design mistakes that designers make.

Web Design Principles Exercise

Go through the "Web Pages That Suck" checklist #1 and checklist #2.

If you have already designed a webpage, go through the list and checkoff the items that apply to your web page. Please note: If you checkoff any of the items, this automatically means that your webpage"sucks".

If your webpage does not suck, consider how you might make evenbetter.

If your webpage sucks, read OK, My Web Site Sucks. What Do I DoNow?.

Storyboarding Exercise

Read the tips on how to storyboard your website design athttp://www.public.iastate.edu/~nielandj/webarticle4.html.Jot down a quick hand drawing of how you would storyboard the structure ofyour webpage.Feel free to make changes after your initial drawing. Look for consistencyand ease of navigation within the structure of your course website.

Contribute:

Create a webpage first by simply drawing a storyboard of what you imagineyour website's structure. Remember the tips you learned in theStoryboarding Exercise above. Once you are satisfied with your storyboard,



http://www.arnb.com/http://www.webpagesthatsuck.com/does-my-web-site-suck/does-my-web-site-suck-checklist-part-one.htmlhttp://www.webpagesthatsuck.com/does-my-web-site-suck/does-my-web-site-suck-checklist-part-two.htmlhttp://www.webpagesthatsuck.com/does-my-web-site-suck/what-do-i-do-now.htmlhttp://www.webpagesthatsuck.com/does-my-web-site-suck/what-do-i-do-now.htmlhttp://www.public.iastate.edu/~nielandj/webarticle4.htmlhttp://www.almostaturkishsoapopera.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://www.almostaturkishsoapopera.com/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://www.arnb.com/http://www.arnb.com/http://www.webpagesthatsuck.com/does-my-web-site-suck/does-my-web-site-suck-checklist-part-one.htmlhttp://www.webpagesthatsuck.com/does-my-web-site-suck/does-my-web-site-suck-checklist-part-two.htmlhttp://www.webpagesthatsuck.com/does-my-web-site-suck/what-do-i-do-now.htmlhttp://www.webpagesthatsuck.com/does-my-web-site-suck/what-do-i-do-now.htmlhttp://www.public.iastate.edu/~nielandj/webarticle4.htmlhttp://www.almostaturkishsoapopera.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://www.arnb.com/http://www.arnb.com/


10/11



create a simple webpage using any of the tools recommended above. Refer

to the "Web Pages that Suck" checklists as a guide on how NOT to designyour webpage. Try to keep your design simple, easy to navigate and content-focused. If you need some help with web design, web graphics, layout ortypography, you can find tips and resources on the "Web Design Basics"webpage. When you have completed your webpage design, upload yourwebpage to a free webpage hosting provider such as Bravenet(http://www.bravenet.com/).

Now check your site with at least two different web browsers (such asInternet Explorer or Firefox) and see if the webpage looks the same in bothbrowsers. Test the accessibility of your webpage by going to the WAVE Tool

(Web Accessibility Evaluation Tool) at http://wave.webaim.org/.

Resources

Here is a list of the resources which can be helpful with designing yourcourse websites:

Web Pages that Suck

Web Pages That Suck Top Web Design Mistakes Checklist

Checklist #1: 149 Mortal Sins That Will Send Your Site to Web DesignHell

Checklist #2: 82 Potential Mortal Sins (How many web design mistakescan I make before our site sucks?)

Web Design Basics

http://webdesign.about.com/od/webdesignbasics/u/webdesignbasics.htm

Cascading Style Sheets



http://www.arnb.com/http://webdesign.about.com/od/webdesignbasics/u/webdesignbasics.htmhttp://www.bravenet.com/http://wave.webaim.org/http://www.webpagesthatsuck.com/http://www.webpagesthatsuck.com/does-my-web-site-suck/what-we-clicked-on-checklist-one.htmlhttp://www.webpagesthatsuck.com/does-my-web-site-suck/does-my-web-site-suck-checklist-part-one.htmlhttp://www.webpagesthatsuck.com/does-my-web-site-suck/does-my-web-site-suck-checklist-part-one.htmlhttp://www.webpagesthatsuck.com/does-my-web-site-suck/does-my-web-site-suck-checklist-part-two.htmlhttp://webdesign.about.com/od/webdesignbasics/u/webdesignbasics.htmhttp://webdesign.about.com/od/webdesignbasics/u/webdesignbasics.htmhttp://www.almostaturkishsoapopera.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://www.almostaturkishsoapopera.com/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://www.arnb.com/http://www.arnb.com/http://webdesign.about.com/od/webdesignbasics/u/webdesignbasics.htmhttp://www.bravenet.com/http://wave.webaim.org/http://www.webpagesthatsuck.com/http://www.webpagesthatsuck.com/does-my-web-site-suck/what-we-clicked-on-checklist-one.htmlhttp://www.webpagesthatsuck.com/does-my-web-site-suck/does-my-web-site-suck-checklist-part-one.htmlhttp://www.webpagesthatsuck.com/does-my-web-site-suck/does-my-web-site-suck-checklist-part-one.htmlhttp://www.webpagesthatsuck.com/does-my-web-site-suck/does-my-web-site-suck-checklist-part-two.htmlhttp://webdesign.about.com/od/webdesignbasics/u/webdesignbasics.htmhttp://webdesign.about.com/od/webdesignbasics/u/webdesignbasics.htmhttp://www.almostaturkishsoapopera.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://www.arnb.com/http://www.arnb.com/


11/11



What are Cascading Style Sheets and why should I use them?

Accessibility http://www.uwsa.edu/ttt/schwanke.htm#Introductory

Web Design Tutorials

How to Build Websites Tutorial http://www.how-to-build-websites.com/

How to Storyboardhttp://www.public.iastate.edu/~nielandj/webarticle4.html

How to embed audio and video files

http://cit.ucsf.edu/embedmedia/step1.php How to upload files to WebCT/Blackboard using WebDav

(https://www.elearning.ubc.ca/plugin/index.cfm)

Web Design Software

Adobe Dreamweaver CS4

Amaya

NVU



http://www.arnb.com/http://www.abdn.ac.uk/webpack/factsheet13.shtmlhttp://www.uwsa.edu/ttt/schwanke.htm#Introductoryhttp://www.how-to-build-websites.com/http://www.public.iastate.edu/~nielandj/webarticle4.htmlhttp://cit.ucsf.edu/embedmedia/step1.phphttps://www.elearning.ubc.ca/plugin/index.cfmhttp://www.adobe.com/products/dreamweaver/http://www.w3.org/Amaya/http://nvu.com/http://www.almostaturkishsoapopera.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://www.almostaturkishsoapopera.com/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://www.arnb.com/http://www.arnb.com/http://www.abdn.ac.uk/webpack/factsheet13.shtmlhttp://www.uwsa.edu/ttt/schwanke.htm#Introductoryhttp://www.how-to-build-websites.com/http://www.public.iastate.edu/~nielandj/webarticle4.htmlhttp://cit.ucsf.edu/embedmedia/step1.phphttps://www.elearning.ubc.ca/plugin/index.cfmhttp://www.adobe.com/products/dreamweaver/http://www.w3.org/Amaya/http://nvu.com/http://www.almostaturkishsoapopera.com/http://www.arnb.com/http://www.almostaturkishsoapopera.com/http://creativecommons.org/licenses/by-nc-sa/3.0/http://creativecommons.org/licenses/by-nc-sa/3.0/http://www.arnb.com/http://www.arnb.com/

Documents

Elearning Toolkit - Web Design