Archive for the ‘Web Development’ Category
Why my project failed.
Wednesday, January 13th, 2010Last year I worked on a project called weproudlypresent. Below is the story of how it came about and why it failed. I will talk about the lessons I learned.
Origins
I have been a member of a variety of forums over the past few years and quite a few people have me on their list of contacts. I first heard about this project by someone asking me if I was interested in working on a project. I never commit to anything immediately and instead sought some more information.
The project was to create a music site for unsigned bands. We would showcase their music, allow them to market their music, create and sell merchandise and generally build up a fan base. I thought this had some potential, especially if marketed correctly so I agreed to come on board.
The Problems
There were a number of problems to begin with. The person who came up with the idea had contacted a lot of people through various instant messengers. Some were simply not up to task. I do not mind working in a large team of skilled people but there is little point in working within a team largely unskilled. To better understand this, their are professionals, hobbiests and people who know a bit of HTML and call themselves a designer. We had quite a few of the latter. In a long e-mail I explained why the project would be better off without these people and the first problem was solved. Our team of 11 dropped to a skilled team of 4.
The second problem was the brief. We all had grand ideas and the brief grew very big. It was a massive list of wants. This was one of the problems that we struggled and ultimately didn’t solve. We didn’t want to scrap any features as they were all good. At the same time we knew version 1.0 couldn’t have all of these features. Half would have been a good achievement. As we never all agreed on a 1.o brief there was no defined end point and this was a problem.
The third problem and by far the biggest was the lack of management. If you want to get a side project done you cannot treat it like a side project. You need to set time aside each day to work on it. This will ensure the project gets the proper attention it deserves and actually gets done. This philosophy didn’t exist in the beginning and the general consensus was ‘if we say we will do it, it will eventually get done’. The person in charge did not set goals, instead he set vague aims and kept pointing towards the launch date. If a person has 4 months to do something where is the urgency? The lack of management also meant some poorly scheduled and controlled meetings which lead to half our time waiting for everyone to attend and the rest of our time getting off track and everyone leaving none the wiser.
I did eventually solve this management problem but it was probably a little too late. I took over the project. I set a weekly meeting time. With each meeting I listed the things we needed to resolve in advance so everyone came prepared. I set everyone a task with a deadline. These tasks were just small sections of programming and design that needed to be done. Slowly the project started to grind into action.
Then it failed. The final nail in the coffin was a lack of motivation by 2 team members. There is a very big difference between wanting to do something, saying you will do something and actually doing it. They talked a good game and there were a lot of promises but when week after week they had nothing to show it got a bit tiring and leached the motivation of other team members. This was ultimately the reason why the project failed.
Lessons
The lessons learnt are as follow.
- Creating an ultimate feature list is fine but the most important thing is to create an achievable v1.0 feature list.
- Make sure you have the right team together, if someone isn’t up to it, let them go. It will be better in the long run.
- If someone cannot manage very well, spot it immediately then help or take over. A successful project is a well managed one.
- Ensure that everyone knows that while the project is built in their own time, they need to set time aside each day to work on it. If they cannot agree to this then you are going to have problems.
- From day one look at creating a very limited Alpha. You then will have something to show for the hours invested.
I haven’t been put off working on projects and I hope to work on some more this year.
If you have been working on any projects that haven’t quite panned out feel free to post why.
Posted in General, Observations, Web Development | 4 Comments »
An example of terrible HTML
Monday, February 16th, 2009Recently I was called in to update a web application. This application needed fixing and brought up to 2009 web standards. I was told that this was programmed in early 2008 and to be honest I was very surprised by what I found. What I will do is take apart a file which I recently edited, I will point out what is wrong with it and show you the updated version at the end.
You can grab the source file here.
<div style="padding:30px" class="affmain1">There are 2 issues with this code. Firstly the inline styling which will make this difficult style with a stylesheet. Secondly the class name has no meaning whatsoever.
<div class="afferror"> {if $message} - {$message} {/if} </div>
I should add that this template file uses Smarty. The problem here is that again the class name is terrible. Secondly, the class really should be within the smarty tags. If there isn’t a message the div isn’t needed so there is no reason why it should always display whether there is a message or not.
<div style="width:400px;">Another example of the previous developer just making it more difficult for themselves. I should add that all pages have this style tag. Why not set a class and allow customisation via the stylesheet?
<!--top-title begin--> <div class="f2-top"> <div style="float:left"><img src="images/f2_t1.gif" border="0"></div> <div style="float:right"><img src="images/f2_t2.gif" border="0"></div> <div class="f2-top-div"><strong>Add new site</strong></div> </div> <!--top-title end-->
Firstly… what useless comment tags! Secondly it contains far too much mark up. The image tags lack key attributes like dimensions and alt. This is the page title. It should contain a header tag. In this case I replaced all of the above code with a h2 tag.
<div class="div1"> <div class="div2"> <div class="div3-f2a">
Again, nonsense class names. What is ‘f2a’?
<div>http://<input type="text" name="site" id="site" class="affaccount" style="margin-left:3px"></div>
Why doesn’t this form element have a label? Inline styles, nonsense class name and an untitled div all need fixing here.
<img src="affiliate/images/cancel_sm.gif" style="margin-bottom:-8px; margin-left:2px" onclick="window.location.href='affiliate.php?action=sites&do=list';"> <input type="image" src="affiliate/images/save.gif" style="margin-bottom:-8px; margin-left:5px" onclick="f1.submit();">
More inline styles.. but there are two things which bug me here. Firstly, instead of using an anchor tag to allow the user to leave the form. The developer thought it would be a fantastic idea to add some javascript to an image. This raises a question. What happens when users have javascript disabled? Furthermore, the fact that the image has no mouse-over effect will cause confusion. Finally people tabbing around the page on the keyboard won’t be able to cancel the form.. its stupid, short sighted programming.
The submit button also raises some questions. Why use javascript to submit the form when this is what the tag does anyway? Considering how these images are scattered around the application how does a designer style these elements? Are they expected to change them one at a time.
My client was charged a high fee for this POS programming. It is designers like this who give the rest of the industry a bad name. If you cannot program to a decent standard then don’t..
For those who are interested here is the before and after.
Before
<div style="padding:30px" class="affmain1"> <div class="afferror"> {if $message} - {$message} {/if} </div> <form action="affiliate/savesites.php" method="post" onsubmit="return validateForm();" name="f1" id="f1"> <div style="width:400px;"> <!--top-title begin--> <div class="f2-top"> <div style="float:left"><img src="images/f2_t1.gif" border="0"></div> <div style="float:right"><img src="images/f2_t2.gif" border="0"></div> <div class="f2-top-div"><strong>Add new site</strong></div> </div> <!--top-title end--> <div class="div1"> <div class="div2"> <div class="div3-f2a"> <div>http://<input type="text" name="site" id="site" class="affaccount" style="margin-left:3px"></div> <div style="padding:20px"> <img src="affiliate/images/cancel_sm.gif" style="margin-bottom:-8px; margin-left:2px" onclick="window.location.href='affiliate.php?action=sites&do=list';"> <input type="image" src="affiliate/images/save.gif" style="margin-bottom:-8px; margin-left:5px" onclick="f1.submit();"> <input type="hidden" name="changes" value="add"> </div> </div></div><div><img src="images/1.gif" border="0"></div></div> </div> </form> </div>
After
<div id="add-site"> <h2>Add new site</h2> {if $message} <div class="message"> {$message} </div> {/if} <form action="./savesites.php" method="post"> <div class="form-element"> <label for="site">Site Name:</label> http://<input type="text" name="site" id="site" /> </div> <a href="./affiliate.php?action=sites&do=list" class="cancel" title="Return to Menu"><span>Cancel</span></a> <input type="hidden" name="changes" value="add" /> <input type="submit" name="save" value="Save" class="save" /> </form> </div>
Posted in Web Development | 3 Comments »
Team Viewer in Web Design
Friday, November 21st, 2008Web design throws up a number of challenges with client interaction. Ideally the client would be able to come to your office or you would be able to go to them to discuss any new designs or various challenges with a project. Unfortunately this isn’t always the case. This can lead to a number of challenges explaining to or showing your client what they need to see.
I have recently been using a tool called Team Viewer to remotely control my computer. In doing this I have found some software with a huge number of uses in the web design field.
Team Viewer allows you to remotely control someone else’s computer and vice versa. It works on both the Mac and PC.
It is a small file and a minor installation. The whole thing is pretty much idiot proof. (Unless your running Vista, then you probably need to run it as an administrative user)
Design Approval
Getting a design approved can be very difficult, to ease this it is common practice to either send a design with a message or talk to the client over the phone if you cannot meet them in person. Team Viewer can be a great tool to aid this process.
Imagine this, you are on the phone and instead of imagining what the client is thinking or looking at. You will be able to visually see what they are doing. To demonstrate your point or to talk them through the design you can move their mouse around. You can point to parts of the design and tell them why each bit is there, what it is for and why this design is the best for their website.
When a client queries something you can see exactly what is being queried and address any concerns.
Posted in Clients, Web Development | 1 Comment »
IE6 :- Will it ever perish?
Monday, November 10th, 2008Technology is forever improving, new programming methods, new technologies, new methods of working. What remains a constant is the existence of IE6. Despite being out of date, insecure, prone to pop-ups, vulnerable to phishing AND tabs do not exist… many people still use the 7 year old browser.
So many people in fact that they cannot be ignored.
Check out W3C usage stats.
http://www.w3schools.com/browsers/browsers_stats.asp
Bear in mind that W3C is a technology website, it is a school teaching people how to develop websites. I would imagine that many people visiting this site are somewhat web savvy. The actual IE6 percentage is probably far higher.
http://www.thecounter.com/stats/2008/November/browser.php
Depending on the type of site you are building I think it is safe to assume to that at least 20% of users are running IE6. Perhaps more worrying is if you look at the browser stats from w3schools. IE6 was released in 2001. It took until 2005 for IE5 to drop below 10%. It would appear that we will be designing for IE6 for many years to come.
As a web developer you cannot ignore 20% of your clients visitors. At the same time by supporting these visitors there is nothing to encourage the users to change. IE6 doesn’t support transparency, it doesn’t have complete CSS support. In short its a pain.
Microsoft seem to be completely unable to convert the remaining IE6 users to IE7. My main gripe is that IE7 always has been an optional update instead of a compulsory one. When Firefox 3 came out I kept my laptop running Firefox 2 for testing purposes. A little while later I was prompted to upgrade to Firefox 3. Excellent I thought. Why isn’t the same with Microsoft and IE7?
There are business users who are not yet able to upgrade or do not wish to upgrade due to the cost of the upgrade along with man hours lost while their users upgrade and adjust.
There are also the stubborn users who have the opinion of ‘if it isn’t broke why fix it’. They can browse the Internet on Internet Explorer 6. Why do they need to use Internet Explorer 7.
I think in the coming years we are going to reach a point where IE6 won’t be capable of running the latest applications without a serious amount of time devoted to it. At the end of the day graceful degradation will only go so far. When this happens site owners will have a choice between asking users to upgrade their browsers or shelling out extra money.
Recently I have been hearing a lot of developers talk about stopping support for IE6 for ‘moral’ or perhaps elitist reasons. The fact is though that the web developers job is to cater for a websites users. If these users decide to use Internet Explorer 6 then its the duty of the developer to work with it.
Perhaps a day will come when a message on a site saying “Dude, upgrade already” will become appropriate. However without a concerted effort amongst the major webplayers (google, yahoo, facebook, msn etc) there really is little point in smaller sites doing it. Unfortunately it isn’t their job to force the web to upgrade its software.
What are other peoples opinions on Internet Explorer 6? What % of the market share do you think you will be designing the site for? If you support Safari/Opera who have a less that 5% share of the market will you be supporting IE6 until it drops to 5% market share?
Posted in Web Development | 6 Comments »