AJAX is a method that has been around for a while, yet in the past was not something that was used by many developers. Only recently has it been gaining more attention, especially with the rise in web applications that demand a better user experience. AJAX is not a programming language in itself, but rather a new way to use JavaScript in relation to a web page, and it's this new technology that can make webpages faster, more user-friendly, and the overall function more efficiently.

AJAX stands for Asynchronous JavaScript and XML, and is used for updating and interacting with a server via JavaScript, therefore allowing far more functionality with the server without having to reload the webpage. In this article, we'll go over the basics for implementing AJAX into your website.

If You Know JavaScript, AJAX is Easy

If you understand at least the basics of JavaScript, you'll be able to pick up AJAX quite easily. You can make a page interact with the user with JavaScript alone, and then based on those user interactions you can send, receive, or update page content in relation to the server's response when needed.

Let's say we have a simple button, and we want it to update some data on the page. Imagine we have some input fields before this that the update button will take care of.

<button onclick="updateProfile()" type="button">Update</button>

As seen in the button code above, upon clicking on the button, we can call a JavaScript function updateProfile(). If you know JavaScript, there's nothing new there. The function that is defined between script tags will then be called:

<script type="text/javascript">
function updateProfile(){
	// JavaScript code to be executed
}
</script>

As is best practice, these script tags and all code in between can be placed right before the body tag. Alternatively the JavaScript can be placed within the header (depending on the site structure or specific needs for this page, it may be smarter). Of course, with larger pieces of code, it should be placed within a JavaScript file .js and the file should be included in the header.

From here on, we can place any code we want executed when that button is pressed inside of this function. Again, nothing new here. With traditional JavaScript, we could manipulate any content that is already in the page, as long as it didn't need any more data from the server. A good example of using JavaScript only can be found here: Freelance Finances Calculator.

If we needed additional data from the server, we would need to bring in a server-side scripting language and reload the page entirely. That's where AJAX comes in — to solve this problem. Within the updateProfile() function, we can use AJAX code to interact with the server (via JavaScript!), and we are now able to retrieve, update, and delete information as needed on the server, no reload required.

<script type="text/javascript">
function updateProfile(){
	// JavaScript code to be executed
	// AJAX code will go here as well!
}
</script>

The XMLHttpRequest and ActiveXObject Objects

In order to begin using AJAX code, you need to tell the browser that it will be interacting with the server. In JavaScript there are two objects that help AJAX work: the XMLHttpRequest and ActiveXObject objects. While these are the basis for object-oriented programming with JavaScript, you don't need to understand or implement object-oriented concepts to an extent to use AJAX. In fact, we'll walk you through it right here.

Both objects do the same thing, but they are just meant to support different browsers. The objects are meant to exchange and handle data with the server behind the scenes of the webpage; simple as that.

To tell the browser you will be using AJAX, use the following code (Credit to W3Schools):

<script type="text/javascript">
function updateProfile(){
	// Create a variable to refer to our request object:
	var xmlhttp;

	if (window.XMLHttpRequest){
		// code for IE7+, Firefox, Chrome, Opera, Safari
		xmlhttp=new XMLHttpRequest();
	}else{
		// code for IE6, IE5
		xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	}
}
</script>

The code above is pretty simple. First, we create a variable that will hold our object; whether it is a XMLHttpRequest or ActiveXObject will be dependent on what browser the user is in. (Remember, they both do the same thing.) If we can detect that our browser can handled the XMLHttpRequest object via window.XMLHttpRequest, then we can set our variable to this object. Otherwise, we should set it to the ActiveXObject.

This will be the start of any AJAX code you place into a website. Note that if you are using multiple functions, it may not be the most efficient solution to declare this code at the beginning of every function. If used within several functions, it would be more efficient to set this variable on page load.

Receiving Requests from the Server

Now that AJAX is "all set up" for use in our browser, we can begin the fun part - interacting with our server. Whichever request object is used (based on the browser), there are a set of pre-defined functions we can use to get information from a server via AJAX, send information, or manipulate information.

The first pre-defined property we'll look into is the onreadystatechange property. The does just what it says, it calls the function it holds (see below) when the readyState is changed. The readyState is just the state our server tells us it's in: processing, downloading, or completed.

xmlhttp.onreadystatechange = function(){
	// This code will be executed each time the readyState changes
}

Each readyState is defined by a number, and we can check to see if our current readyState equals that number to process our code dependent on what the server's doing:

• ajaxRequest.readyState == 0 // request not initialized
• ajaxRequest.readyState == 1 // server connection established
• ajaxRequest.readyState == 2 // request received
• ajaxRequest.readyState == 3 // processing
• ajaxRequest.readyState == 4 // completed and response is ready

For example, if we wanted to execute some code only after the data or actions we've requested and ready and have our feedback for us, we'd check to make sure our readyState was at 4:

xmlhttp.onreadystatechange = function(){
	// This code will be executed each time the readyState changes
	if(ajaxRequest.readyState == 4){
		// This code will be executed if our request
		// is completed
	}
}

We can access the data we're requesting by using either the responseText or responseXML properties respectively. responseText is for retrieving text-based data, while responseXML can be used for retrieving XML based data. Then, using basic JavaScript again, we can use these properties to assign our feedback from the server in a div, or do whatever else we like with it:

xmlhttp.onreadystatechange = function(){
  // This code will be executed each time the readyState changes
  if(ajaxRequest.readyState == 4){
     document.getElementById("myData").innerHTML=xmlhttp.responseText;
  }
}

Hopefully you can understand the logic behind all this, but of course none of the above will do us any good as long as we don't tell our code what we want to request in the first place. We needed to create a function to handle our request first, and the above code simply explains how we'll show our data from the server after we've requested it.

Sending Requests to the Server

Like with receiving responses from the server, our request object also has pre-defined properties and functions for dealing with sending requests to the server. Anytime we need to send new information, manipulate information, or send instructions of any type to work with our web application, we'll be sending a request to the server. After we've sent the request, we can turn around and use the function we created above (using onreadystatechange) to see our results.

There are two parts to sending a request to the server via AJAX, as seen in the example below:

xmlhttp.open("GET","ourPHPCode.php",true);
xmlhttp.send();

The first prebuilt function, open(), let's us define what server-side script we'll be using to communicate with the server. We include our server-side script as the second parameter and it will be processed without refreshing the page. This function also holds a few other arguments that we'll look into more detail soon.

Included in our server side script ourPHPcode.php, we'll include the more in-depth instructions that will work with our server. After AJAX opens the server-side script file via the open() method, we can send those instructions out via the send() method.

