Friday, January 23, 2009

Contracting and Optimizing your Time Part 2

Hi All, 

This is a continuation of my blog on working as a contractor and making sure you do it correctly. Procrastination, Laziness and Distractions are all huge problems that most people take out at work right now. However if you are working for yourself...time is money, and you have to ask yourself questions like :

 - I could have made $30 in this hour that I was sending people messages on Facebook?
 - I just spent $60 (2 hours) doing the shopping, would it have been better to just order things online?

Which brings me to Step 2.

Step 2 : To-Do-Lists

Let's face it, we have all done a couple of To-Do-Lists in our lifetime. Whether it was the shopping list, a christmas present list or a project list, lists are a great way of organising what you need to achieve. I personally use a new product called "Remember The Milk" which I had a link to in Part 1 of this post. The free version of "RTM" allows you to add tasks with due dates, and also categorise them into Work, Personal, Study etc. Here are some important tips for creating a To-Do-List :

 - Don't make this list too large as it will become overwhelming and prioritising tasks will become a nightmare.
 - Priorite tasks by importance and due date.
- If you feel that your list is getting to big, take a task off the list (don't actually delete it, but hide it). It is better that you remove a task than just postpone it.
 - Make detailed lists, don't skimp on detail. One of the vital parts of making a list is the fact that you want to remember exactly why and how you were going to do the task. Add attachments, add reminders, add side notes, anything that will enable you to look at the list and know exactly what you were talking about when you entered the task in the first place.
- Have milestones. What good is doing things without having some light at the end of the tunnel? Add tasks to your list that simply entail "Shout yourself to the coast for finishing project A".
- Centralise your list. Like mentioned before....don't use Notepad, Paper, Remember The Milk and Word. Use one product and stick to it. Sure it might not be the best for Calendars...or Storing Pictures but make sure you pick ONE and only ONE and stick to it.
- Don't bite off more than you can chew. Take tasks slowly and do them right. Only tick them off once they are 110% complete. Having a task e.g "Build Website for Brother" and releasing it, knowing that you will have to revisit it in 2 weeks is not a complete task.

Hope this helps, 

 - Tim

Contracting and Optimizing your Time

Hi All, 

I have recently been working on some projects in my spare time. Some are for work, some are from learning and some are presonal websites. For the websites that I am being paid for I am getting paid at an hourly rate. Let's call this hourly rate $30 (it isn't, but I need a number to put everything into perspective).

This got me thinking. What am I doing in the day apart from work that I would pay $30 an hour for? Yes...I know everyone needs a break now and then but it was very interesting to ask myself questions such as :

1 : Would I pay $30 to watch an episode of "Deal or No Deal" for an hour...No
2 : The time it takes me to put on a wash, put it in the dryer and clean up, would that be worth it? Maybe
3: Would 4 hours of cleaning my place be justified? No, simply get a cleaner (and might I say they would do a much better job) to come and clean my place for me? Yes

Therefor this next set of steps is an insight into managing your time and progress while working as a contractor.

Step 1 : Wasting Time
How many times during the day would you say you look at silly emails, facebook, news or sports results? I think most people would say too much. Facebook alone cost the Australian workplace $5 Billion dollars in lost work last year alone. I don't think your boss would be to happy about that! But that is your Boss, it isn't you, so in essence, it isn't bad for you...it is just bad for your boss (WRONG!).

Once you become a contractor, the hours you work, you get paid for! That is the bottom line. So to think that taking your "lunch time" to go look at some silly pictures etc could probably cost you $60 doesn't add up does it?

The number one rule for optimising your time, is to stop wasting it. 

However I don't want to be a party pooper. Let's face it, it is healthy to want to know what is going on in the world. It is healthy to know what your friends are doing and it is healthy to want to look up houses that you want to buy....after all the more you look, the more chance of getting that perfect home!

