Download Newsletter N. 27 - Carlo Scodanibbio

1 of 5
Newsletter N. 27
home page
newsletters archive
print this page
Subscribe to Carlo's free bimonthly Newsletter - enter your e-mail
download all newsletters
subscribe
"Web Designer and WebMaster Hints and Tips"
The monthly e-zine for serious Web Developers - presented by Carlo Scodanibbio
-------------------------------ISSUE N. 27
-------------------------------In this Issue:
1) Editor's Note
2) Special Announcement
3) Main Topics of this month
4) Other Announcements
===============================
1) Editor's Note
My dear ezi-readers and cyber-friends, Hello!
I have a number of Web Design topics this month, freshly baked for you in my
special oven (pizza oven, of course...). Just a few tips: just to keep your brain in
action and to make sure you won't fall into deep apathy (in this last case your
brain will be filled with cobwebs, and spiders will deep-crawl inside!! - yeccchhhhhhhh!!).
Ciaoooooo!
===============================
2) SPECIAL ANNOUNCEMENT
Carlo goes "live" again!
Where?
At the University of Cape Town, for another
edition of the "real-world" Course "How to build a Professional Web Site".
The Course, structured as usual in three Modules of 4 evening sessions each
(for a grand total of 12 sessions) starts on early November in the Red Computer Lab 5th floor - Menzies Building - University of Cape Town.
The exact date will be released soon.
If you wish to listen "live" to Carlo's nonsense and watch his famous (or infamous)
training style, flock around and you won't be disappointed: fun by the lots, guaranteed.....
This Course is now fully structured around XHTML (the present and future
standard language of the Net) and the associated, final exam will be XHTML based.
The WebMaster section is richer than ever, with 1001 tips and tricks hardly known
also by experienced Web Designers.
If you have already attended this course, don't forget to bring it to the attention of
friends, colleagues or business associates: they will be grateful to you for life!!
Also, don't forget to refer it to friends of yours who are still hooked on Frontpage,
Dreamweaver, or similar wizards: they'll love you for being enabled to see the
true story (finally.....) of HTML and XHTML!!!!
=============================
Enough with talks. Now let's get cracking:
3) MAIN TOPICS OF THE MONTH
3.1) HOW TO STRUCTURE A 3-COLUMN PAGE ARCHITECTURE IN PURE CSS
(NO TABLES)
Yes, Tables are a bit of a nigth-mare, isn't it?
I remember your reactions when you
went through this topic (in the real-world course, or when tackling Lessons 10 and
11 of my Distance-Learning course): most of you were just horrified, others
fascinated but very perturbed, others just could not digest the subject immediately,
and only managed to go through it after a couple of solid glasses of brandy.........
2 of 5
Today we can safely and easily go for CSS (Cascading Style Sheets): practically
all browsers support CSS, and the very few guys still living in the bush (and
attached to their old non-CSS-capable browsers) will have to do without your
super-duper-structure.
Now, first of all, why 3 columns? Because it's very popular. If you need only 2
columns to structure yur page, so much the better and the easier. But let me tell
you how you can go for 3 columns, which is the more general case: the left column
is generally for your navigation facilities, and contains all links and whatever else
you like - the central column is your main content area - the right column can be
used for special news, adverts, banners, other links, fancy stuff and the like.
What does the trick? The clever use of the DIV (Division) Tag and of the CSS
Property "float".
You structure your page with 3 Division Tags, one after the other.
And you let them "float" LEFT around each other (each around the previous one).
The "float" property, set at "left", causes the next column contained in a Division
to wrap clockwise around the previous one. Voilà, easy as that.
The STYLE code, contained in the HEAD of your page (Document Level Style) or
in an EXTERNAL STYLE Document, could be something as follows:
.navblock {
background: #eeeecc;
color: #000000;
float: left;
width: 25%;
border: none;
}
.centralblock {
background: #ffffff;
color: #000000;
float: left;
width: 50%;
margin-bottom: 0;
border-left: 1px solid #000000;
border-right: 1px solid #000000;
border-bottom: 1px solid #000000;
}
and your BODY code would be something like this:
<body>
<div class="navblock">
Your Navigation Stuff goes here
</div>
<div class="centralblock">
Your Main Content goes here
</div>
<div class="navblock">
Your Fancy Stuff for the Right Column goes here
</div>
</body>
Grab the concept?
A Division can contain anything: Headers, Links, Text, Images, other Divisions, etc.
So it's now up to you to fill your structure as you wish. The above code just sets the
architecture of a page: beat it with tables, if you can!!
A final note: you may achieve the same result with the CSS Property "position" and
play with "absolute" or "relative" positioning of your 3 DIV Tags. But the beauty of
3 of 5
the "float" property is that you just can't go wrong: the 3 columns will fill the page
due to a relative (%) width - the structure will adapt to any screen resolution - "float"
will guarantee the same top "levelling" of the 3 columns - what do you want more??
3.2) BOOKMARK THIS PAGE
Do you wish to make life less miserable for those several million non-web-literate
users who populate the cyberspace without even knowing where they are and
what they are doing there?
Easy: suggest them to bookmark your page and let them click on a link to do it
(you know, people like to click here, there and everywhere.....).
Just use this simple JavaScript, and put it in the HEAD of your page:
<script language="javascript" type="text/javascript">
<!-- Begin
if ((navigator.appName == "Microsoft Internet Explorer") && (parseInt(navigator.appVersion) >= 4)) {
var url="http://www.myexcellentwebsite.com/";
var title="The Best Site on the Web";
document.write('<a href="javascript:window.ext');
document.write('ernal.AddFavorite(url,title);" ');
document.write('onMouseOver=" window.status=');
document.write("'Bookmark Us'; return true ");
document.write('"onMouseOut=" window.status=');
document.write("' '; return true ");
document.write('"><u>Bookmark Us</u></a>');
}
else {
var msg = "Bookmark Us";
if(navigator.appName == "Netscape") msg += " - Press CTRL+D";
document.write('<a href="#">' + msg + '</a>');
}
// End -->
</script>
What will this little Script do?
In the case of Internet Explorer, will just insert a Link at the very top-left of your
page, stating "Bookmark Us" (which you can change into whatever you wish).
By clicking on the link, users will be presented the typical Bookmark dialogue
window. All is left to do is to click on OK.
In the case of Netscape (that does not support the facility), users will be prompted
to key-in Ctrl-D to bookmark the page.
Opera does not support the Script at all.
OK????????????
3.3) PRE-INSERT SUBJECT AND BODY IN E-MAIL FROM YOUR WEB SITE
This tip comes to you thanks to Alistair Howson, to whom my credits go.
Very simple: if you wish to personalise your MAILTO command that powers
up your visitors' e-mail in such a way that a pre-baked Subject and Body text
gets sent with the e-mail, all you have to do is to insert this link - code:
<a href="mailto:[email protected]?
subject=any subject of your choice long as much as you wish&body=any text of your choice long as much as you wi
even long as the Zambesi River">click here</a>
4 of 5
Your visitor's client e-mail program will behave with high sense of discipline
and pre-insert your Subject and your Body content just as you inserted it.
WWWWWWWWWOOOOOOOOOOOOWWWWWWWWWW!!!
Very, very nice, isn't it?
With this, I hope you will be happy and active for the next 2 months, and,
in the meantime,
Bye!! Ciaooooo!! Arrivederci!! Salutations!! A' bien tot!! Greetings!! Hasta la vista!!
Zdravo!! Tot-siens!! Bye!! Yassou!!
Carlo
=============================
4) OTHER ANNOUNCEMENTS
Dear friends, I know that many of you were very interested in the distance-learning
version of my course
"How to get into the E-Economy"
Well, it's done - it's ready for you.
If you browse to
http://www.scodanibbio.com/site/e_courses.html
you will find a list of my e-courses, ready to be downloaded or still being prepared.
There are 3 ready so far, including
"E-Performance - World-Class Performance in the E-Economy"
(formerly entitled "How to get into the E-Economy").
Just click on "program" and you will be presented the full details of this e-course.
What do you get for the very cheap price of this course?
4 Mb (zipped) = over 330 A4 pages of content - that's a solid, well illustrated e-book
over 85 illustrations (slides, graphs, diagrams, spreadsheets....) and several audio clips
examples, case studies, practical formula, 100s links to significant web sites, etc.
a very comprehensive Internet Glossary, with over 250 terms
over 15 practical enclosures with facts and figures, technical explanations, reading
material, tables, diagrams, etc.
an e-certificate of attendance
back-up and coaching by e-mail on a one-to-one basis
No other e-course offers so much for so little! Hope you will be very happy with it!
You will find also another e-course of mine, just released, in which I know many
of you were interested:
Creativity: the ultimate resource for the years 2000
This course is a "must" for the serious web developer. It deals with all aspects
of creative thinking, directed not only to solve problems, but also to generate
"opportunities". And Internet is a Mega-Opportunity, that's why developing
Creative Thinking is more essential than ever. Also this e-course is extremely
cheap - with it you get:
3,62 Mb (zipped) = over 140 A4 pages of content - that's a solid, well illustrated e-book
over 95 illustrations (slides, graphs, diagrams....) and several audio clips
examples, exercises, case studies, etc.
an e-certificate of attendance
back-up and coaching by e-mail on a one-to-one basis
No other e-course offers so much for so little! Hope you will be very happy with it!
===============================
Hasta la vistaaaaaa!!!
See you, as usual, in the cyberspace (in two months' time)!!
5 of 5
Carlo
How to build a Professional Web Site
http://www.scodanibbio.com/webbuild
-------------------------------------HOW TO BUILD A PROFESSIONAL WEB SITE
A comprehensive real-world AND distance-learning Web Design/WebMaster course
presented by Carlo Scodanibbio
http://www.scodanibbio.com/webbuild