HTML 5 Introduction

This course will become read-only in the near future. Tell us at community.p2pu.org if that is a problem.

Task Navigation 

Install an HTML Text Editor

Learning Objectives

  • Identify desirable features in an HTML editor.
  • Compare two or more HTML editors.
  • Report your comparison to other participants of this class
  • Select an HTML editor for your personal use
  • Summarize the reason(s) that led you to choose your specific editor
  • Use your editor to produce a simple HTML page

Task Materials

For this course we need an HTML editing tool. There are many to choose from. We do not need many advanced features for this basic course so pick a simple text editor with syntax highlighting.

Online HTML editors

There are several HTML editors that you can use in your web browser:

  • Mozilla Thimble - Recommended to use on this course. Provides direct visual feedback, syntax highlighting, and easy publishing.
  • HTML Pad (Mozilla online HTML editor)
  • JS Fiddle (JavaScript, CSS, and HTML editor online)

Free/Open Source Text Editors

The following text editors have syntax highlighting and are Free/Open Source tools:

  • Bluefish (GNU/Linux, Mac OSX, Microsoft Windows)
  • Geany (GNU/Linux, Microsoft Windows)
  • gEdit (GNU/Linux, Mac OSX, Microsoft Windows)
  • jEdit (GNU/Linux, Mac OSX,Microsoft Windows)
  • Notepad++ (Microsoft Windows)

Advanced Integrated Development Environments (IDEs)

Task Discussion


  • tech help   April 5, 2015, 6:30 p.m.

    i used noteped

  • shellz39   May 2, 2014, 10:33 a.m.

    I will use JS Fiddle. I like being able to practice and run all three scripting languages. I usually use Komodo Edit.

  • Ad_man   April 3, 2014, 5:45 a.m.

    I am using Aptana Studio 3, I have used it in the past and it is pretty good and easy to use.

  • Nicole K.   Feb. 18, 2014, 6:04 p.m.

    I have decided to use Mozilla Thimble because I do like the idea of the preview panel so I know what I make a mistake... :/ Also because it is recommended for the class. I have used Notepad in the past but I would like to try something new this time around :)

  • Eager2learn2   Jan. 25, 2014, 8:51 a.m.

    I am using Brackets.Has practically identical features to Sublime Text 2,only Brackets is completely free.I have tried plenty of different editors over the last few weeks,but this is the one that I finally settled on.

  • Krohon   Oct. 16, 2013, 9:52 p.m.

    I was undecided so I asked my 12 years old daugther for help. She said: "We should pick Mozilla Thimble because it is the most recommended, it looks like to have better chances of being the best editor around." So I said, why not?

  • jpollen   Oct. 10, 2013, 4:33 p.m.

    I am familiar with Notepad++ so I decided to stick with that, but I did check out Mozilla Thimble and liked the ease of use and the code/design veiw so I might try that one out also.

  • Karam   Oct. 9, 2013, 3:14 p.m.

    Hi, my current choice of a text editor is Text Wrangler. It seems a lot of people in the web design and development industry recommend Sublime Text 2.

    The latter features code completion so it is better for intermediate and advanced users. Beginners should stick with code editors without automatic completion to develop good coding habits.

  • helenbooth   Oct. 2, 2013, 5:12 p.m.

    Hello. I have opted for the Thimble editor. I've only ever used NotePad to structure code in the past, so as recommended, I'm giving Mozilla Thimble a go. This editor tool will be far easier on my eye when completing tasks. Helen

  • darrenjames   Sept. 15, 2013, 10:12 a.m.

    I have decided to stick with notepad++ as i have been using it since i have begun learning html and i am very comfortable with it. Perhaps when i improve i would want to use a more in depth text editor

  • v4lent1na   Sept. 9, 2013, 9:01 a.m.

    Text editors of choice: TextWrangler and Mozilla Thimble.

    I'm a Mac user, so I chose TextWrangler as a multipurpose editor because it has a very nice, simple and clean interface and I can use it to write programs in other languages too (like Python).

    My problem is that I don't have a revenue, since I'm still a student and TextWrangler is free.

    I tried other open source editors, like blue griffon, but it crashed so many times I couldn't work with it.

    Let's just say TextWrangler is the editor I use to tinker with code, not necessarily HTML.

    While Mozilla Thimble is the editor I use on-the-fly, when I need to write HTML code quickly and/or for small tasks.

  • lioness818   July 29, 2013, 5:20 p.m.

    I selected Mozilla Thimble because  it was the only one actually recommended for the course.  Plus the features it offers seem to be more learning-friendly.

  • Tascam_1   June 28, 2013, 9:05 a.m.

    I'm very familiar with Notepad++ and somewhat with Eclipse, but for this task, I'm going to go with Mozilla Thimble for several reasons.

    1.     Quick access:  I like to be able go directly from concept to code without having to think about menus and clicks.

    2.     Easy integration:  Requires very little in terms of installation or configuration.  Basically just running constantly in a separate tab so I feel like my task and my code are joined at the hip.

    3.     Simple interface:  Because I immediately understood how to use the tool upon first seeing it, I felt that I would not be fighting an interface every time that I wanted to make a change but simply doing the thing that was in my mind to do quickly enough that the idea didn't become diluted as I searched for configurations and menus.

    4.     Empty cup:  Because I'm taking these courses in order to learn new things, I don't want to bring baggage along that may prevent me from seeing something from a new perspective.  My mindset on each task is to approach it as though I have no idea how to accomplish it other than using the tools and information provided previously in the course or current task.  Hopefully this will allow me to take something away from the course that I did not bring with me.

    I code for a living, but am always open to learning something new.

    Good Luck Everyone!!!

  • bryanwoodsmall   June 22, 2013, 4:37 p.m.

    I am using Sublime Text 2.  Also tried Text Wrangler.  Sublime Text 2 has more features.  It is a paid program, but there is an indefinite evaluation period.  After I use it for awhile, I will either buy it or switch to a free one.   So far I like it.

  • Richard   June 22, 2013, 5:12 p.m.
    In Reply To:   bryanwoodsmall   June 22, 2013, 4:37 p.m.

    I've said it before but imho it is worth saying again : I like Geany & especially Geany for Windows

    (make your own custom HTML/HTML5 template & add it to Geany templates & you will save yourself so much time..& Geany supports all sorts of other programming languages & files - Geany & Geany for Windows are great imho! It is also free! smiley ).

  • GabbyNikki   May 3, 2013, 10:46 p.m.

    I started out with Thimble, but it kept giving me errors so I switched to Notepad++.  I'm going to try Thimble again though, it's nice to have the preview pane.

  • Pau Company   June 3, 2013, 3:19 p.m.
    In Reply To:   GabbyNikki   May 3, 2013, 10:46 p.m.

    visitar www.paucompany.es

  • zpatten93   April 20, 2013, 1:48 a.m.

    I am using HTMLpad, i experimented with mozilla thimble, and everytime before i could even finish a line of code, it would send me error messages. 

  • Anonym   April 14, 2013, 8:12 p.m.

    I'm using Sublime Text Editor 2.

  • dsbrennan   April 9, 2013, 9:37 a.m.

    I've used Dreamweaver in the past but will use Thimble as recommended.

  • Anonym   April 4, 2013, 10:01 a.m.

    I usually use vim for text editing and programming, so I'm also using vim for this challenge. Vim is an open source highly configurable editor with syntax highlight among other useful things.

    I'll give a try to Thimble too: it's a web app and I like its preview and publish feature :)
  • Thomazrb79   March 28, 2013, 2:22 a.m.

    I'm using DreamweaverCS6 for editing and posting by Mozzila Thimble as suggested by the course.