Software Recommendations Stack Exchange is a question and answer site for people seeking specific software recommendations. It only takes a minute to sign up.
Sign up to join this community
I am new to HTML programming. Right now I am using Notepad++ to write HTML code and then save it. Then I open that in Firefox and see it what the output is.
Is there any sort of HTML editor or compiler (compiler is not the proper word, I know) which:
A dedicated editor for web dev is Adobe Brackets, an awesome piece of open-source software. Here's some features it has you won't find in other editors:
It also has a lot of plugins available, and it is quite well polished and updated often. You should try it!
My ultimate favorite IDE = Netbeans
Customized Theme:
Basic Theme:
It's very plain, the more you use it, the more you learn it. Just hit open and open you html files, or drag&drop them from your desktop and you ready to code. Or, start coding right and put your files in a project and let Netbeans handle it for you. Moreover, the editor is customizable. You can change font, background colors, size etc. Got good community support and is Open Source.
checks my HTML code for errors: - Got it and very well done + it formats your HTML codes and show tags in colors.
just by clicking some "run " button I am able to see the output: it got it's own integrated browser in a separate panel to display the result + can be linked with your favorite browser e.g. Firefox, Chrome. If you hit run Firefox will fire-up and run your html page.
runs on Windows and Linux: Checked. Win + Mac + Linux.
it should be free and not complicated to use for beginners:
Yup, Free. For beginnings? hmmm, means no complicated stuff, so don't use the advance features available. Netbeans can take you from newbie to pro, the more you use it the more you will learn about it which can save you lots and lots of time in the future. (Let's say you want to change all <span> to <div> similar to notepad++, you can find&replace using text, regex, wild card etc, you can change in files/directory/project)
IMO The best way to learn is to code it yourself. IDEs that allow you to use visual means to build your HTML pages are not very good way to master HTML. Netbeans can work as an easier notpad++, I appreciate even small stuff, like if you CTRL+LEFT CLICK on a url in one html file and it will take you to that source code of that url html file.
You can use it as a one time quick edit IDE for a single page like notepad++ or in a project based where you compose all of your files under one roof/directory/project/namespace etc. as you call it. It allows opening multiple tabs, same or different panel/windows, different colors for tabs based on to which project they belong to. Plus, open a page in a project by just typing it's name, search for file/keyword in project, navigate from project to file or from the opened file to it's base project.
It has a smart html tags checking, highlight errors, show hints, auto complete, HTML drag&drop panel. I prefer it for learning since it shows your mistakes and give you tooltip to know what do add. Type <html> and hit CTRL+SPACE and it will auto close it for you by adding </html>.
You can use Sublime Text editor, with W3C Validator Plugin. Sublime is paid but you can use the trial version without limits. But I would recommend you to buy as its an awesome editor, trust me...
I'll provide a walk through of how this will work..
Step 1 - Click on Preferences, Select Package Control
Step 2
Step 3 : Type in W3cValidators and install
Now how to use this?
Step 1 : Click on Tools and select W3CValidators[1]
Step 2 : Select the appropriate DOCTYPE you want to validate, lets select HTML5 as of now..
Now whenever you want to validate your document, either go to the menu following the steps above or press the short cut key Win + Ctrl + V (If on widows machine)
And what you will see is
If on error
Click on Open Browser option to open in browser
You will get lots of plugin to auto refresh your CSS, and to live edit.
I would suggest you to download Emmet for sublime, that will boost up your coding speed.
Images Source : My Own PC
Tweakstyle is a relatively new entry in the HTML code editor. It is currently in beta but has a good amount of features.
Uses chrome web tools in the preview pane so you can inspect an element and edit matching rules.
It has a preview pane that updates when you save your HTML file. It provides live updates when you change your CSS.
When you open a HTML file it automatically attempts to open any files linked to it (CSS, Javascript, LESS, SASS). You can have multiple files visible at one time so you spent less time clicking from tab to tab.
It points out errors by placing a red x next to the line with the error and a tool tip explaining why there is an error.
It runs on Windows, Mac and it runs on various distributions of Linux(has .deb file or a zipped file).
The only requirement that this doesn't meet is the price. It's like Sublime in that it has a price but the only thing you have to deal with is a nag window infrequently. It seems to show up once a day.
I already answered here suggesting Atom, anyway if you are a beginner (and even if you are not) you may also like a wysiwyg editor. The acronym "wysiwyg" stands for "what you see is what you get", in general a wysiwig editor lets you view something very similar to the end result since the document creation and implies the ability to directly manipulate the layout and contents of documents without having to type or remember names of layout commands, this means a wysiwig HTML editor provides a simple way of creating web pages without the prerequisite knowledge of HTML, CSS or Javascript (but I advise you to study them so to have clearer ideas on the subject of web documents creation).
In this case I feel to suggest BlueGriffon
BlueGriffon is a wysiwig web editor based on the rendering engine of Firefox, it is available for windows, linux and os x and is filled with tons of powerful features already in free version (and you can get even more if you buy a license).
Side mention:
For completeness, I'd like to mention here KompoZer too.
Just like BlueGriffon, KompoZer is a wysiwyg HTML editor (they both originates from NVU) it's available for Windows, Linux and OS X BUT the latest stable version (0.7.10) dates 2007-08-30 and the latest development version (0.8b3) 2010-02-28... it's practically discontinued.
I would suggest Geany as the alternative for Linux. It has the following features:
run button to test your code on a browser. > <.Windows and Linux.It's not a proffesional, production-level tool, but it's great for beginners. You may want to give it a try.
Since nobody suggested it so far I'm going to introduce you Atom
Atom is a text editor that's modern, approachable, yet hackable to the core—a tool you can customize to do anything but also use productively without ever touching a config file.
Atom is open source, cross-platform (OS X, Windows and Linux) and provides smart autocompletion. Also a w3c validation package is available.
Just a final note: since you need a free editor to work with Windows or Linux, Coda is automatically out of the games here... right?
HTML Editor is an online HTML editor with a minimalist approach. Edit your HTML, CSS, and JavaScript code and monitor the instant live preview. This real-time HTML editor is perfect for beginners although it doesn't meet your first requirement.
You can use http://jsfiddle.net/ – it matches your requirements completely.
Free, HTML formatter, WYSIWYG (What You See Is What You Get).
And you can share it with anyone. It's an HTML and Javascript Playground.
