Web Design Habits

Simple Strategies to Increase Sales on Your Website

Sheila Mahusay — Wed, 10 Apr 2013 09:06:51 +0000

You want to increase sales on your website, but don’t want to invest too much money on your efforts. You have tried many strategies, but you are finding them time consuming and expensive. Here are some simple strategies you can try to help increase your sales without a huge investment.

1. Seek Out a More Effective Shopping Cart

There are many options online for a better, but not necessarily more expensive, shopping experience. Much like you sussed out a website hosting provider, you can find many advanced shopping cart options. In this day and age, you want to have a shopping cart that is smartphone and tablet friendly. People want the convenience to shop when and where they want. Seek out new shopping cart technology that will offer you check out and payment processing for an improved check out experience for your customers anytime and anywhere. There are so many customizable programs you are sure to be amazed at how far things have come in just a few short years. A new shopping cart will also give a new look and feel to your site which can also assist in improving your presence.

2. Reconsider Your Product Focus

It is not that you need to stop selling shoes and start selling fishing rods. It’s all about how many products you are offering and if they relate well to each other. You can catch a lot more people’s attention with a few clearly described items than offer too many for them to sort through. This can often result in customers abandoning the site because they can’t make a decision. Offering them your best items with detailed product descriptions will help make the product irresistible. Then offer the most complementary products as links from the home page. This is an easy thing to change with little to no cost to you and it’s easy to change if you find it isn’t working. Because it is simple, you can also try a few different items and see which ones work best.

3. SEO

It’s all about the search, and if you are not getting good exposure, or can’t be found then you aren’t going to get new customers. There are many free services offered by Google to help you with SEO (Search Engine Optimization). You will learn how to use the best keywords on your site to help you improve your ranking. You can also pay for effective SEO services if your budget allows. This is not an aspect of your business to ignore. You can be sure that most of your competitors are using some form of SEO to generate sales, and they could be stealing business from right under your nose. Consider doing an SEO audit to test your site because even something as simple as doing searches on your own will give you an idea of how high your ranking appears.

20 Best Examples of Readable Typography Blog

Sheila Mahusay — Fri, 21 Dec 2012 03:59:44 +0000

Typography plays an important role in a successful web design. You may have noticed here in WDH that we previously changed the look and feel of our site. Specifically, its typography was improved to make it more readable and easy to skim. We obviously do love clean and readable typography, so today’s collections are 20 Examples of Blog sites that use beautiful typography.

1. Trent Walton

2. Mark Boulton

3. Jason Santa Maria

4. Kyle Meyer

5. Tommi Kaikkonen

6. Jon Tan

7. Elliot Jay Stocks

8. The Great Discontent

9. Simple Bits

10. Frank Chimero

11. Simon Collison

12. Jan Cavan

13. Dodge & Burn

14. Matthew Carleton

15. I Love Typography

16. Andy Taylor

17. Osvaldas

18. Daniel Filler

19. Kerem

20. Simon Foster

You may also want to read the related articles below.

No related posts found

10 Fresh Free Fonts For Your Design

joefrey — Sat, 08 Dec 2012 15:43:38 +0000

As web designers, we always seek fresh free fonts for our designs. And of course, it’s not easy for us to choose the best from thousands of free fonts available on the net. We already published 27 Elegant and Stunning Free Fonts for your Creative Design in our previous post. So, here’s another bunch of fresh and high-quality free fonts that you can use for your design.

1. Barkentina Typeface

2. geogram typeface

3. DHD Cool Skinny

4. Prime free font

5. Flex Display

6. boros rounded

7. Bourbon

8. Grand Hotel

9. Libre Baskerville

10. Sofia Pro Condensed Font

You may also want to read the related articles below.

25 A Must-Use Free Responsive jQuery Image Sliders

joefrey — Thu, 29 Nov 2012 09:04:40 +0000

Responsive design is in demand due to the rise of mobile technologies nowadays. As a web designer we can’t afford to lose one visitor from mobile and tablet devices. Whenever you plan to develop responsive websites which comprise ample photos or images, it’s best to use image gallery/slider for these contents. Integrating these sliders in your site keeps images more manageable and organized. With so many image sliders arising in the web nowadays, it’s not easy to choose the best for your site. Nonetheless, worry no more, here’s a roundup of Responsive Jquery Image Slider/Gallery which you can use for your next fabulous web project.

1. RefineSlide

A 3D transform/CSS transition-enabled jQuery plugin for displaying responsive, image-based content with shiny animations.

2. FlexSlider 2

An awesome, fully responsive jQuery slider toolkit.

