Web Design Smart Tips:
- Never Delete a Webpage
- Links That Don't Look Like Links
- Shrink Image Sizes
- Design for the Smallest Screen Size
- Aid Those who Can't See Images
- Don't Ignore White Space
- Always Interlace your GIF(c) Images
|
|
|
Need help developing websites? Looking
for HTML tips and tricks? You've come to the right place.
We have many great web development tips revolving around
HTML, design, and more!
Web Smart Tips
Never Delete a Webpage
by Envision Programming
What's that you say? What if I have content that has changed
so drastically that it needs to be placed in another page?
What if I laid out my paths incorrectly and want to change
them? Should I not delete the old files?
Yes, and no. You should always update content, even if
it means moving text from one page to another. But never,
NEVER completely remove a webpage URL. When a web spider
(sent from places like AltaVista <http://www.altavsita.com>
and others) indexes your site, it will keep all of the
webpages on your site in its database. If you delete a
webpage on your server, that's fine and good, but InfoSeek
still references your page.
It looks VERY BAD for people to hit 404 not found errors
on your site, and you should do everything in your power
to keep this from happening. Therefore, instead of completely
deleting a file or subdirectory, replace the .HTM files
you were going to delete with a referrer page. Tell them
the page they were trying to access has been moved to
a new site, and give them the new link page. Better yet,
use <META> tags and redirect people to the new pages.
Links That Don't
Look Like Links
If you hate having links underlined in your web page,
here is a tip that works under later versions of MSIE
and Netscape 4.0+.
Instead of adding a link the normal way, you can code
a link as follows.
<A HREF="page.html" STYLE="TEXT-DECORATION:
NONE">A non-underlined link</A>
The link will perform like a link, but it will not look
like one!
Shrink Image Sizes
Many people on the web are still using 14.4 modems. Even
more just have 28.8, which still is barely adequate for
most pages on the web. Try to design your graphics with
these users in mind. Shrink GIF images by using 4,5, or
6-bit images. Recompress your JPG images several times
with several compression settings and see just what you
can get away with as far as image quality versus size.
A little work goes a long way in creating a page for all
to enjoy and revisit.
Design for the Smallest
Screen Size
It is very easy when designing websites to design for
the best systems available - you know, 17 inch + monitors
with at least 1024X768 resolution with true-color. My
advice is to strongly avoid designing just for such systems.
Surprisingly to those who have the money to buy the latest
and greatest technology, most people do not have 17 inch
monitors - most have 13 or 14 inch. Even more amazingly
to some, those who use big-screen monitors do not necessarily
have their resolution set to 1024X768. Some use 800X600,
and a few still use 640X480. Take out the pixels used
by the browser's window border, a vertical scrollbar,
and possibly a taskbar on the right side of the screen
(such as that of Microsoft Office (c), and you have maybe
550 or so pixels visible on some peoples' screens.
According to latest web usage surveys, a large majority
of users now have their screens set to at least 800x600.
So it may be safe to design for these resolutions. However,
you should still avoid 1024x768.
You need to plan for this limited horizontal resolution
when designing websites, else people with small resolutions
will see a horizontal scrollbar. If the case studies are
correct and most (or many) web users do not use the vertical
scrollbar, imagine how few people use the horizontal scrollbar!
The amount is just about nil percentage-wise. Even those
who understand what the horizontal scrollbar means may
find such websites very unprofessional.
Yes, designing for such a small resolution is challenging,
but it is worth the trouble. If you can't design specifically
for such users, at least make sure to test your websites
with 640X480 resolution. If you are using Win95 with QuickRes(c)
or WinNT 4.0, you should be able to change your resolution
on the fly to simulate what most people see when browsing
the web.
Aid Those who Can't
See Images
One of the easiest ways to make your page viewable by
more people is the addition of the ALT tag when it comes
to graphics. The ALT tag allows those without graphic-ready
web browsers (or those who have graphics turned off in
their web browser) to see text where the graphic would
be instead of nothing at all. Simply add ALT="your
text here" inside the <IMG> tag, or check your
HTML-editing software for more information about adding
descriptions to images. It just takes a couple of seconds
to add an ALT tag to your images, but it can mean so much
for your web visitors.
For those who do not or cannot using ALT tags: Especially
if your images are for navigation, you may want to place
text-only navigations links throughout your site. This
way, text-only users will still be able to move around
your pages.
Don't Ignore White
Space
When designing web pages, you may feel that since there
is so much information on your website, you just must
cram it all together on one page. DON'T DO IT! (there,
I just ignored my rule on not shouting).
White space, if used properly, can be very pleasing to
the eye. Look at your favorite newspaper or magazine and
check the layout - most popular ones place space between
text and pictures, not trying to cram everything together
in the least space possible. Follow the advice graphic
designers have had for years - put a little space between
the elements on your page. If you cannot do this without
making your webpage huge, then it is time to start redesigning
the layout of your website - see if you can separate your
webpages into categories and just list the main categories
on the front page.
Always Interlace
your GIF(c) Images
What does it mean to interlace GIF images? When a web
browser displays an interlaced GIF image, especially a
large image, the graphic will display progressively using
a curtain-style effect. This not only looks nice for your
viewers, but makes the page seem to load quicker. |
|
