Help:Wiki University HTML-- Introduction

From FamilySearch Wiki
Jump to: navigation, search
MAIN PAGE
WIKI
WIKITEXT
HTML/CSS
FAMILY HISTORY CENTERS
VISUAL EDITOR

Lessons


Flexbox/CSS Grid

Additional Helps

ELEMENTS

  • On a typical page in the Wiki, you will see text, pictures, tables, lists, etc. We call these items elements.
  • Elements will appear, by default, on the page in the order you entered them.
  • If you want to add some character to the elements, you will have to use what are called tags.

WHAT ARE TAGS?

Tag.PNG
  • The purpose of a "tag" is to alert your browser (Google, Firefox, Safari, etc.) when you are going to install a particular type of element such as a header.
  • Tags usually come in pairs, an "opening tag" and a "closing tag."
  • Elements, such as text, pictures, etc. are placed between the tags.

Example:To enter a header, use the follow code:

<h1>Header One</h1>

  • NOTICE the closing tag has a / after the <. This is how the browser knows you are finished with installing a header.

DO PATRONS SEE TAGS?

  • In the above example, it will be the words "Header One" that will be seen by the patron, not the tags.
  • It is the location of the tag on the page that tells the browser where to place the header. In this case it also tells the browser how large the font should be.
  • Just remember, that it is between the tags we enter the elements that will be seen by the patron.
  • It is in the tag coding that we control how this information is placed and formatted.

SECOND MONITOR IS HANDY

Two monitors.jpg
  • As you proceed with these lessons, if possible, we recommend that you have a second monitor for your computer. However, a second monitor is NOT REQUIRED. This is only a recommendation.
  • A second monitor makes editing much easier because you can display two pages at the same time.
  • If you have a laptop computer, it can usually handle a second monitor.
  • Used monitors can be purchased for very reasonable prices at computer repair shops.
  • Of course, if you can put two computers side by side, that works too!

SPLITTING YOUR SCREEN

Split screen.JPG
  • If a second monitor is not possible, we recommend you learn how to split your screen so you can display two pages at the same time.
  • To split the screen on a PC,
    • Bring up a page up on your monitor
    • Click on the little square box next to the x in the red box at the top right corner of your page to reduce the size of the image.
    • Next put your cursor on one edge of this uploaded page and drag left or right so it only takes up half of the screen.
    • Then go to FamilySearch Wiki and upload another page. Do the same to this page, reducing the size and place it to the side of the other page.
    • You may have to adjust the images by dragging their edges so they don't overlap.
    • Now you have two pages side by side on your screen. We will show how this will be helpful to you.
  • If you have a Mac, see this Mac information.

SPLITTING YOUR SCREEN FOR HOMEWORK

  • By splitting your screen with your sandbox page on one side and the lesson on the other, you can follow the steps outlined on the page without having to click back and forth between tabs.

TRY THESE OUT . . . . .

Tests.gif
Quick Quiz
  • The forward slash / is used in
A. Closing header tags.
B. Opening header tags.
C. Opening div tags
D. None of the above.
  • Tags are easy to see on pages in the Wiki
True
False
  • Two monitors are always better than one
True
False

Navigation menu