Wild Style

Top 10 Tips to a Great Web Page

By Jennifer Kyrnin, About.com

See More About:

blogging, blogger,blogspot,make money from blog

* beginning web design

* design theory

* building great web pages

blogging, blogger,blogspot,make money from blog

Make Your Site Valuable to Your Readers

There aren’t any magic pills to create a great Web page that everyone will visit again and again, but if you follow these ten tips your site will be more popular and easier for people to read.

1. Know your audience, and keep them in mind when you write.

If your Web pages are frequented by people with slower modems then designing a page that looks best over a T1 is not a successful strategy.

blogging, blogger,blogspot,make money from blog

2. Keep your pages short.

If you minimize the scrolling, chances are, your readers will get your message. A good screen size is 640 pixels wide by 480 tall.

More Info

3. Use tables of contents.

According to Jakob Nielsen only 10% of users will scroll beyond the first screen of text. If that first screen has a table of contents viewers will click on the links to the explanatory text.

More Info

4. Keep images small.

Large images annoy people. If it takes too long to download, many people will never see it, as they will have browsed somewhere.

More Info

5. Use Web colors.

The browser-safe color palette will ensure that most people will see your page and images in the colors you intended.

More Info

6. Avoid lots of text.

People don’t read the Web, they skim it.

More Info

7. Check your spelling.

Use a spell checker, either in your editor or on-line.

More Info

8. Keep links current.

Check your links often to make sure they are still valid. Using a link checker speeds up pages with many links.

More Info

9. Annotate your links.

If a page is good enough to link to, then it’s good enough to explain why you like it.

More Info

10. Put contact information on your pages.

The Web is interactive and dynamic, and you should welcome comments on your pages. Also, if there is a broken link or other problem, your readers can let you know, easily.

More Info

More Tips from You

Are there other tips that people should know about how to design a great Web page? Why not post them to the forum and let us all know about them.

Related Guide Picks

10 Tips for Good Web WritingHow to Drive Away Your Readers

Modifying Fonts In Dreamweaver Using HTML & CSS

Like most WYSWYG (What You See Is What You Get) HTML editors, Dreamweaver has the ability to simply highlight text and change the font, color etc…

But there are two distinct ways that you can alter text: HTML and CSS (Cascading Style Sheets).

In Dreamweaver, these 2 methods get mixed together sometimes, and it can be a bit confusing as to which method you are using.

On the one hand, if you choose the CSS option, Dreamweaver will create some CSS definitions at the top of your webpage. The CSS definition at the top of the page might look like:

And the text that you highlight in the page might have code that looks like:

light blue text

There is also the option to use tradtional HTML to change fonts and colors:

The code that created the above text might look like:

Like this

So which one should you use and how should you choose whether to use HTML or CSS?

CSS is wonderful does have it’s uses, and some people may prefer to use it all the time, but I prefer to use it in select instances where it is decidedly the best option.

To change your HTML/CSS preferences, go to:

Edit > Preferences in Dreamweaver

And then check or uncheck the use CSS instead of HTML tags box depending on which option you want.

I also recommend using external CSS style sheets on your websites. Dreamweaver makes it easy, and using an external sheet, you can update the style of thousands of webpages in seconds.

To learn more about Dreamweaver and CSS, visit http://www.dreamweaverhowto.com

Technology is constantly evolving and advancing and nothing shows this more than the (short) history of the web.  Just a few years ago, the internet was full of websites with blinking, animated icons and background midi music and lots of people thought it was really great.  Advance a few years forward and, although you still see those things from time to time, the web now contains much more sophisticated elements like video clips, rss feeds, detailed flash animations, and more.   

As the “ideas” about what a website is and what it should, or could, do for a company have also evolved, designers have strived to streamline the process of developing websites and to make them more efficient and predictable.  Because different browsers interpret code differently, it hasn’t always been easy to make more complex websites look the same (or even good in some cases) across browsers and systems. What used to work in the early days of the web was no longer working the way web designers wanted or needed it to.

Cascading Style Sheets to the Rescue

Cascading Style Sheets, also known as CSS, were introduced to improve the capabilities of web presentation.  Prior to CSS, almost all of the html attributes that made up the “look and feel” of a web page were contained within the html directly. This made web page code heavy and often quite clunky.  By using Cascading Style Sheets, designers could separate the design elements from the content of a web page and thereby make the pages more efficient, more streamlined, and easier to maintain.

Not all designers jumped on the CSS bandwagon, and even today, many designers still prefer to layout their web pages using html table-based design, the way just about everyone used to do it. Using CSS to layout a webpage is quite different from the “old fashioned” table layout.   However, the advantages to using a CSS layout for a web page heavily outweigh any argument given for using html tables.  

Although I wouldn’t expect clients to know the intricate details of Cascading Style Sheets (and let’s face it, most clients don’t really want to know much if anything about it!), I do think that clients should be aware of the advantages of using CSS layouts and how they can enhance their websites both now and in the future.

Advantages to Using CSS for Web Layout

Web pages will load faster

No one likes waiting for web pages to load and if a page takes too long to load, many users will often simply leave.  Generally speaking, CSS based page layouts require much less html coding than table-based layouts.  This usually results in the pages loading more quickly.  Moreover, an externally linked CSS file, once loaded the first time, does not have to be reloaded and re-read on every page.  When using CSS for layout, browsers can cache (keep in memory) all the formatting and stylizing for your pages instead of having to read and interpret each style tag on every page. This can also result in much faster page loading times.

Visual consistency across pages

One of the strengths of using Cascading Style Sheets in a website layout is that design elements can be defined in a single place (the css file) and will automatically be applied to those elements on the website.  No longer does each individual page have to be updated to reflect the new style.  This makes for much greater consistency throughout the site.  With CSS, you do not have to re-code every element on every page (and check and double check that you didn’t miss some pages!), styling updates are automatic and site-wide.

Accessibility and usability

CSS allows for more interactive style elements, including font size and line heights, which can make web pages more usable for people with disabilities.  Web pages that use CSS layouts are also often more compatible with more browsers.  What’s more, designers can create specific css files specifically for printing, or mobile devices, as well as the standard computer screen, thereby making websites truly multimedia applications.

CSS is better for SEO

Since pages load faster with CSS Layouts, search engines can more easily crawl through the site.  Also, since there is often less coding on the pages and because CSS separates the design elements from the content, it is easier for search engines to determine what a page is about and to index it appropriately.  Finally, search engine spiders rely heavily on structural organization (heading (h1, h2, h3, etc) tags) and CSS allows designers to design those elements as needed and to place them within the page layout in a way that is most beneficial for search engine optimization.



Future redesigns will be more efficient (read, less expensive!)

Since CSS layouts separate design elements from content, once a site has been designed using Cascading Style Sheets, making changes to the design is often easier because fewer files need to be updated (often only the css files rather than every page on the website!)  This makes for faster and less expensive design changes in the future.  Set your site up using CSS now and you can have easier, more efficient and quicker updates in the future.