This week we’ll be looking at some more XHTML tags and a brief introduction to tag attributes.
More Tags
Last week we just went into some formatting tags. This week we’ll look at some other tags. Instead of you reading long and boring paragraphs explaining these tags, we’ll do it in a list-type style.
Hyperlinks
Hyperlinks (or more commonly referred to as simply links) allow you to create a clickable object (which could just be text, or even an image) which will take the user to another webpage on your site or a completely different website. Let’s take a look at an example of a hyperlink that goes to my blog.
For links, the XHTML tag is a, which has a required attribute of href (see the section of this post on Attributes). The value of the href is URL (Uniform Resource Locator) you want the user to be taken to when the link is clicked. The text between the opening and closing a tag is the object which will be clickable. In this case it is text, but it could also contain an img tag.
Images
A webpage would be pretty boring if it was all text, wouldn’t it? The image you want to put on your page must be uploaded somewhere on the Internet. You should also keep its dimensions and file size within reason, so the page doesn’t take forever to load. In this example we’ll add a picture of a GPS device to this page.
Code:
<img src="http://blog.bluefur.com/wp-content/uploads/2008/11/garmingps.jpg" alt="Image of Garmin GPS Device" />
Result:
Embedding images on a webpage uses the img tag. The src attribute is where you specify the URL of the image you want to add. Again, this URL must be a place on the Internet. The alt attribute is where you specify alternate text for screenreaders (or if the image cannot be displayed for some reason). This should contain a description of what’s in the image. Although the alt attribute isn’t actually required, it is good practice to specify it for accessibility purposes.
Attributes
An Attribute in XHTML allows you to specify required or extra options to a tag. Attributes are contained within the opening tag of a tag and are in the form of attributename=”value”. All attribute names must be in lowercase and all attribute values are case-sensitive.
With many tags, there are a set of required attributes needed for the tag to work. A few examples of these tags are, a and img. There are a set of common attributes for most tags. These include id, class, style and title.
For some tags, there are more task-orientated attributes such as href on the a tag and src on the img tag.
The title tag is used for adding a mouseover title on things like links and images. The way this works is:
Code:
<a href="http://www.example.com/" title="Example.com - Home of the Example">Example Link with Title Attribute</a>
At the beginning of 2008 we set some specific business goals to have accomplished by the end of year. Good or bad it is time to evaluate where we are with those plans.
Website Improvements - F
After a lot of different beta sites we tested none were what we wanted. We have decided to redesign the site in the style of our blog it should be done shortly.
Billing Improvements - F
Building a billing system is a large undertaking. We are till working on it but it is not done so it is being worked on still in 2008.
Service Improvements - C
We removed a lot of the unused services that caused us headaches and trimmed our services down. Some of the services we planed on adding have been nixed.
Software and Script Plans - C
BEEF is done but just no one seems interested in it. With free software already out there like Filezilla I guess there was no need to build it.
BlueFurCode which was a great concept had no interest from our community. The project was shelved until more interest in it.
Server Software Upgrade Plans - A
All the servers are upgraded.
Summary
I am disappointed that our goals were not achieved in 2008 and would give us an overall D+ rating. Worse then our 2007 report card. Our 2008 business goals will be released in January. If you have suggestions for improvements post a comment.
In case you haven’t heard, the Consumer Electronics Show kicks off in Las Vegas a little later this week. At this gigantic technology trade show, you can find all sorts of wonderful gizmos and gadgets that may or may not be hitting the market any time soon. You can find the coolest cell phones, the biggest HDTVs, and the latest in mobile technology. While there is still a lot of attention surrounding the Asus Eee PC, there’s another little laptop that may be set to make some rather substantial waves.
Shown here is an early shot of the Sony VAIO Pocket, also known as the Sony VAIO P-series. While some are calling it a netbook like the Eee PC and MSI Wind, the features and price point on this Sony may better describe the device as a subnotebook. It will likely have the same kind of power under the hood as some larger VAIO notebooks and as such, it will not be a budget-minded device. Interestingly, it has an 8-inch display with a 1600 x 768 pixel resolution. That’s a rather unconventional aspect ratio for a laptop.
It is said to have an 1.33GHz Intel processor, but we’re not entirely sure if this is Intel Atom or a ULV variant of Core 2 Duo. If it’s the latter, this further emphasizes the “subnotebook” placement rather than selling the device as a “netbook.” In this way, the Sony VAIO Pocket may retail for well over $1,000 when and if it ever hits retail. Given this price point, only true enthusiasts and possibly enterprise users would opt for something like this.
Keep your eyes and ears peeled for more news from CES, as we hope that Sony has a bit more information about the VAIO Pocket as the week progresses.
Social Media does not mean you have to leave your blog to do it. Today we are going to try a new social media game which has become popularized by Net Chick.
I am going to rename it Comment Tag.
Here is how it works.
1. You leave a comment on this blog.
2. Vist the commentors blog above your comment and leave a comment there.
Sounds pretty simple doesn’t it? Well that’s the whole idea.
Get to know your neighbours and they will get to know you.
Like this topic for Sunday’s? vote for it to be sure it stays.
We have covered how to make your site more iPhone friendly and more Android friendly but we not covered Blackberry (aka crackberry). Like the iPhone it has many faithful followers who are everyday looking at sites and getting frustrated that the sites are not easy to browse.
Redirect BlackBerry users to a Separate Site
If you want to push BlackBerry users to another folder where you can then develop a more BlackBerry friendly design add the following to your .htaccess…
RewriteEngine On
RewriteCond %{HTTP_USER_AGENT} *.BlackBerry.*
RewriteRule ^index\.html$ BlackBerry/index.html
Site Width
The maximum pixel width of the BlackBerry screen is 320. If your site is currently optimized for a higher resolution then I suggest doing a redesign to make it fit in the 320 width. If you have an iPhone Friendly site already then adding a redirect would be a good solution.