Use Built-in iPhone Capabilities in Web Design

When you include a phone number on a web page, the iPhone recognizes it and automatically makes it possible for a user to place a call by touching the number. If a user touches and holds on a phone number for a second, the iPhone offers four options: Call the number, send a text message, create a new contact, and add to existing contact, as shown.

image0.jpg

All iOS devices with phone capabilities include these options, but not all users understand that if you tap on a number with your finger you initiate a call and if you touch and hold for a second, you see a list of options. If you want to help users who may not be aware of this feature on an iPhone, you can add a simple message to bring it to their attention.

The code in the following example includes a message that displays only on iPhones. On any other browser, the page shows just the phone number (without the touch and hold tip for the iPhone).

<?php if ($iPhone == true)  { ?>                        1
<p>By phone: <a href="tel:+12345678901">+1 (234) 567-8901</a> (you can create a contact by   touching and holding a phone number)</p>      2
<p>By text message: <a href="sms:+ 12345678901">Text Mark</a></p>                                  3
<?php } elseif ($iPad == true || $iPod == true) { ?>     4
<p>Add Mark to your contacts: +1 (234) 567-8901 (on an iPad you can create a contact by touching a phone number)</p>                                5
<?php } else { ?>                                          6
<p>By phone: +1 (234) 567-8901</p>                         7
<?php }?>                                                8

Now you’re checking to find true statements twice. The first block is an if statement, but rather than use the else statement, you use elseif to evaluate the next statement. Keep in mind that if the first block is true, the elseif isn't even evaluated. Finally, you can use the else clause for any situation that falls outside the first two scenarios.

To create your own contact page, just replace all of Mark’s contact information with your own and integrate it into the code.

blog comments powered by Disqus
Advertisement

Inside Dummies.com