Silver Cell Internet Services Blog

Firefox has long been my web browser of choice both for general surfing, and also for web design testing. It has good CSS support and its add-ons make it an indispensable tool for any web designer. Here are some of the best ones:

1. IE View - Puts a handy link in the context menu which opens the current page in Internet Explorer.
2. Opera View - Same deal, except it opens in Opera.
3. Aardvark - A great tool which shows you how the page is constructed as you hover the pointer over the elements on the page.
4. Colorzilla - Pick colours off any web page with this handy eyedropper tool.
5. HTML Validator - A must for today’s designers, you can see an icon in the toolbar which tells you whether your page is valid XHTML or not, and if not, you can click on it and it will give you a list of errors for you to sort out.
6. Lorem Ipsum Content Generator - When you’re designing those mockup pages, you’ll need some dummy text to go in the content area. This add-on lets you specify how many words you need and copy it straight to your clipboard.
7. MeasureIt - A draggable ruler which lets you measure the size in pixels of any page element.
8. WebDeveloper - The must have add-on. An entire toolbar of handy design and development tools, including the ability to view the current page’s CSS file directly, disable images and javascript, resize the viewing window and more.

So that’s just 8 reasons why you should ditch IE if you haven’t already, and start taking advantage of what Firefox has to offer.

As well as our regular web design service, we are now offering a design slicing service, for people who already have a finished design, but don’t have the time or the expertise to convert the design to valid XHTML.

The service is ideal for web design agencies, who specialise in innovative design, and need someone to turn their creations into websites, or even for individuals who are proficient in Photoshop, but not too clever at coding up valid, W3C compliant CSS and XHTML.

All we need is a .PSD or .PNG version of your design, any non-standard fonts you have used, and details of any rollover states or other special information, and we will slice up the design and convert it into table-less XHTML and CSS markup. We offer a 5-day turnaround, or a special 3-day service if you need the files in a hurry.

All of our code is valid XHTML 1.0 Transitional, cross-browser compliant, and we don’t use tables for layout.

Prices start at just £140. See our design slicing page for Frequently asked questions and an order form.

For those of you who work with (or have heard of) Cascading Style Sheets, CSS3 is the next big thing. Many of you will be all too familiar with the problems encountered in designing a web page with CSS, and no doubt you have spent countless hours implementing hacks and workarounds in an attempt to make your design display correctly across all browsers. CSS3 aims to make your life easier, with a whole host of new features that will reduce the amount of time and effort spent coding. But it’s not going to happen all at once. The main difference with CSS3 is that it is modular, with each module being developed separately, and thus reaching Recommendation level at different times. In this way, browsers can implement new features of CSS3 gradually, as well as omitting modules which they don’t need. Here’s an overview of some of the handiest modules we can expect to use in the future:

• border-radius - Everyone loves boxes with rounded corners, but until now the only way to achieve the effect was with background images or tons of complex CSS border trickery. With border-radius you simply specify the radius in pixels and there you have it, rounded corners. You can even specify the radius for each corner individually.
• box-shadow - make your boxes stand out without the need for background images.
• Multiple background images - Get rid of all those nested div tags, now you can put as many background images as you want on a single element.
• text-shadow - you no longer need images to create fancy-looking drop-shadows on text.
• box-sizing - tired of the box-model. Make boxes behave the way you want by specifying that they should add border and padding inside the specified box width.
• media queries - automatically display a different stylesheet based on the media used to view the page. Ideal for sites intended for mobile browsers.
• multi-column layout - forget those pesky floats, arrange your content in columns with some simple CSS.

These are just a few of the most exciting modules we can expect to see more of in the coming months and years. Currently none of the modules have reached Recommendation level, and very few of them are supported in most current browsers, but we can expect to see more and more of these features in future browser releases. Safari already supports most of the ones I’ve mentioned above, and the other browsers are catching up slowly but surely. True, it will probably be years before all of the CSS3 modules are supported across all browsers, and even then we’ll still need to consider the users stuck in the dark ages of IE7 (or even - God forbid - IE6!), but for now it’s fun to experiment with the new features, and think about what the future holds for CSS web designers.

Welcome to the Silver Cell Internet Services Blog. This is where you will find news, articles, and tutorials related to the services we offer, including CSS tutorials, Photoshop and Fireworks hints and tips, and whatever else we feel like writing about!