Solution : 
The solution to this problem is not to stop looking at the things  you want on the internet. It is managing your time so that you put it into perspective with the need and the money that is wasted on you fullfilling this need. To help with this here are some tips :

 - Get an RSS Reader embedded into you mail, desktop etc. Spend some time getting all your favourite websites and subscribe to their RSS Feed. In this way, you have one central place that you can access your entertainment, once place to store it so you can come back to it when you want, and there is no need to keep revisiting these sites to see if a story has been updated etc. (After all one of the biggest problems is getting back into the work after you have decided to "Slack Off".
 - Write down notes. Use sites like RememberTheMilk or or Google Calendar to remind yourself of things that need to be done. This way, you have it in writting and you can then clear that thought out of your head.
- Productivity Tracker. Use a tool like this http://www.fruitfultime.com/products/productivitymeter/personal/fruitfultime-productivitymeter-personal-edition.php that allows you to see how much time you are really wasting. Set alerts to tell you when you are going overboard on "Surfing the net".
 - Checking Emails. This can work multiple ways, but basically I have found that designating 15 minutes every 2 hours to read and respond to emails gives a great ballance of a "break" and staying focused.

Watch out for Step 2 tomorrow.

Hope this helps, 

 - Tim

Tuesday, January 20, 2009

Custom Fonts in Silverlight

Hi All, 

By default, silverlight only supports some fonts. The fonts it supports are just the basic ones e.g. Arial, Times New Roman etc. Want to have a custom font in Silverlight? Easy....

After you have Installed your Font in Windows (right click on download TTF file and click Install), simple select the font from the properties menu in the TextBlock control in Expression Blend.

The trick is, that you have to check the "Embed" checkbox for the custom font to show up correctly.

Hope this helps, 

 - Tim

Search Engine Optimisation Tip 1

Hey All, 

This is the 1st tip for optimising your sites ability to be picked up by a search engine. This tip entails using the correct Meta and Title tags within your HTML. The following is an example of the Meta and Title tags that produce great SEO :

<meta http-equiv="Content-type" content="text/html; charset=UTF-8" /> <meta http-equiv="Expires" content="+10000" /> <title>Custom Web Design Solutions by Web Site Managerz</title> <link rev="made" href="mailto:jerrong@gmail.com" /> <meta name="keywords" content="Web Design, Project Team, Web Portal, Silverlight, ASP.net, PHP" /> <meta name="description" content="Choose your own project team from a list of Web Site Masterz employees and build your own product. Be your own manager and utilise our expertise to build enterprise or simple level portals, websites and mobile sites. We also do custom projects as well." /> <meta name="author" content="Timothy Ward" /> <meta name="ROBOTS" content="ALL" />

Hope this Helps,

- Tim

Monday, January 19, 2009

Many to Many with LINQ

Hey All, 

The LINQ to SQL/Entity Models released with the SP1 of Visual Studios does not innately support Many-To-Many DB realtions. This can be shown when working with the Designer, and trying to draw a new association between to table and selecting the relationship type. Notice it only has one-to-one and one-to-many?

However, you can still simulate it with the following LINQ statements : 

WebSiteMasterzDataContext webDb = new WebSiteMasterzDataContext();
            var query = from s in webDb.Staffs
                        join pro in webDb.Staff_Projects on s.StaffId equals pro.StaffId
                        where pro.ProjectId == ProjectId
                        select s;

            return query;

The code above effectively does a join between the Staff and Project table through the many-to-many table Staff_Projects.

Hope this helps, 

 - Tim

Online Conversion Tool

Hey All, 

I found a really great online converting tool that works a treat and does most formats seemlessly!


Hope this helps, 

 - Tim

Wednesday, January 14, 2009

JQuery 1.3 Release Today!

Hi All, 


"First, we have an excellent new release of jQuery ready for you to enjoy. The big features of this release are:

  • Sizzle: A sizzlin’ hot CSS selector engine.
  • Live Events: Event delegation with a jQuery twist.
  • jQuery Event Overhaul: Completely rewired to simplify event handling.
  • HTML Injection Rewrite: Lightning-fast HTML appending.
  • Offset Rewrite: Super-quick position calculation.
  • No More Browser Sniffing: Using feature detection to help jQuery last for many more years to come. "

http://blog.jquery.com/2009/01/14/jquery-13-and-the-jquery-foundation/

Hope this helps, 

 - Tim

Tuesday, January 13, 2009

Checking for Dead Links in your WebSite

Hi All, 

I found a quick fire way to check that all the links in your HTML/XHTML etc are actually going somewhere. It is a great little tool by the name of DeadLinks (go figure) and is available here :


It is actually instesting to see that some big sites don't pass the test, like :

www.ebay.com.au (however when clicking on the links ebay manages to correct them)
www.news.com.au  - sorry guys...you had heaps :( 

Over the next few days I will try develop a bit of code that can run as a service on my server and automatically modify dead links to be either removed or at least make sure they redirect to the home page, so come back.

Hope this helps....it obviously hasn't helped the sites above :)

 - Tim

Monday, January 12, 2009

Checking your Website in all browsers

Hi All, 

I stumbled across a cool site today that lets you test what your site looks like in every browser imaginable. Yes, apparently if your page validates against W3C standards then it should work in every browser right? Well, that is what I thought...and it is wrong. Bare in mind that a lot of these browsers are either not in use anymore or represent well below 1% of all browsers.


It can take some time to do the analysis, but the pay offs will save you install every browser known to man/woman :)

Hope this helps, 

 - Tim

I want to use MooTool, JQuery and other Javascript Libraries on the same page

Hi All, 

I love when this happens. Basically, I am wanting to use the MooTools library and the JQuery Library on the same page. The reason? Because I know JQuery, and am not adpet in MooTools, however there is MooTool library that I want to use....basically because it looks cool :)

