Author Archive

The Role of HTML & CSS in Web Design

If you are thinking about pursuing web design as either a career or a hobby, you must be able to do more than simply design a pretty page. Professional web designers are experts in programming and coding as well. The most talented web designers are those that can adequately balance both their creative and artistic sides with their love of technical coding.

As a web designer, there are plenty of different web design standards one must master. The two most important in the industry today are HTML and CSS. What are these methods all about and how much time and money will you need to invest in order to learn them?

What is HTML?

Since the early days of web design, HTML has been the standard for professional websites. It stands for Hypertext Markup Language and can be quite confusing to someone who has no experience using it. HTML is the language, or code, used to edit and position the text, images, frames and other web page elements. If you go to your web browser and select View and then Source – the code used to design that website is available for anyone to see.

Those who have used HTML will tell you that it is not difficult to learn. There are a few basic tags (codes) a designer has to learn and a simple webpage is at their fingertips. The more complex the HTML, the more you can do with a site.

Efforts have been made to dumb down the process even further so that anyone, even those who have no knowledge of HTML, can create their own website. These are typically called WYSIWYG (What you see if what you get) editors. They allow you to create a webpage without using code and the editor assumes what HTML you need and does the work for you. Some software programs now include an option to convert your document to HTML. These are great tools for newbies. Unfortunately, the processes of guessing what code you need breed mistakes and errors in design that can lead to further frustration.

What is CSS

CSS is a newer animal and is not as familiar to beginning web designers as HTML. CSS was created to allow designers to have even more creativity and control over their designs. Today there is more than just one type of Internet browser to design for and this can be tricky and time consuming for HTML designers. These saves users time, effort and most likely money when they are creating sites. Also, CSS encourages less effort by allowing designers to create style sheets. This means when an edit is made to one page, all other affected changes are automatically made. This keeps designers from having to make multiple edits for large, detailed websites.

HTML vs CSS

CSS is not really taking the place of HTML. It is generally used as an enhancement, not a substitute. HTML is still the perfect type of coding for the main structure of a site.

CSS excels when it comes to how a webpage will look. The outward appearance including backgrounds, colors, content and image placement can all be handled by CSS. Anyone who is familiar with the Microsoft Office version of style sheets has a good handle on the purpose of CSS.

While a webpage can certainly be accomplished still only using HTML, CSS allows designers to do things like set different page margins for all sides of a page, overlap words, better position page elements, and set a font for a whole table instead of just pieces. These make all seem like minor adjustments but these CSS tricks free up time for designers to worry more about overall layout, design and navigation.

Training

There are plenty of places where new designers can go to learn both HTML and CSS. If you are a manual type of student, the library has an abundance of tutorial manuals for these techniques. Any establishment that teaches computers classes will more than likely include these basic web approaches as well for the visual learners.

Of course, many a web designer learned their craft by simply jumping in and messing around. If you have the discipline, this hands-on method of learning is not only effective, but free.

With the popularity of today’s world wide web, it seems like everyone is designing a webpage these days. From the free online editors to full blown ecommerce Internet giants, there is a market and need for web design that is not going away any time soon. Whether you decide to take it slow and target small businesses or get serious and starts designing for large corporations, design fundamentals are the place to start your journey.


When Web Design Goes Too Far

Just as there are fantastic web designs launched every year, there are even more websites launched that are atrocious and go too far with design. What are the parameters for an artist or web design creator on knowing when to step on the brakes with their design?

Need hosting? Visit host monster reviews community.

The most common mistakes made in designing a website are:

Too Much, Too Soon

Ever opened a website and felt dizzy seeing too much content, color, intricate borders and graphics? The top web layouts always have just one or two focal points, nothing more. In the first place, you don’t have to limit the website to just one page. However, you should also not bombard your main home page with too many directional guides and links to the other pages. If a web design has too much going for it, it will be its own worst enemy. Remember that a visitor to the website has a million other site choices, and so your window of opportunity to keep him interested is so small and be just a matter of seconds. The general idea is that a person should be able to tell within 4 seconds after opening a site what it’s all about.

Using The Wrong Design Elements

