Archive for the ‘Web Development’ Category

RSS Cron Job

Monday, December 14th, 2009
Posted in Web Development · Tags: ,

If you are on shared web host, you might not have the ability to run lots of cron jobs or be limited to a certain number per hour or day. You might know about the “Poor Man’s Cron Job”, which is basically not to run a task (usually caching some data or fetching a feed, api, etc.) in the background until someone visits a page. Which isn’t ideal, because often the page will be slow or sometimes it won’t be up to date until the second visit (if you run that task after outputting the cached data).

Well one way to get around this is to setup an RSS feed for the data you are caching or outputting and access it with a query string such as “?rss=2.0″ or http://example.com/index.php?rss=2.0. Then you can check to see if the RSS variable was passed and output a RSS feed with just enough data for a feed, no need to put sensitive data in there or anything. I would suggest putting in a ttl node in the RSS feed and set it to something the aggregators like Google Reader, should obey (that way they hit your page more or less frequently, depending on your needs). The item portion of an RSS feed only needs a title or a description, although its probably a good idea to put some kind of guid in there (check the RSS 2.0 spec for more info on creating RSS feeds).

Anyway here is some sample code. It isn’t complete but gives you an idea what I mean.

if ($_GET['rss'] == 2.0)
{
//create RSS 2.0 feed
header('Content-Type: text/xml');
$output = '<' . '?xml version="1.0"?' . '>' . "\n";
$output .= '<rss version="2.0">' . "\n";
$output .= '<channel>' . "\n";
//...
//process your data and output it into RSS 2.0 format
//...
$output .= '</channel>' . "\n";
$output .= '</rss>';
}
else
{
//process your data as normal
}

Then to make sure the page is hit often, place your RSS feed into Google Reader or Bloglines or some other RSS aggregator. Then your site will be visited often and forced to update. No one else really needs to know about your RSS feeds, unless you want them to be public as well.

CSS3 Validation Debate Reponse

Tuesday, September 1st, 2009
Posted in Web Development · Tags:

There is a post on CSS3.info, The Big CSS3 Validation Debate where I left a comment I figured I’d make into a post here. It’s about how adding CSS3 rules to your style sheet result in errors with validation and what we think the W3C should do about it. Anyway, my response is below (edited, because I pressed submit too soon). :P


No need to have the W3C mess with their validator just to work with all the possible browser extensions. This would most likely introduce bugs and cause too much of a headache for them.

Here are 2 things you can do to get by the errors

  1. Put all your CSS3 rules in a css3.css file and then when you validate everything in your regular .css files should pass and the css3.css should fail.
  2. Or put a /*CSS3*/ comment for each CSS3 rule you have in your style sheet, so when it gives an error you know why. This would work best if you put each css3 rule on a separate line.

Test in IE6 for Real

Friday, September 26th, 2008
Posted in Software, Web Development · Tags: ,

I’ve seen others test out websites in IETester and IE Tab but these tools aren’t always 100% accurate. For instance you might forget to account for the Eolas bug that will not show up with IE Tab. Also IE6 sometimes does a shift and flicker when it’s rendering up a page, which IE Tester will not do, thus the page will look off in IE Tester but not in the real deal.

In my opinion it’s best to use the free virtual machines that Microsoft has for IE6, IE7 and IE8 beta 2. A few are on XP and another is on Vista, I recommend the XP versions, since they are smaller in filesize and will run much faster. The Virtual Machines expire after a few months, but so far Microsoft has been continuing to make new ones for free.

Then you need to get Virtual PC 2007 or if you’re on Windows 2000 you can use Virtual PC 2004 SP1, both of which are free.

Converting them for use on VMware products is easy, but you do need Virtual PC to create the *.vmc file (this holds the configuration). Once you have the vmc file you need to place it in the same folder as the vhd file and then you can use VMware Converter to convert it into a virtual machine you can use in VMware Player or VMware Server, which are all free products.

Of course you could always setup an old Windows 2000 machine, since the last version of Internet Explorer it can run is IE6. And if you are stuck on a Windows 2000 machine, you could always use these virtual machines and install Chrome or Safari, since neither work on Windows 2000. However, I wouldn’t spend too much time configuring the free virtual machines though, since they expire every few months.