3. Animated Responsive Image Grid

A jQuery plugin for creating a responsive image grid that will switch images using different animations and timings. This can work nicely as a background or decorative element of a website since we can randomize the appearance of new images and their transitions.

4. Elastislide Revised

Elastislide, the responsive image carousel, has been updated and improved. It can be used vertically or horizontally and a minimun number of visible images can be specified.

5. ResponsiveSlides

Simple & lightweight responsive slider plugin (in 1kb)

6. Sequence

Sequence is the jQuery slider plugin with infinite style. It provides the complete functionality for a website slider without forcing you to use a set theme. In fact, Sequence has no in-built theme, leaving you complete creative control to build a unique slider using only CSS3 — no jQuery knowledge required!

7. Basic jQuery Slider

Basic jQuery Slider has been developed to be as simple and lightweight as possible. Only the essential functionality has been included combined with clean semantic mark-up.

8. wmuSlider

wmuSlider, a jQuery responsive slider

9. iosSlider

iosSlider is a jQuery plugin which allows you to integrate a customizable, cross-browser content slider into your web presence. Designed for use as a content slider, carousel, scrolling website banner, or image gallery.

10. Blueberry

Blueberry is an experimental opensource jQuery image slider plugin which has been written specifically to work with fluid/responsive web layouts.

11. iView

iView is easy to use jQuery image slider with animated captions, responsive layout and HTML Elements like (Video, iFrame) slider. Easily add unlimited number of slides and captions. Use it as image slider, image gallery, banner rotator, banner ads, or even presentation.

12. Photo Swipe

PhotoSwipe is a FREE HTML/CSS/JavaScript based image gallery specifically targeting mobile devices.

13. bxSlider

Responsive jQuery content slider

14. Swiper

Swiper – is the free and ultra lightweight mobile touch slider with hardware accelerated transitions (where supported) and amazing native behavior. It is intended to use in mobile websites, mobile web apps, and mobile native apps. Designed mostly for iOS, but also works on Android and latest Desktop browsers.

15. liteAccordion v2

Lightweight horizontal accordion plugin for jQuery

16. Bounce Slider

BounceSlider is a tiny jQuery plugin that allows to create simple slideshow using images inside ul. It depends on jQuery and Modernizr to work properly in browsers which don’t support css animation.

17. RTP.Slider

A flexible slider plugin. Fluid, touch-compatible and extendable.

18. Camera Slideshow

A jQuery slideshow with many effects, transitions, easy to customize, using canvas and mobile ready, based on jQuery 1.4+

19. Responsly

Dead simple responsive widgets, written using CSS3 transformations and available as a jQuery Plugin. Currently a sideshow and accordion are available, more to come!

20. Nivo Slider

The world’s most awesome jQuery & WordPress Image Slider

21. Responsive Image Gallery With Thumbnail Carousel

A tutorial on how to create a responsive image gallery with a thumbnail carousel using Elastislide. Inspired by Twitter’s “user gallery” and upon a request to show an integration of Elastislide, we want to implement a responsive gallery that adapts to the view-port width. The gallery will have a view switch that allows to view it with the thumbnail carousel or without. We’ll also add the possibility to navigate with the keyboard.

22. Elastic Image Slideshow With Thumbnail Preview

This slideshow will adjust automatically to its surrounding container and we can navigate through the slides by using the thumbnail previewer or the autoplay slideshow option.

23. Filamentgroup: Responsive Carousel

A jQuery-based script for responsive carousels that work with mouse, touch, and keyboard.

24. jQuery Responsive Thumbnail Gallery Plugin

jQuery Plugin for creating image galleries that scale to fit their container.

25. Fluid CSS3 Slideshow With Parallax Effect

In this tutorial we will create a slideshow with a parallax effect using several CSS3 properties. The idea is to move the background positions of two backgrounds while sliding the container of the slides.

You may also want to read the related articles below.

Best HTML5 Sites of the Week November 26th 2012

Sheila Mahusay — Mon, 26 Nov 2012 04:43:58 +0000

This post is part of our weekly series where we feature best websites using HTML5 markup, Responsive and best design practices from around the net. If you know or have a link of html5 website that you think qualifies our standards then contact us, for it to be included in our weekly series. Don’t hesitate to leave a comment below and Let us know what you think.

If you want more inspiration about html5 websites then try our HTML5Awesome site, it is a showcase gallery of awesome and innovative HTML5 websites from all over the world.

1. Grand (Responsive)

2. TweetBest

3. Manoscrafted (Responsive)

4. Adhara NY (Responsive)

