Archive for November, 2011

Exciting New Features in CSS3

Monday, November 28th, 2011

Cascading Style Sheets (CSS) is a style sheet language used to describe the look and formatting of website. The earliest drafts for CSS3, the newest version of CSS, were published in June 1999 but even today most browsers only partially support CSS3. Because not all browsers support CSS3 yet, developers still have to do some work-arounds to make sites look the same in all browsers, but there are some pretty neat things in the newest implementation of CSS that will really give developers more artistic freedom, as well as increase load time and improve user experience. Here are just a few new style rules implemented in CSS3.

Multiple Background Images

Oh, how many times have I wished I could apply multiple backgrounds to one element, rather than putting a div inside another div just to layer backgrounds!  Multiple backgrounds can be created using the normal background-image style and comma-separating background images:

background-image: url(image1.jpg), url(image2.jpg);

Image1.jpg will be the top background image, image2.jpg will be the bottom background image. Those backgrounds can then be positioned using background-position and comma separating their positions:

background-position: left top, right bottom;

Rounded Corners

In the old days, any elements designed to have rounded corners had to have a background image with rounded corners to make it look right.  This was a real pain with tabbed navigation.  You’d have to put one background behind the anchor and one background behind the list item, or just make each tab its own image, which wasn’t a very dynamic option. In CSS3, there is a new style element called border-radius.  Just specify the radius of the 4 corners of your box and watch the magic happen:

border-radius: 10px 5px 8px 15px;

The numbers correspond to (in order) top-left, top-right, bottom-right, bottom-left.

Drop Shadows

A step in the right direction, but not completely where I’d like it to be, the new box-shadow style allows block-level elements to create a drop shadow. Where this falls short is if you have, say a PNG image and put a box-shadow style on it. Rather than putting a shadow of the image below the image, as a normal drop shadow does, it will put a drop shadow around the box the image is in. Hopefully, in the future this will be addressed.  To use box-shadow, specify the distance on the x-axis, then the y-axis, then the amount of blur, then the shadow color:

box-shadow: 10px 5px 8px #333;

Text Shadows

Self explanatory: generates a drop-shadow behind text.  Text shadows are created using the text-shadow style and specifying the distance on the x-axis, then the y-axis, then the amount of blur, then the shadow color:

text-shadow: 10px 5px 8px #333;

Opacity

This new style rule in CSS3 can make an element’s opacity anywhere from completely visible to completely invisible.  This can make for some interesting Web 2.0 looks. To use the opacity rule, simple define the percentage of visibility you want the item to have in a decimal point (i.e. .5 is 50%):

opacity:  .35;

What I would like to see now is a background-opacity rule rather than using RGBA values.

What About You?

These are only some of the new rules implemented in CSS3, there are plenty of other new style rules in the web developers toolbelt. Now, we just need the browsers to support all of the rules… Check out http://www.css3.info/ for more CSS3 news and info.

But what do you think about CSS3? Have you ever used it or thought about using the new style rules? Do you agree about these rules or think they should work differently? Are you curious to know more? Let us know in the comments!

Ryan Camomile

Established in 1998 and based in Orem, Utah, Infogenix was built from the ground up to be a different kind of web company. Rather than simply creating a website, Infogenix focuses on the whole of Internet presence, including managing, marketing, and advertising.

More Posts - Website

Follow Me:
TwitterLinkedInGoogle Plus

Tech Support: I Don’t Understand You

Monday, November 21st, 2011

I used to work tech support with my brother back in the days when the internet was just born. We supported a dial up internet service (this was before DSL came out) and I remember receiving a lot of calls where people would ask me how to type a capital letter or help them fix their ‘TV” (by which they meant their computer). One call, though, stood out more than any other. My brother took this call and even though this was over twelve years ago, I still remember how many heads were shaking after this call.

Did That Need to be Plugged In?

It started off innocently. A woman called and said she couldn’t connect to the internet. My brother asked a few basic questions and determined that the problem was that her computer wasn’t properly connected to a phone line. My brother asked her to make sure the phone was connected. She said it was connected. He asked: is it plugged into the wall? She confirmed, again, that it was hooked up. They spent forty-five minutes reinstalling everything short of the operating system, unplugging and reconnecting both ends of the phone line, and making sure the phone had a dial tone. Finally, out of sheer frustration, my brother asked her to physically follow the cord from the computer to the wall, thinking that maybe the phone cord was damaged somewhere. When she made it to the end, he asked her what she saw. Her reply: “I see my phone cord taped to the wall.”

While it is easy to quickly assume that the woman was not competent enough to own a computer or that my brother should have been more clear, the truth is that there’s a wide disconnect between how a regular computer user thinks and how an experienced computer user thinks. The gulf between a programmer and your grandmother can seem like an impossible language barrier, but it doesn’t have to be.

Tech Support

Tech Support Tips

Here are a few simple tips for helping you help technical support to fix your problems:

  1. Give information. The more information tech support has, the better off everyone is. If you see something that doesn’t work the way you think it should, play with it see how you can make it happen again. If you can’t make it happen again, write down what you were doing when you saw it happen and any words you remember being on the page. Screen shots are a huge help if you know how to do it. The web address of the page with the problem is gold.
  2. Read the errors. Technical words can seem like a jumble of gibberish more often than not. IE6 JS console anyone? But even if those errors seem to be completely random letters strung together, they can be a solid compass in the right hands. The more words of the error you can relate to tech support, the faster they can fix it, in most cases.
  3. Be clear. A lot of people want to hear an apology up front for something being broken, but computers don’t care about feelings. So, if your interest is to get something fixed, leave feelings out of it at first and stick to the facts and the numbers. Once you’ve given tech support the data and answered any other questions that they might ask, give them a chance to pass it off to a person who will work on it. Then, you can let them know how you feel. Just remember, tech support agents are people, too.
  4. Be patient. Personally, I hate it when I can’t get something fixed quickly because I know problems with a web site can mean a lot of lost money for clients. Most tech support agents try hard to fix issues as soon as possible because it reflects directly on their company, especially in this customer service-based world, so please believe us when we say that we really do want to fix your problems for you.

Most of these tips are pretty straight forward but in the heat of the moment, they can be hard to remember. But try these things they next time and see how it effects the process. Clear communication can cut hours off the time spent finding problems before anyone can start fixing it.

What About You?

What do you think? Have you had any terrible tech support experiences, from either end? What are some other tips that you’ve found useful for communicating with tech support agents?

Ryan Camomile

Established in 1998 and based in Orem, Utah, Infogenix was built from the ground up to be a different kind of web company. Rather than simply creating a website, Infogenix focuses on the whole of Internet presence, including managing, marketing, and advertising.

More Posts - Website

Follow Me:
TwitterLinkedInGoogle Plus