UI / UX Tips

Shadow effects are specified based on specified order. The property dont increase the size of the box, though they can extend past its boundaries. .shadow { text-shadow: 5px 5px 5px #a1a1a1; font-size:3em; color:#000; font-family:"Times New Roman", Times, serif } The above class specifies text shadow effect, it extends 5px to the right and 5px below the text, and the 5px blur. Browser Support IE8 - None FF3.5+ - Yes SA1.3+ - Yes OP9.5+ - Yes shadow value must specify a shadow offset and a blur radius and color. Using two lenghth values the offset will specified. * First value represents the horizontal distance to the right of the text in positive. The negative value move the text to left side. * Second value represents the vertical distance below the text (if it’s positive) or above the text (if it’s negative). The blur radius is specified after the offset values; it’s a length value that represents the size of the blur effect. If no radius is specified, th...

Many people want to have a website. They do not have the technical expertise to put it together themselves. There is no need to panic. In a capitalistic economy where there is a need there is always someone to fill it. Web development is no different. You can hire these resources to be done or find resources to teach you how to do it yourself. A search on the internet will find you resources. You can go more independent and hire someone to do a custom web design. They will help with the set up look and graphics on your site. They can even make some suggestions as to content. These services will cost you but may be a very good investment. If you want the best chance at making your site stand out and do what you want it to then hiring a web designer might just be the way to go. You will want to compare prices on what services they have to offer. You can also choose to download software to use on a web hosting site and make your own design. This may not be as original but will cost less t...

When it comes to a functional and profitable website, there are some details which can be implemented to help your visitors find their way around and be more likely to purchase from you than from your competitors. Below you will find web design tips which can help you in deciding what to display on your pages. Clutter will only confuse your visitors and they will quickly leave your site to click on the next link in the search engines results. Taking the time to plan the layout of your website will not only improve the appearance, it will improve the functionality required to assist visitors in finding the shopping cart. A good method to prevent clutter is to divide the website into categories of related information, or products. By doing this you can free up space on your home page by creating links to additional pages which now contain the information that was previously cluttering up your front page. When a person is about to spend money, they want to know how to get in contact with ...

After the economic slump, it's hard to believe that profits even exist. For many it feels like pigs are more likely to fly, over their business making profits. Even though competition between internet businesses is tough, it's not impossible to make a decent profit, if you have the right tools at hand, a decent marketing plan and excellent customer service. Whether you're selling a product or a service online, it's vital that you have a good customer service plan, which will give you the advantage over your competition. Excellent customer service does mean you go that little bit further for your customers, but it is definitely worth it. If a customer is happy with the service, they will mention it to others and pass it on the chain. It's a good marketing plan, word of mouth, as it costs nothing; all it takes is your effort and time with customers. These days, word of mouth is still just as powerful as the internet, and can make or dismantle your business. So always ...

Usability is the key concept that will make your website an instant success with your customers - the theory is to attract and retain. Here, an effortless experience is the desired outcome that you want each customer to experience time and time again on your site. Below are some core usability tips that have been put together with the help of Surrey web design: 1. Simple Navigation: There is nothing more frustrating than arriving at a website that has no easy navigation, particularly when you are in a rush to find what you are looking for. Users are very impatient and if they cannot find what they are looking for they will leave your site. The simple solution to this is to have an accessible menu bar with appropriate tab headings e.g. Home, About Us, Products and Contact, that is consistent across each page. Keep these tab headings short and specific as this is all you need from your primary navigation. Note, if a user can not find what they want in 3 clicks they'll leave your site...

Current business practices dictate that most companies will use websites or some kind of online presence to market their business. In most cases these sites are nothing more than online brochures. But websites are more than a place to share basic knowledge and services; they are marketing vehicles that should be driving business through your door and directly to your cash register. Online analytics gives us the ability to track our website visitors and tweak the information we present in a way we never could before. Which leads to a very important question... should we offer translations of our website? Content in your website is like location to a Realtor. We log onto the internet to find information, to research products and read reviews... among many other things. Providing the best, easily accessed information puts you at the top of the search engines and increases the likely hood you'll be found by your prospects. According to an AOL study, most Hispanics consume online media ...

There are literally hundreds of web browsers in use around the world. All of them implement the W3C document standards a little differently. Web designers must wrestle with these differences to make a web site work. This article discusses the effect those different implementations has on design. What is Cross Browser Compatibility? If a web page is completely cross-browser compatible, it will look more or less the same in all of the existing web browsers. The most commonly used browsers are Internet Explorer, Netscape Navigator, Firefox and Opera. Each one of these browser implements HTML, JavaScript and Cascading Style Sheets (CSS) a little differently. Some difference only create cosmetic difference others can break the webpage. The situation gets worse because each browser is free to implement “enhancements” to the W3C standard version of each of these formats. Then to compound matters even more the underlying operating systems also creates difference in how the computer displays g...

Choosing the right colors for your website is just as important as selecting graphics and content. This article discusses what factors to consider when selecting your website colors. Colors have many effects on people. Certain colors can invoke specific emotions in people. Emotional reactions can affect the image of your company in the visitors mind and can have a major effect or your company’s “brand”. If you doubt color evokes emotion, consider the phrases, “green eyed monster” “seeing red” or “in a black mood”. The green-eyed monster is a reference to jealousy, seeing red means a person is angry and a black mood refers to depression. People do associate colors with specific moods. Scientific texts have proven that different colors can make people happy, sad, relaxed, excited, angry or afraid. Anything that can evoke those responses in people needs to be looked at carefully when designing your website. Colors tend to be classified as “neutral, “warm” or “cool”. So, let’s take a look ...

Web surfers are basically an impatient bunch and if a website is hard to figure out because the links are not obvious, they will click away never to return. Website navigation is one of the most crucial elements in determining the effectiveness of a website. This article discuses the basic principle of designing website navigation. To be effective website navigation must first and foremost make sense to the average person. While there is always room for creativity, well-designed websites tend to have similar navigation layouts. As a web designer you must always keep in mind the basic purpose of the website and the intended audience when designing navigational elements. Most websites exist to either inform the visitor about a product or service or to actually sell the product or service. Therefore there are some basic guidelines to follow: Make sure all navigational elements are clearly links by using standard conventions for links such as buttons, menus, underlining the text or changin...

Although hundreds of graphic file formats exist web browsers only support a few of them. This article describes the different graphic file formats that are available to web designers and when they should be used. The graphic file formats supported by most popular web browsers are Graphic Interchange Format (GIF), Joint Photographic Experts Group (JPEG), Portable Network Graphics (PNG) and vector graphics. Some of the properties of graphic files are: Transparency – this property allows the image to be varying degrees of opaqueness from solid to completely transparent (see-through). Compression – this property allows the image to be stored in a much smaller file by using a mathematical algorithm to handle groups of pixels as a single item. Interlacing – Interlacing allows the image to be loaded by first drawing the odd rows and then going back and drawing the even rows. It allows the visitor to see the picture sooner. Animation – Animation gives the appearance of movement by using a ...

Website templates are web page designs created by professional web designers that are sold to others for their use. Templates normally have dummy content used as a placeholder so you can see what a finished page will look like. A template is an easy way for a novice to create a good-looking professional quality websites quickly and easily. Most of the commercially available templates can be found in a variety of themes and color schemes. Theme templates come complete with appropriate graphic for each theme. If you have some graphic or web design skills and a knowledge of HTML, you can create a customized professional looking website at a fraction of the time it takes to create everything yourself. Just remember you don’t own the copyright to the design. Before selecting a template, you will need to identify the goals you have in mind for your website so you can select the most appropriate template. Advantages of Using Website Templates There are several advantages to using templates su...

Photo Optimization is necessary to allow a web page to load in the shortest amount of time possible. Fast loading time require small files. This article discusses the methods used for photo optimization. In an ideal world, a web designer could use the highest quality photos and have the webpage download lightening fast. Fast loading requires small file sizes for pictures. Unfortunately, there is a trade off between picture quality and file size. Web surfers are a notoriously impatient bunch. If a website takes too long to load, they will just click away and never come back. Computer monitors can only display images at 72dpi (dots per inch). So the first step in photo optimization is to reduce the resolution to 72 dpi. Large picture can be sliced up into smaller ones and the put back together on the web page. Each piece will be a very small file and together will load in a fraction of the time a single image file would load. Most graphic files contain information about the color palette...

The goal of most web designers is to create an attractive, easily accessible and functional website that will convince the visitor to do something. Creating such a website requires good graphic design, easy and intuitive site navigation, logical site layout and good web copy. The following suggestions are general web design guidelines. Web Content You want the visitor to see you as a knowledgeable information source and/or a reputable business. Poor grammar and spelling will immediately reduce your credibility. Remember that people use the internet to find information. Whether you are selling your own product or recommending someone else’s products, you must first provide valuable information to the visitor or they will click away and find a website that gives them what they what they want. Cross Browser Compatibility There are at least a hundred different browsers in use. You must design your website to work properly in the most widely used browsers. To do that you may not be able to ...

Who is W3C? W3C stands for the World Wide Web Consortium. The goal of W3C is to provide a set of web standard and guidelines that will help alleviate the problem of code incompatibility in the hundreds of different web browsers in use throughout the world today. The standards are only a guideline, but smart web designers and web developers pay heed to what the organization has to say. In fact many of the web programming jobs found on web design freelancer job boards, specifically requests that the code used to build a website is W3C validated. Although fairly common for XHTML and HTML it is becoming increasingly important especially if the web site is a total CSS web site. Tim Berners-Lee who pretty much invented the World Wide Web when he developed the first web browser back in 1989 and other industry pioneers created the consortium to promote the standardization of the technologies used on the World Wide Web. Without some level of standardization, the internet would not be a global m...

Communicating with a web designer can be the most difficult part of the hiring process because you and the web designer don’t speak the same language when talking about the details of a website. This article explains how to get your ideas across to the web designer you want to hire. Ok, so you’ve decided to hire a professional web designer to build your website . You spent some time looking for the right person. Eventually you found the right web designer that you believe will design the most “remarkable”, “extraordinary” website the internet community has yet seen. So now what? Explaining to the web designer the layout design you have in your mind can be a very frustrating process. You will find that putting the “picture” in your mind into words can be a difficult task. Actually in most cases this is the biggest hurdle between you and the final outcome. No matter how talented the web designer is, if you can not communicate with him properly, in his own professional language, he will n...

Banners have been a major part of the World Wide Web world since its early days. Copywriters burn the midnight oil looking for new designs that will grab the visitor’s attention and compel him to click on their banner. This article discusses some of the most successful banner designs. Teasing your curiosity “Do Not Click Here”. How many of you have seen this slogan in a banner? What did you do when you first saw it? If you are like most people, when you first saw it, you clicked on it. What makes this simple sentence so powerful that it compels the visitor to click on it? The answer is curiosity !!! Copywriters and web designers are always looking for ways to arouse the website visitor’s curiosity. As banner designers their goal is to attract the visitor to the banner, usually completely ignoring the other elements on the web page that are more important to the website owner. However, because the “Do Not Click Here” slogan tells us nothing about what is on the next page, it arouses th...

Have you ever considered that your website may be annoying? When it’s comes to website design, knowing what visitors hate most is a must, unless you don’t want them to visit you again. This article describes what you should exclude from your website. If you know about an annoying website, feel free to send this article to its webmaster. A few weeks ago I received an email from a colleague asking me to check one of the website he had developed. He is a web designer and his client wanted a nice attractive flash header. The flash header was great. You can’t miss it at all. Some nice graphics elements were flying in while sound effects created just the right atmosphere. However, after starting to explore the website, the header became very annoying because every time you clicked on the website the header restarted. What was pleasant initially became very annoying very quickly, disturbing your concentration and making it difficult to read what was on the page. He is not the first to create ...

Whether you currently deal with a freelancer website , or are just looking for the best place to find a freelancer, the biggest problem you face is how to find a good reliable freelance , one that will do the job properly with good quality work and finish it on time. Many sites offer you, the webmaster, a place to post your projects to be bid on by freelancers. All of these sites let you contact offshore workers that live in countries where wages are only a fraction of what they are in the more industrialized nations. This allows you to keep your project budget low and save money by keeping your full-time staff small. So, how can you find this “diamond in the rough”? You know, that reliable individual who delivers quality work on time and within agreed upon budget? There is no simple answer. The best you can do is using the tools provided by the freelance website to try and minimize your risk. Unfortunately, most of the existing freelance websites use a very poor rating system that onl...

In Lesson 1 and Lesson 2 of our HTML 5 tutorial, we looked at some new structural tags you can use to help eliminate the “div-soup” of HTML 4.x layouts, as well as some other semantic tags to help give your pages easy-to-parse dates, metadata and captioned images. Now it’s time to take a look at what might be the most-hyped part of the HTML 5 specification — the audio and video tags. Contents Video’s a tough nut to crack Using the <video> tag Using the <audio> tag Conclusion Video’s a tough nut to crack Currently, the only way to reliably embed video on a web page so that all users can see it regardless of browser or operating system, is with Flash. This requires the Adobe Flash plugin and a combination of the <object>and <embed> tags. Most users have the Flash plugin installed already (actually, something like 95% of web-connected users have some version of it), but proponents of HTML 5 are pushing for an open video standard that doesn’t require any plugins. ...

Want to get a top ranking in search engines? No problem! All you need to do is add a few magical "meta tags" to your web pages, and you'll skyrocket to the top of the listings. If only it were so easy. Let's make it clear: * Meta tags are not a magic solution. * Meta tags are not a magic solution. * Meta tags are not a magic solution. Meta tags have never been a guaranteed way to gain a top ranking on crawler-based search engines. Today, the most valuable feature they offer the web site owner is the ability to control to some degree how their web pages are described by some search engines. They also offer the ability to prevent pages from being indexed at all. This page explores these and other meta tag-related features in more depth. Meta Tag Overview What are meta tags? They are information inserted into the "head" area of your web pages. Other than the title tag (explained below), information in the head area of your web pages is not seen by t...