Designing a Home Page (Your Image on the Net)

Transcript Designing a Home Page (Your Image on the Net)

Designing a Home Page
(Your Image On The Net)
using a Cookbook Method
with help from Lions at LionNet
Lion Dan Uitti, PDG
LionNet International
[email protected]
Introduction
 Why Lions Clubs have a web page
– Publicity
– Electronic Communication
– Low or No cost, No risk
 Represent Lions Clubs International
– Keep it current
– Faithful to our International Trademark
– Simple Sponsor Ads
Ingredients before starting
 Computer- 486 or faster -
Windows 95/98
 Internet account with
Internet Service Provider
(ISP)
 Some computer
knowledge and/or
willingness to learn by
doing
Ingredients made during the
cooking process
 Image files needed for
web page
 HTML file of
Prototype Lions Club
web page
 FTP program
 Unzip program
Where to get the ingredients
When starting out, it is assumed that you already have the
Ingredients that are listed in the first section. The second
set comes from the internet.
Step 1 - What to put on your page
 The Full name of your Lions Club.
 The President, Secretary and Treasurer with
E-mail contacts.
 Your Community Projects.
 Your Club's meeting place, date and time.
 Where your club is situated in relation to
the rest of the world
Contact Lion Dan at [email protected]
Step 2 – Getting the Ingredients
 go to www.lionnet.com
 click on WebPage Help
 click on
prototype Lions Club page
 Right click on each graphic Save
 use FILE - SAVE AS to get web page
The Prototype page contains the graphics and
basic HTML webpage needed.
Make a folder on your computer with Explorer.
Select your new folder before saving each file.
List of Files
 undercon.gif
 lionnet_logo-small.gif
 lci_button.jpg
 flag_array.gif
 mailbutton.gif
 we_serve1.gif

club.html
Get the FTP Software
(some Internet Providers do not need this)
 Go to www.tucows.com
 Select USA Region
 pick Windows 95/98 programs
 Section Network Tools click on FTP and Archie
 Scroll down to LeechFTP - it is FREE
 Click the “Try Now” button
Step 3 - Writing the page in HTML
 Hyper Text Markup Language - it really is
simple.
 Use Accessories - WordPad
 Open club.html
 Just substitute the text
The HTML file really is simple.
Get help from LionNet
 Check our Webpage Help
– We provide an annotated guide to the
HTML code
 
• <HTML>
<HEAD>
<TITLE>Prototype Lions Club
Homepage</TITLE>
</HEAD>
Title Bar section

<HTML>
<HEAD>
<TITLE>Prototype Lions Club
Homepage</TITLE>
</HEAD>
Simple change this to say
<TITLE>Watertown Lions Club
Homepage</TITLE>
Title section with Graphics
<IMG SRC="we_serve1.gif" HEIGHT=202 WIDTH=221
ALIGN=LEFT> 
<CENTER>
Federation City Lions Club
 
Pardon our appearance ... <IMG
SRC="undercon.gif" HEIGHT=38 WIDTH=38>
we're still building this site !
</CENTER>
Federation City Lions Club
Pardon our appearance ...
we're still building this site !
Section on Meeting Information
<UL> <DT>Meetings:</DT>
</UL><UL> <UL>
<LI>When: 2nd & 4th Wednesday
- 18:30 </LI>
<LI>Where: Starfleet Academy
Lounge</LI> </UL> </UL>
Meetings:
When: 2nd & 4th Wednesday - 18:30
Where: Starfleet Academy Lounge
Other Sections
Officers:
King Lion: James T. Kirk home: xxx-xxxx; office: xxx-xxxx; e-mail: [email protected]
1st Vice President: Spock home: xxx-xxxx; office: xxx-xxxx; e-mail: [email protected]
Secretary: Nyota Uhura home: xxx-xxxx; office: xxx-xxxx; e-mail: [email protected]
Treasurer: Montgomery Scott home: xxx-xxxx; office: xxx-xxxx; e-mail: [email protected]
Membership Chairman:Hikaru Sulu home: xxx-xxxx; office: xxx-xxxx; e-mail: [email protected]
Links:
National (for national LionNet nodes)
International (linking on-line Lions Clubs world-wide)
(Lions headquarters)
Email Contact Section
Your link for e-mail would be set up like this
<A HREF="mailto:[email protected]">
We welcome your questions and comments</A>
To use a button, make a link like this:
<A HREF="mailto:[email protected]">
<IMG SRC="mailbutton.gif" </A>
Step 4 - Adding graphics and links
 Prototype already
contains some
 download or create
your own graphics
– LionNet Image
Archive
– Lions Programs
 Links to
– www.lionsclubs.org
– www.lionnet.com
Step 5 - Testing your page
 Open the file with your web browser
– Do all graphics appear?
– Does the Email address open a
blank email message?
– Do Links work correctly?
Step 6 - Finding a site
 Your own Internet Provider
 A local provider in your area
 Free web space on the internet
• Geocities
• Tripod
Uploading your site
 Use your FTP program
 Review your Internet Provider’s
member help section
Check your web page again
Step 7 - Publicizing your site
 Let us know at LionNet
 Contact your local paper
 Email your friends
 Internet search engines
– Yahoo
– Lycos
– Altavista
– Excite
Or email www.lionnet.com
Notes about HTML
<A> - Anchor
 - Blank Row
<CENTER> - Center text
 - Font setting
<HEAD> - Header section
<HR > - Horizontal Line
<HTML> - Beginning of HTML code section
<IMG SRC= “filename” > - Insert Image file
<LI> - Line Intent
 - New Paragraph
Other HTML Code Notes
<TITLE> - Webpage Title
 - Underline
<UL> - Unordered List
<A HREF="http://www.LionNet.com">LionNet
International</A> - Hypertext link to another page.
<A HREF="mailto:
[email protected]">
Contact us</A>
- Hypertext email contact
<IMG SRC="flag_array.gif" HEIGHT=96
WIDTH=200> - include a graphic file

Designing a Home Page (Your Image on the Net)

Transcript Designing a Home Page (Your Image on the Net)

Directory