Macronimous Web Design

1. Validate HTML

W3C provides HTML validations, which checks the validity of HTML, XHTML etc.

http://validator.w3.org/

2. Validate your CSS

You should use W3C’s CSS validator tool to validte your style sheets.

http://jigsaw.w3.org/css-validator/

3. Validate site links

Check broken links across the site with W3C’s Link checker tool

http://validator.w3.org/checklink

4. Cross browser compatibility

Check the site on multiple browsers with this tool (You may not have a MAC, but you can you can test the site Mac Safari

http://spoon.net/browsers/

Even if its a simple static site, do them to make the site perfect.

Not all the web clients are tech or web savvies. Many times you should pave them their success path online. Here are few a list of 4 important things which you should let your client know, if they trust your web development skills.

1. Flash: When they ask for a fully flashed website, let them know the adversity it might make. By doing this you are helping them to establish the right online presence. Unless your client is Coca cola or Burger King ( I mean,  :-), an establish brand), they will really want to establish better Visibility to the Search Engines.

2. SEO – If a client just wants a website, let them know what SEO is and how it is going to help them. Make the site SEO friendly within the design scope (Eg. Image tags, XHTML validations, designing without tables, etc). Most of the clients will not say NO to make their site ready for SEO.

3. CMS – Ask how frequently they want to change the content, and if they do, let them do know how to do it themselves with a CMS. You may also need to let them know the advantages of fresh content. I believe instead of providing them a static site of 20 pages, you can introduce them Joomla and how to use it, for some additional but onetime investments.

4. Advantages of Opensource - Do they need a CMS or Ecommerce, You can justify why you charge less. Let them know that you can cut cost by using WordPress or Magento and still make their site professional. By doing this you are introducing standards – if your client goes to some other developers, it would not be difficult for them to take up the work.

I recommend you to keep a short write up (with some references) or articles on the above mentioned (you may keep that under your client section of your website) and ask the client to refer them. It also helps them to understand that you know what you tell them.

Do you work on CSS and like to know more about what you might have to learn to keep you up in the phase?. This slideshow gives you an intro to make you ready.

View more documents from Andy Budd.

Today I revived few questions from Carl Williams of Odin Jobs for a blog entry. I believe every designer should ask themselves to keep the answers with them always.
1. When and how did you get started in web design?
2. What is the single most important attribute/skill a good web designer must have?
3. What hard and soft skills should a web designer have? Should he/she have a degree or can you be self taught?
4. Your opinions on:
a. Fixed width or Fluid Design?
b. EMS, percentage, pixels or points?
5. What tools are a must have in a good web designer’s arsenal?
6. Any advice to budding and beginning web designers?
I am sure you will find yourself interesting in your job, if you have the right answers.
I welcome your answers as comments.

Following the best four series, this time I have chosen 4 sites to find wonderful and useful Photoshop plugins and filters. Though there are thousands of sites offering free Photoshop plugins and filters, searching through the sites and choosing the ones required could be a tedious affair. Am sure this list would prove to be a quick reckoner for all your Photoshop plugins and filters needs, because I have chosen them after trying them out myself. All these sites offer free downloads of filters and plugins, with a huge variety of options to choose from. 

Filter Factory 

This site has a huge accumulation of filters and plugins as well, that impart varying levels of effects in photographs and images. With more than 350 filters and plugins available, this site definitely contains a vast and excellent collection to its credit. With detailed explanation of what plugins and filters are and how to download them are clearly explained in the site as well.

http://www.photoshop-filters.com/html/filter_factory.htm 

VanDerLee plugins and filters 

A site with both free and paid versions, VanDerLee has an impressive collection of Photoshop filters and plugins. Along with latest news in the field of website designing and releases of various new versions of plugins and filters, the site also has a dedicated Support section that assists with useful FAQs and a list of Compatible applications that work with the site’s plugins.  

http://www.vanderlee.com/plugins.html  

Richard Rosenman filters and plugins 

This site has separate windows for both freeware and commercial collection that can be downloaded at a specified cost. Wonderful, amazing and varied collections of plugins and filters are available in the freeware section as well. A must checkout site for all Photoshop plugins and filters seeking fans!  