You may know a lot about web design, but you do not have to use them all at once. Neither should you be random about which design elements to use.  For instance, if the website has products to sell, then do not let design detract from the product so much so that the person looks at the design rather than the product. Neither should you have elements that stop a person from buying by using “come on,� “wait,� or “there’s more� kind of tactics.

Getting Drunk on Contrasts

The use of contrast is a great design technique, but it can get in the way, especially if you try too hard to create a visual smorgasbord battling for attention. On the other hand, many designers tend to disregard the use of contrast because they know the content by heart, and fail to look at the design from the angle of a visitor.  Thus, they look at the overall effect, and end up using too light text color that affects visibility and readability.

Inconsistency From Top To Bottom, Side to Side

Often a web design gets attention because it has no focus, which means it’s not a compliment. Think of it as a room – you cannot have gothic mixed with country because they do not work together at all. It’s wrong to have a different theme for every page in your website, just as it can get to be too much if you keep changing the color scheme.

Creating a Navigational Maze

Web navigation refers to links to different parts of your website. An inconsistent web design uses different kinds of navigational designs in one page, or even in the entire website. Again, you need to maintain consistency. At the same time, the navigational keys should be concise and simple. This is the wrong aspect of the web design to “decorate.� It should be as easy for a 10 year old as it is for a 70 year old to figure out how to get to the Home Page or About Us page.

Making Web Design More Important Than the Content

Unless you are creating a design or artsy website, then content should reign supreme. The web design should not be the main selling point. It should be whatever the main focus of the site is. If anything at all, design should enhance content, and by doing so, get its due recognition.

Using Flash Techniques Improperly

A web design that incorporates a video that automatically pops up when a person goes to the Home Page should always have a Skip option. Making visitors go through the same Flash animation every time is abusive and inconsiderate. It will also cause a drop in interest. The same applies with music, especially in game sites. Not everyone wants to listen to the same tune again and again. There should be the option to lower the volume or put it in mute mode.

Playing Around With Text

Adding design to the fonts is generally a bad idea. People just want to read the content, not be impressed with its font, size, or color. It will also cause a problem with optimization. Thus, it is important to choose a font that is easy to read, and not be too small or too big.

Web design can easily go overboard, so the best way to avoid this problem is to have an objective independent person give you his or her point of view. If you get several opinions, you can come up with a consensus. Just choose your critics well.


When Logos Go Bad – Logos That Suck

Logos have always been an integral part of a company. In fact, many consumers mistakenly assume that a company’s logo is their brand. Branding is a huge marketing movement right now and the logo is only a fraction of what makes a company’s brand. However, to the ordinary customer a logo speaks volumes. It is a first, and sometimes last, impression. It is the single, mainstream representation of what you do and you will be judged by it. Therefore, it is important to spend time, effort and money to be certain that your logo does not suck. Here are ways to design a sucky logo:

Amateurism


A common mistake in logo design is creating something that looks cheap or unprofessional. If you are using clip art or stock, it will send the message that you are not original or unique. If the images are blurry or distorted because you are using the wrong software or file format, people will be put off by your logo. Once they are put off by your logo, they will judge your company by their first impression. Not all logos designed by amateurs will look poorly done, but it is imperative to show your new logo off and get valuable feedback on its quality before finalizing it.

Mistaken Symbolism

(This symbol could easily be mistaken for a crop circle or alien hieroglyph)

A logo is your company’s first elevator speech. It is the first attempt at marketing. What goes into your logo matters. Sometimes your logo could showcase something inappropriate and you not realize it. It is best to show it around to trusted individuals to see if they get an interpretation you were not expecting. Optical illusions can be tricky and people can see different things. Incorporating people or stick people images? Pay close attention to position and placement to avoid being inappropriate. If people are able to locate something ‘dirty’ or sexual in nature anywhere in your logo if it is not supposed to be there – then you need to go back to the drawing board. The same is true for showing your product in use in your logo. This can backfire when perception and customer impressions get involved.

It is just as important to think about the wording of your logo as there are many phrases or words that could have double meanings. Sausage can be sexual if used in an improper context so unless you own a sausage company it is best to avoid it. Same for names like Johnson, Peter, and John. Be cautious if incorporating words that can be different things.

