CSS: Keep Your Content and Design Distinct

Simplfy Site Changes With CSS

Web sites are constructed using a simple computer code called HTML which stands for hyper-text mark-up language. HTML forms the backbone of the world wide web, providing the underlying infrastructure of the millions of web sites that occupy the digital landscape. HTML is simple to learn and implement, which is one reason it’s the W3 standard. However, HTML has a couple of significant drawbacks.

First, it’s cumbersome. It requires a great deal of hand coding which is very expensive compared to automated coding.

Second, HTML lacks flexibility. Elements of design, images, charts and other common web site features have to be positioned using HTML code – on every page, even if the layout stays the same.

Finally, HTML isn’t very efficient. So, if you have a site on which content changes often, as in the “sale of the day,” you or some HTML coder has to go into the HTML code to make those changes in content every day.

To address these and other HTML limitations, Cascading Style Sheets (CSS) were devised to supplement the still-standard HTML code.

CSS is intended to increase flexibility of design, make sites more user-friendly by making them much faster and customizable and, finally, CSS eliminates repetitive and pricey hand-coding, making it much less expensive to get a professional-looking site up and running. Okay, not anybody can do it, but if you have some facility with site design and construction you can employ CSS to simplify the structure of the site.

Content and Design
Every page of a web site is comprised of two elements: content and design. Content is usually presented as text but content also includes pictures and other images that are a part of “telling your story.”

The other aspect of any web page is design – how the content is actually laid out on any given page. Design includes such basics as where to position product text near a product picture (under, over, to the side, surrounding) to the motif selected for everything from background color to buttons to navigation bar.

If you think of these as two distinct elements of a web page you’ll more clearly understand the value of CSS. Using CSS, design elements are kept in a separate file, apart from content. The benefits are immediate and significant.

Design It Once
Using stand-alone HTML requires that every page be constructed (coded) with both content and elements of design being hand placed by the code writer. No problem if your site is a few pages, but what if you’ve got hundreds or thousands of pages. Having to hand code each one of those pages would be costly in the extreme because it would take so long.

Using CSS, the designer codes all design elements one time. This is the background color, these are the colors of this header, this is the size of this button – all elements of design are placed in a single, CSS file.

Then, the coder can simply reference that CSS file to apply that design to whatever pages use it. Think of Amazon.com’s product pages – all basically the same layout. The content changes, of course, but the product pix are always in the same position, product description, reviews, etc. are always in the same place. Prior to the development of CSS, each of those pages required some hand coding in addition to a lot of cutting and pasting from blocks of HTML code.

Today, a designer can make any number of CSS and reference each site page to the appropriate style sheet. Design it once, then change the content as needed.

The Many, Mighty Benefits of CSS

First, let’s start with search engines. Spiders crawl pages of repetitious HTML code. It takes longer to spider a site and it’s more difficult for the spider to identify new content. With CSS, content and design are separate. So, a spider crawls the CSS file once then focuses on the site’s real purpose – the text that delivers the site’s message.

This elevates content to a new level since spiders are always looking for fresh content in assessing a site’s quality. Text is given more weight when design is relegated to a CSS file.

Second, download time is reduced anywhere from 20% to 80%. Why? Because instead of having to download dozens of pages of HTML design code, you now download a single CSS file with all design elements in one place. The text may be the same but downloads are much, much shorter, providing visitors with a better on-site experience.

CSS are more friendly to a variety of media – everything from cell phones and Blackberries to screen readers for the visually impaired who no longer have to sit through written descriptions of page graphics via an HTML tag.

CSS enables the visitor to design the site to his or her needs and/or preferences. Don’t like that type font? Click here for any easier one to read. In other words, by accessing different CSS, visitors can create screen settings that they like or need due to vision problems or just personal preferences.

Next, CSS cuts down on the costs of site design. Using CSS, programmers design it once and apply where desired. And remember, the designer can create as many CSS as required so there are no design limitations. In the same vein, updating a site is much less costly – very important to sites that sell a lot of different products with constantly changing inventory.

Finally, a site owner can easily create printer-friendly versions of all pages by creating a text only CSS. Very useful in sites that provide a great deal of hard content or print out invoices.

What Should I Do?
If you haven’t started the design of your site, go with CSS programming all the way. There are lots of on-line tutorials and many web hosts provide CSS software for easy style sheet creation.

If your site is already up and running, consider taking the time and/or incurring the expense of converting to CSS. Any one of the benefits listed above should be enough to motivate you but if not, how’s this: your competitors have already converted to CSS or soon will be. You’ll be the last black & white TV on the cyber block.

Faster downloads, user-customized pages, lower design and maintenance costs, easier reading by spiders, much less hand coding and flashier, more professional-looking sites. Those are the benefits of using cascading style sheets.

