Line25

HTML & CSS Editing Apps For Windows Designers

Read the full post

Last week’s roundup of HTML and CSS editing apps for Mac users proved really popular, but the Windows based designers were feeling a little left out. This week’s roundup pulls together the most popular editing application choices for PC users.

TopStyle ($79.95)

Visit the app website

TopStyle for Windows contains powerful tools for building standards-compliant websites. It includes useful features such as live preview, built in validation, live editing and HTML5 support.

Screenshot

Application screenshot

Notepad2 (FREE)

Visit the app website

Notepad2 is one of the most popular utilities for Windows users. It’s a fast, lightweight and simple application. Notepad2 doesn’t include fancy features of more robust editing apps, but if it’s just a program to manually write your code that you’re after, Notepad2 may be for you.

Screenshot

Application screenshot

Stylizer ($79.99)

Visit the app website

Stylizer is a web page building app with a range of unique features such as drop-and-drop functionality and ‘Bullseye’ on-page editing. Stylizer is described as a great tool to help designers learning the basics of CSS to learn better through its real time visual tool that lets you see how the pieces fit together.

Screenshot

Application screenshot

E-TextEditor ($46.95)

Visit the app website

E-TextEditor is the Windows alternative for the popular Mac only TextMate app. It supports TextMate bundles and snippets, as well having the ability to be extended with new languages.

Screenshot

Application screenshot

Style Master ($59.99)

Visit the app website

Style Master is a CSS editing app that’s available for both Windows and Mac users. It features live editing of websites vis FTP, has both design & code views and built in browser support for easy troubleshooting.

Screenshot

Application screenshot

PSPad (FREE)

Visit the app website

PSPad is a freeware editor with support for a number of file types and languages. Features such as syntax highlighting, macros, clips and templates make it a complete application for the designer confident with their coding skills.

Screenshot

Application screenshot

Rapid CSS ($29.85)

Visit the app website

Rapid CSS features both manual editing capabilities and the option of having a stylesheet automatically created. Other features such as auto-completion, code inspection and validation make it a good competitor.

Screenshot

Application screenshot

StyleSheet Maker ($34)

Visit the app website

StyleSheet Maker is a CSS editing application with a visual wizard feature allowing you to build ID and Classes through a WYSIWYG editor. It’s not limited to CSS though, HTML documents can also be created and tested in multiple browsers.

Screenshot

Application screenshot

EngInSite CSS Editor ($39.95)

Visit the app website

The EngInSite CSS Editor is a complete CSS editing application with all the features you could wish for. Live preview and validation, visual editing, wizards and auto-completion features make it a great app for both beginners and veterans.

Screenshot

Application screenshot

Astyle (FREE)

Visit the app website

Astyle is a simple CSS editor with a clean interface. The useful graphic tree view makes it easy to navigate through your CSS and HTML documents.

Screenshot

Application screenshot

Dreamweaver ($399)

Visit the app website

Dreamweaver is one of the most well known page building apps. It includes a range of unique features and is a robust app allowing websites to be build via the Design or Code views. If you already have access to Dreamweaver as part of the Adobe Creative Suite, it definitely has every tool you’ll ever need, as well as some you probably never will need!

Screenshot

Application screenshot

Notepad++ (FREE)

Visit the app website

Notepad++ is another free lightweight application for Windows and is a popular choice for veteran programmers who only need a basic app to manually write their code.

Screenshot

Application screenshot

Free web shadows pack for every subscriber

Join the mailing list to have new content delivered straight to your email inbox. Every subscriber gets a free pack of realistic web shadows.

Written by Chris Spooner

