Archive for CSS

Invalid Embedded YouTube Code… A Quick Fix!

January 1, 2013 CSS No comments

Alright this is simple, and probably common sense to some, but I thought it was worth a quick entry for anyone scratching their heads.

YouTube spits out this bit if you want to share or embed a video:

<iframe width="420" height="315" src="http://www.youtube.com/embed/RqbWdo536as?rel=0" frameborder="0" allowfullscreen></iframe>

Both the frameborder and allowfullscreen attributes are what make this code invalid according to the W3C.

<iframe src="http://www.youtube.com/embed/RqbWdo536as?rel=0" style="border:none;width:420px;height:315px;"></iframe>

Although I don’t recommend using inline styles (I recommend the style be placed in your stylesheet), by removing the two invalid attributes and using a style in its place I now have W3C valid code… AND I have better control over the iframe as well.  The allowfullscreen attribute does nothing since the full-screen button is in the play bar.  Notice I also moved the size of the iframe into the style as well.  With many videos on a page and a single stylesheet this method will end up saving you a lot of work anyhow.

Why YouTube doesn’t do this by default though goes beyond me.

Typekit vs. Google Fonts

May 11, 2012 CSS One comment

I think it’s been over five years since I blogged my last battle, ColdFusion vs. PHP.  Hopefully this post will be met with much less criticism.

It’s hard to be a developer and not be unaware of Typekit or Google Web Fonts.  Both services provide excellent alternatives to the standard fonts available and both services are now supported across all current browsers.  For those of us who attempted to build our own fonts for using @font-face on our own projects, these services are a dream come true as the process what tedious, cumbersome and didn’t always process the desired result.

First, lets do a quick comparison:

Typekit Google Web Fonts
Fonts 700+ 500+
Implementation JS JS, link, @import
Selection Quality Excellent OK
Finding Fonts Excellent Good
Cost Varies* FREE

Read more

Dreamweaver to CF Builder to Dreamweaver

May 5, 2012 ColdFusion, ColdFusion Builder, CSS, Dreamweaver 6 comments

So I’m a bit late to the party, but I had my reasons to not make the switch… namely my complete distaste for Eclipse (I’ve expressed this before).  I’m finding myself wanting more when I code cfscript, javascript and all that ajaxy stuff, so I finally forced myself to set aside my differences with Eclipse and approach CF Builder with an open and very clear mind.  I made the switch and started this article in October 2011 and just now wrapping it up after an in depth evaluation.

First, my work environment.

I have a live co-located server that hosts my final product.  I then have a separate development server in my home office which I use to create all my masterpieces.  I have a laptop which I’ve never really been comfortable coding with, but do use it from time to time.  And then there’s my crown jewel… my dual monitor workstation which I’m on nearly all day every day (would like to eventually add a third monitor).  The only reason I mention the dual monitors is that it’s imperative to my development… Dreamweaver CF Builder, Fireworks, Navicat & FlashFXP (all the development stuff) on the left and my browser is on the right (of course I test in every browser… no built-in rendering or troubleshooting tools needed for me), which I refresh as I go making sure I’m getting my desired outcome across all platforms.  And as I just mentioned, I use Navicat for all my SQL management (both Dreamweaver’s and Eclipse’s built-in SQL stuff is just laughable [and unnecessary]) and then FlashFXP for my FTP client (built-in FTP clients work fine… they just scare me.  I test over the local network and want to make sure I’m only uploading the final product, not risking overwriting anything important.).

Read more