Well at long last, here it is…a free Wordpress template which I titled “OceanicFlight”, because I’m a big Lost fan!

Do what you want with it, it’s all yours free of charge. I do have a link at the footer of the template, I ask that you do not remove it, but if you really must remove it, then at least add my site to your blog roll.

This theme is widget ready, has 2 sidebars and it is easily customizable.

[ Download ]

I’ve used many different types of tooltips in the past and they all shared the same problem, they do not work with Internet Explorer 6. After many trial and error, I finally have a pure CSS tooltip that works in IE6.

HTML Code:

<a href="#" class="tooltip">Your Link Here
<span> Tooltip message you want to appear. </span></a>

Here’s the CSS code:

a.tooltip {
	color: #7C98AE;
	text-decoration: none
	}
 
a.tooltip:hover {
	position: relative;
	text-decoration: none
	}
 
a.tooltip span {
	display: none
	}
 
a.tooltip:hover span {
	display: block;
   	position: absolute; 
	top: 0px; left: 40px;
	width: 200px;
        padding: 5px; 
	margin: 10px; 
	z-index: 100;
        background: #f0f2f6; 
	border: 1px solid #955F1F;
	opacity: 0.9;
	text-align: center
	}

This CSS tooltip works with IE6, IE7, IE8, Firefox, Chrome, Flock and Opera. If you have your own CSS tooltip solution please share them here.

• Width and height of design screen (What resolution to design?)
• Height of header and footer content
• Where to place the content so it can be useful or readable
• Keep white spaces (gaps) within your text content and images
• Keep it simple and clean, don’t make too much information stuck on just one page
• You can also draw the layout on simple paper by your hand

2. Color Scheme
Second step in web design is to choose the right color scheme. Your color scheme may be comprised of two or three colors. But don’t use more than 3 colors, it will be difficult to control more than 3 colors. There are some websites where you can pick up the color schemes like kuler.com or you can find amazing color schemes at www.colorlovers.com.

Tips on color choices:

• Choose at least 2 colors or 3 colors, like black, dark brown and dull green.
• Keep your text in a readable color like white text on dark brown background.
• Keep your links a little bit more sharp in colors than your text
• Keep the balance in colors like light colors on dark backgrounds
• Don’t make a fruity effect by using too many colors in one place
• Try to use Web 2.0 sleek and clean color schemes

3. Content Positioning (Balancing)

Third step is to position and maintain your contents so that the user feels like all the pages of the site are in balance. It is a very crucial step in web design. You also have to keep in mind to view your web pages in multiple major browsers.

4. Optimization

First three steps were purely design based; now when you have built your page a bit, you must not overlook the page size and how it is going to load in the browser. Web page optimization means a very broad term. It may also include Search engine friendly coding.

• Keep the usage of images at minimum, loading time will suffer due to heavy images
• Minimize the usage of too many scripts and Flash content
• Use CSS and div based layout and eliminate any unnecessary CSS and HTML codes
• Words in the title of page and headings and your meta tags all count towards Search Engine optimization
• Check your web page in different browsers, cross browser compatibility is a must

5. Design Exposure

Your exposure to new and latest technologies, design patterns and layouts will also improve your web design overall sense.

• Search for latest trends in web design and latest web design techniques
• View portfolio websites of other great designers
• View art related websites like Deviantart.com to get some good exposure
• Try learning new tutorials on Photoshop, CSS, HTML

Article By: Ahsan Idrisi

To configure your settings, go to: Settings – General – Network – Cellular Data Network. Please note that I’m using an iPhone 3Gs on firmware 3.1.2.

Under the MMS settings use the following values:

APN: wap.voicestream.com
Username:
Password:
MMSC: http://mms.msg.eng.t-mobile.com/mms/wapenc
MMS Proxy: 216.155.165.050
MMS Max Message Size: 1048576 <--optional

If you’re still having problems receiving MMS after completing the steps above, try this video tutorial:

I decided I’m going to send out invites to 3 of my blog readers, all you need to do is drop a comment, post a blog about this post, or link back to my blog. Be very creative about it. I’ll pick the winners this weekend and I’ll email you personally to let you know I chose you.

I haven’t had time to fully dig into Wave but this looks like it will forever change the way we exchange emails.

Tip 1
Clear out the default padding and margin settings before you start working.
Different browsers have different default margin and padding sizes so you want to start with a clean slate, so to speak. Use this command:

1
2
3
4
5

* {
margin: 0; 
padding: 0;
border: 0
}

to clear all default margin and padding settings. Also note the border, which is set to 0. Please note that if you do this, you will also get rid of the pesky purple border round click-able images, although some people argue that the purple border is necessary for accessibility and usability. But lots of people do not like the purple border round images, and this is one way that you can get rid of it in one fell swoop without having to set img border=0 for each image (which is against the strict markup rules in any case).

