As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 11 years ago.
I use dreamweaver and i'm trying to teach my friend HTML and CSS but he needs a program like dreamweaver thats free. Do you know any good web design programs for beginners?
Notepad++ on Windows
TextMate or Coda on Mac
Or, if you have a penchant for regex and infinite time to learn commands : VIM
Get in there and get dirty with the code and mash F5 on the browser (if you are on Windows or Command + R on Mac), best way to learn HTML and CSS. WYSIWYG editors are just a bad influence, because they don't teach you best practices.
Some tutorials from html-dog are where you want to start.
You aren't happy with #Myles answer so let me elaborate.
You said you want to teach your friend HTML and CSS: well, the best way to do that is to get a text editor and start writing code. There might be a slightly steeper learning curve, as there always is when doing something that a piece of software would otherwise do for you using a GUI, but within a short while you'll actually save time not having to plough through the GUI to achieve what you're trying to achieve.
Notepad++, as far as your non-vim, non-eMacs text editors go, is a pretty good solution for Windows. Textmate would be a great alternative for Mac OS.
The answers so far are very reluctant to offer up WYSIWYG alternatives to Dreamweaver since the community at large is reluctant to utilise these tools, and with good reason. Back in the days when websites consisted of table-based spaghetti, a tool like Dreamweaver might well have come in handy. But now that the focus is on writing clean, semantic markup and reusable CSS, a WYSIWYG editor on autopilot isn't going to be up to the job.
Another thing: the Adobe suite of products are very good at what they do. Dreamweaver, as it goes, is the market leader. But when Dreamweaver has shortcomings in itself, why would you want to resort to a poor alternative?
A few tools for this:
Coda, from Panic: http://panic.com/coda
Emacs
Vim
Butterflies
For the actual design, Photoshop and Pixelmator seem to be good.
And if you want such a horrible WYSIWYG, the only thing I can think of is Dreamweaver or Frontpage, but I've never worked with them and I never will do so.
Try Kompozer, its open source.
Checkout the screenshots first: http://kompozer.net/screenshots.php
For just HTML/CSS I agree with Myles Gray. Go for a simple text editor instead of some IDE or WYSIWYG apps like Dreamweaver; you'll get used to the code a lot faster if you start out by typing it yourself.. even if it means spending a lot of time on that.
Once you know the syntax/code/etc inside out, move on to something like Aptana, NetBeans, Coda or another IDE of your preference.
Good luck.
Use NetBeans by Sun Microsystems
If you're on Mac, Smultron has a basic WYSIWYG, but I haven't tried to push it too far. You're always going to get browser rendering problems.
Related
As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 11 years ago.
In various forums and blogs, I see some people promoting HAML and some promoting HTML. What are the advantages and disadvantages of using HAML vs HTML?
I just want to understand what I'm missing out on if I use HAML in favor of HTML (if any).
You are trying to compare Apples to Oranges. Browsers only understand HTML. HAML is just a templating language that gets transformed into HTML (e.g. same final output). If you find the HAML syntax to be easier than HTML then go for it. However IMHO - abstracting away what actual elements you are generating just makes applying CSS and doing JavaScript navigation that much more difficult.
Personally if I wanted to "trim" my HTML, I would put content into tags (depends on your serverside technology)
<!doctype html>
<html>
<head>...</head>
<body>
<x:awesomeListThing data="$foo"/>
<x:foreach data="$bar">
<x:renderBazWidget/>
</x:foreach>
<div>random content that hasn't been "tagified" yet.</div>
</body>
</html>
Then inside any tag's template you'll be able to see the actual HTML structure that is being generated.
On Stackoverflow - HTML has 65k followers. You WILL get an answer, most likely many answers, in a very short amount of time. HAML has 157 followers. Simple math.
The main disadvantage of using HAML over HTML is simply that HTML is just about universal among web developers, where as the HAML community is still a relatively small community. This would undoubtly make finding developers to work on your project in the future a more daunting task.
But if you have the resources, you could argue that to be an advantage. Ensuring you only hired developers that were capable and experience in HAML.
The other major down side I can see is that if you have graphics/web designers working on your templates, separate from your development team, they would also have to be familiar with HAML. As you can imagine there are very few graphics/web designers who capable of it, and few tools to help them.
Google HAML. I am sure, you will get relevant stuff to understand it.
Haml is:
Easy to read and visually expresses your DOM hierarchy
Easy to learn
Ported to other languages
Well-maintained and has a huge community
Popular with designers because it borrows CSS syntax
Almost as fast as plain ERB
Makes many types of error impossible (or very difficult)
See here :
Your attitude to Haml?
When major IDEs (such as Aptana) learn to parse HAML, we can return to the question. Right now I see HTML's superiority in that it's widely supported and understood by common parsers. You get proper syntax colouring and any errors or validation problems get marked instantly. This is not true of HAML.
Additionally, consider web templates. They're usually (X)HTML + CSS, be them ready templates for hire or the designs your designer cuts for you. What are your odds of getting a, say, HAML+SASS template instead of the usual XHTML+CSS?
HAML needs to gain more field and its community needs to grow much more before it's a viable alternative to HTML. Currently most web coders don't even know what HAML is, not to mention writing anything in HAML.
As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 10 years ago.
Besides the new Google Docs, all the other WYSIWYG web-based rich text editors (ckeditor, tinymce, old Google Docs) I've seen are based on contenteditable or designMode. I personally hate using these editors. It doesn't take much formatting or copying/pasting before the whole experience turns into an exercise in frustration. Returns suddenly start getting double-spaced, unintended formatting gets introduced via pasting from other HTML sources, undo's/redo's are completely broken, formatting becomes excruciatingly difficult to control, etc.
I believe this is one of the reasons Google Docs introduced its own much more constrained, non-HTML formatting engine. Is there any open-source library out there that provides something similar? Thanks in advance.
You could start with the Ace editor (formerly Bespin and Skywriter). It's aimed at code editing, so it's missing formatting and other features, but you may find a useful core of functionality to base a rich text editor on.
In action: http://ajaxorg.github.com/ace/build/editor.html
Code: https://github.com/ajaxorg/ace
Update: As #theazureshadow points out, the current editor doesn't use canvas as I originally reported. Bespin used canvas before it merged with Ace, which uses the DOM. Peeking briefly under the hood, it doesn't appear they are using contentEditable or designMode, though. (There's a <textarea /> that follows the cursor around and spans and divs to show the text - a bunch of custom JS to wire it all together, methinks.)
From ace.ajax.org > History:
Bespin started as part of Mozilla Labs and was based on the
<canvas> tag, while Ace is the Editor component of the Cloud9 IDE
and is using the DOM for rendering.
You're right: it's much nicer.
Is there an open-source library out there that provides [a document editor that doesn’t use the browser to handle editable text, instead using a custom editing surface and layout engine, entirely in JavaScript].
Doubtful.
First, the editor is dubbed "Kix". It's not non-HTML, but it doesn't use contentEditable because it sucks for what they're doing, as you mention. What it does is tricky and bulky to do right, and I'm sure it took them a good bit of effort to create it.
That said, why would Google open source Kix? It undermines their effort to be your documents hub, and it would mean they have to do a bunch of additional work to separate Kix from the rest of Google Docs in a way that doesn't leave it difficult to integrate. The benefit? Not much, seeing as though open source projects sponsored by Google are unlikely to see support in the form of developer-participation in improving it.
As for someone creating a library to do it, I'm doubtful it'll happen in open source. Usually open source projects that are a significant undertaking are university or company sponsored, and that's not likely in this case for the reasons above. Then again, if a developer has an itch for it, there's no telling where it could go…
There's HTE, unfortunately it is slow and misses a lot of basic selection functionality.
As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 9 years ago.
As one of those people that never got around to properly learning design (or having no talent for it), the design seems to be the step always holding me back. It's not a problem for rich-clients, as the standard GUI toolkits provide some acceptable ways to design a good-looking interface, but the web is another story.
Question: Does anyone know of a high-quality framework for designing the interface of web applications? I'm thinking of standard snippets of html for an adequate set of controls (the standard html controls plus maybe navigations, lists, forms) and style sheets to give it an acceptable, modern look. If such a thing existed, it could even support themes in the way wordpress, drupal etc. allow it.
I know of the yahoo yui, but that's mostly javascript, though their grid css is a step in the right direction.
Try the samples on ExtJs.
I find them immensely useful in working out the UI. (trees, panels, modals, etc etc)
I realise this is an old thread but it still comes high up in Google searches so it's worth mentioning that Twitter have recently put out Twitter Bootstrap, a "toolkit for kickstarting CSS for websites, apps, and more" which looks fantastic! » https://github.com/twitter/bootstrap
I'm not sure that what you're looking for exists in the way you're looking for it. However, I've had some luck with places like Open Source Web Design and Open Designs, which have some really slick templates that can be adapted to a web application so they at least don't look like crap.
There are also some commercial offerings, such as Gooey Templates.
Once you're getting closer to launch, you can contact a pro to fix the details for you, or simply build on what you've got.
Edited to add: You might also want to consider learning Blueprint CSS. I've found it helps guide my layouts and helps them look "right", without constraining me to the layout constructed for another purpose.
I'll suggest Google Web Toolkit if you're a Java developer. Examples
I'll also second the suggestion for Ext JS. It's got a vast array of really slick looking UI elements, incredibly well documented code, and a strong community.
You'd probably also find the myriad of Wordpress templates reasonably useful to build on, as Wordpress is at least reasonable at separating content from layout. The also tend to have a modern bloggy feel. Of course teaming up with a talented designer is the ideal way to go in my experience! :)
This will be more than a framework OP originally wanted but I'll suggest having a look at Morfik.
You'll be able to build pretty slick user interfaces with the conventional drag&drop way and with theming support (The homepage itself is built in Morfik). There're numerous other advantages Morfik provides, though let me not drift to off-topic for the subject. You may download the trial and see...
ps. Disclaimer: I'd worked for them.
you can check out this young site, http://guitemplates.com/. The templates are quite clear and modern, and at 20 bucks each they won't break your budget.
We had the same problem so we made our own. CSS UI (http://css-ui.com/), open-source UI framework. The concept is to use pre-defined CSS classes to style any element.
Check out http://jacanasoftware.com. Their templates feature multi level tabs, clean css, it validates, and the CSS won't mess with your controls. I highly recommend them.
As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 9 years ago.
I have to choose an online WYSIWYG editor. I'm pending between TinyMCE and Xinha. My application is developed in Asp.Net 3.5. Could you help me with with some pros and cons?
Haven't tried Xihna myself, but I have experience with TinyMCE and FCKeditor. In my company we switched to TinyMce (from FCKeditor) due to the superior support for pasting from word documents and the (relatively easy to work with) plugin architecture which we used to add some custom modules (links browser, simple file browser). TinyMCE also converts the text to xhtml code which is usually better.
I'd recommend FCKEditor over TinyMCE. I've had much better luck with it (better markup, better managers, better extensibility, better speed, better compatibility, etc)
Try SPAW Editor. File Manager is included. Editor is generated from server side code, meaning it's lighter on client side processing.
Of course TinyMCE :)
I found Xinha to be much better and more functional than FCKEditor. If you know PHP and a dab of javascript you can customize the file manager, and there is a lovely set of plugins on offer. I am also impressed with what I have seen of TinyMCE and due to wider adoption you may find it to have more options.
I've never used Xinha, but I can vouch for TinyMCE. It's fast, scales well, and is infinitely customizable. I particularly like the dynamic loading of functionality, which means you only take the performance hit for the stuff you use.
It also includes language-specific compressors to further increase performance (C# is supported, along with PHP, Java and ColdFusion) by GZipping components.
Of course TinyMCE it has more plugins to choose from and its easy to make custom plugins.
It only gives issues with ipad(cause of iframes).
As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 10 years ago.
I am looking for a text editor to be used in a web page. Where users can format the text and get a WYSIWYG experience. Doesn't need to be too fancy. But has to be easy to use and integrate into the page. Has to generate HTML as output. Support AJAX (one I checked works only with standard form submit) and has to be small in terms of download to the user's browser.
Well it depends what platform you are on if you are looking for server-side functionality as well, but the defacto badass WYSIWYg in my opinion is FCKeditor. I have worked with this personally in numerous environments (both professional and hobby level) and have always been impressed.
It's certainly worth a look. I believe it is employed by open source projects such as SubText as well. Perhaps, Jon Galloway can add to this if he reads this question. Or Phil if he is currently a user.
TinyMCE is the simplest I've found to use. I've never used it in an AJAX-enabled application, but there are instructions on how to do so on the project's wiki.
Try FCKeditor. It supports integration with most popular platforms, and it's fairly lightweight.
You might also want to look at YUI's Rich Text Editor.
If you're starting your site from scratch or haven't invested a lot of effort into another JavaScript platform, Yahoo User Interface (YUI) is a very complete JavaScript library that could help you add other AJAX elements beyond a text editor.
I just did a full day of evaluation of all the ones mentioned so far (and then some), and the one I liked the best is Obout Editor. I think it might be for ASP.NET only, so it might not work for you, but if you are using .NET, it's great. The HTML output is clean and nicely styled, and the rendered output looks the same in the editor as it does when you output it to the page (something I had trouble with when using the others due to doctype settings in the editor). It costs a few bucks, but it was worth it for us.
I found TinyMCE pretty easy to implement. And it's light on bandwidth usage too.
Using fck for some tine now, after "free text box", or something like that. Had problems only once, when I put fck inside asp.net ajax updatepanel, but found fix on forums. Problem was solved in next release.
I would like to see some nice photo browser in it, because fck comes only with simple browser that displays filename, no thumbs. The other one, that has thumbs costs bunch of money.
Didn't try it with asp.net mvc, don't know how will uploading work. It uses one ascx for wrapping js functionality.
i started out using free text box when i was doing a lot of asp.net programming, but now that most of what i do is php i've moved to the FCK editor.
while the change wasn't necessarily prompted by the language, i feel that the fck editor is a better choice because of it's versatility.
For something minimalist, take a look at Widg Editor, it's truly tiny and very simple. It's only haphazardly supported as a hobby project though.
I'm currently using the RTE component of DynarchLib, which is highly customisable - definitely does AJAX - but a bit complicated and not very pretty. It is actively supported, and you can get answers on their forum very quickly.
I previously tried Dojo's editor, and found it broken and badly undocumented. YMMV.
Edit: In response to other people's answers, I've now tried TinyMCE and found it to be excellent. More easily configurable and far fewer problems than anything else I've tried. Use TinyMCE!