Help! My Sidebar is Displayed Below My Content!

CSS

Since I have been designing my own Wordpress themes, I have learned a lot of create CSS-designed themes and how the various elements on a page interact with other elements. It has been frustrating at times to position elements in the correct locations, but it is because of this frustration that I have managed to learn how to create my themes.

5 Dreadful Mistakes that Must be Avoided by a Web Design Company and a Website Designer

HTML Code

If you are a website designer you might be planning to make another grand website that you fancy will captivate a great mass of visitor’s attention. Indeed it will, depending upon the efforts you put into your work. You will be having in mind great design ideas that constantly tempt you to put your imagination into creation, an entity that is visible, admirable and tangible. But don’t be over anxious, it’s good to be enthusiastic but it may happen that some of your design ideas turn into dreadful mistakes that you repent over after creation. It’s not just the website designers who can make such mistakes; a web design company can also be prone to such mistakes. So what are these dreadful mistakes which must be avoided especially if you are planning to represent your business online? So here are we going to discuss them.

Read more

How to Test Your Web Site on a Smaller Browser Window

Monitor

Many new computers and laptops sold today include a widescreen monitor with a nice high resolution. For many applications, such as games and movies, having a large widescreen monitor makes the experience much better. Movies were meant for widescreen, and games, well they always look better in a higher resolution.

The one aspect where the widescreen monitors may be more of a pain is in web development. The reason is simple: creating a web site that displays great on many monitor resolutions is not easy. The web site can look good at one resolution and monitor size, but not on another. If you do have a widescreen monitor you can easily test your site with various resolutions with a free application.

Read more

Create an Attractive Web 2.0 Design Website

Web - HTTP

The purpose of Web 2.0 design is to focus on the user, and to step up the level of interactivity. Instead of limiting the user to simply viewing the content you have put on your page, a Web 2.0 design will facilitate dialog & user created content. Some examples of Web 2.0 are blogs, mashups, social networking sites and video sharing sites. In this article we will discuss the different characteristics of a Web 2.0 design.

The first thing to keep in mind when designing, is less is more. Removing unnecessary components will not only make your website load faster, it will direct your users attention to the important parts. It is said that you only have 3.5 seconds to capture and retain the viewers attention, and with Web 2.0, it won’t be hard to do.

Read more

Make Your Site Load Photos as Fast as it Should

Speed

Many people that have taken on the task of putting up a website do not realize that visitors are not always very patient, especially when it comes to page loading. If the site is running slowly, people who come across it are likely to become frustrated and leave, with rare revisits in the future. If you want your photography to be exposed to as many individuals as possible, it is important to put in the work to make sure everything loads as fast as you can manage. But how can this be achieved? What does a designer need to do have a fast loading photography website? The below tips should be consulted.

Read more

Increase Your Web Site Performance with CloudFlare

CloudFlare Logo

I recently experienced some performance issues on this blog and changed the template to more of a basic look and feel. By doing so I reduced the number of requests for all the pages on my blog, as well as the number of bytes that was transferred. In an effort to increase the performance even further, I signed up with an online free service.

While I was on Twitter several months ago I noticed a tweet from Michael Aulia from Craving Tech regarding a service he just started using called CloudFlare. This site talks about increasing a web site’s performance while also making the site safer. I have been using their service over the past few months, and so far I have been impressed.

Read more

How to Properly Resize a CSS Sprite Image in GIMP

CSS

GIMP is a popular image editor, but to require some knowledge if you want to properly resize a CSS sprite image in GIMP. In my previous post I provided instructions on resizing a CSS sprite in Photoshop, but I realize that Photoshop is expensive to buy, and many people may not be using that photo editor. For those that are looking for a free alternative to Photoshop, I suggest you download GIMP which is also powerful photo editor. For more information about GIMP, you can read this GIMP review.

If you are used to Photoshop, GIMP can take some getting used to, but once you understand the basics, it is easy to use. In this tutorial I will show you how you can easily resize a CSS sprite in GIMP much like I did in Photoshop.

Read more

How to Properly Resize a CSS Sprite Image in Photoshop

CSS

Once you have created a CSS sprite image for your website, it is important to learn how to properly resize a CSS sprite image in Photoshop if you wish to add additional images. The reason for this is that when you resize the canvas of an image in Photoshop, the additional pixels added to the image will be applied to all sides of the image equally. This will have the undesired effect of centering the previous image in the current image, and throwing off your CSS sprite positioning.

To avoid such an issue, it is important to ensure that you only resize either the bottom or the left side of the CSS sprite image. In this post I’ll show you how to properly resize a CSS sprite image in Photoshop.

Read more