Blackboard

advertisement
Internet Information Resource
Design
INFO652
week 1
Blackboard
•
•
•
•
•
http://drexel.blackboard.com
Announcements, email
Readings: on web or Bb
Syllabus
Discussion board
4/2/2009
E.Corse, Drexel IST
2
1
Syllabus
4/2/2009
E.Corse, Drexel IST
3
Pop
Quiz!
2
The Web
internet
Web servers
Web pages
Home
page
Website
4/2/2009
E.Corse, Drexel IST
5
File organization
• “Local” files are on your hard drive, your
j
jump
d
drive,
i
or perhaps
h
a flfloppy di
disk
k
• “Remote” files are on a server… in this
case, the web server dunx1
4/2/2009
E.Corse, Drexel IST
6
3
Browsing
• Internet connection
• Browsers
• Web addresses
http://crab.rutgers.edu/~corse/YALit/index.htm
http://www.apple.com/itunes/
4/2/2009
E.Corse, Drexel IST
7
History of Web Design
Drexel 1997
Drexel 2009
4/2/2009
E.Corse, Drexel IST
8
4
Accessibility:
W3 Ten Quick Tips
http://www.w3.org/WAI/Reference
s/QuickTips/Overview.php
/Q i kTi /O
i
h
Drexel web setup
•
•
•
•
•
•
•
•
•
http://www.drexel.edu/irt for support
Launch SSH “secure file transfer client”
File menu
menu, Connect
dunx1.irt.drexel.edu | your dunx1 username
Click Connect
Enter password; OK; OK
Double-click
Double
click folder public
public_html
html
Create subfolder “652” (New Folder button)
Keep this window open!
4/2/2009
E.Corse, Drexel IST
10
5
index.html
<html>
<head>
</head>
<body>
</body>
</html>
4/2/2009
E.Corse, Drexel IST
11
head
<head>
<title>Emily Corse ePortfolio
</title>
</head>
4/2/2009
E.Corse, Drexel IST
12
6
body
<body>
<h1>E il ’ ePortfolio</h1>
<h1>Emily’s
P tf li </h1>
<p>I am an adjunct professor at
IST and I earned an MS here in
1996. I’ve designed many
websites for many years, with
many tools.
t l
</p>
</body>
4/2/2009
E.Corse, Drexel IST
13
More info
• Use <h2> headings for “Projects” and
“I t
“Interests”
t ”
• Use <p> tags to write short paragraphs for
each
• Save and display local file in browser
4/2/2009
E.Corse, Drexel IST
14
7
Publish
• Switch back to SSH
• Locate
L
t index.html
i d ht l ffrom local
l
ld
drive
i and
d
drag into folder public_html/652
• View with browser using your official
course web address
4/2/2009
E.Corse, Drexel IST
15
Your URL
http://www.pages.drexel.edu/~username/652/
4/2/2009
E.Corse, Drexel IST
16
8
Take a break….
4/2/2009
E.Corse, Drexel IST
17
Photo courtesy Trevor Lowe on Flickr.com
FW topic
• audience
• your own original textual and graphic
information, plus annotated links
• 5-8 pages total, including:
– Home page
– About page
– Annotated links
• watch tone
• WARNING: this project will be published on the
internet, via your dunx1 account
9
Sample topic proposal 1
I’m hoping to create a website that will
i f
inform
an audience
di
off neophyte
h t comic
i
collectors. I might include pages on Getting
Started, Where to Buy, How to Protect, and
My Favorite Superheroes. To avoid
copyright issues, I can use my own original
anime for images.
Sample topic proposal 2
My website will offer resources for new
parents,
t including
i l di some comic
i essays I’I’ve
written through the years, plus book reviews
of my favorite parenting books. I’m also
planning to include lots of links to the best
online resources for health, adoption, and
shopping.
10
Google account
• Go to google.com
• Click “sign in”
• Click “create an account now”
4/2/2009
E.Corse, Drexel IST
21
Create blog
• Go to blogger.com
• Sign in with Google credentials
• Create your blog & start posting:
http://www.pages.drexel.edu/~corseel/web
2/firstblog/firstblog-textonly.html
4/2/2009
E.Corse, Drexel IST
22
11
First post(s)
•
•
•
•
•
Name, some version of
Course of study
Day job
Career plans
3 oft-used websites
If time
• Editing on Blogger
– Set time zone
– Edit published post
• Add URL
• Add graphic
– Delete comment
• Edit on Wikispaces
4/2/2009
E.Corse, Drexel IST
24
12
Quick look at blogs, wikis?
• http://www.theshiftedlibrarian.com/
• http://finalwebelc.blogspot.com/
• Create blog on blogger.com
– Requires Google acct
– May prefer using alias
• http://profcorse.wikispaces.com/
htt // f
iki
/
• Create account on wikispaces
4/2/2009
E.Corse, Drexel IST
26
13
Download