Embed images in stylesheets

by Mads Kristensen 22. December 2009 22:24

I wanted to try something new this time, so I recorded my blog post as a screencast. Since I mostly write about code I thought it might be a good way to illustrate it in a video instead of in writing. It does add a new level of simplicity and understanding to the message. Please check it out and tell me if you like the video more than a regular blog post.

I hope the video illustrates just how easy it is to embed images in stylesheets and also how to use the online tool for image to base64 conversion.

* Only $4.95/month ASP.NET & Windows 2008 + IIS 7 Hosting! FREE SQL Included

Tags: , , ,

Client-side | Videos

Comments

12/22/2009 11:09:27 PM #

pingback

Pingback from topsy.com

Twitter Trackbacks for
        
        Embed images in stylesheets
        [madskristensen.net]
        on Topsy.com

topsy.com |

12/22/2009 11:37:05 PM #

Anthony Grace

Video was very helpful, keep it up! Smile

Anthony Grace United States |

12/22/2009 11:43:18 PM #

Brian Swanson

Like the video, but I have to say your resolution is too high for a screen cast.  As you are going through the demonstration and highlighting lines of code, it's difficult to understand what's in those lines of code unless you spoke about it.

Brian Swanson United States |

12/22/2009 11:51:05 PM #

Mads Kristensen

Good point. I'll remember that for the next one

Mads Kristensen United States |

12/23/2009 10:53:29 AM #

Remy

Personally I'm not soo much a fan of Video's. They don't give you the possibilites to quickly glance over something or have a look at the summary/result.

Remy Switzerland |

12/23/2009 1:36:38 PM #

Mads Kristensen

Would you think it was better to combine video and regular writing or keep just the writing?

Mads Kristensen Denmark |

12/23/2009 2:07:59 PM #

Remy

Personally for me, the writing and a few pictures are enough. I almost never look at videos. But maybe that is just me...

Remy Switzerland |

12/23/2009 3:04:16 PM #

Guy

Not a big fan of video posts at all.

i want to look at a post and pick out the things i like/need

big NO from me.

Guy United Kingdom |

12/23/2009 4:58:29 PM #

Gokhan

I would prefer simple text. It's indexable by search engines. You can easily fix it if there's a typo, improvement, changes etc. I can skim through with my eyes. Resolution is my preferred resolution, not your choice during the recording. It's friendly to people with disabilities. So on so forth.

All are IMHO, though.

For example, I can't turn on the sound ATM and text is too small. Although I get how it's done, so I couldn't get the the full trick. I'm now going to google it to find an article in text Smile

Gokhan Turkey |

12/23/2009 5:22:18 PM #

Grasshopper

I like the video.
My comments on the actual technical part is that it looked like to me your total request time went up even though you had fewer requests.  is that within the normal request latency variation, or an actual difference based on the bigger CSS file?

Grasshopper United States |

12/23/2009 5:53:51 PM #

Remy

To get back to the technical discussion.
There is an intersting acticle about the performance of Data URI's on Ajaxian:
ajaxian.com/archives/performance-of-data-uris

Remy Switzerland |

12/24/2009 6:25:15 AM #

Jay Cee

Mads,

Your articles are among the best on the net,  but I only watch video when I really HAVE to ...... text for technical articles is IMHO far superior.

Video/Podcasts are simply too time consuming and too "immersive" ... you MUST concentrate on them rather than "skip-read" and refer to other articles etc.

Jay Cee United Kingdom |

12/24/2009 3:26:19 PM #

Tom

I think most people in general do not watch videos and would prefer to just see some pics.. however I did not know how to embed images ... so i watched the video Smile

Tom United States |

12/25/2009 1:53:35 AM #

Semicton

Thanks for the video.  I like videos when I am learning something that I am not very familiar with.  I think text and video would be great.

Semicton United States |

12/26/2009 6:44:38 AM #

Sikat ang Pinoy

I think it will be more effective if you can provide a caption/subtitle on the video. Now regarding the conversion of image to base64, is there a limit in size of image in converting using the tool?

Sikat ang Pinoy Republic of the Philippines |

12/27/2009 12:34:39 PM #

RS

I like text, which is useful than video

RS India |

12/27/2009 2:59:11 PM #

Peter

Interesting video. I think 6 minutes is a long time. Add a time structure as a sort of content page of a book. Would help viewers.

Peter Netherlands |

12/30/2009 5:49:05 PM #

Ahmad Masykur

Nice info. The video is helpful to undershand what is you want to deliver instead of regular text. Video is more understandable than regular text for person that not good enough of knowing the English language like me. The disadvantages of video are require huge bandwidth to viewing smoothly. This is not suitable for most Internet users in my country with low bandwidth Internet access.

Ahmad Masykur Indonesia |

1/1/2010 5:34:50 PM #

Yopi

I only watch video when I really have to. Too many time and bandwidth consuming

Yopi Indonesia |

1/3/2010 11:37:11 PM #

pbhj

screencast-o-matic is cool but this info would be better passed on textually IMO. Thanks for the tip though - I'd used base64 before for putting images in the microformat address data as on http://www.barefoot-ceramics.co.uk - but never direct in a CSS file.

pbhj United Kingdom |

Comments are closed

About the slave

Mads Kristensen Mads Kristensen
Web developer at ZYB and founder of BlogEngine.NET. More...

LinkedIn ZYB Facebook Last.fm Twitter View Mads Kristensen's profile on Technorati

The Lounge

Disclaimer

The opinions expressed herein are my own personal opinions and do not represent my employer's view in anyway.

© Copyright 2008