Domain renewal group sales pitch

Just received a letter from domain renewal group telling me my domain will expire soon. They kindly offer me “their” best savings when I switch to their service. Their best offer is double my normal yearly rate. Thank you for scouring the domain lookup and trying to get some cash out of me but I think I’ll pass this time.

The form on the letter is a good effort. All the prices are in pounds but the total is in dollars (good mail merge).  But by far the best of this letter is the masses and masses of small print on the back. I think I’ll stick to my current provider.

Be careful what you ask for




homebase_extraction_fan

Originally uploaded by surfgimp

Homebase seems to have an interesting fall back when you submit a query that it doesn’t know. It gives you random stuff in the hope that you’ll buy it. I suppose there’s more chance of buying something than having a “sorry we can’t find that” page with no products.

This still amuses me. Time to try other random searches me thinks.

WordPress theme versus blank theme

When learning a new skill the process can be accelerated by seeing how other people have accomplished the task. When it comes to themes for wordpress there are lots available ranging from free to paid for. These can come in various setup’s i.e. one column, two column etc. Therefore when designing a new theme for wordpress it’s easy to copy an existing theme and then start editing the css / code to see how the theme changes and to tailor it to the project in hand.

Trees and sky

Sometimes though it is difficult to see the wood for the trees as even the default style.css document is over 350 lines long. This is where a barebones or completely stripped down theme comes in useful. I’m currently using starkers form elliotjaystocks.com. Then the theme can be built up using parts from the theme that you’ve been learning from safe in the knowledge that if it starts to work unexpectedly that it’s because of the code inserted not because of combination of css further down.

Debugging CSS using web development toolbar

If the css is getting a bit of a unwieldy monster it can be helpful to separate the css out into separate sheets so that individual stylesheets can be turned off to see effects on the theme. The individual stylesheets can be turned off using the web development toolbar for firefox. Sometimes it’s easier to live edit the css in the browser which is carried out by clicking on the css menu then “edit css”. If the theme is not behaving as expected then the toolbar can help visualise the problem with the stylesheet by using the “Display element information” in the information dropdown. This then shows the details for the part of the page that is selected. This includes the nesting of the css elements the size, postion, font.

Use both

To learn how to make themes it  is good to use both established themes and barebones themes. This way it can help to cherry pick the aspects out of the themes but implement them into

Sexy Forms

We’ve all seen forms of varying types littering the internet. My approach always used to be to get the table tags out and enclose my form in a table of varying complexity depending on how I wanted to make the form look. Then came the eureka moment that the resulting form is buried in a lot table, tr, td, th, tags. That’s when the search continued for a new method.

Fieldset tags

A simpler form can be created using fieldset tags. Within the fieldset tags we can make use of the legend tag to put a title on the form. This is more useful when there is a few sections to a form to group individual fields onto sections. Then to group the headings for the field the <label for> tag is used. This then helps when styling the form as the label can be aligned to the left and a two column form can be easily created.

<form id="form1">
 
<fieldset>
<legend>This legend makes a neat heading</legend>
 
      <label for="text1">Field 1</label>
<input id="text1" type="text" />
<input name="submit" type="submit" />
</fieldset>
 
</form>

This code gives the form below without css.

This legend makes a neat heading

CSS layout

The form contains no markup to make the form sexy but as we’ve given the elements id names we can use CSS to alter the formatting of the form as we wish. This includes setting the form up with columns, altering the fonts, colours and anything else we wish to add.

jquery validation

To add extra extra help to the form validation can be used to give help, issue alerts to ensure that forms are filled in properly. The following jquery validation plugin was used available from http://bassistance.de/jquery-plugins/jquery-plugin-validation/. If running on a live website to ensure that the data is validated some server based validation should be used by using php or another server-side language.

The validation plugin has many options to customise the validation and the resulting errors / warnings. The full documentation is available at http://docs.jquery.com/Plugins/Validation.

Bannish boring forms forever

Next time you create a form don’t forget they don’t have to be boring

Essential add-ons for firefox

firefox logoThe true power of firefox is in the add-ons available. For the web-developer there are a number of add-ons which are not only essential but also means that most of the time you only need firefox to carry out your work.

The list of these include:

Web Developer

firebug – Great tool for debugging javascript and examining what’s going on in the background.
firequery – An addon for firebug which shows the detail of what’s going on with jquery on a page.
page-speed from google – Another addon to further expand firebug. This time it’s from google and it shows how long each part of a page is taking to load and has helpful hints on how to speed the page load process up.
developer toolbar – This addon contains a wealth of useful tools when developing. Too many to mention here, it basically helps with css, javascript, standards validation. You name it, it’s got it.

Web Design

measureit – A neat little addon which lets you drag the mouse over the page to get element sizes. This is useful when designing pages.
colorzilla – Another essential design tool. Just click on the eye-dropper and anywhere on the page it will tell you the colour.

SEO

seo for firefox – These two are from Aaron Wall of seobook.com fame. It displays seo information for the page that is being displayed. There’s also tools to delve deeper into the seo performance of the page.; rankchecker
– Thisaddonn allowssearchtermss / websites to be entered then theaddonn goes away and find where the site is ranking for that search-term.
google toolbar – Helpful toolbar if you use a lot of Google’s services. Obviously it was mainly used for displaying the all important page-rank but as page-rank isn’t all of how Google ranks a site it isn’t as important as it used to be.

This is my current favourite addons for firefox. I’m going to be on the lookout for more soon mainly to help with general blogging like image finding, screenshot etc. There are plenty being developed all the time so let me know which addons you recommend.