Web authoring system: Difference between revisions

The educational technology and digital learning wiki
Jump to navigation Jump to search
Line 71: Line 71:
== Useful browser extensions ==
== Useful browser extensions ==


Most tools don't provide you with enough information about what you are doing.
Many authoring tools don't provide you with enough information about what you are doing.
Browser extensions, in particular for Firefox, can help.
Browser extensions, in particular for Firefox, can help. E.g. if you develop web page,  [http://chrispederick.com/work/web-developer/ Web Developer] is a '''must have'''.


=== Firefox ===
Read more in the [[browser extension]] article !
 
* [http://users.skynet.be/mgueury/mozilla/index.html  HTML VALIDATOR] is a Mozilla extension that adds HTML validation inside Firefox and Mozilla. The number of errors of a HTML page is seen on the form of  an icon in the status bar when browsing. The details of the errors are seen when looking the HTML source of the page.
** [https://addons.mozilla.org/en-US/firefox/addon/249 related Firefox (en_US) page]
 
* [http://www.getfirebug.com/ FireBug] integrates with Firefox to put a wealth of web development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page. There also is a light version based on [[JavaScript]] that you can use with any browser.
** [https://addons.mozilla.org/en-US/firefox/addon/1843 related Firefox (en_US) page].
** [http://www.getfirebug.com/keyboard.html Firebug Keyboard Shortcuts]
 
* [https://addons.mozilla.org/en-US/firefox/addon/748 Greasemonkey] A quite spectacular extension that allows you to customize the way a webpage displays using small bits of JavaScript. Hundreds of scripts, for a wide variety of popular sites, are already available at [http://userscripts.org UserScripts.org]
 
* [http://chrispederick.com/work/web-developer/ Web Developer]. Tells you most everything about your HTML page.
* Important: To install the DOM Inspector you must reinstall the browser choosing the 'Custom' and 'Developer Tools' options (if not already done so). You won't loose any personal settings, just do it :)
** [https://addons.mozilla.org/en-US/firefox/addon/60 Firefox page].
 
* [https://addons.mozilla.org/en-US/firefox/addon/2897 XML Developer Toolbar]. For XML development. Schema and DTD Generation, Various validation, XSLT on the fly.
 
Find more through the Tools/add-ons menu of the Firefox browser.
 
=== IE ===
 
* [http://www.microsoft.com/downloads/details.aspx?familyid=e59c3964-672d-4511-bb3e-2d5e1db91038&displaylang=en Web Developer Toolbar]
 
Find more through the IE Tools/extensions menu...
 
Note: IE is not well know for extensions, but there are some other useful extensions for other purposes (e.g. videodownloads). Some are payware.
 
=== Opera ===
 
Get at least the developer console and DOM snapshot from  [http://dev.opera.com/tools/ the Opera tools page]. Installing add-ons with Opera is really easy.


== Software of particular interest to education ==
== Software of particular interest to education ==

Revision as of 11:09, 19 March 2009

Draft

Definition

A web authoring system is software to produce webcontents. They range from simple HTML editors to fairly sophisticated integrated development environments.

Today, a lot of web contents are not produced with web authoring systems, but with portalware of various kinds (and that include learning management systems

See also: Text editor (for more technically minded people)

List of editing software

Specific tools for web programming are not included here.

Free HTML structure editors

There are dozens of available systems. We don't have time to evaluate these.

See also XML editors to edit XHTML, SVG etc.

Daniel K. Schneider can recommend both these systems, but prefers to use a programming editor, e.g. (X)Emacs.

Programmer's editors with HTML support

There are lots of text editors with HTML support, e.g.

  • Notepad++ (Windows)
    • Lightweight and easy to use, does good syntax highlightning but no indentation
    • Has a rather large library of plugins.
  • PSPad (Windows).
    • Lightweight and easy to use, does syntax highlighting, but no indentation (too bad !)
    • Only thing you need to know is: "CTRL-space" will open a popup for contextual code completion
  • (X)Emacs (Most systems, that's what I prefer, but young people have trouble with this.)
  • JEdit (Most systems)
    • This is a more complex editor than PSPad or similar, ok for programmers.
  • BBEdit (commercial) is popular with Mac users. The free TextWrangler has some HTML support.

See the text editor article for more information about text editors.

Free HTML WYSIWYG Web Editors

  • Kompozer (formerly NVU). A fairly nice editor. Good for beginners.
  • Mozilla SeaMonkey Suite (a followup from the earlier Mozilla browser that includes a navigator, a composer and an email client).
  • Amaya, The W3C sponsored test browser and editor.

Wikipedia has a list of some Free HTML editors

Through the web editors

See JavaScript links. These systems usually are installed on some web page with a server-side connection (e.g. in a CMS. But nothing prohibits someone to use them client side only (and copy/paste the HTML code)

Commercial Mid or High End tools

  • Microsoft FrontPage
  • GoLive is a dead product since April 2008. See Dreamweaver.
  • Dreamweaver

Other editing software

  • Some word processors like Adobe FrameMaker can be configure for single source HTML/XML/PDF production.
  • (future?) versions of Office XP.
  • Open Office
  • Presentation software can export to HTMLweb authoring

See also document standard, since one can produce HTML from any reasonbly well defined document format.

Useful browser extensions

Many authoring tools don't provide you with enough information about what you are doing. Browser extensions, in particular for Firefox, can help. E.g. if you develop web page, Web Developer is a must have.

Read more in the browser extension article !

Software of particular interest to education

These systems offer additional functionality, e.g. can export to IMS Content Packaging.

Commercial
Free

Links