<script type="text/javascript">
function updateProfile(){
	// Let's first create our request object:
	var xmlhttp;

	if (window.XMLHttpRequest){
		xmlhttp=new XMLHttpRequest();
	}else{
		xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	}

	// This code will be executed each time the readyState changes
	xmlhttp.onreadystatechange = function(){
		if(ajaxRequest.readyState == 4){
			document.getElementById("myData").innerHTML=xmlhttp.responseText;
		}
	}

	// We'll send any data to the server through our request object
	xmlhttp.open("GET","ourPHPCode.php",true);
	xmlhttp.send();
}
</script>

A Closer Look at Open()

When we are opening a file to send to the server via AJAX, the most important portion item is the link to our server-side file. Beyond this though, we have two more: the method for sending the request and async.

open(method,file,async);
Example: open("POST", "myFile.aspx", false);

The method for the open() function can either be GET or POST. If you are familiar with PHP (and many other similar languages) and sending data via HTML forms, the concept is much the same. GET can be used in most situations, and you can even send values through an URL like with HTML forms:

open("GET", "ourPHPCode.php?email=test@test.com&firsname=Johnny&lastname=Smith", false);

GET will often times get you a cached result, which you may not always want. If you still would like to use the GET method, you can simply create a "new, fresh URL" for the browser to go to by appending a unique ID, so it will send you an uncached result:

open("GET", "ourPHPCode.php?x=", false);

POST can be more secure than GET, and also has no size limitations. If you're ever working with data sensitive information (like passwords), then use "POST".

