About HTML, CSS, and JavaScript modes
The first mode I started working on was HTML mode. Before I began writing Alpha's HTML
mode, I had tried several HTML editors, but I found none of them
satisfying. I couldn't find any editor with which HTML editing could be
done faster than simply typing the text. What's the point of using an HTML
editor if all its functions slow you down?
I had for long used Alpha to write LaTeX and I thought it was just
excellent. With Alpha I could write LaTeX documents a lot faster than with
any other editor. Alpha at that time had an HTML mode written by Scott
Brim, but unfortunately it was a bit outdated and lacked many HTML
elements. So the first thing I did was to add all missing HTML elements.
But once I'd begun programming I couldn't stop, so I kept adding new
functions to HTML mode...
HTML mode has now got two child modes, CSS mode and JavaScript mode.
Alpha is not a WYSIWYG editor and it does not teach you HTML. It's a text
editor for you who are looking for an editor which makes HTML editing
easier and faster.
Alpha colors the code to make it easier to read. The image to the right
shows how the text is colored in HTML mode. The coloring is customizable so
you can the choose the colors you prefer.
CSS mode and JavaScript mode
There is support for editing of CSS and JavaScript in HTML mode. CSS mode and
JavaScript mode are two modes for editing of external CSS and JavaScript
documents, respectively. They have basically the same features as the
features in HTML mode.
Why three modes? Well, basically to give you the set of functions you need
for a certain type of document. HTML mode is for editing HTML documents
(suffix .html, .htm or .shtml), CSS mode is for
editing CSS documents (suffix .css) and JavaScript mode for editing
JavaScript documents (suffix .js).
The image to the the left shows how the text is colored in JavaScript mode
and the one to the right shows the text in CSS mode.
Online manual
Below I will mention some of the features in HTML mode. If you want to have
a more detailed look before downloading you can browse the online manual. This manual can
also be downloaded as a single file.
Features in HTML mode
| Speed
typing | When you insert HTML elements you will
see black bullets being dribbled near where you insert elements.
They are supposed to be a feature. The tab key takes you to the
next one and deletes the bullet. For example when you insert H1
tags you will first get
Now type the header text,
and then hit tab to jump to the bullet and delete it. You are now
ready to continue typing. |
| Word
completion | Another way to speed up the typing is
the word completion mechanism. It is best illustrated with an
example. Let's say you want to type a TABLE tag. First type
<ta
If you now hit cmd-tab this is expanded to
Then you perhaps want the attribute CELLSPACING. Type the first few
letters
and hit cmd-tab again.
Alpha tries to expand this as much as possible. Since there is also
an attribute CELLPADDING Alpha expands this to CELL. Now type an
's' and hit cmd-tab again. Alpha then expand the text to
You can now type the value you want for CELLSPACING hit tab and
write the next attribute. |
| Changing and removing
tags | Editing HTML code is not only a matter of
inserting new HTML tags. You want to easily be able to change and remove
them too. HTML mode has several key shortcuts for this. For example,
command-double-clicking on an opening tag opens a dialog with the
current attribute values. Change them as you want and a new tag is
inserted. |
| Preview in
browser |  The files are sent to
your browser with one key storke. HTML mode has a user configurable
menu where you can add your browsers and quickly change which
browser Alpha sends the file to. |
| Jumping between
files | Command-double-clicking on a link in your
document opens the corresponding file for editing. You can also open
image file by command-double-clicking on the image tags. They are then
opened in the program they were created with. |
| Home page
windows |  You can open
windows with lists of your files. I call these windows 'home page
windows'. From these windows you can cut and paste to make links.
You can also open files for editing from these windows. |
| Formatting of the
code | HTML mode has a customizable indentation of
the code and a function to reformat messy code to make it more
readable. |
| Checking
links | HTML mode can check that all links between your files
are ok, and lets you easily fix broken links. |
| Dynamically included
files | Sometimes you want to use the same code in many files.
For example, you want every page to have the same header. This code can
be put in a separate file and be dynamically included in other files. If
you want to change the header you only have to change it in one place
and then quickly update all the other files. |
| Character
translation | HTML mode translates special
characters, å, ó, ü etc. to and from their HTML
entities. |
| Extending HTML
mode | You can define new HTML elements. Therefore
you don't have to wait for Alpha to be updated to use it for new
HTML. |
| More... | There
are of course more features in HTML mode. I let you discover them for
yourself. Thanks for reading all the way down here |
