Tryangled Solutions web designing tips tricks

Not specifying a unit for length values is a very common mistake among CSS beginners. In HTML you can get away with that, but in CSS all length values must have a unit. There are two exceptions: line-height and 0 (zero) values. Note that the value must be immediately followed by the unit – do not insert a space between them.

There is no need to specify a unit for 0 (zero) values because zero pixels equals zero centimeters equals zero of any other length unit. Despite this it’s very common to see something like padding:0px where padding:0 would do.

While there’s nothing wrong with specifying a unit when the value is 0, it’s a waste of space and – at least to me – looks untidy.

To save space and make your CSS files easier to read I recommend using shorthand syntax to declare several properties in a single declaration. How the available shorthand properties are used is described in my article Efficient CSS with shorthand properties, so I’m referring you to that instead of going into any details here.

JavaScript is most commonly used as a client side scripting language. This means that JavaScript code is written into an HTML page. When a user requests an HTML page with JavaScript in it, the script is sent to the browser and it’s up to the browser to do something with it.

The fact that the script is in the HTML page means that your scripts can be seen and copied by whoever views your page. Nonetheless, to my mind this openness is a great advantage, because the flip side is that you can view, study and use any JavaScript you encounter on the WWW.

JavaScript can be used in other contexts than a Web browser. Netscape created server-side JavaScript as a CGI-language that can do roughly the same as Perl or ASP. There is no reason why JavaScript couldn’t be used to write real, complex programs. However, this site exclusively deals with the use of JavaScript in web browsers.

If you don’t have any programming experience at all it’s best to start with some gentle JavaScript examples that teach you the basics. It might be a good idea to buy Negrino & Smith, “JavaScript for the World Wide Web”, 4th edition, Peachpit Press, 2001. It contains some very useful examples and though it doesn’t treat advanced programming tricks, it will certainly help you get started. Of course this site also offers plenty of help.

I can also recommend Jeremy Keith, DOM Scripting: Web Design with JavaScript and the Document Object Model, 1st edition, Friends of Ed, 2005. This, too, is a book that doesn’t delve too deeply into technology, but gives non-programmers such as graphic designers/CSS wizards an excellent overview of the most common uses of JavaScript - as well as the most common problems.

Guidelines for submitting to Directories

What is a Directory?

A categorized index of web sites that does not use robots is called a directory. All sites that are indexed are submitted manually. You need to submit your web site under a relevant category, after which an editor will review your site and then accept or reject your site according to its content.
Guidelines while submitting to Directories

* Good site design, fast loading pages, and informative content are very important issues.

* From the homepage of a directory take your time and find the appropriate category your site fits into. You can do a keyword search using your most important keywords or key phrases and note the category that lists these sites. That will probably be the best category for your site. You may also have multiple categories, in which case you must submit under all the suitable categories.

* Once you have found a suitable category, look out for a “Suggest a site” or an “Add URL” link. Click on this link to submit your site.

* Since Directories do not use robots, your best bet is to describe your site accurately as the final decision of adding your web site to a directory’s database rests with the editor who reviews your web site.

Top Directories

Yahoo Yahoo!

Yahoo is without a doubt the single most important index on the Internet. Make sure you follow the guidelines given above and Yahoo’s submit page instructions while submitting your site. The effort you put in now will reap huge benefits in the long run. Submit carefully!

Submit to Yahoo
Open Directory - DmozThe Open Directory - Dmoz

Lycos, AOL Search, AltaVista and HotBot feature Open Directory categories within their results pages. As ODP is now the directory listing source for many search engines, it is in the “big leagues” and is a must to submit to.

Read their instructions and submit

Web Design Directories

DesignDir.net - Web Design Directory