Async, the last parameter, can either be set to true or false. You'll want to use true the majority of the time, and false can sometimes be used for smaller requests. Setting asynchronous to true simply means you'll be able to do other functions while your AJAX request is waiting for the server response. (It's recommended.)

Working with a Server-Side Language

After we've set up our AJAX to request information from a server-side script and also to handle its response, there's really nothing new or magical about our server-side script. The code is the same, and whatever you do with it will follow the same syntax as always. All AJAX does is help to be the middleman while this script executes and handles all the dirty work, allowing us to eliminate or cut down on the need for page refreshes, and allowing us to execute other functionality on a page while our server-side script is working with the server.

Let's say we simply want to echo out a string (via PHP) when we change some form input. We'll use our function that we created above, which defines our AJAX request object, tells the browser what to request, and where to put the response.

Our HTML file (with our AJAX/JavaScript):

<html>
<head>
<script type="text/javascript">
function updateProfile(){
	// Let's first create our request object:
	var xmlhttp;

	if (window.XMLHttpRequest){
		xmlhttp=new XMLHttpRequest();
	}else{
		xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	}

	// This code will be executed each time the readyState changes
	xmlhttp.onreadystatechange = function(){
		if(ajaxRequest.readyState == 4){
			document.getElementById("myData").innerHTML=xmlhttp.responseText;
		}
	}

	// We'll send any data to the server through our request object
	xmlhttp.open("GET","ourPHPCode.php",true);
	xmlhttp.send();
}
</script>
</head>
<body>
	<input name='firstName' onChange='updateProfile()' />

	<div id="myDate"></div>
	<!-- Our response will be placed into the div above,
	thanks to JavaScript's "innerHTML" property. -->
</body>
</html>

Our PHP file ourPHPCode.php.

<?php
	echo "The input field was changed.";
?>

Using JavaScript's onChange event, we trigger our JavaScript function, updateProfile(). Within this function we've done all our AJAX set up, and sent a request to our PHP file, ourPHPCode.php, which simply echos back our string. Therefore, we use the power of AJAX to echo out this string when our input field is changed. There is no need for refreshing or waiting on a slow response for a server.

Obviously, this example is incredibly simple and very pointless. This is just, at the most basic level, how we can connect a server-side script with an HTML page using the power of AJAX. Within the PHP script, you can take in data from a form (for example if we used the POST method in our open() function, we could just use PHP's $_POST variable to obtain that information), manipulate it, send it to a server, update information in a database, and return a response via PHP's echo statement.

Let's say we have a simple HTML form that asks for a name and email. Below is an example of something more elaborate:

Our HTML/JavaScript page:

<html>
<head>
<script type="text/javascript">
function updateProfile(){
	// Let's first create our request object:
	var xmlhttp;

	if (window.XMLHttpRequest){
		xmlhttp=new XMLHttpRequest();
	}else{
		xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	}

	// This code will be executed each time the readyState changes
	xmlhttp.onreadystatechange = function(){
		if(ajaxRequest.readyState == 4){
			document.getElementById("myData").innerHTML=xmlhttp.responseText;
		}
	}

	// We'll send any data to the server through our request object
	xmlhttp.open("GET","ourPHPCode.php",true);
	xmlhttp.send();
}
</script>
</head>
<body>

	<form>
	<label>First Name;</label><br />
	<input type='text' name='firstName' />

	<label>First Name;</label><br />
	<input type='text' name='lastName' />

	<label>First Name;</label><br />
	<input type='text' name='email' />

	<input type=submit' onClick='updateProfile()' />

	</form>

	<div id="myDate"></div>
	<!-- Our response will be placed into the div above,
		thanks to JavaScript's "innerHTML" property. -->

</body>
</html>

Our PHP Script:

<?php
	$firstName = $_POST['firstName'];
	$lastName = $_POST['lastName'];
	$email = $_POST['email'];

	$response = '';

	// Now you have variables from the form, and you can do whatever with them:
	// validate them, update a database, insert them into a database, or whatever.
	// You can do whatever you'd normally do with regular PHP here.

	// You can then create a response variable, set it to whatever value you'd
	// like to send back to the user, and AJAX will update it automatically.

	// Examples:

	if(// Email isn't valid){
		$response = "The email address you entered isn't valid.";
	}

	if(// Everything checks out ok and was submitted properly){
		$response = "Your profile has been updated!";
	}

	echo $response;
?>

The above shows how we can manipulate form data, and one can see that there's no difference in how we use our PHP code to work with a server. We could also include a link to a database connection and work with a database with the information we grabbed from the same page. Just like an HTML form or otherwise can use POST to send data, so can AJAX. From a server-side script's perspective, it's all the same.

Conclusion

AJAX is a revolution to web technology, allowing our client-side scripting to reach server data as needed, yet still allowing us to code with the faster and often times more user-friendly benefits of client-side. It's been around for a while, but it's great to see now how AJAX is really taking off as common practice.

While there are endless tutorials on the web for doing specific things with AJAX, such as creating chat boxes, live feeds, updating info on the fly, and so much more, it's more important than ever to understand the basis of how AJAX works. Having a true understanding of AJAX can help any developer to use the technology to the fullest and in a wide variety of siutations most efficiently.

• Web Design: Say No to Spec
• Building Web Apps: File and Directory Structures
• Creating a Groupon-Like Count Down Timer
• Design Research: Methods and Perspectives

Written by: Kayla Knight for Onextrapixel - Web Design & Development Magazine | No comment
Post Topic(s): Development

In this round up, we have compiled a collection of some wonderful forced perspective photographs that you will definitely love to browse. Forced perspective photography basically is a special technique in which human perception is manipulated with the help of optical illusion. You can make things appear smaller or larger than they actually are.

Here we have showcased some really incredible examples of forced perspective photography. All the photographs in this compilation are hand-picked for your inspiration. These photographs demonstrate how you can create a visual interest that grasps the attention of the viewers.

Forced Perspective Photography

David und Goliat

Kiss On The Forehead

Perspective gourmande ~ Greedy Perspective

Suzi holding the Leaning Tower of Pisa, Italy '08

SKYraker

Nooooooo, por favoooooooooor!!

Touch my sun

Hey, Let go....

Bonfire

Blowing in the Wind

Bolivia, Salar de Uyuni-74

Are You A Little Woodland Pixie?

Clearing the Waters

I need TIME

Balancing Act

Tim tastes the rainbow

Jirrupin eats the moon

Coffee Break....

Lulu sunfingers

Patrick 1

Forced Perspective

Pisa, I love you!

366-317

I Guess I Overpacked

Must have stepped in some manure

Brincando com a perpectiva

Roadtrip North of Salta: kaartje voor mn neefje

Please don't fall, cloud

Camel Kisser

Being Crushed

Fixing the WA Monument

Shyness

Photography

Scara perfecta (a perfect stairway)

Saad

The kontraptionist

Flying on the Rooftops

The Kafkaesque Metamorphosis of my Wife

The orange balloon

Baskeeeeett

The Balcony (Tribute to P. Ramette)

Conclusion

In this round up, you have seen some of the best and truly unbelievable examples of forced perspective photography. Feel free to share your opinion with us via the comments section below.

• Stock Photo Giveaway: 5x $50 Credit from Depositphotos
• Architecture Photography: Appreciation of Man-made Structures
• 30+ Examples of Shallow Depth of Field Photography
• 47 Stunning and Creative Examples of Silhouette Photography

Written by: Jameel Khan for Onextrapixel - Web Design & Development Magazine | 4 comments
Post Topic(s): Inspiration

One of the best sources of inspiration for artists and designers is nature. You can see lots of artwork inspired by nature, artists and designers use colors, textures, objects and photos of nature in their work. The rainbow is definitely one of the most colorful nature objects which inspires everyone. In this showcase I have collected some colorful websites with rainbow elements. Some of these use lots of colors, others use colorful lines similar to those of the rainbow while others use actual rainbow images.

Showcase of Rainbow Elements in Web Design

In this web design showcase you will find 25 impressive examples of rainbow inspired websites with short descriptions.

Designfabrika
Designfabrika uses a beautiful combination of a wood texture and a rainbow inspired background.

Instagallery
A small accent of rainbow on the left side of the website adds some identity and makes it stand out.

Nybble Designs
On this website you can see rainbow inspired elements in the background.

AdaptD
Another website using rainbow inspired lines to add some personality to the website.

MULTIWAYS
Only 3 colors but you can see that it was influenced by the rainbow, on the right side you can see a simple 3-color rainbow.

FeedStitch
Lots of different color lines have some similarities to an ordinary rainbow.

Alexander Zhestkov
Why is this website in this showcase, you'll ask. It's here because it's based on different color lines and that's one of the signs that it's inspired by the rainbow.

Eating in Sydney
Beautiful and subtle colors used to create a top menu on the right side of the website. Looks really nice and refreshing.

For The Record
Retro website with plain grey background and a colorful rainbow inspired block.

LOLWUT
Nice HTML5-based game with vivid colors and a non-traditional rainbow in the background.

Truly Design
Truly Design website uses four colors to imitate a straight rainbow on their website.

OrangeYouGlad
Another non-traditional rainbow used on this website creates some identity for the brand.

Elliot Lepers
Lots of colors used in one shape definitely inspired by the rainbow.

Manchester Craft Mafia
Another website with visible contrast. A gray background and colorful elements inspired by the colors of the rainbow.

Hughes
The big block of colors is reminiscent of the color combination of the rainbow

.

Pretty Production
Stylized dog in different colors creates the impression of the rainbow.

Epic
Epic creative agency logo is definitely influenced by the rainbow and you will notice a few different colored lines on the main agency page.

The Flood Plain
A piano in rainbow colors gives an energetic and fresh look for the website.

Aspanovas Bizkaia
Aspanovas Bizkaia website is decorated with nice colorful socks and rainbow inspired background graphics.

ShowtimeDesigner
Another example of non-traditional rainbow colors. ShowtimeDesigner uses orange, pink, green and purple to create a rainbow-like background element.

Colourpixel
Small rainbows are highly visible on the pixelated orange background.

F5
You can see a nice rainbow behind the mountains on the right side of the website.

Beautiful 2.0
Grunge style website which uses rainbow inspired colors for the background.

WebTek
The WebTek background is very colorful and quite modern. You can easily notice the influence of rainbow colors.

Elastic Media
A small detail which looks like a straight rainbow is used on the header of the website. Simple and beautiful.

Conclusion

As you probably noticed, rainbow inspired websites use lots of colors and various combinations to stand out from the crowd. The most common techniques used are visible contrast when colorful lines are being used on dark backgrounds, rainbow elements placed on one side or corner of the website, and actual rainbows used on the background.

Which website looks most attractive for you? Would you use a rainbow in your projects? Let's discuss these questions in the comments section below.

• The Art of Coordinating Colours in Web Design
• The Designers Republic Guide to Catchy Color Combinations
• Golden Wonder: Using Gold Colour to Design Websites
• What Does Your Website’s Color Scheme Reveal About You?

Written by: Tomas Laurinavicius for Onextrapixel - Web Design & Development Magazine | 8 comments
Post Topic(s): Design

Online advertisements, whether you like it or not, have existed since the internet came into being. Traditionally in the internet industry, ads were mainly created with Flash animation or video; however, as HTML5 rises like a shining star, HTML5 ads are becoming a burgeoning market. So in 2012, we are going to see more ads transform from Flash to HTML5, especially in mobile platforms.

Why HTML5 Ads?

Choosing the right tools for a project means using the simplest tool with the lowest cost that meets all your needs--something HTML5 is capable of doing. Ads, whether animation or video, can be played by HTML5 canvas and video tags; theoretically, it means ads could be created for the web without plug-ins (like Flash or Silverlight), which is the simplest way.

HTML5 ads will not be just animated banners (GIF) or static, but totally interactive pages including advanced functions such as games, quizzes, simulations and etc. The trans-platform capability enables HTML5 ads to be compatible with PC, mobile, tablet as long as the browser supports HTML5. It saves on the cost of development.

The Current Situation:

On PC platform, most of ads are Flash animation or Flash video; according to Adobe’s statistics, 99% of internet-based PCs have installed Adobe Flash Player.

Meanwhile, a change also happened. With more HTML5 support by browsers, more than 60% of web users are ready for HTML5. We have witnessed the huge growth of HTML5 apps in the last year, the HTML5 ad will also flourish along with the growth. Although IE is not compatible with HTML5 before version 9, we will see great changes in IE10.

While Flash is still the dominant tool for ads on PC, HTML5 ads are undergoing a rapid growth.

The situation is totally different on mobile platforms; ads are experiencing a Flash-to-HTML5 conversion. Because of the poor performance, Adobe has abandoned Flash Player on mobile platforms, which leaves no competition for HTML5. Apple and Google are the two titans on mobile platforms; the former one, as we all know, closed the door to Flash on their products; the latter one supports both on Android. So HTML5 is quickly popularizing on mobile and tablet platforms, and becoming the important factor that changes the mobile ad rule.

In terms of cross-browser compatible animation, video technology and ad patterns, HTML5 is the No.1 choice. Previously, in the case of published ad campaigns on mobile apps or websites; there was the major issue of device technology fragmentation to overcome.

Even when limiting the campaign to the latest smart phones, there are various screen sizes, a handful of operating systems, dozens of browser versions, and hundreds of device models that the ad units will have to be displayed on; now, HTML5 enables ad publishers to create richer ads that can be served on different mobile sites and apps regardless of iOS or Android. According to the statistics from Google Doubleclick, the click rate of rich media is 5 times higher than other ad forms.

More importantly, HTML5 makes track impressions possible on mobile platforms; this method is called client side counting. Ask any mobile ad publisher, he will tell you how important it is. It helps agencies to plan, create and track mobile ad campaigns through user’s interactive time, interest degree and etc; those statistics are helpful to know the brand preference and purchase motivation.

For a rapidly growing category of media tablets and app phones, developers have turned to HTML5 for its easy distribution, great graphical abilities and flexible audio/video features.

Challenges and Restrictions:

Let us take a look at some of the possible challenges and restrictions that need to be worked on before HTML5 ads can be possible.

Ad networks don't fully support HTML5 yet

Google IMA for HTML5 allows developers to request and track VAST (Video Ad Serving Template) ads in an HTML5 video environment with certain limitations based on device compatibility. YuMe HTML5 support is in progress. It is supported in the JW Player’s HTML5 mode through the YuMe plugin. The other networks are implementing HTML5 support with different degrees of progress.

WebM or H.264

HTML5 video ads must be encoded into 2 formats: WebM for Firefox and H.264 for other browsers. An appropriate format should be selected to display. This is difficult to implement in an ad scenario, especially if ad networks don’t account for the user’s browser when generating an ad response.

Crossdomain issues

An additional technical concern is that loading external assets (a VAST XML response from an ad server, for example) brings with it certain restrictions in JavaScript. These restrictions need to be worked around on the server hosting those assets.

Future Guess

HTML5 ads are a new and rising submarket; we are going to see a rapid growth of HTML5 ads in the upcoming years; meanwhile, more ad publishers will transform from Flash ads to HTML5 ads, or take care of the both; with the help of modern tools like SWF Decompiler or SWF convertor, it is not difficult to adapt the changes. Although most of the discussions have been about apps and websites in the last year, we can predict HTML5 will also bring remarkable changes to advertisements in the next year.

What are your thoughts on HTML5 Ads? Share your views with us.

• A Closer Look at Choosing Between Flash and jQuery
• Full CSS3 HTML5 Contact Form with No Images
• 20 Inspirational HTML5 Websites with 3D Flavor Added
• Top 10 Practical Websites for HTML5 Design

Written by: Viki Hoo for Onextrapixel - Web Design & Development Magazine | 4 comments
Post Topic(s): Articles

Business cards are a vital contact point for potential clients so why not refresh your image for the New Year...for free? Today we are delighted to collaborate with 1800Postcards.com to offer our readers the opportunity to win 500 business cards!

Who is 1800Postcards.com?

So why trust 1800Postcards.com with your design work? 1800Postcards.com is the retail branch of Circle Press, a high-end commercial printing firm with a roster of Fortune 100 clients that include Dior, Tiffany, Disney, American Express, Broadway Shows and most of the world’s leading brands. These companies demand nothing but the best in quality.

To be specific, a quality standard called “G7”, which is only granted to printing firms that meet a very strict set of best practices and production quality. These clients sit with pre-press, have color proofs printed for spot color matching, they come in when the job is printed to make color adjustments and watch it run on the press to see the final results, the whole nine yards. They also pay tens of thousands of dollars for this type of service level.

1800Postcards produces your print work in the same facilities, with the same press-men and production staff, and adheres to the same quality standards as high-end commercial jobs. The only difference is that your job is “gang printed” or run together with other 1800Postcard clients, which is the secret of every online printing company and why they can be so cheap in pricing. However, 1800Postcards.com just brought it up to an almost unreasonable level of quality.

But what if you don’t need postcards? Well they’re capable of more than just postcard printing. They offer brochures, business cards, flyers, posters, banners, stickers and pretty much any custom work your creative mind can imagine.

Bottom line, the print results are unbelievable... no one in the online printing space comes even close to this quality and attention to detail. You can see it yourself by requesting free samples.

The Prizes

3 winners of 500 free business cards each with free shipping costs. For US entrants only.

How to Enter

To enter the giveaway is easy. Leave a comment in this article below to tell us why you should win. Follow us @onextrapixel and @1800Postcards on Twitter. Tweet or like this giveaway to double your chance of winning.

This giveaway ends on 5th February 2012. Please use a valid email address when filling out the comment form. Please comment only once.

The winners will be selected at random, contacted by email after the contest is over and announced in this article.

Good luck, everyone!

• UPrinting Giveaway: Print Your Own Custom Business Cards
• Business Card Giveaway: 500 MOO Business Cards to be Won
• 38 Awe-Inspiring Business Cards of Designers In The Community
• 30+ Business Card Design Ideas That Will Get Everyone Talking

Written by: Onextrapixel Team for Onextrapixel - Web Design & Development Magazine | 23 comments
Post Topic(s): Giveaways

As a web professional, there are things we have to deal with outside the realms of development and design. Sometimes it’s a matter of business, sometimes it’s keeping our finances in order, and every now and again, the subject of branding, re-branding or protecting our brand hits our to-do list.

When you begin your journey into starting up your first freelance portfolio, this information will play a vital role in how you represent yourself, however, that’s not to say that this subject won’t recur later on.

Online Brand Availability

If you ever want to launch that start-up idea you have, or if you want to build a new business, a basic knowledge of domain names is critically important. After all, it represents your office’s address.

Figure 1: The website address is critically important, thought should go into its branding.

Within this article, we’re going to explore your options, once you’ve got yourself an idea for what (if anything) your new project should be called, and critically, what your project actually does. Because it’s not a sexy chore, and somewhat frustrating to find that perfect domain (with lots being sucked up and left unused), it’s one of the hardest challenges you’ll likely encounter.

With the advice below, you’ll at least have an idea of which domain types matter, and thereby, which you should focus on attaining (and if you can’t get it, when you should reconsider your brand due to unavailability).

Prioritize: The Trendy Three

Domain names in truth are a little biased to whether the audience can remember the extension. It might seem ideal to snag yourself a free .TK domain in preference to buying a more easily recognised extension, but that will work against you when your visitors begin trying to locate you for the first time. While increasing numbers of TLD’s are becoming available on the Web, the truth is that visitors will automatically assume your site uses one of three extensions: dot COM, NET or ORG.

Perhaps this feels a bit unfair due to the lack of good available names in the system, but if you can get one of the top three (or all three if the brand is named really creatively), you’ll put yourself in an ideal position.

Figure 2: Dot COM, NET and ORG and the most widely recognised extensions. Get them if you can!

When you’re working with the top three domains, the great thing is that they’re often among the cheapest to register, and even more critically, all domain and hosting providers will likely support them (in terms of offering the ability to register and renew ownership). While I would say it’s not as essential to own one of the big three as it used to be (due to more people becoming web aware), there are still a huge number of people who don’t understand the web, and won’t likely realize that extensions exists outside of .com, .net and .org exist, so they do still hold sway over consumers.

Localize: Geo and IDN

While the big three are pretty important and useful assets to have, there is a major exception where the need for a globally recognised identity may be second in the priority list. If you’re an individual or group that only operates locally to a country, then the registration of internationalized (specific to a language) or geographic country domains (like dot CO.UK, EU or US) will become equally worthwhile as the big three.

If you’re based in the USA, the .us extension will be easily recognized and worthy of purchase, elsewhere around the world, you’ll have that country’s own regional domain to register if you serve people in those areas (even if you just use it for offering localized specific site translations).

Figure 3: If you live in Europe, it makes sense to get the dot EU as well as countries native ccTLD.

Choosing whether to use .com or .us can be tricky if you only serve a small audience from a specific nation, however generally speaking, I’d prefer to edge on the side of caution and get them both to avoid unnecessary mistakes based on user expectations (it also gives you room for expansion). Also worthy of mention are the fairly new Internationalized domain names that potentially will be useful if you serve an audience who don’t natively use the standardized English alphabet (like China, Japan and Russia).

When it comes to IDN’s, however, my advice is to just use them to supplement a ccTLD or .com address, as visitors whose primarily language is English will find entering those URL’s tricky.

Figure 4: International domain names are useful, but don’t force English users to try to enter them.

Customize: Hacks and ICANN

Sometimes, no matter how hard you try (or how much thought you put into the brand), the domain name you’d really like to register just isn’t available. In times of trouble, and if you’re really stuck for getting something close to an ideal URL, many choose to cheat slightly and use a technique called domain hacks. The idea behind the technique is pretty simple, as either subdomains or the extension itself forms part of the brand name.

Ideally it would likely cause less confusion if you could get the name you wanted without the need for hacks (as users don’t need to try to remember where the dots need to appear), but it’s certainly a favourable and highly utilized alternative to get a good url.

Figure 5: There are some cool sites out there that will help you identify potential domain hacks.

Beyond using hacks, some users like to customize even further by using services like new.net. These services essentially offer an alternative system (aTLD) by providing extensions that aren’t endorsed by ICANN or other registrars. However, because these extensions aren’t natively supported and thereby require a plug-in, the potential for conflicts and the invisibility of domains for those without the required extension exist.

As it’s obviously not an ideal solution, I’d recommend that such services be avoided (they’re not worth the cost). It’s also worth mentioning at this stage that

ICANN accept applications for new TLD’s, and even though they’re out of the average person’s budget, the benefits of all of these new domains will be passed onto us as those fresh domains go global in the future.

Figure 6: New.net is an alternative domain extension supplier but it’s poorly supported worldwide.

Accessorize: Protect and Redirect

Let’s say you’ve found your domain (the top three, applicable ccTLD’s, IDN’s and maybe a hack). The focus now needs to go onto ensuring that you don’t fall foul of the various issues that exist when it comes to domain names. The first thing you need to ensure is that you’re actually legally able to use the domain you’re thinking of purchasing.

Keeping it simple, trademark law can complicate matters if there is a chance that your brand might be mistaken for the property of someone else. For your own safety, ensure that you don’t register a name that’s similar to anyone else’s who does the same thing as you. Such misappropriations might result in you losing the domain and a hefty legal bill.

Figure 7: One classic example of this in action was the highly publicised “Mike Rowe Soft” site.

If you’re sure that you’re entitled to own a domain and you aren’t just swiping someone else’s brand identity to try to catch their visitors, you want to ensure that your own digital property is going to be as protected as other major brands. While applying for a trademark can be useful if the site is likely to become really successful, it’s pretty expensive to purchase.

As such, many simply choose to register as many applicable TLD’s as they can, using them as redirects to the central .com domain. Bulk purchases can be cheaper if your registrar offers bulk discounts or domain credits; however, it’s definitely something you should consider, as misspellings or fake sites often catch people out online.

Figure 8: Take the most popular TLD with users (like .com) and have all others redirect to it.

Authorize: WHOIS and Registrars

Finally, I’m going to mention a couple of tips when it comes to the registration process itself. While the picking of a domain name is fraught with a lack of choices, and protecting your domain can be a hard task, there are two things that occur commonly in the registration process itself, which can lead to problems.

My first piece of advice when registering domains is to ensure your domain registrar and host aren’t the same company. I realize that not all hosts are bad registrars and not all registrars are bad hosts, however, I’ve noticed correlations between businesses that branch out into too many directions having their core (or complementary) services suffer (in quality or stability) as a result.

Figure 9: Reputations are made and broken on the quality of service, and bigger isn’t always better.

As a final tip in relation to domain registration, never ever use WHOIS privacy services! While valuing your privacy is a good thing, the issue is that these tools use the registrar’s own contact details to fill in the blanks, and this becomes a critical issue if your domain is hacked or if you want to leave your registrar.

According to ICANN policies, it’s the person in the WHOIS details who owns that domain, so if your domain is hacked and transferred away, you’ve got little to prove prior ownership. Trickier still is the problem that if you want to move registrars and your provider doesn’t want to let you, as their name is in the records, they technically own it and can take it away, whenever they feel like it.

Figure 10: Keep your name in the WHOIS records, if you don’t you put your domains at risk.

Branding and the Internet

Sites are wonderful, and having that perfect domain name can really make a difference, even in this age of being redirected by search engines and social networks. Easy to remember names are likely to reduce the burdens upon users who hand type a URL.

Top-level and the right secondary domains can help search engines ensure that you reach a good global and local audience. With all of this in mind, moving forward with your various projects, spending the time to get to grips with your options and how they may affect you is worthwhile.

Ultimately, a weak brand (such as one which could easily be confused with another) may damage opportunities for success, or risk becoming forgettable.

Do you have a particular technique for finding a brand name? Are you a fan of auction services like SEDO? Do you even believe that domain names still matter with the likes of Google?

Let us know your pro tips in the comments for ensuring you’ve snagged the best domain in the universe!

• Web Design: Say No to Spec
• Why Designers and Developers Shouldn’t Hate Each Other
• Uncover the Competition Before Stepping into the Ring
• Tips For Choosing A Graphic Designer

Written by: Alexander Dawson for Onextrapixel - Web Design & Development Magazine | 6 comments
Post Topic(s): Articles

Today, while skipping rope I was pondering (my level of concentration increases when I skip rope) the reason behind the availability of innumerable anti-spam WordPress plugins. Did the creators of WordPress not think about spam issues and don’t they do so now when WordPress has gone viral? Actually, that isn’t the case. WordPress, as a Content Management System, comes loaded with basic features to tackle spam. It is just that we have been spoon fed the idea that a plugin is a must for any WordPress feature other than writing articles and uploading images.

Plugins are required for extra features. Believe me, basics are always packed with WordPress. This discussion will go through some of the best WordPress plugins to fight spam and later on excogitate the WordPress dashboards to find out if we really need such plugins.

P.S. Don’t ask me why I was thinking about WordPress spam while skipping rope. I tend to think weird things at weird times.

The Showcase of WordPress Anti-Spam Plugins

The upcoming list of Anti-Spam WordPress Plugins will help you run a (literally) spam free WordPress blog. It will be your call when it comes to using the best out these bests. Remember, plugins tend to slow down your blog (even when the time period is fractions of seconds) so think before you install such plugins.

Akismet
Akismet happens to be one of the first WordPress Anti-Spam Plugins which actually started the trend of Anti-Spam plugins. As of now Akismet comes packed with default WordPress plugins which in itself explains the importance of this plugin. Akismet requires a registration key but once you are through the setup then you can literally forget the plugin. It will continue to perform its job without requiring any interference from your end. Although, the occasional plugin updates at your discretion will be required.

WP-reCAPTCHA
This is another famous WordPress Anti-Spam Plugin which has received plenty of downloads and positive critic ratings. The unique feature of this plugin is the collection of words from old books that it uses for CAPTCHA verification. The functionality used for this plugin was acquired by Google which helped the plugin reach the heights of fame. The plugin has a lot of content for you to read if you have time to do so.

WP Hash Cash
Users are required to submit a proof-of-work in order to confirm that the website was opened in a Web Browser and not by some bot. WP Hash Cash provides admin with three options for comments that fail the JavaScript test. Firstly, you have the option to push the comment into a moderation queue. Secondly, you can push the comment into the default Akismet queue. Thirdly, you have the option of deleting the comment without a second thought.

Additionally, the plugin protects sign-up pages from dummy bots. The plugin is 100% standards complaint with XHTML 1.1 which is hardly the case with other plugins.

bcSpamBlock
bcSpamBlock is a JavaScript based Anti-Spam WordPress Plugin that uses JavaScript and the crypt () functionality of PHP in order to smartly fight spam. Users that block JavaScript are switched to a CAPTCHA based legitimacy check exercise. This helps bcSpamBlock control spam from all fronts. The plugin hasn’t yet received the amount of recognition that other plugins have but it has left its mark pretty neatly.

The above plugin uses a part of the code from JS Spam Block which will be discussed next.

JS Spam Block
Like its child plugin, bcSpamBlock, JS Spam Block uses JavaScript to tackle unwanted spam in WordPress blogs. Legitimate users are asked to enter a given number which proves the authenticity of a real user over a spam bot. JS Spam Block comes loaded with backward compatibility for non-JavaScript users therefore this plugin too covers all sorts of spam. The plugin has received enough positive critic ratings which prove that it is good at what it does.

Spam Stopper
Much like other anti-spam plugins, Spam Stopper WordPress Anti-Spam Plugin uses CAPTCHA features to validate the originality of a comment. It uses JavaScript to validate if the required fields in the WordPress comment form have been filled with correct data. The plugin skips the CAPTCHA validation if the user is logged into the WordPress dashboard. It simply assumes that the author won’t leave spam comments in his own blog.

Peter’s Custom Anti-Spam
Peter’s Custom Anti-Spam WordPress Plugin uses CAPTCHA based validation functionality to gauge if the comment is from an authentic human or a spam bot. It will ask commenters to enter a random word (as per the CAPTCHA image) before the comment goes into the blog. Some of the exciting features of this plugin are the customization of words displayed in CAPTACHA image, random font display, no JavaScript required, audio feature for the visually impaired and a lot more.
The downside of this plugin is the unavailability of an auto-upgrade feature. To update the plugin you will have to perform manual tasks. Although updating a plugin manually isn’t a herculean task, some hearts do start pumping blood very quickly when they read the word – manual.

Spam Free WordPress
This plugin claims 100% spam blocking rate and the amount of downloads (almost) confirms the same. The plugin uses multiple features like IP address block list in case of manual spam. The plugin proudly boasts of its 100% spam blocking rate and boasts about even Akismet not promising the perfect blocking rate. I guess such comments take the Anti-Spam war to another level but at the end of the day it is the user who benefits from such war of anti-spam plugins so it is good!

And, Why You Don’t Need the Above Plugins!

I have no intentions of disrespecting the hard work done by programmers in order to launch the plethora of Anti-Spam WordPress Plugins. Really. But, I am a WordPress user and my life revolves around WordPress. I won’t be doing justice to the best Content Management System if I do not introduce my readers to some of its amazing features.

You (the WordPress user) might have already been through every page on your WordPress dashboard and assumed that without a plugin spam will kill your WordPress blog. Actually, Plugins must be used when webmasters want to utilize extended features that WordPress does not support. Otherwise, the basic WordPress features might just do well!

Ignorance will stall your own blog. How? Well, when you ignore the basic WordPress features and use plugins instead then you give away memory for those plugins to run smoothly. That is when your blog starts to lag. Let us quickly look into different WordPress features that can fight spam without using plugins. The Settings > Discussion section from your WordPress Dashboard will now be our point of discussion.

Default Article Settings

I am assuming that you dream about people leaving gazillions of comments on your posts so the comments cannot be blocked. From this section we can cut down pingback and trackback notifications. These are the silly heads up that keep popping up when some article from your blog is linked by some other article. This step eliminates the requirement of those plugins that fight pingback and trackback notifications. Trust me, you don’t need them.

Other Comment Settings

Fields like Name and E-Mail in the comments form must be marked as mandatory fields. As this is turned on by default in WordPress installations most WordPress blogs have this setting enabled already.

If you require users to log in before leaving comments then this will cut down on a significant amount of spam comments. This step might be a turn off for few legit readers who want to leave a comment but don’t want to sign in. So, analyze before you enable this feature.

Usually old posts are the target of spammers instead of legit readers. So, it is suggested that you close comments on post that are pretty old. Say 3 months? If you are writing articles that are evergreen for discussion then you might want to skip this suggestion.

E-mail Me Whenever

You can use this feature if you don’t get thousands of comments on your posts. You will get email notifications for every comment that pops up and you can mark it spam right away cutting down on a section of spam comments.

Before a Comment Appears

Allowing readers who have previously left a comment to leave a comment again without requiring any approval will help you cut down the legit comments in the moderation queue while you can mark the rest of the spam comments as – spam!

Comment Moderation

Usually, spam comments have plenty of outgoing links. Pushing such comments into a moderation queue will give you the time to approve the legit comments and spam off the useless ones.

Comment Moderation Blacklist

If you smartly tune your Comment Moderation Blacklist and regularly update it with words that you think are often part of spam comments then you will eradicate the need for plugins that do the same task. It might take some patience to build such a list but the hard work will surely pay off. This will remove the need for any third party blacklists and plugins that use such lists to fight spam.

Comment Blacklist

Comment Blacklist is more or less similar to above list. The only difference is that comments blacklisted through this list will be directly marked as spam and they won’t be pushed into the moderation queue for re-consideration. Use this list very carefully otherwise some legit comments will be marked as spam.

Life Without Akismet

Akismet anti-spam WordPress plugin comes loaded with default WordPress installation so it must be important? Well, not really if you are using the above features smartly and updating them regularly. Please understand that every plugin will eat up a section of your useful memory which might (as pointed out before) slow down your blog. Use the aforementioned features and you might not even feel the need for Akismet!

Conclusions

Let me know if you will take the extra step of disabling Akismet and start fighting spam without any WordPress plugins. I am ready to take this step. Joining me?

• WordPress Giveaway: The Events Calendar 2.0 for WordPress
• WordPress Week Giveaway: 3 X Premium WP Plugins from Tribulant
• WordPress Plugins Giveaway: GD Custom Posts And Taxonomies Tools Pro
• WordPress Giveaway: Ultimate WordPress Administration Plugin

Written by: Salman Siddiqui for Onextrapixel - Web Design & Development Magazine | 9 comments
Post Topic(s): WordPress

There are hordes of online graphic design tutorials, resources and lists however we thought that to make a change, a list of top ten offline resources would be great for those who spend far too much time in front of a computer screen or for those times when, God forbid, your internet connection isn't working!

While blogs and magazines are great for quick reference and news, they don't offer the depth that a good old read can. Whether you are a professional and looking for a book that can give you the edge and offer the best service to your clients or a novice designer looking for guidance, these reference books can help you become a more well-rounded designer.

Top Ten Offline Design Resources

Participate; Designing with User-Generated Content – Helen Armstrong and Zvezdana Stojmirovic

What can you do when creativity is no longer the sole territory of the creative professional? The web is overrun with amateurs using websites such as Flickr, Threadless, WordPress, and YouTube. User-driven design has never been so easy for the amateur to generate and distribute. Rather than admit defeat the author here discusses how designers can lead this new breed of amateur creatives rather than be overrun by them.

PANTONE The 20th Century in Color - Leatrice Eiseman and Keith Recker

Pantone, the worldwide authority on colour gives you a tour of 100 years of colour in the 20^th century. From the Pale Gold (15-0927 TPX) and Almost Mauve (12-2103 TPX) of the 1900 Universal Exposition in Paris to the Rust (18-1248 TPX) and Midnight Navy (19-4110 TPX) of the countdown to the Millennium, the 20th century brimmed with color. This book reveals the colour trends, shifts, and resurgences of different hues. Helping you to identify colour schemes and trends for your work.

Grid Systems in Graphic Design - Josef Muller-Brockmann

This is one strictly for the professionals. This is THE book to turn to when using grid systems in graphic design. Though Muller-Brockman first presented his interpretation of grid in 1961, this text is still useful today for anyone working in the latest computer-assisted design. With examples on how to work correctly at a conceptual level and exact instructions for using all of the systems (8 to 32 fields), this guidebook provides a crystal-clear framework for problem-solving.

Idea Index: Graphic Effects and Typographic Treatments - Jim Krause

This little reference book lists hundreds of great ideas for creatives -- whether you're a graphic designer, font designer, or web designer, or even just an amateur artist. The book is divided into two sections, Graphic Effects and Typographic Treatments. The Idea Index offers new ways of looking at shading, spacing and much more.

Make it Bigger – Paula Scher

Named after the familiar 'make it bigger' that graphic designers are used to hearing from clients, it is an appropriate title for a book that examines the graphic design industry through the eyes of the business community that it serves. Drawing on over three decades of experience, Scher provides readers with a first-hand account of the graphic design process in relation to the corporate cultures and organisational dynamics that are often resistant to creativity and change. What makes this book stand out from the others is that it focusses on the collaboration element that is absolutely vital to bring ideas to life.

Layout Index: Brochure, Web Design, Poster, Flyer, Advertising, Page Layout, Newsletter, Stationery Index - Jim Krause

It‘s little sister, Idea Index Idea started a revolution in graphic design books. Layout Index is the next step, holding a whole host of layout idea-generators that will help designers explore a wealth of possibilities for visual treatments each time they turn the page. The visual and textual suggestions are divided into eight major areas, including newsletters, flyers, posters, brochures, advertising, stationery, page layout, and Web pages. Designers will learn to solve their design problems, produce fantastic work and become better, more creative thinkers.

Patterns and Palette Sourcebook: A Complete Guide to Choosing the Perfect Color and Pattern in Design - Anvil Graphic Design Inc

This reference book is invaluable for art directors, designers, and students working in the fashion, product, and graphic design fields, as well as anyone in the business of visual communication.

The Pattern and Palette Sourcebook is a desktop source of colors and patterns that addresses the professional's real-world needs when working with harmonies and contrasts. The book is divided into six sections and provides users with 15 appropriate colors for each section, which are then incorporated into 25 different patterns shown in six or eight color variations each. This allows readers to see the impact colours have in design and helps them better understand how to use color effectively. The book also demonstrates ways of creating designs that are distinctly unique from one another yet hold together in a group.

Identity Crisis: 50 Redesigns That Transformed Stale Identities into Successful Brands - Jeff Fisher

Everyone loves to see the before and after in any transformations, but this book is also a great resource for getting new fresh ideas for your own and to show your clients the potential in any redesign. While graphic design books are extremely popular, this book is unique in the fact that it looks at redesigning existing brand identities to achieve success.

Logo Design Workbook; A Hands-On Guide to Creating Logos - Sean Adamsn and Noreen Morioka

This handy guide focusses on what makes a logo work. In the first half of the book, readers get a step-by-step guide to the logo development process. Topics in the book involve developing a concept that communicates the right message and is appropriate for both the client and the market; defining how the long term goals of the client may affect the look and needs of a logo; choosing colours and typefaces; how to avoid common mistakes and analysing why some logos are successful and others not. The second half of the book focuses on logo case studies throughout various industries.

Thinking With Type - Ellen Lupton

One of the most basic challeneges facing any graphic designer today is what type of font to use and how big? How should those letters be aligned? How much spacing should be used? In this useful guide, design educator and historian, Ellen Lupton provides a clear and concise reference for anyone learning or brushing up on their typographic skills.

Conclusion

Each of the above books offers a unique method for mastering the subject at hand, quickly and easily, and many are filled to the brim with the experience and guidance of experts that is bound to give you the advantage over your competitors who haven´t taken the time out to seek this depth of knowledge.

• Showcase of Awesome Catalog Designs for Your Inspiration
• Win a Macbook Pro by Participating in the 2011 Graphic Designer Survey
• From Print to Web: Creating Print-Quality Typography in the Browser
• 30 Stunning & Creative Uses of Typography in Print Ads

Written by: Chloe Lloyd for Onextrapixel - Web Design & Development Magazine | 6 comments
Post Topic(s): Resources

This year, Chinese New Year is on 23^rd January, and 2012 is the year of the Dragon. The Chinese zodiac is also divided into 5 elements, and the element for this year is water – so this year celebrates the Water Dragon.

The other elements are wood, fire, earth and metal, and previous dragon years have been: 2000: Metal Dragon, 1988: Earth Dragon, 1976: Fire Dragon, 1964: Wood Dragon, 1952: Water Dragon.

In general, the characteristics of those born in the year of the Dragon are: resourceful, adaptable, original, arrogant, irritable. Dragons are most compatible with rats and monkeys.

In the world of digital art, dragons are a popular subject. Here, to celebrate the new year, we have compiled a selection of Year of the Dragon greetings and wallpapers, followed by some general dragon art.

Year of the Dragon Art

Year of the Dragon

Dragon Year 2012

Year of the Dragon

Year of the Dragon

Year of the Dragon

Happy New Year

Dragon Year 2012

Year of the Dragon

Year of the Dragon

The Year of the Dragon

Year of the Dragon

Year of the Dragon

Year of the Dragon 2012 Calendar

Japanese New Year’s Card 2012

Dragon Year

Chinese Dragon Slifer Wallpaper

Year of the Dragon 2012

Year of the Dragon 2012 Red

Chinese New Year/2012 Year of the Dragon

Happy Year of the Dragon

Happy Year of the Dragon

General Dragon Art

Dragon Mage

Ice Dragon

Dragon Fury

Victorious Dragon

The Green Dragon

Chinese Dragon

Flight of the Dragon Kyn

Dragon

Dragon Hurlant

Dragon and Knight

East Dragon Love Attack

Dragon

Fire Dragon

Confrontation

Dragon Ball

The Dragon Wallpaper

Conclusion

We hope you have enjoyed viewing this selection of outstanding dragon art. If you celebrate Chinese New Year, we wish you a very happy, healthy and prosperous New Year.

Please leave any comment or acknowledgments for the art/artists below.

• 35 Beautiful Examples of Nature-Friendly Art for Tree-Huggers
• Showcase of Fractal Artwork from deviantART
• Typography as Design: Advanced Technology and Art
• Inspiring Drinks Labels: Positive Reasons for Turning to The Bottle

Written by: Carol Francis for Onextrapixel - Web Design & Development Magazine | One comment
Post Topic(s): Inspiration

In the world of corporate design, booklets are one of the standard tools that you can use for promotion and advertising. Booklets are like the tiny books or magazines yet are very powerful. Booklets usually lay around in conference halls, offices and waiting rooms and on occasion they include an annual report of the company or showcase the portfolio of an artist.

Apart from being easy to carry, booklets are less likely to bore the reader as their content is shorter and enticing. Therefore, such printed materials can be utilized essentially as manuals, guides, as well as flyers to furnish readers a concise but succinct idea regarding a certain topic.

Booklet designs have to relay messages to the readers through images and few words, usually presented as key points that get the aims, ideals, products and/or services of the company across. A good booklet design is of paramount importance to all companies, and the designer must be skilled in this field.

Showcase of Creative Booklet Designs

Here is a selection of effective booklet designs produced by creative designers for your inspiration and viewing pleasure.

Portfolio

ALPHA_TXT

Capital Jets Booklet

Avant Garde Gothic Typeface Booklet

Kiosk 37

Restaurants Identity book

Silkroad

De Facto

Caledonian

Frankmusik 3 Little Words EP

Recycle Yourself Booklet

Booklet and Badge

Verbo na Escola Mailing

Type Specimine Booklet

HIKE Design Ravensbourne

Beautiful Trash

Cute Booklet

Waterstones Murder Mystery Book Month

University of Lincoln: Science Dept Prospectus

Effektive CV Poster Mailer

Portland has been Busy with Beautiful Design

SHN Mood Booklet

Retrospective 08 Aiga Senior BFA Catalog

Orzamento 08

All is full of...

Design Methodologies Booklet Photo

Some Thoughts on Design

Lago Estate

Le guide des admiscibles

Booklet Design

Altus

Conclusion

In this roundup, we have shared some excellent examples of creative booklet designs that you can get ideas from when creating your own. With this collection, we tried to include innovative, visually appealing and attention-grabbing design solutions. We hope that everybody will find something interesting and unusual.

Let us know which are your favorites in the comments section below.

• All About Steve: The Amazing Steve Jobs (1955 – 2011)
• Waking the Sleeping Genius Within a Designer
• Beautiful Food and Drink Packaging Design
• 24 Fabulous One Page Web Layouts

Written by: Jameel Khan for Onextrapixel - Web Design & Development Magazine | 3 comments
Post Topic(s): Inspiration