So, what are you waiting for? Go CSS and make your site more attractive, more visitor-friendly and much, much cooler much, much faster.

Need some help pumping up your site’s performance? Yeah, it’s a headache. Give me a call. I’m the cure. Webwordslinger.

The Perfect Gift: A Web Site

 

The Pefect Gift: A Web Site

There’s one on every gift list. The one person for whom buying the right gift is an annual challenge. Mom. Dad. Uncle Fred. We’ve all got them. And another blue tie, or worse, the six-pack of tube socks, is just another way of saying, “I don’t have a clue what to get you.”

 

Well, how about a little piece of the world wide web? A domain name. It’s one gift that’s low-cost, practical, fun and won’t fall apart even if the kids play with it. And, it truly is the gift that keeps on giving.

The Cost
For a domain name to “exist,” it has to be registered. There are hundreds of on-line businesses that are domain registrars. Most often, registrars are web hosting companies (we’ll get to that in a minute) and can charge anywhere from $3 to $18 to register a domain name with the W3 domain name authorities. Go with the lowest-priced registrar you can find. A domain registration is a domain registration whether it costs $3.95 or $17.95 so don’t waste the money. In fact, do a Google on “web hosts” and do some comparison shopping before registering.

Picking a Domain Name
There are millions of web sites, which means there are millions of registered domain names because that’s what a domain name is all about – a web site. Amazon.com is a domain name you may have heard of. Youtube, Myspace and WebMD are other examples of domain names.

So, if you’re giving your brother a domain name for his birthday, choose a name that he’ll enjoy and appreciate. Be creative in developing a name that’s (1) available and (2) a reflection of the gift recipient.

Now, we’re all familiar with dot-coms, as in IBM.com and Google.com. The c-o-m stands for “company,” telling potential visitors that this is a commercial site. But today, there are many more options for domain name extensions including .net, .us, .name and plenty of others. This gives you many more domain options because if IBM.com is taken (it is) you might try IBM.net or IBM.us until you find a name that will please the individual who receives the gift.

Presentation is Everything
Create a card with the domain name displayed front and center. Or, wrap it up in its own box, or stick it in the box along with the new laptop. If your gift recipient isn’t computer savvy, s/he won’t have a clue what the gift is so, as needed, provide a little bit of explanation in your presentation package so the receiver is as excited as you are.

Now What?

You and/or the domain name owner are now poised to construct a web site. Since this is just for yucks (in most cases) go with a low-cost web host – a company that provides access to the world wide web for cheap. Also, look for a web host that provides a toolbox of web building tools free. The last thing you want is to go out and buy a $799 piece of site builder software, so go with a web host that provides all the tools you’ll need to design and launch a website.

Low-cost website hosting, with a pile of goodies, shouldn’t cost more than $7 a month – less than $100 a year. BTW, this might be a cost you add to your “gift” – a one-year subscription of web hosting. You get the best rates when you sign on for 12 months or longer.

Once you’ve selected a web host, it’s time to build a web site and, really, it’s something anybody can do. You don’t have to be a computer genius. You don’t even have to be a computer dummy.

Building the Website

Help or let the gift recipient handle things on his or her own. A child might need a little help but part of the fun of designing a web site (especially one given as a gift) is to personalize it and make it your own.

Actual site construction is done using templates – basic forms into which you add whatever information you want – your name, the family name, whatever – that’s what makes it your site.

Using pick-and-click templates, even the techno-impaired can build a web site in a few hours with a completely customized look. Hey, now you’ve taken your place in cyberspace. You have a digital identity.

Who Would Want a Domain Name?

Who wouldn’t? There are so many things you can do with a domain and a simple web site.

Grandparents would love a web site that allowed them to see their grandchildren living far away.

College students, for the most part computer savvy, can share their campus experiences with family and old friends.

Military families can stay in constant touch even half a world away. The site owner can post pictures of the new baby and post his or her own blog of daily events. Imagine how that would pick up the spirits of military personnel away from home – and very home sick. A personal or family website is almost like being there.

Kids can get very creative (probably more than adults) using today’s site building software. Just keep an eye on the child’s web site and never let the child post any family or identifying information. Pix for friends are fine but giving out the home phone number is definitely out of the question.

Who else would enjoy having their own websites? Any family with distant relatives. Small business owners. Artists, writers and poets looking to expose their works to the world. A not-for-profit organization, community organizations, town sports teams, service organizations – just about anyone could and would have fun as a web site owner.

So, forget the flying elbows at the mall and stop scratching your head about what to get Dad this year. The answer is simple – a little piece of cyberspace and just a spark of creativity.

Then watch what happens as a whole new world opens up for the lucky recipient of such a thoughtful and original gift.