Sketchy

It is always great to start off with a hand drawn design, but when it is time to go to print the logo needs to look more professional. Hand drawn artwork can be cute and quaint, but a mainstream logo needs to be able to compete and your competition is most likely not using a cute design.

Spacing

If you are going to use multiple words without proper spacing, you better be certain the words cannot be misinterpreted. A popular example of this is using Kidsexchange instead of Kids Exchange. This method can be used effectively like in Petsmart where either Pet Smart or Pets Mart are both appropriate. Be certain to really pay attention to your wording if you intend to omit spacing.

Being Too Personal

Inside jokes and personality quirks that are unrelated to your business should be left out of your logo. If you are overweight but are running a bakery, your logo does not necessarily need a fat guy or gal in it. Instead of being a nice representation of you as an owner, people will be reminded that if they eat your goods they will gain weight. This is the opposite of what you want to accomplish. If you like to drink a lot and your friends all call you Lush for fun, this does not mean you need to add this charming bit of your personality into your business brand. Your customers do not need to know that much about you in order to spend money on your products or services.

Multicultural

This one can get tricky because no one is an expert in all cultures. However, something that seems perfectly appropriate to you may be majorly offense to another culture. If you have quite a few Indian customers, it is not a good idea to advertise cow slaughter or to even poke fun at cattle. The cow is sacred in India and this will run your Indian customers away. If you want to ensure you do no offend anyone accidently, ask people of various cultures what they think of your logo. You never know when something fairly innocent to you will send another family running in he opposite direction.


How to Choose and Maximize Use of Free Fonts

Graphic designers understand their way around the Internet. With branding and graphic design becoming more and more important for companies, it is also becoming more highly competitive. To keep up with new software, new techniques and trends, graphic designers read design publications and network online at forums, blogs and design communities. One of the ways design websites encourage traffic is to offer designer freebies. Free fonts are an excellent way to offer valuable content and motivate graphic designers to subscribe to what the site has to offer.

Quality fonts are easy to come by, if you are willing to pay for them. However, signing up for the right blogs and forums could help you build your font database for free. There are plenty of websites that deliver all kinds of free fonts as long as you remain a subscriber.

Who doesn’t love free? Even if it is not a font you have a need for right now, having it in your font library could be beneficial for designs in the future. Even if the font is not attractive at first glance, there could be a design at some point that the font is the perfect accompaniment for.

Of course, for every positive there is a negative. The danger with storing and using free fonts is that a free font is much more likely to be overused than a font that designers need to invest in. An overused font is one you can recognize at a glance. If you see a font and can label it as Times Roman, Arial or Verdana, then that font is too common.

There are also fonts that are ridiculed in the design industry. It is important to understand what these are as well. If you are going to use a font like Comic Sans, you better have a really great reason. This font is evokes unfair, but fairly common disgust in the design community. Research a font before you use it to get some feedback about how the design is perceived in the community. Just because someone states that the free font is fun, new, creative and unique – does not make it so.

Also there is some confusion regarding just how free a font really is. There is a difference between a font and a typeface. The font is often offered as free, which means designers are allowed to use it in their designs. However, the typeface is still under copyright protection for the designer who created it. This means the font should not be edited or changed in any way. Some of the free fonts might have a licensing agreement that allows it to only be used privately, which means commercial design for the font is not okay. The majority of the freeware fonts are only free for personal use. Understanding the terms of usage for each font, free or not, is an essential part of using fonts in graphic design.

Another challenge that needs to be taken into consideration is the availability of free fonts. Even with millions of fonts available, it can be difficult for graphic designers to be free to use whatever font best works for them. The reason is that design is often restricted to fonts that the audience has available on their computer. If the targeted audience does not have the font loaded on their machine, the design might not be able to be read or will display incorrectly. Spending hours selecting the right colors, symbols, text and font might come to nothing if the end user is seeing something different than what you have designed.

So, now you are stuck with choosing between fonts that are readily available to your audience but that are not overused and tired. This makes selecting a font not only important, but also potentially frustrating. A great designer can find a way to include the chosen fonts as images so that they show up regardless of what fonts are installed on the receiving computer.