The problem : If you use both libraries at the same time, you get conflicts with names, basically because both libraries use the $ symbol to work with their library.

The solution : Simple....it couldn't be more simple (although it did take some time to work out). Place the following code in a script tag after you have loaded the jQuery library..

<script type="text/javascript">      jQuery.noConflict(); </script>   

No joke...that is it...

Hope this helps. 

 - Tim

Sunday, January 11, 2009

Bind a Class to a Datasource (instead of a SQL, LINQ etc statement)

Hi All, 

The fact is, I needed to quickly bind an Accordion form the AJAX Control Kit to a simple list of objects, I didn't want to create a Table in the DB, simply because it wasn't necessary, I didn't want to write LINQ because it wan't part of my entity model. All I had was a Collection of anonymous types called (items) and I wanted to bind it to an accordian. Here is how you do it : 

Step 1 :  Create a new class and dump this in there.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Collections;

namespace WebSiteManagerz
{
    public class AccordianItems
    {
        public static ArrayList FetchItems()
        {
            ArrayList Items = new ArrayList();
            Items .Add(new { Name = "Full packaged solution including Design, Development, Hosting and Maintenance", ImageUrl = "img/icon1.gif" });
            Items .Add(new { Name = "A vast range of different technologies catered for you needs", ImageUrl = "img/icon2.gif" });
            Items .Add(new { Name = "A talented team of experienced web professionals, dedicated to your project", ImageUrl = "img/icon3.gif" });
            Items .Add(new { Name = "Different levels of client interaction, from the \"Just get it done\" approach, to a much more intimate client experience", ImageUrl = "img/icon4.gif" });
            return Items ;
        }    
    }
}

Step 2: In your ASPX page, here is what you should add :

<asp:ObjectDataSource ID="Items" runat="server" SelectMethod="FetchItems" TypeName="WebSiteManagerz.AccordianItems" /> <cc1:Accordion ID="accordion" runat="server" FadeTransitions="false" FramesPerSecond="100" TransitionDuration="250" CssClass="accordion" HeaderCssClass="header" ContentCssClass="content" RequireOpenedPane="True" AutoSize="Fill"> <Panes> <cc1:AccordionPane ID="mail" runat="server"> <Header> <div> <span>What we offer?</span> </div> </Header> <Content> <asp:ListView ID="pane1" runat="server" DataSourceID="Items"> <LayoutTemplate> <ul> <li id="someid" runat="server" /> </ul> </LayoutTemplate> <ItemTemplate> <li style='background-image: url(<%# Eval("ImageUrl") )'> <%# Eval("Name") %></li> </ItemTemplate> </asp:ListView> </Content> </cc1:AccordionPane> </Panes> </cc1:Accordion>

