7 Free WYSIWYG-HTML Editors You Should Try

August 28th, 2009

Being a freelance web designer you for sure are always looking for tools that can simplify and speed up your work. I already gave you the list of text editors useful for programmers, developers and designers. Today I’m going to share WYSIWYG HTML editors with you. WYSIWYG means What You See Is What You Get, these editors are easy to use and what is most pleasant about them – they all are completely free. Note that if you are looking for more features and need extra flexibility there are some very good editors for a reasonable price.

Xinha

This is an open source community-built WYSIWYG HTML editor. Xinha supports all the major browsers as Internet Explorer 6+ ,Safari 3+, Opera 9+ , Firefox 1.5+ (PC, Mac)

Nvu

Very good free WYSIWYG editor. Features advanced CSS support, XML support, built-in validator, full site management and color coded XHTML editing.

Trellian WebPage

This great editor offers not only the WYSIWYG functionality but also image editing within the software. Besides, you can use Photoshop plugins for customization.

SmartMarkUP

This powerful JavaScript library allows to turn any text area into a markup editor. HTML, CSS, XML, BBCode and other markup languages are easily configured. Supports all the major browsers.

PageBreeze

This free HTML editor allows you to switch between WYSIWYG and source mode, thus you are able to check your HTML.

Selida

This free WYSIWYG web page editor for Windows is appreciated by many web design professionals. Selida offers a great number of really good features.

WYMeditor

This standards compliant, web-based WYSIWYM XHTML editor produces XHTML-CSS compliant code. WYMeditor is JavaScript, it is easily integrated into your CMS and is also multilingual.

Well, what is your favorite HTML editor?

Top Web Design Tips

August 19th, 2009

Nowadays world of strong competition in web design requires exceptional skills and deep knowledge of the trends and basic rules. Being a freelancer you for sure know how hard it is to create a design that will become a successful website. Here are some simple tips that will help you achieve the goal and create the most successful websites. Make sure you are doing everything right and your clients will be satisfied.

* Do not use huge images. Everyone knows how awful a slow website is, even if it is exceptionally beautiful. Thus, try to use images that are not bigger than 10-12KB. The latest trend of minimalism in web design is your best friend here. The less pictures you use the better your website looks, and the better it functions.

* Hold on to the standards. Being different isn’t always good, 3 column layout is that popular because it is actually simple to use and navigate. Though don’t be afraid to experiment, just know when enough is enough.

* Use easy on the eye, common fonts. Always remember about the people that will visit your websites when you design them. Imagine how your own eyes would react on this or that font. Using common fonts you guarantee that your client’s visitors will see the site correctly. Try to use matching fonts that won’t disturb the visitors.

* Never forget to test everything twice, or thrice, or even more. Make sure that every single thing at your website works properly at every major browser.

* Remember that the customer is always right. Being a freelancer you for sure know how hard it sometimes is to deal with clients. They may be wrong, very-very wrong, still, they are right and you’ll have to deal with that on a mature level.

Keeping up with these simple tips you’ll get one step closer to the top of web design Olympus.

Do you have your own web design tips? Do share them with others in the comments below.

Are Your Designs SEO Friendly?

July 30th, 2009

Google seems to rule the world nowadays. Why? Because everyone knows that “Google knows everything”. If you’ve got a question – ask Google, if you are looking for any info – ask Google, if you want to buy something – ask Google. Thus the success of your website depends mostly on whether the search engine will find the web page or not. Being a designer you most likely consider that search engine optimization is not your field, but it isn’t quite so. Most on-site SEO is totally your responsibility. If your design isn’t SEO friendly you might loose a considerable piece of traffic. But if you know how to make your website design visible to search engines you will be much closer to the top. Besides, as a designer or a developer you may actually profit from your search engine optimizing skills, your clients will definitely pay some extra money for a search engine friendly design.

How do search engines actually work?
Search engines like Google and Yahoo have a program called a “web spider”. The spider crawls the web pages, collects content, follows the links and deposits the collected info to the search engine’s database. When you type a query in the search box the search engine finds the most relevant results in it’s database. What makes a website more or less relevant to your query? There is a number of factors which form the search engine algorithm. Thus, the higher your website ranks for these factors the higher it is in the search results and the more visitors you get.
There are two types of SEO – on-site and off-site. As you are a designer/ developer your prime concern here is on-site SEO.
So, what are the things you can do on your design to make it SEO friendly?