Tip 2
To center your layout, use a container div to contain all your content
Declare it as follows:

1
2
3
4

#container{
margin: 0 auto;
width: xxxpx
}

There are a couple of points here to take note of. DO NOT declare the width to be 100%. This defeats the whole object since you will just have to declare the sub elements within the container and then center THEM using margin : 0 auto. This is VERY BAD since it means that instead of declaring the central layout once, you will have to declare it in multiple places for each element within your container.

Tip 3
Work from the top down
Literally start working on your CSS layout starting from the top most elements in your design, as well as the ‘top’ elements in your HTML, such as the body, as well as your main containers.

Declare your CSS commands on the highest level possible and try and declare something once only and let it cascade throughout. Only override the commands at a lower level when strictly necessary. This prevents a verbose CSS file that is difficult to maintain and understand. For example, if you have { margin : 0 auto} settings on each and every sub div within your container – you are in trouble.

Tip 4
Document what you are doing and use Firebug and the Firefox browser to debug
You are not writing your CSS code just for yourself, some day some poor sod will have to debug it. Make numerous comments inside your CSS file to explain why you are doing things in a specific way.

Fitting in with this, you might find yourself having to fix someone else’s CSS more often than you think (or even your own, for that matter). Use the Firebug add-on for Firefox to debug your CSS. This is a life-saver with regards to giving you an insight into exactly where your design might be broken and why.

The only problem with this is that your design might work perfectly in Firefox, but not in IE5, IE6 or IE7. This brings us to the next tip.

Tip 5
Decide which browsers you are going to build your CSS for and test from the start
Some purists insist on making sure that your website work for all possible browsers, others only make it work for the ‘major’ browsers. How do you know exactly which browsers are used the most? Once again W3 Schools come to the rescue.

On the following page, you can see which browsers are the most popular: http://www.w3schools.com/browsers/browsers_stats.asp. From this page you can see that something like IE5 is only used by about 1.1% of browsers. It is up to you whether you consider it worthwhile to build your CSS to be compatible with this browser, or whether you are just going to test your compatibility with IE6, IE7 and Firefox, for example. Whatever you do, when you start building your CSS, start from the top, and test each and every setting in each of the browsers as you go along. There is nothing worse than building a perfect website in Firefox, then finding out right after you have coded a 1000 line css file that it is broken in IE6. To then debug and fix your code after the fact is a nightmare.

Tip 6
Here is an embarrassing little tip for fixing your CSS in IE6 or IE7
Let’s say your design works perfectly in Firefox, but is broken in IE6. You cannot use Firebug to determine where the problem might be since it WORKS in Firefox. You do not have the luxury of using Firebug in IE6, so how do you debug an IE6 or IE7 stylesheet? I often found that it helps to add {border : 1 px solid red} or {border : 1 px solid purple} to the problematic elements. This way you can often see why certain elements do not fit into the space available. It is an embarrassing little tip since it is so primitive and simple, but it works!

Tip 7
Understand floats
Floating of elements is essential to understand, especially in the context of getting your floated elements to work in the different browsers!

Basically elements such as divs are floated to the left or the right (never to the top or the bottom, only sideways). Here are a couple of things to take into consideration with floated elements. Each floated element must have an explicit width specified. If you are making use of floated divs to create a 3 column or a 2 column layout, rather specify the widths in terms of percentages rather than fixed widths, and if you do use percentages, make sure that the percentages do not add up to 100%, this will often cause the right most column to drop below the rest, clearly indicating that you are trying to fit something into the available space that is too wide for it. Rather use percentages that add up to slightly below 100%, such as 25%, 49%, 24% for a left column, middle column and right column.

Floating elements can be extremely complex to understand and it is worth while to spend some time on good sites that provide specific guidelines and tips, such as the Position Is Everything website.

Conclusion
These CSS tips for layout should hopefully save you some time and effort when you next have to panel-beat a table-less design into submission!

Article By: Christine Anderssen
Christine Anderssen is the owner of Tailormade4you, a web design and hosting company in South Africa, catering for small business website owners. Visit our site on www.tm4y.co.za/10-strategies.html to download your free guide on how to make your website really work for you and bring in more customers to your business.

Who is it for?

KPMRS is a perfect SEO tool developed by SEO professionals for fellow SEO professionals, search engine marketers and website owners. We understand how important it is to know where your website ranks in various search engines. We felt the need, we provided the solution!

Features

Get Email Alerts
Receive email notifications whenever your website rankings change. See a sample here.

Identify Social Popularity
Find out how popular is your site on social media websites like twitter, delecious, technorati, stumbleupon, yahoo etc . See a sample here.