Maintenence of Quality

Wednesday, September 10th, 2008
Posted in Web Development

Remember the last website you launched for a client? The design was clean and looked awesome, that is until they got a hold of the CMS. Even if you clean up any code they dump into the site, the quality can still go downhill overtime. For instance, maybe they like using all caps for titles, huge blocks of bold or italics text or they upload fuzzy pictures. It’s rare to see a huge site that can maintain its quality over time without having to redesign it again, unless there are some strict limits on what goes in certain fields. We’ve all seen sites that launch with an impressive design, then over the next 3 years they tack on more and more features without any real thought to how best to place or present that information. Overtime the site becomes jumbled, bloated and its time to redo it again.

Financial situations may pressure you to squeeze in another ad or your web stats prove video is hot, so the powers that be require you to have a video widget on the page. Another department requires you have a link to their content above the fold or someplace prominent with a icon or hideous color. People that use CMSes can’t see how the information looks as they enter it or if it’s consistent with the rest of the site, afterall most admins screens are rather plain. Thus, content that wasn’t originally planned or laid out in the initial design just gets dumped in.

So, what can you do?

  • Filter out CSS and HTML (although sometimes people need the ability to create tables, or put in some YouTube code). You could possibly allow a few tags and then filter out the rest but be sure to remove style attributes.
  • Setup your CSS to try to override any possible color or font changes (nothing is worse than having a site all in Verdana and then someone dumping in font tags using Lucida Handwriting or big ugly blocks of bold red text).
  • Make rules or guidelines for entering data into your site.
  • Suggest to users they should not use all uppercase for titles, let them know that CSS can transform the text for them (that way you if you redesign later you won’t have some titles in uppercase and others not so).
  • Suggest alternatives to the bright yellow background colored box they want for video player.
  • Add a Preview feature that shows them exactly what the data will look like on the live site.
  • Check the dimensions and filesize of any images uploaded (resize and save them with backend code like PHP if possible or do the alternative with nasty HTML squashing and force them to be a certain size with the height and width attributes).
  • Be sure they know any images that are uploaded need to look crisp (any really dark, red tinted, or blurry photos can make a good site look bad very quickly).

CSS Blockquotes

Tuesday, September 9th, 2008
Posted in Web Development · Tags: , ,

I figured I’d share two ways I’ve done blockquotes on this site.
Here is the HTML being used

<blockquote><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas sit amet quam. Sed quis justo scelerisque dui iaculis euismod. Nunc sit amet lectus ac orci placerat pulvinar?</p></blockquote>

The first is from the original design the site had.
old blockquote

In this one I just use 2 images for the quotes, but no extra div for the closing quote, because I use the last-child pseudo-class.


blockquote {
margin:1.5em;
padding:5px 40px;
border-top:1px solid #eee;
border-bottom:1px solid #eee;
background:url(images/quotation_marks.gif) no-repeat left 5px;
color:#717f53;
min-height:30px;
}
blockquote p:last-child {background:url(images/quotation_marks_close.gif) no-repeat right bottom;}/*css3*/


The second is the one I use on the site right now. Instead of using images, I just use the css content property and set the value to open-quote for the before pseudo-class and close-quote for the after pseudo-class. I also add css rounded corners for some extra styling.


blockquote p {
padding:10px;
margin:10px;
}
blockquote:before, blockquote:after {
display:block;
cursor:default;
line-height:1em;
font-weight:bold;
font-size:1.6em;
color:#000;
font-family:Georgia, 'Times New Roman', serif;
}
blockquote:before {
content:open-quote;
}
blockquote:after {
text-align:right;
content:close-quote;
}
blockquote {
margin:20px;
padding:10px;
border:1px solid #eee;
line-height:1.4em;
color:#918e95;
-moz-border-radius:5px; -webkit-border-radius:5px;/*css3 rounded corners*/
}

This CSS may not work in older-browsers, but if the blockquote is indented with a border or set to another color, it should stand out enough to be ok.