DesignDir.net is an industry leading web design and development directory. We bring together the best designers and their customers. URL: (http://www.designdir.net)

Submit to DesignDir.net

HotPlum.com

Top sites - Web templates, web & graphic design, flash, etc. top.hotplum.com
Business Directories
BusinessRanks.com

Complete directory of only business links. Submit to BusinessRanks.co

1.  w3Schools.com - I’m still shocked on a daily basis by the number of people that don’t know what the w3 is or have ever heard of w3schools.com. The w3 is basically the governing body of web standards. They are the people that define what is XHTML and CSS. Now, what is w3Schools? It’s free, complete documentation for all things web. If you don’t know your <pre> from your <ol>, this is the place to go. If you still rely on dreamweaver to sort out your <div>s or, heaven forbid, you still code with tables, the w3schools is a great place to start learnin’ yo self some real code. It takes a second to get past the design (it’s aweful, ironically), but there’s a metric ton of good information there.
2. Apache - Oh Wait, it’s already there. Just click that “Personal Web Sharing” check box in your Sharing system preferences and you have everything you need to build a basic static HTML site. I get all my software updates from entropy.ch and there are a hundred good tutorials out there for installing PHP, Ruby On Rails, django, or whatever software you plan to use.
3. subversion - Subversion is amazing, to say the least. Once you go “version control system” you can’t go back. Basically, subversion is a way to keep all of your sites (or your blog theme, etc) backed up and versioned. You install subversion server on your computer or a remote server, and then check in your site to the server. Then you can checkout your site to your webserver and always have an updatedable, but also revertable site. If you break your design, roll it back to the last time you checked it in. Want to move webhosts? It’s as easy as 1 command. And want to update your site to that new design you’ve been working on, “svn up” and your good-to-go. For a great tutorial on installing subversion, check out this great tutorial from Hivelogic.
4. Textmate - Put down Dreamweaver and step away from the handholding. Seriously people, it’s really not that hard, and you’ll make so much nicer sites because of it. Textmate is a god send for web site designers. Yes, you’ll have to code by hand, but you can also post to your blog, get live updating previews of your code, and use the aforementioned subvesrion, straight from inside Textmate. And, with code competion and bundles, a well experienced ‘mater can type 2 or 3 characters and complete entire lines of code.
5. Firefox - Ok, this one seems like low-hanging fruit, but if you add Firebug, Web Developer, and Colorzilla to Firefox 2, you have one sweet testing/debuging environment. Firebug is like sending Firefox to medical school, seriously slice and dice capabilities. Web Developer extesion is like buying one of those nice big red Snap On tool chests full of tools, and shoe horning it into your browser and Colorzilla is just that, a color picker as powerful as Godzilla. I can’t imagine doing webdesign with out these great little pieces of kit.
6. Safari from O’Reilly Publishing - Safari from O’Reilly is amazing, that’s about all I can say. If you can’t tell, I’m big on documentation, and Safari is like having a bookstore in your computer. You can search through hundreads of REALLY REALLY great books (sorry about the caps, Safari gets me hot). My favorites on there are Bulletproof Web Design, The Zen of CSS, and Eric Meyer on CSS.
7. BONUS - Here’s all the other mac only software that I use and abuse that is worth a mention: xScope, CSSEdit, Transmit, Linotype FontExplorer X, Xyle Scope.

The Most Useful Design Tips of the Year

The Internet is changing with the development of Web 2.0, and the changing marketplace reflects a need for increased usability, easier functionality and design that is visually appealing but that still lends to an easy to maneuver, content-rich website. The following is a list of ten top website design tips that made a difference in 2008.

1. Know the audience: The design of your website should cater specifically to your target market both in the visual sense, and in usability. It is critical that the design of your website reflect the values that your potential customers will hold.

2. Personalize: Even if your website is designed by the greatest professionals in the business, if you do not allow your customers to get to know you, or to believe in you, you will have difficulty selling your ideas.

3. No uncertain terms: Clearly identify what the purpose is for your website, and ensure that every facet of your website focuses on this goal. Are you conveying a message, selling a product or offering a service? Make this obvious from the beginning, and keep your focus until the end.

4. Keep it quick: You have between ten and thirty seconds to capture the attention of your customer, so keep graphics small in order to minimize the time it takes to load your website. Compress images when possible, so that your loading times stay low.

5. Design is important, content is more so: Good content is what sells your ideas and products. Is your copy delivering the message you intended for it to? Grammar and spelling ARE important; so proofread everything you write before it goes live.

6. Map your Site: You can make your website’s navigation much more easy and intuitive simply by creating a site map, or a directory web page. If your customer cannot navigate your website quickly or easily enough to find what they came for, they will go elsewhere for solutions.

7. Strive for consistency: Your website should be consistent in the design, the look and the feeling. Colors, themes and ideas should stay constant throughout every page on the website to make the best impression on your visitors.

8. Keep track of links: You should make sure that your site is fully functional at all times, which means checking out your website links on a fairly regular basis. If you have dead links on your site, there is no telling how much of a negative impact will transfer to your search engine page ranking, or the opinion your visitors have of your website.

9. Make a simple start: When you begin your site, take everything one page at a time, and optimize each page for the best results before moving on to the next. This means that you should make sure that every page is perfect before leaving it for the next one.

10. Optimize: The top search engines are responsible for helping more than 85-percent of all web users to find exactly what they are looking for. If you want to be one of the websites that is considered when users look for similar products or information, you must make sure that your pages are designed to maximize your search engine placement.

To make sure your website works for you, follow these six key points to an effective website:

1. Make Sure It’s Consistent

Your site should reflect key elements of your brand identity, it should reflect the corporate look and feel of your business and be consistent across all your marketing communications. Keeping your brand consistent across all forms of media is vitally important and reaffirms what you’re about.

2. Usability

It is important that users find your site easy to use to get the most out of their visit. Things to consider here include ensuring the navigation is simple, logical and consistent and that all links are working properly, that there is the right information on each page and that if you have any forms on your site, they are working correctly. These factors amongst others will ensure visitors stay longer and are more likely to return.

3. Text Legibility

It is important that fonts used on your site are sized correctly so that the text can be read easily on different browsers and different platforms (and you should also consider making sure that text can be resized by visitors). It is also worth noting that the text on your site should be significantly darker than the background colour, so that it can easily be read, bearing in mind that some visitors could be colour blind or visually impaired in another way. You should therefore ensure that text is easy to read, logically laid out and that text doesn’t interfere with any images on your site.

4. Style with Substance

Make sure that your site is well designed, it looks good and gets your message across. By keeping it simple and stylish with lots of high quality, relevant content you are well on the way to creating a website that will bring you the results you need. Do not be underestimated the skills of a professional website design team who can provide you with a range of options and will ensure that your site meets both your brand requirements and your online objectives.

5. Website Speed

It is crucial that your site is quick to load and quick to navigate as visitors always want access to the information you provide quickly. By ensuring graphics on your site are optimised and the site written with clean code, it ensures that wait time

is kept to a minimum. The longer visitors have to wait for your site to load or to get around, the more likely they are to leave – and they are far less likely to return in the future.

6. Make Friends with Search Engines

It’s no good having a great looking website, packed with lots of relevant well laid out information if nobody can find it. And if people can’t find your site, then the chances of receiving enquiries about the products / services you offer are slim. So what can you do to make the leading search engines like your site? Here are a few quick tips amongst the many things we can recommend:

Firstly it is important to have the text within your site coded in HTML rather than embedded with the graphics or images. Search engines cannot read text within images so keep them separate. Instead, use ALT tags on images as search engines do consider these and they do have an impact on your search engine ranking. Also, include meta tags and descriptions within your code ahead of submitting your site to the leading search engines – many of which will list your site for free. Consider submitting your site to online directories and work hard a developing the number of inbound links your site has too.

By ensuring that your website is well-designed, logically laid out, quick to load and looks good, you are well on your way to ensuring that visitors to your site will enjoy their visit whilst getting their hands on the information you provide. Your website is a crucial business and marketing tool – make sure your site is working as hard as you are.