http://www.richardrosenman.com/software/downloads 

Mehdi Plugins 

A great site for Photoshop plugins, this site has a colorful and eye pleasing layout in itself! Not only does the site has a large collection of plugins, but it also has clear explanations as to how to use the particular plugin and also how to customize them in order to make it the way you need it. I have used this site for many of my plugin needs as well. Excellent site indeed! 

http://www.mehdiplugins.com

Apart from these four, I also happened to see a site called Virtual Photographer. A very useful site for creating special effects on photos, downloads are available in zip format as well. A site worth checking out for the photographer in you http://www.optikvervelabs.com/default.asp

WordPress is a simple and handy platform that is highly used in creating blogs and is also one of my favorite blog platforms, WordPress plugins that are used along with it can create excellence to sites. Out of many WordPress plugins that are available, I have chosen 4 that are my darlings, from the Multimedia point of view. These plugins are highly useful with regards to creating Multimedia-rich websites and blogs, and I also am of the impression that they are simple to use, without any complications or hassles.

(1) Kaltura Video recording and management – http://wordpress.org/extend/plugins/kaltura-interactive-video 

This plugin is quite apt to make the videos in your blog more interactive. With facilities like uploading, importing and recording of videos into your blog posts,  modify videos with the help of an online video editor; this plugin is definitely a hit! What I like the best in this is that it this plugin also supports a huge variety of codecs and audio/video file formats along with video sharing options. In short, complete management and administration of videos is possible with this wizard! 

(2) MTR Audio and Podcast Recorder - http://www.podcastingnews.com/2008/09/15/free-podcast-recorder-plugin-for-wordpress
 

I would say a “must-download plugin” for the Podcast freaks; this plugin is called the MTR Podcast recorder that allows all the recordings to be saved in MP3 format. It is saved in the same server as that of WordPress. The best part that I like in this plugin is that it allows handling the records and musical selection lists from the WordPress administration itself. This helps in easy playlists management and overall blog site administration. 

(3) NextGEN Photo Gallery – http://alexrabe.boelinger.com/wordpress-plugins/nextgen-gallery

One of my most favorites, this photo gallery plugin is very useful, especially for those interested in creating and sorting their own image collections. This plugin has a tinge of Web 2.0 and jQuery JavaScript library, all packed in one. The users can also upload images that have watermarked text or images. The best thing is that various JavaScript effects like Thickbox, Lightbox and the likes can be used. 

(4) Kimili Embedded Flash – http://kimili.com/plugins/kml_flashembed
 

So you want to embed flash based movies into your blog, then Kimili is the best choice! A very flexible plugin with many features attached to it, the Kimili  also complies with the standards. It is very useful for search engine optimization of blogs, as the plugin itself is search engine friendly. What’s more, this plugin also gels on well with other plugins in its 1.2 version, and hence is definitely the best pick for WordPress.

I have found these plugins to be remarkable and of great use to me. There are many more great plugins from WordPress, and if you feel anyone or more of them have stirred your web designing senses, then do not forget to suggest about them in my comments section.

This post is written based on the requests seen in forums. I still found most of the surfers don’t have clear picture about the “difference between Normal design websites and Web2.0“. So thought of writing a brief note on Web2.0

Hopefully people who try to know Web 2.0 design standards should be knowing about normal design, so not much explaining here to bore

Starting, Web 2.0 websites allow visitors to do more than just retrieve information what we see in normal design. They can build on the interactive facilities, allowing users to run software applications altogether through a browser

Below are the attributes that can be followed for Web2.0 

• Clean & simple style
• Pastell colors
• Center aligned with 2 or 3 columns
• Bigger Logo
• Bigger Buttons
• Bigger font size
• Descriptive HTML (XML style)
• Bold text introductions
• Vibrant colors with gradients
• Visible header
• Content as Feeds
• Rich and interactive user interfaces
• Users active participation
• Video sharing
• Social Networking

Get ready to start furnishing a Web2.0 site

We have developed some Web 2.0 sites, for more clarification you can mail us for website names to get a clear picture