5. Jan Cavan (Responsive)

6. HeathLife (Responsive)

7. Eighty3creative

You may also want to read the related articles below.

160+ Outstanding Free Blurred Backgrounds For Web Design

Sheila Mahusay — Fri, 23 Nov 2012 02:11:25 +0000

Blurred background images have become a popular trend in web design currently. Making use of these blurred images as background gives the main content more emphasis and a distinctive look. Perhaps that’s one reason why these are without a doubt trending in web design lately. In this post, we showcase 160+ outstanding blurred backgrounds that will make your design more alluring. Enjoy!

You may also want to read the related articles below.

1. Dribbble Backgrounds

2. 10 Free Blurred Backgrounds

3. Free Blurred Backgrounds

4. Freebie – blurred backgrounds

5. 10 Backgrounds

6. Free Ultimate Blurred Background Pack

7. 12 Blurred Backgrounds

8. 23 free blurred backgrounds

9. 25 Free High Resolution Blurred Backgrounds

10. Blurrry – Free 20 Blurred Backgrounds

11. Dribbble Background By Badhon Ebrahi

12. 8 Blurred Landscape Images

13. Candy Blur Abstract HD

14. Soporific

15. Rainbow wallpaper

You may also want to read the related articles below.

25 Best Photoshop Tutorials of Summer 2012

Adrian — Thu, 22 Nov 2012 00:57:04 +0000

The best method of sharpening your web design skills is, without any doubt, the daily practice. The theoretical aspect can’t be ever neglected but definitely, only with theory, it is impossible to build a working website. Fortunately, the web design blogs offer very good tutorials and anyone may practice and evaluate his/her progress. Following a tutorial is one of the best methods of learning how to realize a specific project and any designer must have some sources to check in order to find the latest tutorials. It means time and not quite always, you will find what is really the best.

But don’t worry, now you shouldn’t waste your time…here is a collection of the best tutorials published in this summer. These are fresh, well-written and amply explained and it’s highly recommended at least to see what they are about. I think that if you will follow all of them, you will learn many new best practices and your design skills will be significantly improved. It’s possible, by mistake, to miss a very good tutorial from this list, therefore please let me know your opinion. And don’t forget, please share this post to be used by many other designers.

You may also want to read the related articles below.

1. Create a Diablo III Inspired Text Effect in Photoshop

2. Photo Manipulate an Abstract Miniature City Wildlife Scene

3. Create A Post Apocalyptic Scene In Photoshop

4. Perfect Gold Text Effect in Photoshop

5. How to create Colorful Abstract Fantasy Background in Photoshop CS5

6. Create a Horror Movie-Themed Photo Composition in Photoshop

7. How to Design a Sleek Google Plus Button

8. Realistic Makeup Application in Photoshop

9. Members Area Tutorial: Create A Fantasy Mushroom House Photo Manipulation

10. How to Create a Stunning Winter Princess Artwork in Photoshop

11. Create a 3D Soda Can Using Actions

12. Create an Advanced Reflective Clear Layer Style in Photoshop

13. How to Draw a Portrait in Photoshop

14. Learn How To Create Something Like This in Only 72 Easy Photoshop Steps

15. Create a Burst in the Nebula Effect in Photoshop

16. How to recreate studio lighting effects in Photoshop

17. Photo Manipulate a Complex Surrogate Scene

18. Turn a Regular Headshot Into a Cold Winter Portrait

19. Create a Photo Manipulation of an Angel Holding a Torch

20. How to create an awesome Tron inspired app icon

21. Applying a Grunge Shattered Glass Effect to Your Design using Photoshop

22. Create an Abstract Floating Break-Apart Rock Circle in Photoshop

23. Create an Easy Stitched Fabric Type Style in Photoshop

24. How to Create an Underwater Abstract Art in Photoshop

25. Amazingly Realistic Transparent Alien Egg

You may also want to read the related articles below.

Freebies: Rounded Minimal PSD Template

joefrey — Tue, 20 Nov 2012 14:26:53 +0000

Hello WDH loyal readers! Good News! Here comes a quality freebie I personally designed for you. A clean and minimal PSD file which you can use for your professional web design project. The great thing is that, I will soon convert this into a responsive html5 template. So keep coming back for much more useful freebies! Enjoy!

You may also want to read the related articles below.

Rounded Screenshot

Pay With a Tweet to Download the ZIP File

You may also want to read the related articles below.

Best HTML5 Sites of the Week November 18th 2012

Sheila Mahusay — Sun, 18 Nov 2012 00:53:23 +0000