For graphic designers who do not understand the intricate nature of typesetting and font design, it is important to spend some time studying fonts. Designers need to understand the differences in serif and sans serif fonts, what makes a font and a typeface, what fonts are overused and how to balance different fonts. Without this knowledge, the fonts you think are wonderful may not send out the impression you were going for. There are plenty of free fonts available and adding them to your collection for future use is a good idea. However, understanding fonts and typography will stretch out the value of those free fonts even further.


The 2010 Web Design Top Picks and Trends

The year 2010 is more than halfway through, and while there are amazing new website designs being launched regularly, the trend for the year has been established. Before the end of 2009, there were already predictions on what the 2010 top website designs would be. One of the predictions, if it could be called that, was that websites would turn minimalist.

And it did. We see the top website design for 2010 consistently across the board as having one or two main focuses on its main page, and not a lot of text. In fact, some of the hottest minimalist website designs have but a couple of words, some of them just the name of the product coupled with an amazing product shot.  Nothing over the top, stark simple, but it gets your attention in a snap.

Another website design that has been capturing the imagination of internet users and web designers is the use of the magazine-style layout. This kind website design recognizes the fact that eventually magazines will be overshadowed by magazine websites, mainly because of the paperless drive to save the environment from further abuse. This type of website design looks like your typical stylish print magazine with a lot of catchy headings and subheadings, links, and content previews – just like what you can expect from the front cover of your favorite magazine.

Looking at this website design, you notice it tries to re-create that magazine feel that most avid magazine readers have gotten used to. As a website, it appears to be overcrowded, but not for its target audience who prefers to get all the information and teasers it needs in one page.

Most hand-drawn website designs belong to artists or website design companies, and they use the first page of their website to dramatically emphasize their skills and creativity. The website below is a restaurant which means that artistry is starting to spill over to the mainstream websites. You can tell that a lot of thought has been put into creating this restaurant’s website, and it looks a little like a menu. You will also notice that it appears to be crowded, but really isn’t. Because of the dark background, there is a mystic that surrounds the website, as if beckoning one to call in for a reservation.

You will notice that the top websites of 2010 are more than just a business website. It  combines aesthetics with the personalized touch, before merging with the online business perfectly. This is a website trend that was not visible at all a few years ago.

The next top website design for 2010 is the retro look.  You may also call it vintage, but it basically refers to an understatement in web design, almost like an unfinished work of art.  Retro web designs can date back as early as 20 years ago, or go even further back to the days of black and white TV. In the example below, the product is a beer from Portland, Oregon, and one would assume from its web design that the company has been brewing since the 1960s. Except, this original brew from Oregon began selling beer only 24 years ago, in 1986.

The website is a testimony to their marketing angle that they have been brewing the best Portland beer for a long time. And it works superbly.  If you notice, this design also tries to be minimalist by not putting too much information on its top page. The graphics zeroes in on the product, and not much else. By all accounts, it appears that from now on, retro is making a strong comeback in design, this time evident in many website designs all across the globe.

Other 2010 top website designs veer towards the use of large graphics, large fonts, oversized footers and headers, and bold typeface and fonts. For 2010, and into 2011, the attitude towards website design has gone from trying to squeeze everything in one page to a more relaxed and subtle approach. Although, there is still the in-your-face design that can make anyone stop and stare. Generally speaking though, the approach remains minimalist and artsy.

For now, there are many websites that carry more than just website design. One example would be the Von Dutch website that incorporates the hand painted top border, large graphics, and textured background.  It also has the retro look, as well as an interesting black and white image, which is something you might see in a magazine-style website.

For web designers and business owners, the spectrum of design has gone explosive. There are no more barriers or inhibitions in creating a unique impression that could help drive traffic to the website simply on the basis of its extraordinary design. And therein lies the reason why it is called a trendy website design for 2010, and one to watch out for in the coming months.

1 Comment more...

  •   
  • Copyright © 1996-2010 BlogmyQuery - BMQ. All rights reserved.
    iDream theme by Templates Next | Powered by WordPress