صفحه 1:
- Ben Ellis - office hours canceled
tonight
صفحه 2:
صفحه 3:
. 1 :عصمتاتصطم0 [همنصطمم
= A webpage is a single HTML
document
= A website is a collection of related
webpages
_ Designing a good website requires
more than just putting together a
few pages
صفحه 4:
- www.uncommonadv.com
صفحه 5:
_ Layout of web pages is very
important
- Poor layout makes for -
= Difficult navigation
= Hard to locate information on page
= Visually unappealing
صفحه 6:
... م
a Tables, tables, tables!
Use tables to lay out your pages!
Make the table borders invisible
A 2x? table works well
صفحه 7:
صفحه 8:
Project Puffin
What is Project Puffin?
‘The Netional Audubon Seciety stared Project Putin ia 1973
than effort arn how ts roster putins to store nosang
‘olends inthe Calf of Maine. Athan, eral althe putin
‘5305 n Maine wore in baskets vatcus Puck ena و
0 gy
Species (hey ae sbundartn Now/cunciand, olan, nd
they are ra Marte Tre tv suring clones معا
tnere very lnerable to 2 lseser such 23 anol eal or
2ccidental establishment predators sh as ras 07 mink
“Tho Project began with an attempt tn rastore puffins 12
Eslern Egg Rock in Musconqus Bay, about Sicrmies east of
Pemaquid Port, Pullrs had nested Here ul he eerly
‘any nv The restoration af pins to
3 based on the fact hat young pufis ususly return o breed on the seme islanc where
they hatched.
Young pufins from Greet sland, Newfoundlanc (where about
+ 80,000 pairs nest) were transplanted to Easter Ea Rock when
they were about 11-14 days old) The young puns were then reared
In arvficiel sod brave for about one month. Audubon biel gists
placed handful of vitamin orified fh inter burrows each dey and,
صفحه 9:
~ www.adobe.com (menu on right)
- www.uintafishing.com (many
columns)
صفحه 10:
downloads
indo 2 te
(ک عدم
TechEd 2003 is almost here
|
A and ae و هه وس اس و
home & entertainment
technical resources
je 4.2 milion nth 82
business agility
duct
جع
سوه
eusinese Solutions
Gomes ond xno
موه ام
Downloade
Update سمه مال
Office Update
Learning Tools
موی
Information For
1 Professional
3
صفحه 11:
lees
news قوم
2 ۳ cont
Business Solutions 4 ‘ortechnoingy pts Resto by Aon 1 andsve
‘Gomes and xox home & entertainment
all produces
Downloade technical resources
ingows Update ۳ اه سا مج مسب م7 Some
Office Update cpa
Learning Tools
موی
ممما
1 Professional
صفحه 12:
را وتا هن
A Land ae و هه و اس و
home & entertainment
technical resources
business agility
oduct Families
office
eusiness Solutions
Gomes ond xno
وه ام
Downloade
ingows Update
Office Update
Learning Tools
موی
ممما
1 Professional
صفحه 13:
pe TechEd 2003 is almost here
3 cur stat Meats promt ang
Business Soltions / ل ين
apes nd Hone home & entertainment
مهبم
Downloads
Windows Update
Office Update
Leorring Tools
موی
technical resources
security ی
ممما
1 Professional
صفحه 14:
ra ra
MAKING A GIFT
|The Campaign for MSUNews. ي سس
FUNDRAISING CAMPAIGNS|
+ Lovels of On-tne Citing Rise Dramatically
1 Major Donors Honored and Fadoweed Postions Filed
coer | 1 Hounds Jeu Fores To lupeove Teacher ومقم ميف enka
MSU headlines provided by 3 هوك
۱ سس ای اوه
vion weet with behavior offre که
باه موه همه "ACT Cention
۳
local tists کت(
| university
Devevorment
HOMEPAGE
MICHIGAN StATE
صفحه 15:
Really complicated cies
Seach the Web
تب تا ae
اه
eee
Steere es
[0
صم عنم عجر
3
RSENS م عسي
ام سم 0
صفحه 16:
_ Monitor resolution affects how you
should lay pages out
~ 800x600 = 50% - 760 x 420 pixels
in browser window
~ 1024x768 = 35%
— 640x480 = 3%* - 595 x 360 pixels
*Was 20% three years ago
صفحه 17:
Up to 760 wide*
100-140 Up to 650 wide
wide
O
Logo
And
Menu
صفحه 18:
۱ 7107107 /010».علطتتمطحع07.
design6.shtml
صفحه 19:
5856031156 monitors differ (640x480,
800x600, 1024x768), pages look
different.
~ You can use a % width for a table,
for example make it 80% of the
page width
صفحه 20:
_ The index.html file is called the “Splash
Page”
_ Itis the key page—the first page visitors
usually see
_ Must be visually attractive, informative,
and easy to navigate
_ Examples:
www.projectpuffin.org
www.pmlodge.com
www.uncommonadv.com
www.rainforestandreef.org
صفحه 21:
_ Decide what info goes on each
page
= Friends page
= Family page
= Personal page
= Hobbies page
صفحه 22:
_ Be Concise
_ Limit choices - use a hierarchical
structure
= A hierarchy is a structured
organization where some pages are
at a higher level than others
= Hierarchy results in a site map with
multiple levels
صفحه 23:
_ Asite map is designed to show the
connections between pages
_ A graphical site map uses lines to
connect linked pages
صفحه 24:
Splash ra
‘ind ex.html
—
Name Page| Progress Fag
name.html | progress.ht:
Interior or|
Internat}
Pages|
Canada Trip Christmas Tree
canada.html tree. html
صفحه 25:
_ Choose a common layout for your
website. The Splash Page will
probably differ but interior pages
should be the same
_ Use tables to control placement
throughout
صفحه 26:
_ Use the same font throughout!
_ Use consistent graphics in website
- do not use ultra modern on one
page and calligraphy on another
_ Use color scheme that is
consistent
صفحه 27:
ons you an مت ی
reliably use are Times
eae Sees LYMAN
مت an
_ Text in site should be BRIGGS
one of these choices SCH oO 6 iL
_ How to overcome this?
= Any font used in
graphics is loaded as a
graphic, and does not
rely upon the font being
anus user’s computer OU ۱۳0
= Make cool font images
in Photoshop
صفحه 28:
_ Test your website as you go along.
= If you're in the computer lab and there’s
an empty computer next to you, log into it
and check out your web page from there
_ Make sure it works in Netscape
Navigator and Internet Explorer
_ Make sure all pictures come up ona
different machine
صفحه 29:
_ From your existing web pages, build a
website.
= Add more pages to site - whatever you want
Some suggestions: Resume, friends page, hobbies
page
Minimum 6 pages (splash page + 5)
= Use common design theme
Make custom graphics in PhotoShop
_ Prepare graphical site map in
PowerPoint to turn in when finished
صفحه 30:
. ۷۷/۵ Pages for more info
= http://info.med.yale.edu/caim/manual/
contents.html
_ Good places for Graphics
= www.clipart.com
= http://free-clip-art.com/
_ Fonts
= http://www.1001freefonts.com/fontfiles/
main.htm
صفحه 31:
۸۵00 Hyperlinks
_ Add Graphics (MSU, Scans, etc)