#1
Only content matters
As irrelevant as it may seem to you (designer/developer) the most authoritative key to success is content. People search for content, not for the design, thus you should give them what they want, shouldn’t you? :)

#2
The code is to be clean
Use text editors to build your sites. Clean and  human-readable HTML is the searchable code. Try to not overuse Divs, use descriptive tags where possible, follow the conceptual structure of the page. Don’t get upset here, CSS will help you create an ingenious website. ;)

#3
Site map
Make a site map that describes your website structure and give it to Google.

#4
Don’t forget about the links
As you remember search engines pay attention to the links you have on your website, the words used for the links also matter. Thus you better avoid using “click here” and so on for the links. Try to describe where the link is taking the user to.

#5
Ajax
Try to not overuse Ajax. Yes, Ajax features are beautiful and impressive, but they are not indexable by search engines because of their dynamic load.

#6
Index page is the most important
Your home page should give a reason to the user to visit other pages, it should describe the goal of your website and be a summary of the rest of your pages.

Well, these were some simple and just basic SEO tips for designers. Would you add more?

More CSS Tools to Boost Your Productivity

July 22nd, 2009

As you may remember I already gave you the list of useful CSS tools, but I’m sure being a professional you will be glad to get more tools that can save you time and ease your work. Thus, here is the new list of even more helpful CSS tools for you:

CSS Optimizers and formatters

* CSSTidy
This is an open source CSS parser and optimiser.

* CleanCSS
Based on CSSTidy CSS optimizer and formatter. Very powerful tool.

* Online CSS Optimizer
Well, you may have already guessed – this is an online tool for CSS optimization.

* Format CSS Online
Great online tool to automatically format your CSS to be easyly  read and edited.

* Webucator
This CSS reference will allow you to test your CSS code.

CSS Forms

* CSS Form Code Maker
This tool generates ‘Colorful Box Layout’ for your forms.

* Korhoen Typeviewer
This is a viewer to give you a look at your CSS typesetting and if needed to adjust it to a better readability.

CSS Generators

* CSS Menu Generator
This is a fastest way to create simple menus. The tool generates 4 different types of menus, you can edit text, links, and colors.

* CSS Frame Generator
This comfortable tool allows you to easily create a “framed” design using only CSS.

* CSS Button Generator
Creating stunning buttons is very easy with this tool. All you have to do is to choose the background colors, border colors and enter the text and that’s it – your buttons are created.

This was a short list of some CSS tools you will definitely find helpful. You can be sure there will be more lists like this one. What tools would you like to see featured in them?

Top7 Online Color Tools

July 9th, 2009

Being a web designer you for sure love the tools that simplify and speed up your work. And I love giving you the lists of these tools, making the search process easy for you. You may remember my previous posts giving CSS tools, text editors, Firefox plugins and others. Well, today I’m going to give you the list of top 7 online color palette tools. Color palette generators are great help when you are stuck and can’t find the color solution for your new project, or you have one color and can’t find the matching ones, besides they are a great source of inspiration.
Well, here they are:

* Color Hunter

This simple online tool generates color theme from any image. You can upload an image, put in the image URL or chose the color tag.

* Colorotate

This Flash based website is a more advanced tool than the previous one. This tool has a 3D approach of creating color palettes and offers great customization options.

* Color Jack

The website suggests you to chose from existing color pallets or create your own ones using the offered tools.

* Color Explorer

This website features a huge color library, besides you can create your own palettes and use the color matching tool.

* Kuler Adobe

This is an Adobe Labs color palette generator and explorer. You can chose from the ready color palettes or create your own using the Flash-based application.

* Color Palette Generator

This is a very simple tool on DeGraeve.com that generates a color palette from any picture from the web you liked. Just put in the URL.

* Color Scheme Designer

This resource offers a range of ways to create a color scheme, very handy tool that many designers consider to be the best.

Well, this is my top7 online color tools. Do share your favorite generators in the comments below.