If you want more inspiration about html5 websites then try our HTML5Awesome site, it is a showcase gallery of awesome and innovative HTML5 websites from all over the world.

1. Instagrille

2. Hipstamatic (Responsive)

3. Yield Design (Responsive)

4. United Tailors (Responsive)

5. Blast Processor (Responsive)

6. Calm Digital (Responsive)

7. We Are Anonymous (Responsive)

You may also want to read the related articles below.

How to “Design” the Content of Your Website

Daniel Pintilie — Fri, 16 Nov 2012 01:49:52 +0000

Every web designer should pay attention at the appearance of the texts that he or she posts, because the content is one of the things that the readers interact with the most. It is no secret that your job is to make life easier to your audience and therefore every aspect of your website must be carefully designed. In case you wanted to learn more about this topic, the following lines will guide you into conceiving a marvelous appearance for the texts of your website.

First of all let’s talk a little bit about the content of your texts and articles. Wilkie Collins said about the nineteenth-century fiction writing that it should: “Make’em laugh, make’em cry, make’em wait!” Well, this is what your content should be like in order to be successful and to attract numerous readers.

They should create laughter, in the sense that your text should combine in a magnificent manner the seriousness of the topic, with the comical effect. Insert a joke here and there and help your readers loosen up, because they want to relax when they are sitting in front of the computer.

Okay, your visitors should not cry when they are reading your texts, but they should be able to feel touched and impressed, if the content presents a humanitarian case or a touching story. However, you shouldn’t be too sentimental, or your readers will loose their interest.

And as far as the “make them wait” aspect is concerned you should write your content in a manner that will make your readers become anxious about your future posts. Try to make them “vicious” about your novelties and you will manage to have a successful website.

However, apart from the content of your articles, you should make sure that the texts are easy to read. Nothing annoys more a person than the inability to read something that they need or are interested in. In this respect, there are various techniques you could use, just to make sure that your readers feel comfortable every time they access your website:

1. Choose a nice typeface.

There are many fonts that simply irritate people just because the letters are too tangled and they make it impossible to read the information. I know that you want to impress everybody and that you desire the design of your website to be extremely special, but sometimes it is best to keep it simple, in order to make your readers stay. But, if you are keen on becoming famous for trying bold features, you should use them on something else other than your text.

2. Pick the right colors.

You want your website to transmit certain feelings to your readers and as a result you choose various colors that will make them feel happy, relaxed or serious. It’s a good thing to play with colors, but you will have to remember that if you won’t make the right decision as far as your texts are concerned your readers won’t be happy, since their eyes will start to feel exhausted and fatigued. Go for colors that will make the information pop, because this is what interests people.

3. Increase the font size.

Show to your visitors that you respect them by increasing the size of the font. This gesture of yours will make their eyes feel “happy”, since they won’t have to force themselves to read certain passages. Anyway, do not exaggerate as far as this issue goes, or you will end up with a totally unattractive web design. Try various sizes and ask other opinions, in order to make sure that you are doing a nice job.

4. Organize your paragraphs.

My advice for you would be to pay attention at the appearance of the text sections as well. Do not go for extremely long units, or your readers will become bored. Try to create symmetry, as far as this matter goes and your texts will become a lot easier to read.

5. Headings.

This has a lot to do with organization. The headings are important if you want your readers to get a glimpse of the issue that certain paragraphs deal with. Thus, the headings will make it easier for your readers to get the info and to use your website. As a result, every web designer should remember to insert and to use something like this, because it is mandatory for a better utility of the website.

Besides having an interesting content and being easy to read, your texts must follow the design you have picked for your website. Thus, it should match the other features your website contains, because it is important to create harmony and balance. You want everybody that accesses your website to feel as if they have landed in a safe and full of advantages place. So, let’s say that you have decided to go for a romantic design; well your font could follow this theme, as long as it doesn’t bother the eye. The same goes for the colors as well, they must match the web design you have decided to create, but at the same time they shouldn’t become a burden for your readers’ eyes.

So, as you can see the main idea is that the design of your texts should be friendly to your visitors’ eyes. And it is understandable why. If your visitors must read a lot, they desire to do it comfortably and in a manner that won’t affect their sight. Once you have acknowledged this, your website will become a hit, since your audience will feel that you care for them. Therefore, this design is not only about technical things, but also about respect that you must show to the people that visits your website.

Conclusion

In conclusion, when you will think about the design of your text you should take into consideration the other design features you have used so far, the quality of the content and the readability. Make sure that your texts look neat, organized and appealing and you will have visitors galore.

You may also want to read the related articles below.