kimberly dew [email protected] [email protected] carrie schell [email protected] [email protected] welcome!
TRANSCRIPT
HTML Basics – Agenda
Let’s take a look at wherewe’re headed.
• Basic HTML Commands• Inserting a Picture / Linking to Another Location • The “New” Announcement Page (AP)
– New Format and Examples– Add flash appointment scheduler (text or image)– Linking tutoring calendar/ads/virtual office icon to an Elluminate room– Changing Backgrounds– Marquees– Drop down menus to organize help resources
• HTML Educator Emails and Updates• Questions & Answers
Basic HTML CommandsWant students to READ your emails and updates?
Capture their attention with
color, font, bold, underline, or size
Basic CommandsBold <b>End Bold </b>Center <center>End center </center>Underline <u>End underline </u> Break <br>Font size <font size=3>Font <font face=arial>Font color <font color= blue> or <font color= #FF4848>(http://immigration-usa.com/html_colors.html)
Create some magic behind the scenes!
HTML Example with picture<center><Font face = Arial><font size= 4><font color= green><b>Happy Spring Super Scientists!<br><font size= 2>I am challenging you to a bit of “spring cleaning” in your assessment area this week. <br>Clean out some of those overdue assessments and you will be on target for a successful completion!<br><img src=/educator/common/CarrieSchell/spring-cleaning-bucket.jpg></center>< /font></b><br>
Happy Spring Super Scientists! I am challenging you to a bit of “spring cleaning” in your assessment area this week.
Clean out some of those overdue assessments and you will be on target for a successful completion!
Nooo!
A spray bottle?May I
borrowsome
water?
Adding Photos1. Load image into common folders (remember to save as .jpeg, .gif, etc)2. Copy the image source from the common folder area3. Paste the image source code into your email, newsletter, or announcement page
<img src=/educator/common/CarrieSchell/MrsSandkids.jpg>
You are a
I love your attention to details on your mollusk chart! Keep up the great work!~Mrs. Schell
HTML Version of Student feedback:You are a <img src=/educator/common/CarrieSchell/rockstar.jpg> <br>I love your attention to details on your mollusk chart! Keep up the great work! ~ Mrs. Schell
FUN FEEDBACKMake things fun!
Students will love it!
Linking an Image to direct to another location
Do you want students to click on an image and end in a new location?
Flash appointments
<a href="http://www.flashappointments.com/client/launch.cfm?busId=XXXX"><img src="http://img src=/educator/common/CarrieSchell/schedule_appointment1.gif”>
This is a dandy tip. No “lion” about
that!
Linking an image to direct to another location
Click an image and end in a new location!
Virtual Office
<a href=https://sas.elluminate.com/m.jnlp?sid=679&password=M.5A520247821BE863242E8CD7F946A0><img src=/educator/common/CarrieSchell/smallVirtualOffice.jpg>
I am the Mayor, and I approve
this tip!
New AP Layout
Check out the new design!
Don’t be scared.
It’s easy to use!
New AP Layout
Insert a picture
Small appt. Icon for Students to click
If you Instant Message
3 cool itemsto add!
New AP Layout
Insert a picture
If you InstantMessage
Here’s a horse ofA different color!
The Code:<td background=/educator/common/Physics/Clipart/Cloran/feb1.jpg>
To change it:
Changing AP Backgrounds
1. Find images you like (I have an html folder – backgrounds) – file save as gif/jpeg2. Upload to educator (my folders – Step 2a, then common folders – Step 2b)3. Insert background code below into HTML Announcements area – you will need to
insert the code in several places throughout your page, depending on the length/#of tables, etc. in your AP)
(Step #2a) (Step #2b) (Step #3)
AP: Adding Links/Dropdown Menus and Live Session Elluminate Links
Key: Red = Menu Title (whatever you want to title it)Blue = Common Folders LinkGreen = Individual Link Title (whatever you want to name it)
Links, Menus, and Sessions.
Oh my!