DevHints

Archive for the ‘Advanced’ Category

It’s 2am and I’m up working on a website. It’s fairly typical. And while most people would doubt my productivity at such an hour given that I’m awake all day, I have proof of productivity (and creativity).

I was playing with a layout revision of one of my websites when I got to doing the links. Typically I do something plain-jane like this:

a:link, a:visited { color: #000; text-decoration: none; }
a:hover, a:active { color: #333; text-decoration: underline; }

That makes a neat little link that goes from plain black to a dark gray with an underline when hovered over. Nothing special. Of course, I mix in all sorts of fun colors and I do background color changes too. Tonight was different though.

I decided I wanted to do something to help visitors keep track of where they’d been by styling “visited” links differently. After seeing a few people (most notably Mike Davidson) do the little check boxes, I figured it wasn’t a half bad idea. Mike uses the :after pseudo selector to add the checkbox to visited links. Not a bad idea, but it won’t work in IE and it makes changing it on hover difficult and choppy. I had a better idea.

I used the background property. I had just used the same method for my list bullets, so it was still fresh in my mind. Simplified, we had the following:

a:link, a:visited { color: #000; text-decoration: none; }
a:visited { background: url(‘images/check.png’) right 60% no-repeat; }

I used 60% because it achieved better alignment in my situation than center and it scales better than pixels. Now my little visited links had neat little checkboxes next to them. Awesome. But now my hover style didn’t look quite right since I was changing the background color on hover. This is when I started thinking…what if I could tell the browser to change the background on hover over a visited link? Well, it looks like you can:

a:link, a:visited { color: #000; text-decoration: none; }
a:visited { background: url(‘images/check.png’) right 60% no-repeat; }
a:visited:hover { background-image: url(‘images/check_hover.png’); }

I actually originally had the hover and visited pseudo-selectors swapped the other way around (:hover:visited) but IE didn’t want to cooperate, so I got to thinking what I was really telling it (apply this to anchor tags when they are being hovered over that are visited) and how it made more sense if I flipped it (apply this to anchor tags that have been visited when they are being hovered over). Sure enough, it worked like a charm.

NOTE: While this method does allow for more customization and it works with IE, Mike’s method is better from an accessibility standpoint since it doesn’t use an image.

Advertisements

I’m currently about half-way finished with a project that allows a user to check their Myspace Mail inbox through WML and WAP (mobile internet standards). The user simply visits this service, dubbed mBridge at the moment, on their mobile phone. They will be prompted for their Myspace login information. mBridge will pass the credentials on to Myspace and retrieve the 10 most recent messages, strip any code, and display them for the user to read. For those of you interested in how this works, read on.

First, mBridge has a login page written in WML that includes a form allowing the user to type their email and password for Myspace. After the user submits this information, mBridge will take it and use it to connect to Myspace via sockets. A socket is opened to myspace.com, headers for the homepage are written, and a token is retrieved. mBridge then opens a socket to login.myspace.com and uses a POST request to send the user credentials. After a few redirects and setting of cookies, we have a valid session with Myspace. mBridge retrieves the mail center page and uses a regex to grab the dates on all of the messages, their subjects, and the message ids of all of them. Now we open a socket for each message found in the inbox and retrieve the content.

The subject lines are stripped of repetitive “RE:” flags and the messages are stripped of code that won’t display properly in a mobile browser. The user is sent a list of links to each of the messages for them to read. When they read a message, they have a link to respond to the message.

When a message is sent, we log back in, visit the mail center, read the message, simulate a click on the reply button, and insert the mobile users response in the field before clicking send.

Will Myspace try to stop this from happening? While it’s possible that they will change the login method, links, or method for sending message, we can always adapt to it. If your browser can login, so can a script. It is also possible that they will incorporate JavaScript into the service to set cookies that we would otherwise miss with a script, but we can always determine the behavior of the script and make it work no problem. It is possible for Myspace to start blocking our IP address, but we can go buy more. Myspace can force users to verify a CAPTCHA before logging in, but we will develop OCR that can answer them just as accurately as a human, or pass them on to the mobile user and allow them to answer them.

The only thing Myspace might do is try to shut us down through legal methods. I’m not aware of anything illegal about what mBridge does, though I’m not a lawyer. I’d hope that since Myspace does not have a service competing with this they won’t get their panties in a bunch that their customers don’t have to login to something they made to get their messages, but really, can they continue to expect people to put up with a lack of updates, no integration with mobile phones, and constant errors?

If you’re a freelancer and you’ve ever had problems obtaining or retaining clients, or if you’re new to web design and you’re considering freelancing, this article is for you. I’m going to give you some great tips on how to get new clients and keep them coming back for more.

Obtaining new clients can be a challenge. Some freelancers do fine advertising their services on relevant websites and rely on potential clients contacting them. Others are more aggressive and like to go out and find clients instead of waiting for them to come to you. Either way, you still have to convince the client that you are the person they want working for them.

How can you do this? Be available. Its always easier to see someone who is doing it wrong and make sure you don’t do what they are doing, and that’s how I learned. Most Indian programmers have a language barrier, considerable time zone difference, and high-international rates discouraging you from calling them, so we should make sure we speak with impeccable grammar, punctuality, and spelling. We should ensure that we respond to emails within 3-6 hours at the most, and that we’re available via telephone at any hour of the day or night (weekend or weekday, the internet still runs). This alone will make people feel better about choosing you as their developer.

In addition to the tips above, you should make sure you are always open and honest with your clients. Don’t tell them you can complete a project that you aren’t sure of every single step. Explain to them exactly your understanding of their needs and have them verify to ensure everything goes smoothly. Give the client details on how everything will work, including the use of diagrams if relevant. Your potential clients will have no doubts about your ability to complete the job, and they will be confident that you are the developer they should go with.

Now that you have the job, you should continue to show your client the same level of communication that you have been. Give them an update daily (or every few days if it is a very large project) on where the project is. Don’t be afraid to call them up and speak with them personally to reassure them everything is going just as planned. Trust me here, they will appreciate it.

So you’re finished with your project and your client is satisfied? Great! You’re still not done! Give them a few weeks to use their new application/website/etc before giving them a follow up call to ensure everything is going well. Ask if there’s anything that they would like changed or any other projects they might like your assistance with. Chances are, they will request additional work on the same job or tell you about another project they are working on. If you don’t catch my drift, you can encourage repeat business this way!

Why is repeat business important though? Well, most of your work is already done for you. You already have the client in your pocket and you don’t need to convince them you are right for the job, and if you work on the same project, you should already know most of the code! Repeat business is much more profitable!

If you follow these tips, you can charge 3-5 times the rates of other developers or more! I’ve never had a problem gaining a client at a rate of $100/hr, and I’ve gained several at $300/hr! Good luck!!!

First you have to find someone that has a problem and is seeking a solution that you can provide. Then you have to get in contact with them and sell them on your ability to complete the solution, and convince them that your price is worth it. Even after you’ve obtained the job, it’s not all coding from there on. You’ll still need to keep your client updated on the status of the project, and after the project is finished, you should give them a call a few weeks later to make sure everything is running as intended.

I’ve proved this in the past, but I suppose it’s time I do it again. Libcurl is generally faster than file_get_contents by a considerable amount.

Many people argue that it’s not any significant amount. This point is used time and time again when comparing functions that don’t access anything except memory, but it doesn’t apply to accessing files over a network.

Having not looked over the source code of libcurl and PHP, I can’t tell you for sure why one is faster than the other, but I can give you proof and some rational thoughts on the matter.

First, libcurl allows you to customize your request a considerable degree. This allows it to lighten up it’s processing on trying to figure out what it’s connecting to and how it should handle everything. It’s opponent is a one-size-fits-all solution, meaning it fits, but not very well. It has to do more work to decide exactly what it should do with each query. There are also a number of headers that could be sent differently between the two that I don’t care to test or look at.

Anyways, here’s the proof you’ve been waiting for: Test

The test runs through a list of websites, connecting 10 times to each using libcurl and file_get_contents and compares the times. Some websites work faster with file_get_contents, and others work faster with libcurl. Occasionally the total will end up within 10 seconds, but I’ve never seen file_get_contents spend less time than libcurl.

As an additional note, even if you are connecting to a website where file_get_contents has been proven to be faster, you should still use libcurl due to it’s error handling abilities. If you’re really opposed to libcurl or can’t use it, use sockets. 🙂