Search boxes: integral parts of many websites but often neglected in terms of markup and style. When considering both accessibility and semantics, marking up a a search box can be a little awkward depending on the look you are trying to achieve.
In this post I will suggest some methods of marking up your search boxes, and show a neat way of styling it using css and a few images.
Last week I noticed something very odd on Blue Anvil when resizing the browser window; after some casual browsing I discovered it was not just my site with the problem and that it was quite widespread on many ‘web 2.0′ style sites.
The problem occurs when resizing the browser window; cutting off background images and potentially making text illegible. Worse still, the bug also seems to affect mobile browsers with a zoom function, such as opera mobile.
After some dabbling I found a solution, which I shall explain in this post.
Pull quotes, lift-out quotes, or call-outs are a handy method of drawing reader’s attention to a section of text. Recently, on a couple of client projects, I’ve seen the need to enhance large blocks of text so the user could skim read them without missing the really important parts. Pull quotes seemed perfect for this, so I created a small jQuery script to take care of them.
In this article I demonstrate an easy method of creating pull quotes from a block of text using jQuery (a JavaScript library), CSS, and the html span element. I hope you find this method useful.
Recently I’ve been searching for a method of creating nice looking rounded corners with Javascript & JQuery.
First I found the “JQuery Corner” plugin for rounded corners, but was disappointed that it did not include smooth, anti-aliased corners.
I then did some more google-trawling and found this post, which contained a modified version of Curvy Corners for use with JQuery. Now this script was much much better.
However…the filesize was a massive 40kb, way too big for production use, and to make things worse the code was not compatible with packer so I could not reduce the filesize.
Well, I got busy, and fixed the errors. It is now fully packer friendly meaning easy rounded corners in JQuery at only 9kb 8kb 15kb 20kb 16kb 10kb. Excellent. Read more for the download link.
As promised last week, this week we are looking at fetching RSS feeds with Magpie RSS.
Magpie is an PHP based RSS feed parser; I.E. It fetches RSS feeds to display in other places, which gives it many uses.
Unknown to many, wordpress has the magpie RSS parser built in, this article will teach you how to use it, and also how to fetch and show someones del.icio.us bookmarks!
In this first edition of “Wordpress development techniques” I will be talking about one of the most useful classes available for use in wordpress: wpdb.
The wpdb class (WordPress DataBase class) is based on the ezSQL class, and handles database connections and queries.
Why use it? You can make all sorts of custom queries, and pull information from the wordpress database, including posts! Read on for more information on this useful class…
Widgets are a cool new feature built into wordpress version 2.2, and allow you to drag mini plugins into your widget-enabled theme’s sidebars.
They have all kinds of uses, searches, polls, you name it.
This article will show you how to create a customisable Recent post widget for yourself.
This week Ive been trying out a lot of image replacement techniques in main headings, and their are quite a few available. If you have a graphical header logo on a website, with the sites name, often you wont want to have another heading as plain text. Yet, you should want to have the heading readable by screen-readers, and you also want the SEO benefits of the heading.
Ive rounded up my favorite methods, and this entry will show you how to use them, and when to use them.
When developing websites there is one thing I have never kept consistent; the method of clearing floats. It seems every project I take, I seem to do it a different way, well Its about time I sorted it all out in my mind.
For those with no clue about what I’m rambling on about, with CSS layouts, when you have a float inside an block-level element, it will collapse in most browsers, since floats have no dimensions. So for instance, if I had a div container with a blue background, and a float inside it, the blue background would not surround the float (and the floats contents), due to the div ignoring the height of the float.
To fix this you need to ‘clear’ the float, so the container recognises the fact the float is there, and adjusts its height accordingly.
There are many methods of doing this, personally in the past Ive used most of them, so in this article I will compare the main ones and rate them in terms of:
Recently ‘Microformats’ has been a major buzz word in the web design community, but what are they all about? If you are feeling lost then this article is for you. This article explains what Microformats are, the benefits of using microformats, and how to implement them.
This article focus’ on the microformats hCard, and hAtom; both of which are used on the Blue Anvil site if you hadn’t noticed.
I have just uploaded 1.1.7 of MiniCard here and to the WordPress theme directory. This updates includes:
Hope you like it, and don’t forget you can show your support by purchasing the premium pack from here.
It’s been about two weeks now since I made the transition from a shared reseller hosting account to a VPS (Virtual Private Server) account – impressions so far, excellent performance but fiddly to configure.
The reason I wanted to change from shared hosting was the fact the server was always being hacked (even though ALL my scripts were secure), there was frequent downtime, support blamed me for problems every time, and it was slow as hell.
Those used to a shared hosting environment would probably not know where to start when faced with configuring a VPS. Luckily, a lot of it was pre-configured when I received my account – certainly some of the major security holes were patched. I was not satisfied with those however. As a victim of hacking in the past (previous host swears it was not there fault, something I don’t believe) I took extra care to secure it as a much I could – configuring brute force detection, the firewall, installing mod security (excellent rules for that here: http://www.atomicorp.com/wiki/index.php/Atomic_ModSecurity_Rules) and going though multiple guides (like this one: http://www.webhostingtalk.com/showthread.php?t=468168) with a fine-tooth comb.
The result? My pages are loading at least 6 times faster, I have had no down time (or at least have not noticed any), and I feel in control and happy. No longer am I at the mercy of shared hosts 
If your interested, I chose ServInt as my provider as they offered a great deal, as well as being a managed service (so I’m not on my own if I screw things up). I was tempted by the bells and whistles of Media Temple, but felt the ServInt service was better value.
Download Monitor has received some more love and has been updated. Here’s the change log from the new version:
If you have edited capabilities for download monitor user permissions, you’ll have to again sorry! This is because I named them too long. Also, you should check your forced downloads still work because there was a logic error meaning they may not have been forced after-all…
Enjoy.
Today I completed the update for the Wordpress Download Monitor Plugin – many tweaks, fixes, and features added. There were no changes to the database structure so people upgrading should be fine. Here is the list from the change log:
And yes, those category link bugs are fixed at long last, and you can edit category names finally. Phew!