In a survey, by the Information Architecture Institute, 47.6% of people says “My CMS is not flexible enough to accommodate my design”, as a key issue they face with many Opensource CMSs available in the market. This made me to think about the truth behind this. What prevents them from making a great design for their CMS driven site? Is it the CMS they’ve chosen or they customization skills they lack?

When we offer consulting for Opensource CMS selection, it is not an easy job always. Building websites with the CMS our clients like and to make it work with our own custom design might become a nightmare if we aren’t considering and planning the UI design in advance.

We have customers who supply design for their web sites (as Photoshop source files – if they know Photoshop) since they have good sense of designing and they know how their site should look like. We can happily accept it and build HTML/XHTML and CSS based Static pages without any issues or provide a Custom written CMS easily. The real challenge starts when they want to make their site CMS enabled with an Opensource CMS framework such as Joomla, WordPress or Drupal.

Most of the opensource CMS applications strictly adopt some design standards, and they give clear instructions for UI designing. Your design will not work well with the CMS, if it does not obey their design rules. The primary reason for these strict rules is to help with the CMS applications for design-content separation and for easy user interface maintenance. You can easily change the design without changing the programming sections and vice versa. But can you easily fit your custom design which is created as your mind wishes to an Opensource CMS application? Most of the good CMS applications does not allow you to create an unique site with your own custom design, custom graphics and custom XHTML.

Simply configuring a Opensource CMS application along with a template design (meant for that CMS application) may ease your job, But it will not give your client an user interface, which is unique for them. It will look like one another site made with that particular CMS. I have seen several Ecommerce sites with similar structures; I can easily identify them as “made with osCommerce without added efforts”.

So, how do we deal with this situation?

Take the case of WordPress. If you start designing a site without keeping WordPress in mind, and wanted to enable WordPress CMS at later stage, I am sure you need much experience in XHTML coding  you may have to give up WordPress in order to keep your look and feel remain unchanged.

Few months earlier, we did an Ecommerce web site design with Cubecart; with the help of Programmers and good HTML scripter, we were able to make the user interface which is very unique and no template look. Yes, good PHP and HTML programmers will have to give hands to change the way the application works and to fit your custom design with the CMS. If you need a decent design which does not offer you a standard template based site look, you need an experienced team’s support to make it possible.

Cost is one key factor why people like to use opensource applications and in most of the cases we almost get a free solution. Installing Drupal or Joomla with a pre-existing design, will only help you to offer a cheaper solution, But to give a unique look and feel to your site, you must be ready to invest in application customization too. Your CMS theme or template will need your programmer’s support to provide coherent CMS driven website, which is exclusive for the customer.

Opensource CMS applications are excellent tools for professional web solutions. No objections!. Opensource CMS applications will not cut the cost of custom development completely and making a design which has an exclusive and aesthetic look to your customer will need the time/cost of your developers and designers.  Don’t leave the CMS application to decide your site user interface by cutting the customization efforts.

This is what I understand about Web 2.0: Web 2.0 is a trend which uses web as a platform to build collaborative applications of sharing nature – mostly hosted community solutions. Web 2.0 applications also use rich client side integrations using Ajax, light weight user interfaces with limited graphics built with XHTML and CSS.
I found few interesting tools, some are good, some are funny – but you may want to give a try. Here is a list.
Web Node:
Web node is a web based solution, you can build Web 2.0 sites on the go.
“Webnode brings you a brand new innovative way of creating and editing advanced websites by just using a web browser. The system is very easy to use and is fully interactive. Using their 40 free templates you can easily design sites for free. You can give a try at www.webnode.com
Web 2.0 validator:
This is a web based Web 2.0 validator, and the validation rules are controbuted by the users of the site, as the rules are changing daily. Check your site at web2.0validator.com
Web 2.0 Certifyr:
This site is a real fun, They are authorized to give you a web2.0 certification, I tested with our site, and they certified us with 100% score. You can get 100% score to any with any xyz.com site and get the certificate. The trick is, you are going to give a back link to them for FREE from your homepage, if you use their icon. SEO guys note this. You can just play around at www.certifyr.com
Free Web 2.0 Templates:
Templateworld provides clean and crisp web2.0 design templates, absolutely free. You can customize and learn to create designs like what they offer. View and download them at: Templateworld.com