Chris Spooner is a designer who loves experimenting with new web design techniques collating creative website designs. Check out Chris' design tutorials and articles at Blog.SpoonGraphics or follow his daily findings on Twitter.

  • http://www.fuzzimo.com/ fuzzimo

    Thanks Chris! I always like to test different editors. Another free one that I found useful a while back was <a href="http://www.alleycode.com/">Alleycode</a&gt;.

  • Thomas Britton

    I'd suggest Intype (http://intype.info/home/index.php)

    Possibly the nicest looking text editor for Windows in my opinion. The only problem its quite featureless and hasn't been updated for some time.

    But perfect if you want a lightweight option with good syntax highlighting.

    • http://www.creativeindividual.co.uk Laura

      Also my text editor of choice :)

    • http://celareartem.com Artem Pereverzev

      Agree. Intype looks best. If only it had everything Notepad++ had to offer!

    • http://www.etondigital.com Dusan

      Intype is in 0.3 alpha stage as long as I can remember. I suggest you use e-texteditor instead. I miss that super-useful undo history feature (I switched to mac a year ago)

  • Brussells

    Awesome list of editors, some I'd not heard of but look promising, and worth a trial (if they have one).

    Netbeans is another one, which I'm using at the moment, but has only just started implementing HTML5 and CSS3 support for auto complete etc. Worth checking out though.

  • http://sideradesign.com paul

    windows is really lacking a good CSS editor like CSSEdit for MAC.
    Stylizer has a great concept, unfortunately, there isn't an option to manually edit code, which means you can't use advanced CSS3 that hasn't been included in the UI.
    stylemaster hasn't got the greatest interface, seems like it was designed in the early 2000s.
    topstyle keeps crashing in the preview.
    I went back to notepad++
    there's a new web app called buildorpro that allows you to design in the browser. it's currently in beta. although it still has limited uses such as rapid prototyping. don't expect to be able to build a fully fledged HTML5/Css3 app with it.

  • Nils Pedersen

    Hi Chis,

    Another great article from you..

    One editor I would suggest is Aptana WebStudio with built-in FTP-Connection, macros and much more.
    Its also comfortable with MAC
    - Check out http://aptana.com/ – The new 3 version of Aptana is out now :P

    • http://www.apurvapangam.com Apurva

      Aptana is great – very nifty especially if you want to extend it to Javascript, Ruby on Rails, etc!

  • Nils Pedersen

    * compatible

  • http://www.burakcalik.com xmripper

    Stylizer is really the best visual CSS editor imo. I've been using it for 2 years.

  • http://www.tutoriallounge.com Tutorial Lounge

    useful editors you listing. thanks

  • http://ragnarkarlsson.com Ragnar Karlsson

    I use WeBuilder from Blumentals, it is quite a bit more than an HTML/CSS editor but it does them quite well in my opinion for a not dissimilar (or less, in the case of Dreamweaver) price.

  • http://labusdesign.com Bill Labus

    How can Windows be so freaking ugly? It's like they're going out of their way to do it… :)

    • http://danaemc.com Danae

      Haha, the ugly ones are Windows 95 etc. Also the most of the actual applications seem to follow function-over-form, which is fine by me. I'd rather something that was ugly and worked, than something that was pretty and useless.

  • http://www.emdesigns.de Michael

    I am using PSPad and I love it.

    @Bill Labus, this was Windows XP and it didn't look good, you have to check out Windows 7 it looks much better :-)

  • http://drawne.com Andy Feliciotti

    Notepad++ is tops for me

  • http://www.demogar.com demogar

    E-Text Editor is my choice, it's really great and the best of it is that you can use TextMate bundles within it.

    However, I tend to use Notepad++ too, simply great and lightweight

  • http://www.jecadesigns.com Auz

    Great list, but I was surprised there was no mention of EditPlus. It's a great editor especially when you add custom commands.

  • simmo

    In your opinion what is the closest program to Coda on Mac?
    Im using dreamweaver just because I have it atm.. but Coda does seem like an amazing piece of software.
    Staring to think I may have to invest in some apple hardware

    • Nils Pedersen

      @simmo – I would say Aptana… I can't mention any editors thats closer to Coda than that.. But if there one of you who know one, Im also listening ears :)

  • http://linknomer.com andrei

    http://www.sublimetext.com/ free and very good looking

    • http://www.exon.co.nz Wayne

      I agree, Sublime Text is my choice for editing.

  • http://jthreeconcepts.com Jose

    there is one more which is under development and i have been using it for about 4 months now which is nice and i think it should be review,

    intype.info

  • http://www.fourdivisions.com Four Divisions

    I am using Notepad++. this is the one of the best tool for editing Html and css files.

  • http://www.billigfergebillett.no Billig Ferge

    I´m using Dreamweaver, that is working fine for me.. Also use Notepad if needed.
    :-)

  • http://www.clockdiscount.com/ Ed Baxter

    Notepad++ is what I use. Lightweight, snappy and very solid.

  • http://www.postmodem.co.uk Daryl

    Nice round up – I'd echo Nils though, Aptana really should get a mention. Especially as it's compaitble with Zen Coding (my new best friend)

  • Bob

    Notepad++ is the best.

  • http://www.calaveracreative.net/ Dave

    HTML Kit is one of my faves. There's a free version too.

    http://www.htmlkit.com/

    Great post :)

  • http://www.techguywebsolutions.com Brad Traversy

    I keep it simple..Dreamweaver or something like NotepadII. I think the GUI software and wysiwyg does more harm than good. Good old fashion coding.

  • http://www.seandey.co.uk Sean

    I have always used notepad++

  • Janet Kern

    It's easier to use notepad/notepad ++. It's harder, for me anyway, to learn how to use a wysiwyg editor then to learn code.

  • http://www.aheadcreative.co.uk David Smith

    Great list Chris. I've just started using:

    Sublime Text – http://www.sublimetext.com/

    Compatible with TextMate and features:
    * Macros
    * Powerful Snippets
    * Panels
    * Quick document viewer
    * Clean and simple UI

    Highlight recommended.

  • http://www.ashrobbins.com Ash Robbins

    Does anybody know if the free version of Microsoft Visual Studio is any good?

  • http://twitter.com/rteslya Roman Teslya

    Notepad++ fits all my needs. Simple and effective.

  • http://www.twitter.com/jamiewillmott Jamie Willmott

    I'm a fan of Notepad++.

    I also use some of the add-ons for the firefox browser, such as Firebug.

  • http://andymatthews.net Andy Matthews

    I'm shocked that you left out UtraEdit, EditPlus, CoffeeCup, and Aptana Studio.

  • http://advertise-stl.com james singleton

    this is a great collection of tool some im not to familiar with tho notepad period is like a standard to me its time to use different tool

  • http://www.dezineware.com Rehan Khan

    I have just started writing Div codes… and this post is right on time thanks man

  • http://blog.mintdesign.pl Mateusz Lomber

    I also would add intype to that list (works fine for me ;))

  • http://www.websondesign.com Alex Mos

    Hmmm… I thought I'm not the only one using PHP Designer to code html/css. It has all you want code to programming: html, php, javascript, ruby, etc, etc. I like it how it switches the highlighting (colored/light gray) between html and php depending on which part are you working on. Great especially when creating themes for WordPress. It als has a nice code snippet feature, suggestions-as-you-type function similar to what Dreamweaver has, and ftp manager, opening files and saving them directly on server. And it's pretty decently priced, unlike Dreamweaver. http://www.mpsoftware.dk/

  • http://kajrietberg.nl Kaj Rietberg

    Iḿ using the Bluefish editor. It works very handy, if I'm typing a selector, bluefish gives me different ones wich I'm probably want to use too choose from. It also explains what it does. Beside that gives colors to the dirrirent words. As last I also use it on my Ubuntu pc. I have the same program on Ubuntu as on Windows 7.

  • http://illustrator-artwork.blogspot.com Ahmed Abbouh

    Hi everyone i really recommend Dreamweaver it's the best tool for windows both developers and designers

    Good Luck

  • David Dias

    What do you think about Aptana? Isn't it a very good alternative?

    Btw, will be there a Guide of tools like this to Linux soon?

    Thanks!

  • http://www.dotswebdesign.co.uk Web design Leeds

    I use dreamweaver and firebug for my web designs but going to take note of the article and user comments and try other apps too, Notepad++ was mentioned a few times

  • Davor

    Notepad++ with a nice skin FTW!

  • http://www.pixmac.com Simon

    Notepad++ :)

    best
    simon at http://www.pixmac.com

  • gugumanu

    Avesome post, as usual :)

    But what about WeBulder ?
    [ http://www.blumentals.net/webuilder/ ]

    I use it fot a few years and i'm happy.
    But for special things (huge files) Notepad 2 is, imho, more speedy

  • Dave

    Aptana Studio is my preferred choice

  • http://www.massdesigners.net saleh

    its the best …

    thanks Chris Spooner

  • Stas

    I suggest to add one more very good free HTML editor – Codelobster PHP Edition (http://www.codelobster.com)