Webpage Design 1

What rules are there when creating a webpage? The aren't any BUT there are generally accepted protocols. Here are some links that may help you.
Look at the basics of web design; The dos and don’ts. From this you should be able to produce a better site.
Web pages are built on the basic commands of the Hyper-Text Mark-Up Language (HTML). There are of course now very powerful programmes that can help you create webpages in What-You-See-Is-What-You-Get (WYSIWYG) mode, such as Dreamweaver. These are editors that operate in a similar vein to a word processor where you enter text and then highlight it (select it) and choose the formatting appropriate. eg bold, italics etc.

 

Before you start to design your own sites, go to www.webpagesthatsuck.com
Choose "The Original Pages That Suck Examples" and take the short tour with it of pages that feature bad design. Make a note of some of these. You have probably been annoyed by some of the same features in your web surfing.

 

You should also check out the link www.useit.com/alertbox/9605.html
This was written some years ago so there are some features that are no longer a proplem, but nevertheless it provides a good source of information. It is also interesting to see how the technology has changed since then.

 

info.med.yale.edu/caim/manual/contents.html is perhaps the most comprehensive of all references (It is Yale after all).  It is quite long, but provides a very complete picture of what should constitute a good site.

 

Of course, there are a countless number of other sites that you are free to examine in your quest for web design nirvana. For example, I recommend www.htmlhelp.com, which provides links to other good articles and ideas, including some in  Japanese.
www.pageresource.com contains links to many HTML and webdesign articles.
You may like to put electronic networking into further practise by joining one of the mailing lists that some of these sites provide.
 
You are welcome to use whatever web page editor you prefer. Frontpage(part of the Microsoft Office suite) is a middle of the range while Dreamweaver is the Deluxe version. There are also Composer (the free editor provided by Netscape) and the Microsoft freebie, Frontpage Express. Of course, you can also program using HTML using a basic editor program like Notepad or Wordpad in the Microsoft Office suite.
Hints on Developing a Web site
1. Who is your site for?
Most of the population of Planet Earth has the potential to access your Web site. Which sub- group are you aiming at? Students? Teachers? Parents? Define carefully.
2. Where are you going to put your site?
Web sites live on computers called servers. Servers are connected to the Internet. The speed at which the server can send and receive information via the Internet is important. If you have a large, multimedia site with many graphics, sound files, on-line chat programs etc. and you place it on a slow server, your target group will most likely give up in frustration because it takes too long to download your pages.
3. What sort of computer power do you think your target group will have?
This relates to the above question. Even if you have your site on a fast server, if your site is intensely multi-media and your target audience is using old computers, you will have the same problems. If you want to develop a complex site that requires plug-in programs such as frames, streaming audio or video, ShockWave, or other special applications, be sure to let the reader know on the first page what they will need to access the page successfully. You might consider in this case to provide a simpler version for readers who lack state of the art hardware or software.
4. Budgets and servers
The school budget (or the developer's own finances) must be considered. Internet Service Providers (ISPs), particularly of the commercial variety, charge by time and downloads. Most also limit the size of a subscriber's Web site.
5. Site design
This relates back to the target group, the amount of computing power your server will have, and your technical competence to develop a site. In general, the KISS (keep it simple, stupid) principle applies. Remember, while a complex site may work very fast on your own machine, this will not be the case when you upload it to the server.
Other points on site design:
Graphics should be used sparingly, and should reinforce the theme of the site. Do not use graphics just because they look pretty. The same goes for sound files and any video clips. Remember that any file other than straight text files (graphic, sound, video) is correspondingly larger. A 3 minute video clip in .AVI format can be up to six mebabytes!
If your site is more than one page, consider using a story board in the initial design. This will help you devise ways of setting out your pages in a logical and navigable way for the readers, and will also help you to set your hyperlinks properly.
Always have some method for readers to contact you. The 'mailto:' tag is very useful for this.
Learn the latest version of HTML. It's simple to learn, and while the later Web editor programs are very good, knowing HTML will allow you to fine tune your pages exactly the way you want them.
Browse! Go back to pages that caught your eye. Use the 'View' button (on Netscape) to look at the author's code. Remember also to bookmark any sites you may want to revisit. Get familiar with Web-related programs. Learn about interactive scripting (CGI), Java, JavaScript, and other applications which can make your Web site powerful and efficient.
CHARACTERISTICS OF ANY EDUCATIONAL SITE
Requirements for Use
•Browsers
•Netscape
•Internet Explorer
•Opera

•Lynx

•Safari

•Mozilla

Technology required - user end
Frames
Java
JavaScript
Plug-ins
Sound & Video
RealAudio
•Quicktime
ShockWave
Technology used -- server end
CGI
Database
Reason made
Product of class activity
Information resource
Supplementary material
Profit-making (fee for access)
Advertising
Who made
Individual teacher
Individual student
Class project
Cooperative project
School
Publisher
Other Company
CHARACTERISTICS OF LANGUAGE SITES
Function
Language Practice
Function
Specific Language Function
•pronunciation
•grammar
•vocabulary
•reading
•reading practice
•useful info for discussion
•writing
•Message creation
•Information creation
Type of Activity
Read only
Read & Do
Game
Quiz
Target Student Type
Language Level
•Low -- Intermediate -- High
Grade Level
•Elementary
•Junior High School (years 8-9 in Qld)
•High School
•University
•Adult
Nationality
All cultures
Specific cultures
EVALUATIVE CRITERIA
Pedagogy
Clear pedagogical goals?
Effective?
Proposed learning/discovery pathways? ie: choice of guided or unguided discovery of the WebSite/Cyberspace. Material can be integrated in curriculum/easily adaptable to own teaching? Or very much self-standing learning resource. Uniformity/gradation of language level of material
Volume of Material
Little -- Much
Interest Level
Low -- High
Presentation
Effectiveness of graphics, color choice
Intuitive navigation controls?
Well (concisely) described and 'logical' (to learners...) links between pages
Overall design of the site, not only pages
Maintenance
Site has been updated regularly
Technical aspects
Effectiveness of Scripting/Programming
Response time
Quality of code (bugs, etc.)
Cross-platform capability
Loading time (Site size)
Conformity of HTML code to standard
What does it do that couldn't have been done with paper and pencil?