Posts Tagged as tutorial

Simulate Realism with CSS3

February 16th, 2010 35 Comments

CSS3 is here to make our lives easier as web designers and developers. While it’s not something we can always rely on heavily for layout purposes just yet, we can use it to enhance certain aspects of our designs by spending a considerably less amount of time doing so.

However, CSS3 has not been created for the sole purpose of making it easier and quicker to create a website but also so we can create much better sites than we ever could with CSS before. Here are a few examples of how CSS3 can improve the web.

Read more...

Code a Backwards Compatible, One Page Portfolio with HTML5 and CSS3

January 25th, 2010 51 Comments

HTML5 is the future of web development but believe it or not you can start using it today. HTML5 is much more considerate to semantics and accessibility as we don’t have to throw meaningless div’s everywhere. It introduces meaningful tags for common elements such as navigations and footers which makes much more sense and are more natural.

This is a run through of the basics of HTML5 and CSS3 while still paying attention to older browsers. Before we start, make note of the answer to this question. Do websites need to look exactly the same in every browser?

View Demo | Download Files (.zip)

Read more...

How to Create a Theme Development Environment for a Live WordPress Site

January 11th, 2010 47 Comments

Any good website owner knows that they need to be constantly looking at ways to improve their site even through small little tweaks. If you’re using WordPress you’ll notice that it isn’t easy to create a development version without creating a separate installation. Of course, you can make changes directly on a live WordPress site but that isn’t recommended for anything other than minor tweaks.

With the help of an excellent plugin for WordPress called Theme switch and preview, this tutorial will allow you to easily switch between the live site and development versions using two different themes on the same installation of WordPress. We’ll do this by creating a bar at the top of the page which will clearly show you if you’re viewing the live theme (what everyone else sees) or the development theme with a link to switch between the two.

While there may well be a Worpdress plugin that does everything below, it’s much more rewarding and satisfying to create your own solution.

Read more...

A Look at Some of the New Selectors Introduced in CSS3

July 27th, 2009 39 Comments

Everyone who has been using CSS is immediately familiar with selectors as they are what is used to target elements on a page and style them. CSS3 brings even more options as far as selecting elements goes. It will allow designers and developers to implement designs much easier and quicker than before.

css3-selectors

Here is a run-down of just some of the things that is possible with CSS3 selectors. Of course CSS3 isn’t supported at all by any IE browsers including IE8 but all latest versions of Safari, Firefox and Opera support most, if not all of them.

Read more...
Page: 1