Intermediate HTML & Hand Tagging

**The topics and items included in this post will build off of the items presented in my Basic HTML & Hand Tagging blog.**

More Tagging

Attributes & Working with Color

• bg ______=______ - Left is what attribute you want to set up, on right the attribute dimension
• bg - background (bgcolor - sets the background color)
• w3schools.com lists attributes
• HTML 5 no longer accepts attributes, using CSS is preferred
• For example:
  < HTML >
  < HEAD >
  < TITLE >Learning Libraries < /TITLE >
  < /HEAD >
  < BODY bgcolor="FFFF10">
  < P >< H4 >< i >Google can bring you back 100,000 answers, a librarian can bring you back the right one.< /i > < /H4 > < BR > < H5 >- Neil Gaiman < /H5 > < /P >
  < /BODY >
  < /HTML >

Additional Attributes

• < pre > - makes it so the HTML text has been pre-formatted to display properly on the web, so any white space will be preserved, etc.
• < kbd > -  (keyboard) creates keyboard text (e.g. Click the Ctrl key to enter a response)
• < !-- -- > a comment tag that cannot be seen by users, but can be seen by others working on same code
• < sup > - superscript
• < sub > - subscript
• < align = "___" > aligns the text to specifications 
• For Example:
  < HTML >
  < HEAD >
  < TITLE align="center" > Learning Libraries < /TITLE >
  < /HEAD >
  < BODY bgcolor="FFFF10">
  < P >< H4 >< i >Google can bring you back 100,000 answers, a librarian can bring you back the right one.< /i > < /H4 > < BR > < H5 >- Neil Gaiman < /H5 >< /P >
  < /BODY >
  < /HTML >

Linking to Another Webpage

• < a href "______________" >
• For Example:
• < HTML >
  < HEAD >
  < TITLE align="center" > Learning Libraries < /TITLE >
  < /HEAD >
  < BODY bgcolor="FFFF10">
  < P >< H4 >< i >Google can bring you back 100,000 answers, a librarian can bring you back the right one.< /i > < /H4 > < BR > < H5 >- Neil Gaiman < /H5 > Visit my student learning blog < a href="http://www.learninglibraries.blogspot.com" >here.< /a >< /P >
  < /BODY >
  < /HTML >
• DON'T FORGET TO CLOSE YOUR < a > TAG!!! Any text that comes between the opening and the close will be part of the link text.

Linking an email

• "mail to"command - < a href="mailto:_______@_____">
• Linking to websites and emails are known as absolute paths, as these sites and emails are absolute in nature and are not dependent upon the linker's file location. These locations have fixed URLs/places on the internet.

For Example

              < HTML >
              < HEAD >
              < TITLE align="center" > Learning Libraries < /TITLE >
              < /HEAD >
              < BODY bgcolor="FFFF10">
               < P >< H4 >< i >Google can bring you back 100,000 answers, a librarian can bring you back the right one.< /i > < /H4 > < BR > < H5 >- Neil Gaiman < /H5 > Visit my student learning blog < a href="http://www.learninglibraries.blogspot.com" >here.< /a > Feel free to contact me with any questions via < a href=mailto:srmwestberry@gmail.com> email < /a >.< /P >
< /BODY >
< /HTML > 

Providing a Dowload Link

• When linking to a file, the file should be uploaded (alongside the html source code) to a server. These should both be in the same file to enable access.
• Uploaded, personal files are known as relative paths. This is due to the relative nature of file placement. 
• < a href="________.___" > (e.g. < a href=Library Laws.pdf >)

For Example

              < HTML >
              < HEAD >
              < TITLE align="center" > Learning Libraries < /TITLE >
              < /HEAD >
              < BODY bgcolor="FFFF10">
               < P >< H4 >< i >Google can bring you back 100,000 answers, a librarian can bring you back the right one.< /i > < /H4 > < BR > < H5 >- Neil Gaiman < /H5 > Visit my student learning blog < a href="http://www.learninglibraries.blogspot.com" >here.< /a > Feel free to contact me with any questions via < a href=mailto:srmwestberry@gmail.com> email < /a >.< /P >< P > Be sure to check out the < a href="Library Laws.pdf> Library Laws >

< /BODY >
< /HTML > 

To provide a link inf a different directory (or file) you would place the name of the file within the tag.

• For Example: If you saved or created the Library Laws file in a folder named "rules" the tag would be - rules/Library Laws.pdf>

Internal Links

• Longer web pages may have sections to which the reader wants to jump. To do this you need to have a reference for the area you want to be able to jump to.
< HTML >
              < HEAD >
              < TITLE align="center" > Learning Libraries < /TITLE >
              < /HEAD >
              < BODY bgcolor="FFFF10">
               < P >< H4 >< i >Google can bring you back 100,000 answers, a librarian can bring you back the right one.< /i > < /H4 > < BR > < H5 >- Neil Gaiman < /H5 > Visit my student learning blog < a href="http://www.learninglibraries.blogspot.com" >here.< /a > Feel free to contact me with any questions via < a href=mailto:srmwestberry@gmail.com> email < /a >.< /P >< P > Be sure to check out the < a href="Library Laws.pdf> Library Laws >

and our < a href="index.html#Sponsorships" > Sponsorships.< /a >
< /BODY >
< /HTML >< br >
< br >
< br >
< br >
< br >
< br >
< br >
< br >
< br >
< br >
< br >
< br >
< br> < a name="Sponsorships" > Library Sponsorships < /a >

Linking a Photo

• Linking to a photo is similar to linking to a dowloadable file. 
• You need to make sure they are linked correctly per their placement in the file/server.
• You need to make sure the name of the image file matches that with the name included in the tag.
• Tag to include photo < img src="headshot.jpg" >
• To edit height and width:
• < img src="headshot.jpg" width="___" height="___">