Browser extension

The educational technology and digital learning wiki
Jump to navigation Jump to search

<pageby nominor="false" comments="false"/>

Definition

“A browser extension is a computer program that extends the functionality of a web browser in some way. Depending on the browser, the term may be distinct from similar terms such as plug-in or add-on. Mozilla Firefox was designed with the idea of being a small and simple web browser, delegating more advanced functions to Mozilla extensions.” (Wikipedia, retrieved 10:48, 19 March 2009 (UTC)).

Browser extensions can be considered a variant of rich internet applications, since they may connect to the Internet and they ought to offer a similar security model as Java (In practise though we suggest to be careful and only download extensions that are rated by informed users and from places you trust).

We believe that there is huge potential in education for such extensions (and some already exist). It's a technology that can be compared to commercial initiatives like Adobe Air or other technologies used for desktop widgets. An other alternative to browser extensions are browser modifications, such as Flock (a social software variant that is built on top of standard Firefox code).

Firefox extensions

Below is a short list that should not grow too big. See the links sections.

Adding an extension to Firefox is easy, but may be different for each version. E.g. you may find it through the "Tools" menu -> "Addons".

To make it simple:

  1. start up Firefix
  2. Go to: https://addons.mozilla.org/en-US/firefox
  3. Search for an extension, then click on the title (not yet the "add to Firefox button) and read some of the reviews. Often there exist several alternatives for a given functionality.
  4. Click on "Add to Firefox" if you want to have it
  5. Restart the browser once you are done adding extensions.

Too many extensions may slow down the browser ...

For students, researchers and teachers

  • Zoom Page zooms full page or text only using two buttons in status bar. Useful if you want to project web pages in a classroom.
  • Zotero, to help you collect, manage, and cite your research sources. Scrapbook is an simpler alternative with different functionalities.
  • eLML editor, to edit eLML documents (not stable yet on 3/2009). This editor is based on Firedocs.
  • Firedocs a word processor and remote authoring workspace. Firedocs has support for a growing number of document formats and content servers. It can Auto-discover editable content while you browse it and provides wysiwyg editing for html and xml-based content types.
  • Wired-Marker is a permanent (indelible) highlighter that you use on Web pages. The highlighter, which comes in various colors and styles, is a kind of electronic bookmark that serves as a guide when you revisit a Web page
  • Google Gears allows to work offline with certain web applications.

For general web use

  • Googlebar. See this pages for some (outdated) pointers to other domain-specific searches. Otherwise, the home page is outdated (but not the extension itself).
  • 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 UserScripts.org. See user-side JavaScript for more information (including a link to useful mediawiki scripts).
  • Colorful tabs. Adds color to tabs. If you browse with lots of tabs, makes finding the same tab a bit easier (similar extensions exist).
  • Resurrect pages. Finding ghosts of dead pages. Truly useful, if you find dead links in this wiki ;)

For web page authors and web developers

  • 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.
  • Web Developer and DOM Inspector. 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 :)
    • Firefox page.
  • ColorZilla includes an Eyedropper, ColorPicker, Page Zoomer and other colorful goodies.
  • 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.
  • XML Developer Toolbar. For XML development. Schema and DTD Generation, Various validation, XSLT on the fly.
  • XQuery USE ME (XqUSEme). A XQuery processor. Great for teaching XQuery. E.g. you can put some huge XML files on some server and then ask students to do queries and also generate HTML output which then shows in a browser window.
  • Screengrab is an extension that makes it easy to save a web-page as an image – it’s a screen capture tool for Firefox! I use for creating screen shots of web pages for this wiki. It possible to select just an area.
  • There doesn't seem to be an integrated CSS validator. For convenience, you can install CSS Validator which will use the online W3C CSS Validator. Since it will forward an URL, your page must be published on a web site.

There are dozens of other useful extensions, but as we said, some extensions may slow down your browser, some eat memory and all slow down startup. Here are some extra ones:

  • Codeburner for Firefox
    • It provides searchable reference information and code examples for HTML and CSS. It's a standalone version of the original CodeBurner for Firebug, but with an independent interface, and more dedicated search tools.
  • JSView 2.0.
    • offers the ability to view the source code of external files. Most websites store their javascripts and style sheets in external files and then link to them within a web page's... A must have for JS coders that want to understand how others code client-side interaction.
  • Web Doc Processor
    • modularized Firefox extension for processing and validation of XHTML web documents inside browser.
    • Currently (Sept 2009) still experimental (works under Linux, HTML Validator does not ....)

For mediawiki authors

  • It's All Text! 1.3.1. Edit textareas using an external editor, because it's all text!
    • I use this to edit edutechwiki pages on PCs with an external editor.
  • CoLT Copy Link Text is tiny extensionto copy a hyperlink's associated text or both the URL and the text in various formats.
  • Wiked. Not an extension but a script for the Greasemonkey extension.
    • Best mediawiki editor, if don't want to work with an external editor (as of 3/2009).

Other browsers

IE

  • Web Developer Toolbar (for IE 7 only !)
  • IE 8 integrates developer functionalities: Getting started with the tools is simple: press F12 or click Developer Tools from the Tools menu.

Find more through the IE Tools/extensions menu...

Note: IE is not well known for extensions, but there are some other useful extensions for other purposes (e.g. videodownloads). Some extensions are payware.

Opera

Get at least the developer console and DOM snapshot from the Opera tools page. Installing add-ons with Opera is really easy.

Retrieved from "https://edutechwiki.unige.ch/mediawiki/index.php?title=Browser_extension&oldid=25439"