Posts filed under 'Becoming Web Savvy'
CSS (Cascading Style Sheets) offer a way of keeping content and design elements separate. Because this separation allows us to include more meaningful content on each page, Web sites designed with CSS often provide their owners with significant advantages over Web sites designed with the older table based techniques.
Here are several of those benefits:
1. CSS (Cascading Style Sheets) with (X)HTML has become the new standard for professionally designed Web sites. Major media Web sites like ESPN, MSN and others have been redesigned using CSS. It’s time to move away from the clumsily overused hacks of table based Web design.
2. CSS with semantic (X)HTML is meaningful even when the design elements are not visible due to the use of an assistive device or a Web site visitor’s decision to disable style sheets.
In the early days, HTML was a simple document markup language that was ideally suited to structuring documents logically for easy comprehension. With the event of the World Wide Web, there was a popular demand for Web sites that paralleled what could be achieved with print media, and HTML was hacked and expanded to provide what the public demanded.
The most perplexing hack that has become a permanent feature of Web design is the use of tables to structure images and text on a page. This method of design renders the text presented to assistive devices almost meaningless as the continuity present to the visible eye is lost.
3. By focusing on HTML structure for meaning first and design second, a CSS designer can drastically reduce the superfluous markup created by the use of tables for design. This cleaner code can have a dramatic impact on search engine visibility. With increased search engine visibility, more of your Web site’s valuable content will be indexed and become searchable on major search engines like Google, MSN, and Yahoo!. Of course, this assumes that you’ve created Web content that people want to read.
4. Separating design and content with CSS and (X)HTML usually results in a more flexible design. If the designer correctly separates all design elements, such as background images used in the templates, most if not all of a Web site’s design can be altered by changing the images and CSS files in a single directory of the Web site. In the old days, this required the use of Dreamweaver templates, fancy find and replace techniques, and the repetitive work of checking each page of the Web site and tweaking each to fix bugs.
5. One of the reasons some large media Web sites have moved to CSS design is that the cleaner (X)HTML code is also lighter and faster to download. If a Web site has a large amount of traffic, this often results in a major reduction in server bandwidth use and a considerable cost savings.
6. CSS designs can allow text to be resized and flow with relative grace. It seems that designers who tend towards tables as a design tool also more often fix a text size that prevents browsers like Internet Explorer from changing its size. This comes from a fear that the design will break when text sizes are changed. All sites eventually break when text size changes drastically, but CSS is more able to handle flexible text sizes that allow readers to view text at a size with which they feel comfortable.
7. No More Font Tags! OK. You caught me, this is actually a continuation of Reason #4 but is so common that it deserves a separate treatment.
Imagine a Web site of thousands of pages in which each page has 3 or 4 different styles of typefaces and sizes. Each of these variants is set using an embedded font tag. The Web site owner decides to change typefaces, and the webmaster dutifully visits each Web page and adjusts the properties of every font tag on each page. If he or she is a skilled user of Dreamweaver or other WYSIWYG editor the edits may be possible using find and replace, however, it will still be difficult to pull off quickly and will require much time to visually verify that the correct changes have been made.
Now picture a Web site with content structured for meaning. Odds are that the font tags used in the previous example were inserted to create a visually coherent and meaningful presentation. Without them, everything on the page has an equal weight. Let’s replace all font tags with heading elements, paragraphs, strong text, emphasized text, and assign class names to anything like warning or alert text for which there is no stock HTML element. Now, our CSS document can assign typefaces (fonts) based on these elements, tags, and class names with complete understanding of their semantic importance in the Web page. Even better, the typefaces used can be change quickly, even in seconds, from one or more CSS files.
The second example has two benefits, ease of changing the typefaces (and all other design elements), and the added fringe benefit of a meaningfully structured, coherent HTML document that makes as much sense without design elements as it does with them.
November 20th, 2006
Hiring a freelance Web designer and getting good results is not a mystical process. Though many elements of a successful process may not be controllable, there is much you can do to insure a good return on your investment.
Many intelligent people simply don’t know how to hire a freelance Web designer. Those who hire freelance designers often make the following mistakes:
-
Getting started on a new Web site without setting a budget or setting a budget without measurable outcomes.
To avoid getting lost in cyberspace ask yourself:
- What will it take to make this project a success?
- What is this project worth to me?
-
Not planning your Web site around content; trusting aesthetics as a substitute.
To avoid a Web site with glamour and no substance ask yourself:
- What do I hope the new look of my Web site will help me achieve?
- How will my aesthetic choices help me achieve my goals?
-
Not considering search engine visibility and optimization (SEO).
To avoid an invisible Web site ask yourself:
- In what way will my new Web site be more visible to search engines than my old one?
- Have I researched keywords on Google and WordTracker. Have I written page titles, descriptions, and headings based on my findings?
-
Not monitoring your Web designer’s progress and budget expenditures.
To avoid overspending ask yourself:
- Will I get what I want if I don’t regularly monitor my new Web design and establish a reporting schedule for my freelance Web designer?
-
Choosing a Web designer based on price without considering quality workmanship and the designer’s track record.
To avoid hiring an unqualified designer ask yourself:
- Which is more affordable, a Web site that costs $500 but gets no results or a $5000 Web site that helps sell my products and services?
September 11th, 2006
Have you ever wondered how experts use Wordtracker to keep their clients’ sites at the top of the search engine results pages? What can you learn from their methods? How can you apply their strategies to your own website to get outstanding results?
read more | digg story
September 7th, 2006
The months of November and December account for at least 28% percent of retail sales and are also a peak web browsing and purchasing season. With this in mind, it pays to prepare for the increase in traffic the Christmas season will bring no matter the size of your Web site. Retailers are already gearing up for Christmas in late August, so you will be in good company as you prepare for the Holiday Season.
Content is the life-blood of an online business, so most of these tips will focus on your Web site’s content. Here are Seven Tips to help you bring your Web site up-to-date for the Christmas Season:
Monday. Proofread. You probably won’t like this very much, but you need to read every page on your Web site to make sure it accurately reflects your current product or service. What changes have you made to your business offerings lately? Nothing is more embarrassing or counter-productive than promoting a product you no longer carry or misrepresenting your product on your Web site. Trust is vital to the online exchange of services and products.
Tuesday. Remove Ambiguities. Think about questions clients, customers, and friends have asked about your business over the last year. What seems absolutely self-evident to you, but is misunderstood by others? If questions are coming at you from left field, it may be time to add a Frequently Asked Questions page or to update your existing page with clear answers to those not-so-self-evident questions!
Wednesday. Revive Your Web Site’s Look & Feel. Take new product photos and replace the old ones on your Web site. Liven up your pages with new graphics and stock photos as needed. Add a slideshow or flash presentation to your home page or other appropriate landing pages to grab the attention of more visitors.
Thursday. Learn from Competitors. Visit your the Web sites of your competitors and compatriots for new ideas regarding content you can add to create value for your customers and clients. Add New Content: Articles, White Papers, Tools, etc.
Friday. Research to Improve Your Search Engine Traffic. Put on your thinking cap. On a blank sheet of paper, write an unedited list of search terms that you think potential clients and customers might use to find your Web site. Concentrate on phrases in the two to three word range. Spend about 15 minutes searching Google for these phrases. Does your site come up on the first few pages? If not, don’t panic. Consider ways you might be able to add the phrases you consider most important to the HTML titles and body copy of a few relevant pages on your Web site.
Tip: A good place to get search term ideas is from your server logs. These record all visitors to your Web site and often specify search terms used to find your pages. This may spur you on towards finding additional related phrases that are not in use now.
For added effect, visit Wordtracker and purchase a low-cost daily subscription (Support me - find an affiliate link here) to research the keyphrase list you created. Find the most effective phrases. Concentrate your efforts on those.
Saturday. Evaluate the contact channels your Web site provides. Do your contact forms work? Is your email address clearly visible? Is your business address included in the footer of EVERY page? Is your telephone number available on every page?
Why should you be redundant with regard to contact information? Most Web site visitors these days come either from pay-per-lick advertising or search engine results pages. They are seeking highly targeted content and have a cynical distrust of Web only businesses. Showing your physical address and offline contact information on each page declares your location in geographic space as a real and accountable entity.
If you disagree with my reasoning above, at least include a prominent “contact” link on each page.
Sunday. Rest. Relax. Perhaps mull over in the back of your mind any promotions or events you can offer your customers and clients during the coming months. Find a piece of paper and write them down if you wish. Be completely non-judgmental. You’ll evaluate them later.
If this blog post left you wanting more, Harvey Ramer has also written a short e-Book called A No-Nonsense Guide to Creating Your Web Site Design Plan that you may find helpful.
September 7th, 2006
Over the past several years, I have noticed that many Web design clients do not understand how to take ownership of the design process and rarely think about how they will manage their Web site after it launches. Somehow, the new design is supposed to compensate for a Web site owner’s lack of vision. This list is one Web designer’s attempt to help you create a plan that will allow you to achieve some success attracting new visitors to your Web site, and making a positive impression once the new visitors arrive.
- Plan your content carefully before you think in detail about your Web site structure and aesthetics.
- Research competing and related niche sites to discover the content, Web site structure, and aesthetics representative of your industry.
- Determine your business objectives and set measurable goals for your new Web site. In as much detail as you can muster, record the ways in which your new Web site will help you achieve your goals.
- Your landing pages should reflect the ways in which your prospective customers will search for your service or product. Plan the content of these pages in relation to the complexity and number of your offerings. Use Wordtracker to discover key phrases that are likely to drive visitors to your Web site landing pages from search engines.
- Since no page is purely informational in a bottom-line business climate, decide carefully what you will ask your Web site visitors to do in response to the content your page offers. Find an appropriate way to ask your potential clients to respond.
- Articulate the first impression and emotional response your Web site should evoke. Who will your site visitors be, and why will they feel this way when they visit your site?
- What is the dominant type of content your Web site will feature? Will it be news items, archived documents, multimedia or sales copy. What ideas do you have about how the content can be structured for maximum comprehension and utility?
- What aesthetic preferences do you have? Why? Link typefaces, colors, and artwork specifications to the first impression and emotional responses you hope to evoke and the business goals they will help you achieve.
- Set your budget and communicate it clearly. If working with a limited budget, be prepared for trade-offs and be ready to prioritize goals and preferences.
- Discuss your communication preferences with your designer in advance. Do you want daily reports? Weekly? Will you want real-time access via telephone, instant messaging, and email? Do you need face-to-face meetings to feel comfortable with the process?
If this blog post left you wanting more, Harvey Ramer has also written a short e-Book called A No-Nonsense Guide to Creating Your Web Site Design Plan that you may find helpful.
August 17th, 2006