Share On Facebook
Share your rankings with your friends and groups on Facebook. See how it will look here.

Get Weekly Report
Receive detailed reports of how your rankings have changed in the last week. See a sample here.

Check Back Links
Know the number of websites linking back to your website. See a sample here.

View Graphical Charts
Trendy Flash Charts to show your search engine rankings between any two dates. See a demo.

Export & Print Rankings
Export & Print your reports in excel or csv formats. See a Sample.

[ Visit the KPMRS blog » ]

While this is a great way to promote your blog posts, the buttons do not serve a purpose if you simply have an announcement to make on a post.

It would be great if we can turn the option on and off as needed, right?. Well by using WordPress’ custom fields and a little bit of PHP coding, we can display or not display these social media icons.

Let’s get to it

Step 1 – Download the SexyBookmarks plugin, upload it into your plugins folder and activate it.

Step 2 – Go into the plugin settings and modify the settings. You can reorder the icons by clicking and dragging. Check mark the ones you want to display.

In the Placement option, select Manually Insert.

Step 3 – Go into your Themes folder and find single.php. Open the file and locate The following code:

1

<?php the_title(); ?>

The above code displays the title of your blog post. If you want the social media icons to appear right above title, then copy the code below and place it before the title.

1
2
3

<?php if(get_post_meta($post->ID, "socialmedia", true)){ 
     if(function_exists('selfserv_sexy')) { selfserv_sexy(); }
} ?>

If you want the plugin to display at the bottom of your post, then paste the above code right after:

1

<?php the_content(); ?>

Step 4 – In the Admin panel, open up one of your posts or create a new one. Scroll down to the Custom Fields section, click Enter New, name it socialmedia and give it a value of 1 or yes or whatever value you prefer, it really doesn’t matter as long as you input a value in there. Click the Add Custom field button to save it. You should now see a custom field called social media with a value of 1 or whatever value you chose.

From now on whenever you want to display your social media icons, simply scroll down to the Custom Fields section, click on the name drop-down, select socialmedia and give it any value.

Benefits of Reseller Hosting – Another Middleman?

Yes, a reseller is essentially another middleman, and typically there are more fees when a middleman is involved. Depending on who you ask, you will have varying opinions about the benefits of a reseller. If you are looking to save money, then a reseller would not be in your best interest. If you want to put less effort and just get your site up and running then a reseller would be better. It is fairly easy to go to a hosting company yourself. Today hosting companies make it quite simple to set things up. You can usually select a hosting option when you purchase your domain name. It is also possible that the folks you are getting your hosting from are themselves resellers and you just don’t know it. Many upstart hosting companies are resellers, as it is a common way to break into the business. A reseller is just taking an allotted amount of drive space and bandwidth and redistributing it. It is possible for them to redistribute a smaller portion to individuals or companies that do not need that much space and bandwidth.

Benefits Of Reseller Hosting – Are You Already Working With a Reseller?

If you suspect your current hosting service is a reseller just ask them. It’s possible they are just working on behalf of a web hosting company as well and just getting a cut of whatever business they bring to the hosting company. In any case, you may want to identify which hosting company the reseller works for and find out where the bandwidth is really coming from. You may want to consider approaching the original hosting company to see if there are lower prices available. Also, consider where you will go if there is a problem. Will need to contact the reseller or the web hosting company itself? Does the reseller provide the same support and remedies in the event something goes wrong? Maybe they can provide more support if they are not some large company where you call for support and are on hold for days on end. For those getting into the online business it is certainly worth investigating and keeping in mind when seeking hosting services.

This instruction applies to iPhone firmware 3.0 only:

Step 1 – Go to Settings

Step 2 – Tap Mail, Contacts, Calendars

Step 3 – Tap Add Account

Step 4 – Select Microsoft Exchange

Step 5 – In the Email field, enter your full GMail address (name@gmail.com)

Step 6 – Leave the Domain field blank

Step 7 – Username is your full GMail account

Step 8 – Password is your GMail password….duhhh!

Step 9 – Tap Next at the very top (choose Accept if the Unable to Verify Certificate dialog appears)

Step 10 -  You will see a field called Server, enter m.google.com

Step 11 – Tap Next at the very top

Step 12 – Select the Google services you want to sync. Currently only Contacts and Calendar are supported

Step 13 – Unless you want to delete all the existing Contacts and Calendars on your phone, select the Keep on my iPhone option when prompted. This will also allow you to keep syncing with your computer via iTunes.

Step 14 – REJOICE!!!

Google Sync is now set for your iPhone. Synchronization will begin automatically if you have Push enabled on your phone. You can also open the Calendar or Contacts app and wait a few seconds to start a sync.