Saturday, January 10, 2009

Using Sprites with CSS 3

Hi All, 
I am definately liking some of the new features in CSS 3. A many a time I have had one image and have wanted to use parts of it in my websites, on different parts of the page. I nice addition to the CSS framework is the use of sprites and here is how you use it.

For example, I am using this image (that contains seperate images) and I want it to be shown as the icons in a list.



 dl
        {
            float: left;            
            width: 300px;
            padding-left: 50px;          
        }
        dt
        {
            padding-left: 40px;
            padding-top: 9px;
            padding-bottom: 4px;
            background: url( '../images/sprite.gif' ) no-repeat;
        }
        dt span
        {
            border-bottom: 1px solid #cccccc;
        }
        dt.part1
        {
            background-position: 0 0;
        }
        dt.part2
        {
            background-position: 33px -33px;
        }
        dt.part3
        {
            background-position: 66px -66px;
        }
        dt.part4
        {
            background-position: 98px -98px;
        }
        dt.part5
        {
            background-position: 131px -131px;
        }
        dt.part6
        {
            background-position: 164px -164px;
        }

<dl> <dt class="home"><span>Why we are different?</span> </dt> <dd> No other company in the world offers the same experience as Web Site Masterz. You personally choose from a large range of experienced professionals, your project team.<br /> <a href="http://www.some-link.com" title="dasgsdfg">sdfg</a> </dd> <dt class="preferences"><span>How do I start?</span> </dt> <dd> Simply make your way to the Arrage A Quote page and use the simple wizard to make a project request. Once you have been guided through the wizard you will be contacted by Web Site Managerz and a more involved meeting will be arranged.<br /> <a href="http://www.google.com" title="sdfgsd">sdfgsd</a> </dd> <dt class="web"><span>Why use Web Site Managerz?</span> </dt> <dd> Every other Web Design company in the world is the same. They use cheap CMS tools to autogenerate your sites and don't provide you with the flexibility to think outside THEIR square. We develop every solution from scratch as no 2 solutions are ever the same. <br /> <a href="http://www.google.com" title="sdfsaf">more &raquo;</a> </dd> </dl>

This will simply split the images up and show them as the icon in a list style.

Hope this helps,

- Tim


Thursday, January 8, 2009

Ripping Videos From Animoto



Hi All, 

I discovered a great tool today called "Animoto" that will take in pictures and music and then convert it into a professional Flash Video. I needed to convert the Flash video to an MP4 file, but Animoto take great lengths to protect this from being allowed. Here is how you can rip the flv file from Animoto.

Step 1 : Navigate to www.animoto.com and sign up and upload your files.



Step 2 : Wait while you photos upload




Step 3 :  Once Animoto has done its thing, click the Embed link highlighted in read




Step 4 : Click on the Other link

Step 5 : Copy the link and then paste it into an empty Web Application within the Default.aspx page (in between the form or body tags. Then Run it!


Step 6 : Go to your Temporary Internet Folder and sort via Internet site, looking for swf files from www.animoto.com.











Done!

Hope this helps, 

 - Tim



Sunday, January 4, 2009

CSS Image Ratio

Hi All, 

It has come to my attention that it is not a widely known fact that you can resize images, while keeping the ratio in perspective using CSS. I was using my technique for doing this the other day, and was curios to see if other people had discovered better ways of doing this. To my surprise, I found that a lot of forum posts etc were mentioning that it cannot be done. Without futher stalling......here is how you do it, and make it work in all browsers as well.


<div id="main_image"> <img src="img/Bazaar.jpg" alt="Bazaar" title="img/Bazaar.jpg" /> </div>
 

 #main_image
        {
            margin: 0 auto 60px auto;
            height: 250px;
            width: 350px;
            text-align: center;
        }
        #main_image img
        {
            margin-bottom: 10px;
            height: 250px;
            width: 350px;
        }

I know....this seems so obvious......but a lot of people were using the DIV to do the resizing, and in my experience this causes stretching with the image contained within the DIV.

Hope this helps, 

 - Tim