Study Guide Layout - Heading 1
pdf
Study Guide Layout - Heading 1 Profile:
Introduction to LISD SchoolWeb – (v2) Technology. Lewisville ISD © 2006. 2007-06-12 ... The following is a list of disabilities, the common issues they present and/or ......Intro_SchoolWebv2.pdf
The part of the document's content:
...... affiliated with the authors of this page or responsible for its content. Study Guide Layout - Heading 1 Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 1 T T a a b b l l e e o o f f C C o o n n t t e e n n t t s s T T a a b b l l e e o o f f F F i i g g u u r r e e s s ..............................................................................................................................5 Introduction......................................................................................................................................7 LISD Vision .................................................................................................................................7 SchoolWeb in LISD .....................................................................................................................7 What is SchoolWeb?................................................................................................................8 SchoolWeb (Moodle) Features Overview........................................................................................9 Information Source ......................................................................................................................9 Interactive Content.......................................................................................................................9 Full Integration.............................................................................................................................9 Web Page Basics............................................................................................................................11 Vision.........................................................................................................................................12 Plan/Organize the Site................................................................................................................12 Gathering Resources ..................................................................................................................12 The SchoolWeb Design Cycle ...................................................................................................13 User Accessibility ......................................................................................................................14 Design the site............................................................................................................................15 Sketch your website layout ....................................................................................................15 Create the Layout .......................................................................................................................16 Viewing Different Resolutions ..................................................................................................18 Maintain the Web site ................................................................................................................19 SchoolWeb Specific Configuration............................................................................................19 LISD SchoolWeb ...........................................................................................................................21 SchoolWeb Environment ...........................................................................................................21 Logging On ................................................................................................................................22 Side Blocks Defined...............................................................................................................23 Edit your Profile.....................................................................................................................24 Course Setup ..................................................................................................................................27 Topic Outline .................................................................................................................................27 SchoolWeb Course Environment...............................................................................................27 Tools, Icons and Definitions ..............................................................................................28 The following icons will be used frequently as you continue to develop your site. ......................28 Course Setup Settings .............................................................................................................28 Short name: This is the name that will appear in the breadcrumbs ..........................................29 Adding Content..............................................................................................................................31 Editing Symbols.........................................................................................................................31 Course Home Page Summary Description.................................................................................32 Rich text HTML Editor Features ...............................................................................................34 Paste text in from other Applications.........................................................................................34 Inserting images .....................................................................................................................34 Inserting Tables ......................................................................................................................34 Inserting Links .......................................................................................................................34 Inserting Emoticons ...............................................................................................................34 Richtext HTML Editor Environment .....................................................................................35 Formatting Toolbar 1 .........................................................................................................35 Formatting Toolbar 2 .........................................................................................................36 Table Properties Toolbar....................................................................................................37 Insert a Table..............................................................................................................................38 HTML Basics.................................................................................................................................41 Introduction to LISD SchoolWeb (v1) Technology Lewisville ISD © 2006 2007-06-12 2 View HTML Code..................................................................................................................... 42 Change Table color................................................................................................................ 44 Text line spacing.................................................................................................................... 44 Add a Table Border ............................................................................................................... 46 Your table should look similar to that shown here. ....................................................................... 47 Add an Image ................................................................................................................................ 49 Download Images and Files ...................................................................................................... 50 Image Size ................................................................................................................................. 51 View File Size ....................................................................................................................... 51 Reduce Image Size in Microsoft Photo Editor ...................................................................... 52 Reduce Image Size in Microsoft Picture Manager ................................................................ 54 Reduce Image Size in Microsoft Paint .................................................................................. 55 Upload Image ............................................................................................................................ 56 Insert Image ............................................................................................................................... 59 Image URL ............................................................................................................................ 59 Formatting the Image............................................................................................................. 60 Accessibility Standards...................................................................................................... 60 Add Alternate Text....................................................................................................... 60 Align Image in the Cell ..................................................................................................... 60 Check Image Size (in pixels) ....................................................................................................... 61 Your work thus far should look something like the example here. ............................................... 62 Topic Outline Contents...................................................................................................... 63 Adding Resources.......................................................................................................................... 65 Resource types........................................................................................................................... 65 Compose a Web page .................................................................................................................... 67 Using Tables.............................................................................................................................. 67 Table Basics............................................................................................................................... 67 Table Types ........................................................................................................................... 67 Fixed-width........................................................................................................................ 67 Relative/percentage-width ................................................................................................. 68 Table adjusts depending on the resolution of the monitor............................................................. 68 Nested tables...................................................................................................................... 68 General Guidelines for using tables........................................................................................... 68 Insert a Topic Title ................................................................................................................ 69 Compose a Text Page .................................................................................................................... 71 Window Settings ........................................................................................................................... 73 Move a Page .................................................................................................................................. 75 Administration Block .................................................................................................................... 77 Settings ...................................................................................................................................... 79 Format.................................................................................................................................... 79 Weekly............................................................................................................................... 80 Topic.................................................................................................................................. 80 Course Start Date................................................................................................................... 80 Enrollment Period.................................................................................................................. 80 Group Mode........................................................................................................................... 81 Enrollment Key ..................................................................................................................... 81 Guest Access ......................................................................................................................... 81 Hidden Sections..................................................................................................................... 82 News Items to show............................................................................................................... 82 Files ........................................................................................................................................... 82 Create a Directory.......................................................................................................................... 83 Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 3 Create a Folder ...........................................................................................................................83 Move Files to Folders ................................................................................................................85 Now that you have a folder for Images, you can move the image file to that folder. ....................85 Upload a resource (file)..................................................................................................................87 Delete Files ................................................................................................................................89 Display a Directory ........................................................................................................................91 Revise Topic Summary..............................................................................................................93 Building Basic Navigation .............................................................................................................95 Link to a web site .......................................................................................................................95 Image link ..................................................................................................................................97 Email link...................................................................................................................................97 Add subject to email link .......................................................................................................97 Add a Calendar...............................................................................................................................99 Add Calendar Block.................................................................................................................100 To add the Calendar block to your page, .....................................................................................100 Add a User Event .................................................................................................................100 To add a user event, one that is viewable to only you, follow these steps...................................100 Delete a User Event..............................................................................................................101 Add a Course Event .............................................................................................................102 To add a course event, one that is viewable to everyone in your class, follow these steps. ........102 SchoolWeb (Moodle) Modules....................................................................................................105 Adding Activities and Resources .............................................................................................105 Assignment Module .............................................................................................................107 Assignment name:............................................................................................................107 Description .......................................................................................................................107 Assignment type:..............................................................................................................107 Allow resubmitting: .........................................................................................................107 Grade................................................................................................................................107 Maximum size:.................................................................................................................107 Due date: ..........................................................................................................................107 Chat Module.........................................................................................................................107 Choice Module.....................................................................................................................107 Forum Module......................................................................................................................108 Glossary ...............................................................................................................................108 Lesson Module.....................................................................................................................110 The items on the first page are:....................................................................................................111 Quiz Module ........................................................................................................................113 When you have everything the way you want it, click on Save changes. Your Embedded .....117 Scorm Module......................................................................................................................118 Survey Module.....................................................................................................................118 Wiki Module ........................................................................................................................118 Workshop Module................................................................................................................119 Workgroup Evaluation Types ..............................................................................................121 Accumulative Grading Strategy.......................................................................................121 What an accumulative evaluation looks like: ..........................................................................123 Not Graded Grading Strategy...........................................................................................123 Error Banded Grading Strategy........................................................................................124 Criterion Grading Strategy...............................................................................................125 Rubric Grading Strategy ..................................................................................................126 Appendix......................................................................................................................................127 Add a Web Page with Table ....................................................................................................127 Introduction to LISD SchoolWeb (v1) Technology Lewisville ISD © 2006 2007-06-12 4 Compose a Web page ...................................................................................................... 127 Insert a Table ....................................................................................................................... 129 Merging table cells .............................................................................................................. 131 Character Formatting........................................................................................................... 132 Font Face ......................................................................................................................... 132 Font Size.......................................................................................................................... 132 Font Color and Style........................................................................................................ 133 Table Formatting ................................................................................................................. 133 Cell Properties ................................................................................................................. 133 It appears you need one more row! Not a problem. ................................................................... 134 Add a Row....................................................................................................................... 134 To add a row to an existing table, use the icons on the toolbar. .................................................. 134 Bold............................................................................................................................ 135 Font Face.................................................................................................................... 135 Font Size .................................................................................................................... 135 Color........................................................................................................................... 135 Superscript/ Subscript ................................................................................................ 135 Table background color ................................................................................................... 136 Horizontal Rule ....................................................................................................................... 137 Edit HTML .......................................................................................................................... 138 Change Color................................................................................................................... 138 Change Length (Width)....................................................................................................... 138 Change Height (Size)........................................................................................................... 139 HTML Tags ............................................................................................................................. 140 Main HTML tags................................................................................................................. 140 Text tags .............................................................................................................................. 140 Simple Formatting Tags ...................................................................................................... 141 Making Links....................................................................................................................... 142 Graphics............................................................................................................................... 142 Tables .................................................................................................................................. 143 Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 5 T T a a b b l l e e o o f f F F i i g g u u r r e e s s
Figure 1 Web basic cycle ............................................................................................................. 11 Figure 2 Site flow chart................................................................................................................ 15 Figure 3 Page size table (in pixels) .............................................................................................. 17 Figure 4 Choose a page size (in pixels) ....................................................................................... 17 Figure 5 SchoolWeb Environment............................................................................................... 21 Figure 7 SchoolWeb login ........................................................................................................... 22 Figure 8 SchoolWeb Login window ............................................................................................ 22 Figure 9 Main Topic Outline ....................................................................................................... 27 Figure 10 Compose a Webpage ..................................................................................................... 32 Figure 11 HTML Editor Environment ........................................................................................... 33 Figure 12 Emoticons ...................................................................................................................... 34 Figure 13 Formatting page contents............................................................................................... 35 Figure 14 Page formatting tools..................................................................................................... 36 Figure 15 Table Properties toolbar................................................................................................. 37 Figure 16 Insert Table window ...................................................................................................... 38 Figure 17 New table illustrated in HTML editor ........................................................................... 39 Figure 18 Data in a table ................................................................................................................ 39 Figure 19 HTML Editor (regular and enlarged window)............................................................... 42 Figure 20 Table Properties Window .............................................................................................. 44 Figure 21 Select desired table border............................................................................................. 46 Figure 22 Table .............................................................................................................................. 47 Figure 23 Original image file size.................................................................................................. 51 Figure 24 Stretch and Skew in Photo Editor.................................................................................. 52 Figure 25 Reduced file size............................................................................................................ 53 Figure 26 Stretch and Skew in Picture Manager............................................................................ 54 Figure 27 Stretch and Skew in Paint .............................................................................................. 55 Figure 28 Reduced file size............................................................................................................ 56 Figure 29 Insert an image............................................................................................................... 57 Figure 30 Uploaded Image in File list............................................................................................ 58 Figure 31 Image information ......................................................................................................... 59 Figure 32 Add a Topic Title........................................................................................................... 69 Figure 33 Move file........................................................................................................................ 75 Figure 34 Administration Block..................................................................................................... 77 Figure 35 Administration block ..................................................................................................... 78 Figure 36 Edit course settings........................................................................................................ 79 Figure 37 Topic formats................................................................................................................. 80 Figure 38 Managing Files .............................................................................................................. 83 Figure 39 New Folder .................................................................................................................... 84 Figure 40 File move completed ..................................................................................................... 85 Figure 41 Upload File(s) ................................................................................................................ 87 Figure 42 Contents of Files (Parent folder).................................................................................... 88 Figure 43 Contents of Science_I folder ......................................................................................... 88 Figure 44 Contents of Dinosaurs folder ......................................................................................... 88 Figure 45 Display a Directory........................................................................................................ 91 Figure 46 Select directory to display ............................................................................................. 92 Figure 47 Student view of resource ............................................................................................... 93 Figure 48 Link to a file or web site ................................................................................................ 95 Figure 49 Viewing the Calendar .................................................................................................... 99 Introduction to LISD SchoolWeb (v1) Technology Lewisville ISD © 2006 2007-06-12 6 Figure 50 Course Event on calendar ............................................................................................ 102 Figure 51 Add a course event ...................................................................................................... 103 Figure 52 Activitie<b>s...................................................................................................................... 105 Figure 53 Resources..................................................................................................................... 105 Figure 54 Glossary Example........................................................................................................ 109 Figure 55 Using the Lesson Module ............................................................................................ 110 Figure 56 Add a new Lesson........................................................................................................ 110 Figure 57 Define Lesson Pages.................................................................................................... 111 Figure 58 Lesson Summary Page................................................................................................. 112 Figure 59 Move Lesson Pages ..................................................................................................... 112 Figure 60 Check Navigation Links .............................................................................................. 112 Figure 61 Testing Screen ............................................................................................................. 112 Figure 62 Quiz Module................................................................................................................ 113 Figure 63 Create a Question......................................................................................................... 113 Figure 64 List of Questions in Category...................................................................................... 114 Figure 65 Example of Quiz.......................................................................................................... 114 Figure 66 Sample Question with Embedded Answers................................................................. 118 Figure 67 Editing the Quiz........................................................................................................... 118 Figure 68 Display List of resources ............................................................................................. 121 Figure 69 Editing Assessment Elements...................................................................................... 121 Figure 70 Editing Assessment Elements Example....................................................................... 122 Figure 71 Yes/No Grade Strategy................................................................................................ 122 Figure 72 Not Graded Grading Strategy ...................................................................................... 123 Figure 73 Error Banded Grading Strategy ................................................................................... 124 Figure 74 Grade Table ................................................................................................................. 124 Figure 75 Weighted Grading System........................................................................................... 124 Figure 76 Criterion Grading Strategy .......................................................................................... 125 Figure 77 Rubric Grading Strategy Window ............................................................................... 126 Figure 78 Rubric Grading Strategy Example............................................................................... 126 Figure 79 Add a Resource............................................................................................................ 127 Figure 80 Compose a Web page .................................................................................................. 128 Figure 81 Insert a Table ............................................................................................................... 130 Figure 82 Table in enlarged view ................................................................................................ 130 Figure 83 Merged row ................................................................................................................. 132 Figure 84 Cell Properties window ............................................................................................... 133 Figure 85 Horizontal Rule ........................................................................................................... 137 Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 7 I I I n n n t t t r r r o o o d d d u u u c c c t t t i i i o o o n n n elcome to LISD SchoolWeb! LISD is excited to bring SchoolWeb to you as a way to
develop your own web presence! Among the things you will be able to do are to communicate with students and parents, place resources, assignments and quizzes on the Internet
for your students, or manage a forum. This course will begin with the basics. You will learn how
to create your own website within the Moodle structure, how to upload resources for students,
and how to create a calendar for students and parents. And best of all you can access and update
your site from anywhere you have an Internet connection! LISD Vision The vision of Lewisville ISD is to provide a tool that is easy to use for the staff and at the same time provides a platform for parents and students to quickly and easily access pertinent content.
Moodle provides such an environment. In the past, educators have developed their own website
and posted them on the TWEB server that has been provided for that sole purpose. However,
throughout the course of LISD members learning to create sites, there have been requests for
features that were not available. Enter Moodle, hereinafter called LISD SchoolWeb (Moodle and
SchoolWeb may be used interchangeably throughout this course guide.) SchoolWeb in LISD Lewisville ISD is implementing SchoolWeb to provide a solution for teachers to create and maintain a class web page to meet their objectives for their course. The site is called LISD
SchoolWeb and will be available to students and parents via an Internet connection. SchoolWeb
will provide the tools needed to create and maintain your website from the comfort of your home or
anywhere you have an Internet connection. It will also provide a comprehensive list of those
classes such that a student or parent may configure the LISD SchoolWeb environment so they have
immediate and easy access to only the classes for that student. Parents and students need only go to
one web site to view the links to all teachers web pages in the district. W Introduction to LISD SchoolWeb (v1) Technology Lewisville ISD © 2006 2007-06-12 8 What is SchoolWeb? SchoolWeb utilizes an open source program (which means it is free) called Moodle. LISD has installed Moodle on a dedicated server, LISD SchoolWeb, to allow LISD teachers to easily create
their own web sites to integrate into their traditional classroom. These sites can be as simple as
informational sites maintained by the teacher for students and parents, to online extensions of class
work. SchoolWeb is a Course Management System, which means class information and course content can be delivered via the Internet. It allows the classroom to extend onto the web by providing a
common place for students and teachers to go for classroom resources. Using this system, teachers
can post news items, assign and collect assignments, post electronic journals and resources and
much more. Suggested uses: Listed below are some suggested uses of SchoolWeb: Teachers can make a simple web site which posts their syllabus, lesson plans, calendar of
events and other documents for student and parents to access. A teacher can integrate the interactive features of SchoolWeb into the traditional classroom
by posting discussion forums for students, creating online quizzes and presenting content
on the Internet. Teaching teams can have one site that has postings for each of the team members. Note: Care must be taken when placing content for students to access
online. It CANNOT be required of students because many students do
not have Internet access readily available. Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 9 S S S c c c h h h o o o o o o l l l W W W e e e b b b ( ( ( M M M o o o o o o d d d l l l e e e ) ) ) F F F e e e a a a t t t u u u r r r e e e s s s O O O v v v e e e r r r v v v i i i e e e w w w Information Source The basic use of the LISD SchoolWeb is as a common place for teachers to place course resources for student use as well as providing updated information concerning the course. A
teacher may provide resources such as: Any electronic content, Word, PowerPoint, Flash, Video, Sounds etc. Course Syllabus Activities and handouts Reference materials Assignments Web pages created on the fly using web forms (text or HTML) Links to external content on the Internet Calendar items News items Interactive Content The intermediate level of use is in addition to that of the basic content. A concentric location is provided for content that engages the user. At this level of use, the teacher may Create a forum to engage students in a topic of discussion Include quizzes that students can take online using a teacher defined database of questions
for re-use in different quizzes Post assignments that students can upload to the server (assignments are date-stamped and
any file format can be used). Set up a chat session to be available to chat with students. Full Integration SchoolWeb (Moodle) is written to be a full course management system to be used for online courses. This provides the platform for courses to be enhanced by the use of online content, or to
be offered in total on-line. Plans are currently under way at LISD to offer a number of staff
development sessions in the on-line format. However, no plans are currently being considered to
offer student courses on-line due to the multiple legal implications. Note: Care must be taken when placing content for students to access
online. It CANNOT be required of students because many students do
not have internet access readily available. Introduction to LISD SchoolWeb (v1) Technology Lewisville ISD © 2006 2007-06-12 10 Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 11 W W W e e e b b b P P P a a a g g g e e e B B B a a a s s s i i i c c c s s s A web page is a document on the Internet which contains text, multimedia elements, function scripts and other elements. You can create a web page using programming languages or choose a
program which allows you to create the web page as you would a PowerPoint slide or word
document and the software will translate your creation into a web page. Once a web page is created, the goal is to deliver that page to users via the Internet. This requires several resources to make this happen. Refer to the diagram below to see how this takes
place. Figure 1 Web basic cycle Before continuing, consider the steps involved in creating a web site from the inception of the idea. Careful thought and planning must be given to the project before you actually begin the
process of physically creating the website. The tasks to be completed are: Determine your vision Plan/Organize the site Gather data to be included on the site Address user accessibility issues Design the site Create the layout Maintain the site The computer user will open a web browser and an Internet connection. They search for and request a web page. The request goes to a web
Server which routes the
request to the computer
storing the page and
retrieves it for the user. The server sends the
request to the user who
was requesting the web
page. The computers web
browser receives the web
page and translates it for
the user. Introduction to LISD SchoolWeb (v1) Technology Lewisville ISD © 2006 2007-06-12 12 Vision What is your vision for your web site? Consider the following as you are planning your site: What is the purpose of the site? Identify your vision and primary purpose for creating the
site. Determine how a web page fits with your objectives for your courses? What do you want to accomplish? (inform parents and students) Who is the target audience? (parents and students) What kind of information will be included? (assignments, important dates, etc). Gather
content which may include existing documents, scanned images, digital pictures, drawings
and text. Will the users most likely have the most up-to-date browser with all the latest plug-ins?
(memory and processor speed required for graphics and animations) Plan the content and map out the file structure Plan/Organize the Site Prior to beginning your actual site content, spend time visiting other educator web sites to help you gather ideas of what content you might wish to include. Some elements of planning a web site
in SchoolWeb are generic to any web site creation process. Because of the standard features of
SchoolWeb, there is a consistent look and feel to web sites created using this tool. If you wish to do
more advanced web site design, it is recommended that you use a tool such as Macromedia
Dreamweaver MX. This allows you to create a site from a blank page. Prior to creating a web site, you need to do some advanced planning and resource gathering to make the creation process effective. During this process, take into account the features of
SchoolWeb so they can be included in the design. Necessary considerations are: Gathering Resources The construction of the web site will move much smoother if all documents that are to be included have already been gathered. This does not mean you cannot add additional documents
later. Once you have determined what your goal is, you are ready to begin gathering the data that
will be contained on the site. This may include: Begin by gathering all of the resources you will need to place in your site. These include text documents (lesson plans, syllabi), files to be included (lecture notes, PowerPoint presentations,
diagrams, pictures), and web links to additional pages that are a good resource for the content you
teach. Anything that is in a file format can be uploaded to your course (within size limits). Resources Description Text pages These are simple documents much like a Notepad file in windows, or a
Word, Excel, PowerPoint, Publisher, or Inspiration document. Web pages These are created using the HTML editor provided and can include some more
complicated features than a simple text file. An HTML page that has been
created in Dreamweaver can also be uploaded. Links You can link to files in your course as well as various web pages. Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 13 The SchoolWeb Design Cycle In order to create your web page in SchoolWeb, you can follow the design cycle as outlined below. Step Considerations 1. Define your objectives,
intended audience and
the role of the web page
you wish to create. Decide: why you are creating a web page what purpose it will serve will this be for students only or students and parents what role will this web page play in your existing
curriculum 2. Gather resources Gather resources you wish to use and save them in a centralized
place. 3. Configure your class
space Customize your class space by determining which blocks you
wish to be visible to students and parents. 4. Create a directory You need to put all uploaded files in a directory that makes
logical sense when looking for resources. 5. Add content: images,
resources, activities This may be uploading and adding links to files, creating an
html webpage, adding images, etc. 6. Maintain the site On-going maintenance is vital to keep the site useful to the
intended audience. Introduction to LISD SchoolWeb (v1) Technology Lewisville ISD © 2006 2007-06-12 14 User Accessibility According to the US Census Bureau, one in five Americans has some kind of legal disability (Source: December 1997 US Census Brief, Disabilities Affect One-Fifth of all Americans). Most
use a browser like Microsoft® Internet Explorer TM or Netscape® Navigator TM to view Web-based information. However, popular browsers do not always accommodate the needs of all people, some
of which use assistive devices. A website that is accessible to the disabled will consider the following: Visually impaired users Color blind users Users with weak vision that cannot read small text Hearing disabled users Users that cannot use a mouse Users with disabilities like arthritis or other motor-control issues Photosensitive epilepsy not as common but it is addressed by the standards The following is a list of disabilities, the common issues they present and/or solutions that can address these access issues. Blind Software that reads content out loud or solutions that
translate the content to brail. Color blind Site must be developed to not rely on color. Low vision Users with low or weak vision will use browser software
or magnifying software to adjust for disability. Deaf or Hard of Hearing Rely on captioning or text transcripts of audio content. Motor-challenged,
unable to use keyboard
and/or mouse People who do not use a mouse rely on keyboard shortcuts
or pointing devices held in the mouth. Additionally
speech interfaces provide a potential solution. Photosensitive epilepsy People with this disability could have a seizure triggered if
the computer screen has movement, flickering or
animation, which is not in compliance with the rule. Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 15 Design the site As you review existing sites, pay particular attention to the way the information is arranged. Identify those that you consider easy to navigate. A web site that is easy to navigate will be more
useful to the user for whom the site is designed in this case, the students and parents. Consider
the data to be included and sketch a flow chart to assist in creating the links that will be included for
students and other users to easily move through the site. Think of this diagram or outline as a
storyboard for a multimedia project or a movie, giving you an idea of the scope of the project and a
starting point for setting up the file structure you need. Your flow chart may look something like
the one below. (Inspiration is a great program to use as a tool in creating this design). Figure 2 Site flow chart Sketch your website layout Take a few moments to design your website layout. You may use paper and pencil or you may use
a tool that is on your computer called Inspiration. Main Page index.htm Student Page Parent Page AP History AP Government Important Dates Field T rip Form Permission Form Class Policy Assignments Assignments Course Syllabus Introduction to LISD SchoolWeb (v1) Technology Lewisville ISD © 2006 2007-06-12 16 Create the Layout Creating the layout and structure of your site is much like designing printed materials: you develop the concept first. Once you have the details about the type of content you want on the site,
you can begin to draw up all of the details you want on a particular page and sketch out your ideas
for each page. When designing a web page, the following items are very important. When using
LISD SchoolWeb, some of them may not be necessary, depending on the type of content you want
on your site. Consistency It is important to maintain consistency throughout your site. Your objective is to create a professional and interesting site that contains information that is easy to access and
understand. When designing the layout, be consistent in the use of page size, the navigation panel,
fonts, colors and animation. Page size Use the same page size throughout the site. To accommodate older monitors it is recommended to use a page size of 760 pixels by 420 pixels (see p. 17). Working within the
SchoolWeb structure, it is best to limit the page width to 500 pixels. This can either be fixed to the
left of the window or can be positioned in the center. The page size in LISD SchoolWeb is a
relative page size, which will change depending on the users monitor. To make sure the content of
your pages does not move, place ALL content in a table that is 500 pixels wide. This
accommodates the 800x600 resolution monitor. Navigation bar/panel uses the same type of navigation system on each page and place it in the same place so the user can easily find it. Fonts Use fonts that are easy to read and use these throughout the site. This is generally Arial or Times New Roman. To use special fonts to add some pizzazz to your page, create the text as an
image file. Because image files tend to be slower to download, most designers opt for a
combination of the two techniques: standard fonts for the body text, and graphical text for headings
and navigation. Colors Choosing the right color scheme is an important part of identifying your style and capturing your intended audience. Select colors that work together and that will appeal to your
audience and use these throughout the site. If you want to use a lot of colors, it is generally a good
idea to use different tones (of the same color family) rather than hues. Only 216 colors (Web-safe
colors) are common to both Macs and PCs, so it is safer to stay within the web-safe color palette. If
a computer cannot display a color youve specified, it will show the nearest possible match. Animation GIF files are a common format for animation: however, Macromedia Flash creates smaller file sizes which lead to faster download time. The key to animation on your
website is to keep it simple, use as few frames as possible, and try to use animation in small but effective ways have a specific purpose for the animation! You can achieve as much with a few subtle details as you can with many big statements. Be very careful of using multiple animations on the page. Many small moving objects distract the user from the purpose and content of the page and in many cases become irritating! Note: It is very tempting to apply a variety of animations to text;
however, a professional presentation should be consistent in the use of
animations. Remember, the purpose of animated objects is to capture
the attention of the audience. If used excessively, they lose their effect. Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 17 The key factor in viewing a web page isnt the size of the monitor, but the resolution of the page. The most common resolutions are 1024x768 and 800x600. It is important to make sure your
page width fits into the smaller resolutions. It is easier for the user to scroll down rather than
across. Build your page for 800x600 resolutions, which means it should be 760 pixels wide at the
most. To have your web page display entirely in one window, with no scrolling at all, use the
estimated dimensions below. Monitor
Resolution
(pixels) Working
page width
(pixels) Working page
height (pixels) 1024x768 980 600 800x600 760 420 640x480 600 300 Web TV 544 378 PDA 150 150 Figure 3 Page size table (in pixels) Consider some of the newer hardware people may be using. Your target audience will most likely use the common 14-15 inch monitor and a resolution of 800x600. However, new
technologies are always coming out and you need to be aware of some of the various options now
available. To provide you with a visual, consider this illustration. Figure 4 Choose a page size (in pixels) Notebook
800x600 display
Web TV 544x378
pixels
PDA
150x150
pixels Introduction to LISD SchoolWeb (v1) Technology Lewisville ISD © 2006 2007-06-12 18 Viewing Different Resolutions The examples shown below illustrate the importance of considering the resolution that is most likely to be used by the target audience for your web site. This particular web page was created in
1024x768 and is shown as viewed in a resolution setting of 1024x768 and 800x600. As you see in
the 800x600, the user will need to scroll to see the entire page. Remember, it is easier for the
typical user to scroll vertically than to scroll horizontally. This illustrates a page created at 1024x768 and viewed at 800x600 resolution Vertical and
horizontal scroll bars. This illustrates a page created at 800x600 and viewed at 1024x768 resolution Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 19 Maintain the Web site Simply designing, creating and posting the site is not the end of the process. You must maintain the site. It is very important that you keep the site updated because it directly reflects on LISD,
your campus, and you. To make the planning time and effort in constructing the site worthwhile, it: 1. should be updated on a regular basis, 2. should contain information relevant to the intended audience to be useful and effective, 3. should be easy for the user to read and navigate, and it 4. should be professional remember -- it will send a message to the entire World Wide Web
about you, your campus and your district. SchoolWeb Specific Configuration 1. All course must utilize an enrollment key (password). This is to protect the student. If an
enrollment key is not used, the student name and information is viewable by the outside world. 2. It is a good idea to create a backup copy of your data and keep on your local computer or burn
to a cd. In the event of a server crash, you can very easily restore all your data. Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 21 L L L I I I S S S D D D S S S c c c h h h o o o o o o l l l W W W e e e b b b As previously mentioned, LISD SchoolWeb has many powerful features for you to use to create your online content. This course will deal only with the basics. Emphasis will be placed on the
structure of the site as well as the content. You will begin using LISD SchoolWeb as a source of
information for parents and students. Before continuing, however, this next session is to make you aware of what is available and as your experience and comfort level increases, you may wish to add additional content at a later time.
Resources will be the first topic. SchoolWeb Environment Users can access SchoolWeb from almost any browser. It is important to become familiar with the
basis screen elements of the SchoolWeb environment. Figure 5 SchoolWeb Environment The first time you open a newly created course, it will be mostly blank. As shown in the example
above, each course has side blocks and the course content is in the center. You have the option of
which side blocks you wish to show. Two are required: Campus List and Main Menu. If these two
are removed, users will not have easy access to the main page and other campuses. Side Blocks Prior to attending class and before you can begin your LISD SchoolWeb site, you must
have logged in to SchoolWeb. When you have successfully logged in to SchoolWeb and
then notified the webmaster, the administrator will set up your account that will give you
all teacher rights. Once this has been completed, you are ready to begin. Figure 6
SchoolWeb Side blocks and Content Area Introduction to LISD SchoolWeb (v1) Technology Lewisville ISD © 2006 2007-06-12 22 Logging On Action Result 1. To open LISD SchoolWeb, open
Internet Explorer and type the following
address in the address bar: http://spsmoodle.lisd.net/schoolweb/ You should see the LISD SchoolWeb
home page. You can also go to the LISD Home
page and click on Staff/Intranet, then
SchoolWeb. Figure 7 SchoolWeb login 2. Click (Login) as shown above. The Login box will appear. Figure 8 SchoolWeb Login window Breadcrumb - an
alternative to the
back button. Click to login Link to LISD Home page Access to your courses Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 23 Action Result 3. Type your normal LISD network
username and password and click Login. You should now see the initial view
of your space as shown in Figure 7,
p 11. Side Blocks Defined Side Blocks To add/delete side blocks, click the Turn editing on button. These can
be added or deleted and moved around to fit your needs. People This block has three selections: participants (shows a list of everyone enrolled in the course) Groups Edit profile (allows the user to add personal information to their
profile.) Activities This block contains icons to the different activities or resources in your
course Calendar This block allows the user to post significant events, relative to their
course. Three types of events can be posted: Course (created by teacher and viewable only to course members ) Groups (created by teacher, viewable only to group members) User (created by and viewable only to the use students can add
their own events) Upcoming Events Displays upcoming Calendar events in an abbreviated list with links to the
actual event. If this event is an Assignment, Forum, Quiz or Chat closing
date the participant can link directly to the activity. Search Allows participants to do a Google like search of all Forums, Administration Management tools for the teacher Courses Displays a list of all courses that a participant is enrolled in, allowing one-
click access to another course home page. Latest News The News forum within the course provides a why in which the teacher
can post course news for the participants. Recent Activity Displays two types of information for the user: An abbreviated list of what they have done since their last login A more detailed full report of recent activity. Online User Displays name and image of everyone logged in to the course within the
past 5 minutes. Content Area Side Blocks Introduction to LISD SchoolWeb (v1) Technology Lewisville ISD © 2006 2007-06-12 24 Edit your Profile It is important that you check to make sure all information in your profile is correct. Before continuing, you will check to see that all of the information contained in SchoolWeb is current and
accurate. If not you can easily edit by following the steps below. Action Result 1. To access your profile to verify the
information, click on the link to All
Courses. This link should just under My
Courses. 2. Locate the name of your campus. You
name should be listed as a subcategory of
your campus. 3. Locate and click on your name. You will see a list of teachers for your
campus. 4. Notice this class is listed as
SchoolWeb101 and you are the teacher.
Click on your name as the Teacher: This will open the profile window for you
to view and modify/edit your profile
information. 5. Click on the Edit Profile tab. This opens the window for you to make any
necessary corrections to your profile. 6. Make any necessary changes then scroll
down and click update profile. Note: The profile will only update if all
information is present. This includes the
following required fields:
First name
...... affiliated with the authors of this page or responsible for its content. Study Guide Layout - Heading 1 Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 1 T T a a b b l l e e o o f f C C o o n n t t e e n n t t s s T T a a b b l l e e o o f f F F i i g g u u r r e e s s ..............................................................................................................................5 Introduction......................................................................................................................................7 LISD Vision .................................................................................................................................7 SchoolWeb in LISD .....................................................................................................................7 What is SchoolWeb?................................................................................................................8 SchoolWeb (Moodle) Features Overview........................................................................................9 Information Source ......................................................................................................................9 Interactive Content.......................................................................................................................9 Full Integration.............................................................................................................................9 Web Page Basics............................................................................................................................11 Vision.........................................................................................................................................12 Plan/Organize the Site................................................................................................................12 Gathering Resources ..................................................................................................................12 The SchoolWeb Design Cycle ...................................................................................................13 User Accessibility ......................................................................................................................14 Design the site............................................................................................................................15 Sketch your website layout ....................................................................................................15 Create the Layout .......................................................................................................................16 Viewing Different Resolutions ..................................................................................................18 Maintain the Web site ................................................................................................................19 SchoolWeb Specific Configuration............................................................................................19 LISD SchoolWeb ...........................................................................................................................21 SchoolWeb Environment ...........................................................................................................21 Logging On ................................................................................................................................22 Side Blocks Defined...............................................................................................................23 Edit your Profile.....................................................................................................................24 Course Setup ..................................................................................................................................27 Topic Outline .................................................................................................................................27 SchoolWeb Course Environment...............................................................................................27 Tools, Icons and Definitions ..............................................................................................28 The following icons will be used frequently as you continue to develop your site. ......................28 Course Setup Settings .............................................................................................................28 Short name: This is the name that will appear in the breadcrumbs ..........................................29 Adding Content..............................................................................................................................31 Editing Symbols.........................................................................................................................31 Course Home Page Summary Description.................................................................................32 Rich text HTML Editor Features ...............................................................................................34 Paste text in from other Applications.........................................................................................34 Inserting images .....................................................................................................................34 Inserting Tables ......................................................................................................................34 Inserting Links .......................................................................................................................34 Inserting Emoticons ...............................................................................................................34 Richtext HTML Editor Environment .....................................................................................35 Formatting Toolbar 1 .........................................................................................................35 Formatting Toolbar 2 .........................................................................................................36 Table Properties Toolbar....................................................................................................37 Insert a Table..............................................................................................................................38 HTML Basics.................................................................................................................................41 Introduction to LISD SchoolWeb (v1) Technology Lewisville ISD © 2006 2007-06-12 2 View HTML Code..................................................................................................................... 42 Change Table color................................................................................................................ 44 Text line spacing.................................................................................................................... 44 Add a Table Border ............................................................................................................... 46 Your table should look similar to that shown here. ....................................................................... 47 Add an Image ................................................................................................................................ 49 Download Images and Files ...................................................................................................... 50 Image Size ................................................................................................................................. 51 View File Size ....................................................................................................................... 51 Reduce Image Size in Microsoft Photo Editor ...................................................................... 52 Reduce Image Size in Microsoft Picture Manager ................................................................ 54 Reduce Image Size in Microsoft Paint .................................................................................. 55 Upload Image ............................................................................................................................ 56 Insert Image ............................................................................................................................... 59 Image URL ............................................................................................................................ 59 Formatting the Image............................................................................................................. 60 Accessibility Standards...................................................................................................... 60 Add Alternate Text....................................................................................................... 60 Align Image in the Cell ..................................................................................................... 60 Check Image Size (in pixels) ....................................................................................................... 61 Your work thus far should look something like the example here. ............................................... 62 Topic Outline Contents...................................................................................................... 63 Adding Resources.......................................................................................................................... 65 Resource types........................................................................................................................... 65 Compose a Web page .................................................................................................................... 67 Using Tables.............................................................................................................................. 67 Table Basics............................................................................................................................... 67 Table Types ........................................................................................................................... 67 Fixed-width........................................................................................................................ 67 Relative/percentage-width ................................................................................................. 68 Table adjusts depending on the resolution of the monitor............................................................. 68 Nested tables...................................................................................................................... 68 General Guidelines for using tables........................................................................................... 68 Insert a Topic Title ................................................................................................................ 69 Compose a Text Page .................................................................................................................... 71 Window Settings ........................................................................................................................... 73 Move a Page .................................................................................................................................. 75 Administration Block .................................................................................................................... 77 Settings ...................................................................................................................................... 79 Format.................................................................................................................................... 79 Weekly............................................................................................................................... 80 Topic.................................................................................................................................. 80 Course Start Date................................................................................................................... 80 Enrollment Period.................................................................................................................. 80 Group Mode........................................................................................................................... 81 Enrollment Key ..................................................................................................................... 81 Guest Access ......................................................................................................................... 81 Hidden Sections..................................................................................................................... 82 News Items to show............................................................................................................... 82 Files ........................................................................................................................................... 82 Create a Directory.......................................................................................................................... 83 Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 3 Create a Folder ...........................................................................................................................83 Move Files to Folders ................................................................................................................85 Now that you have a folder for Images, you can move the image file to that folder. ....................85 Upload a resource (file)..................................................................................................................87 Delete Files ................................................................................................................................89 Display a Directory ........................................................................................................................91 Revise Topic Summary..............................................................................................................93 Building Basic Navigation .............................................................................................................95 Link to a web site .......................................................................................................................95 Image link ..................................................................................................................................97 Email link...................................................................................................................................97 Add subject to email link .......................................................................................................97 Add a Calendar...............................................................................................................................99 Add Calendar Block.................................................................................................................100 To add the Calendar block to your page, .....................................................................................100 Add a User Event .................................................................................................................100 To add a user event, one that is viewable to only you, follow these steps...................................100 Delete a User Event..............................................................................................................101 Add a Course Event .............................................................................................................102 To add a course event, one that is viewable to everyone in your class, follow these steps. ........102 SchoolWeb (Moodle) Modules....................................................................................................105 Adding Activities and Resources .............................................................................................105 Assignment Module .............................................................................................................107 Assignment name:............................................................................................................107 Description .......................................................................................................................107 Assignment type:..............................................................................................................107 Allow resubmitting: .........................................................................................................107 Grade................................................................................................................................107 Maximum size:.................................................................................................................107 Due date: ..........................................................................................................................107 Chat Module.........................................................................................................................107 Choice Module.....................................................................................................................107 Forum Module......................................................................................................................108 Glossary ...............................................................................................................................108 Lesson Module.....................................................................................................................110 The items on the first page are:....................................................................................................111 Quiz Module ........................................................................................................................113 When you have everything the way you want it, click on Save changes. Your Embedded .....117 Scorm Module......................................................................................................................118 Survey Module.....................................................................................................................118 Wiki Module ........................................................................................................................118 Workshop Module................................................................................................................119 Workgroup Evaluation Types ..............................................................................................121 Accumulative Grading Strategy.......................................................................................121 What an accumulative evaluation looks like: ..........................................................................123 Not Graded Grading Strategy...........................................................................................123 Error Banded Grading Strategy........................................................................................124 Criterion Grading Strategy...............................................................................................125 Rubric Grading Strategy ..................................................................................................126 Appendix......................................................................................................................................127 Add a Web Page with Table ....................................................................................................127 Introduction to LISD SchoolWeb (v1) Technology Lewisville ISD © 2006 2007-06-12 4 Compose a Web page ...................................................................................................... 127 Insert a Table ....................................................................................................................... 129 Merging table cells .............................................................................................................. 131 Character Formatting........................................................................................................... 132 Font Face ......................................................................................................................... 132 Font Size.......................................................................................................................... 132 Font Color and Style........................................................................................................ 133 Table Formatting ................................................................................................................. 133 Cell Properties ................................................................................................................. 133 It appears you need one more row! Not a problem. ................................................................... 134 Add a Row....................................................................................................................... 134 To add a row to an existing table, use the icons on the toolbar. .................................................. 134 Bold............................................................................................................................ 135 Font Face.................................................................................................................... 135 Font Size .................................................................................................................... 135 Color........................................................................................................................... 135 Superscript/ Subscript ................................................................................................ 135 Table background color ................................................................................................... 136 Horizontal Rule ....................................................................................................................... 137 Edit HTML .......................................................................................................................... 138 Change Color................................................................................................................... 138 Change Length (Width)....................................................................................................... 138 Change Height (Size)........................................................................................................... 139 HTML Tags ............................................................................................................................. 140 Main HTML tags................................................................................................................. 140 Text tags .............................................................................................................................. 140 Simple Formatting Tags ...................................................................................................... 141 Making Links....................................................................................................................... 142 Graphics............................................................................................................................... 142 Tables .................................................................................................................................. 143 Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 5 T T a a b b l l e e o o f f F F i i g g u u r r e e s s
Figure 1 Web basic cycle ............................................................................................................. 11 Figure 2 Site flow chart................................................................................................................ 15 Figure 3 Page size table (in pixels) .............................................................................................. 17 Figure 4 Choose a page size (in pixels) ....................................................................................... 17 Figure 5 SchoolWeb Environment............................................................................................... 21 Figure 7 SchoolWeb login ........................................................................................................... 22 Figure 8 SchoolWeb Login window ............................................................................................ 22 Figure 9 Main Topic Outline ....................................................................................................... 27 Figure 10 Compose a Webpage ..................................................................................................... 32 Figure 11 HTML Editor Environment ........................................................................................... 33 Figure 12 Emoticons ...................................................................................................................... 34 Figure 13 Formatting page contents............................................................................................... 35 Figure 14 Page formatting tools..................................................................................................... 36 Figure 15 Table Properties toolbar................................................................................................. 37 Figure 16 Insert Table window ...................................................................................................... 38 Figure 17 New table illustrated in HTML editor ........................................................................... 39 Figure 18 Data in a table ................................................................................................................ 39 Figure 19 HTML Editor (regular and enlarged window)............................................................... 42 Figure 20 Table Properties Window .............................................................................................. 44 Figure 21 Select desired table border............................................................................................. 46 Figure 22 Table .............................................................................................................................. 47 Figure 23 Original image file size.................................................................................................. 51 Figure 24 Stretch and Skew in Photo Editor.................................................................................. 52 Figure 25 Reduced file size............................................................................................................ 53 Figure 26 Stretch and Skew in Picture Manager............................................................................ 54 Figure 27 Stretch and Skew in Paint .............................................................................................. 55 Figure 28 Reduced file size............................................................................................................ 56 Figure 29 Insert an image............................................................................................................... 57 Figure 30 Uploaded Image in File list............................................................................................ 58 Figure 31 Image information ......................................................................................................... 59 Figure 32 Add a Topic Title........................................................................................................... 69 Figure 33 Move file........................................................................................................................ 75 Figure 34 Administration Block..................................................................................................... 77 Figure 35 Administration block ..................................................................................................... 78 Figure 36 Edit course settings........................................................................................................ 79 Figure 37 Topic formats................................................................................................................. 80 Figure 38 Managing Files .............................................................................................................. 83 Figure 39 New Folder .................................................................................................................... 84 Figure 40 File move completed ..................................................................................................... 85 Figure 41 Upload File(s) ................................................................................................................ 87 Figure 42 Contents of Files (Parent folder).................................................................................... 88 Figure 43 Contents of Science_I folder ......................................................................................... 88 Figure 44 Contents of Dinosaurs folder ......................................................................................... 88 Figure 45 Display a Directory........................................................................................................ 91 Figure 46 Select directory to display ............................................................................................. 92 Figure 47 Student view of resource ............................................................................................... 93 Figure 48 Link to a file or web site ................................................................................................ 95 Figure 49 Viewing the Calendar .................................................................................................... 99 Introduction to LISD SchoolWeb (v1) Technology Lewisville ISD © 2006 2007-06-12 6 Figure 50 Course Event on calendar ............................................................................................ 102 Figure 51 Add a course event ...................................................................................................... 103 Figure 52 Activitie<b>s...................................................................................................................... 105 Figure 53 Resources..................................................................................................................... 105 Figure 54 Glossary Example........................................................................................................ 109 Figure 55 Using the Lesson Module ............................................................................................ 110 Figure 56 Add a new Lesson........................................................................................................ 110 Figure 57 Define Lesson Pages.................................................................................................... 111 Figure 58 Lesson Summary Page................................................................................................. 112 Figure 59 Move Lesson Pages ..................................................................................................... 112 Figure 60 Check Navigation Links .............................................................................................. 112 Figure 61 Testing Screen ............................................................................................................. 112 Figure 62 Quiz Module................................................................................................................ 113 Figure 63 Create a Question......................................................................................................... 113 Figure 64 List of Questions in Category...................................................................................... 114 Figure 65 Example of Quiz.......................................................................................................... 114 Figure 66 Sample Question with Embedded Answers................................................................. 118 Figure 67 Editing the Quiz........................................................................................................... 118 Figure 68 Display List of resources ............................................................................................. 121 Figure 69 Editing Assessment Elements...................................................................................... 121 Figure 70 Editing Assessment Elements Example....................................................................... 122 Figure 71 Yes/No Grade Strategy................................................................................................ 122 Figure 72 Not Graded Grading Strategy ...................................................................................... 123 Figure 73 Error Banded Grading Strategy ................................................................................... 124 Figure 74 Grade Table ................................................................................................................. 124 Figure 75 Weighted Grading System........................................................................................... 124 Figure 76 Criterion Grading Strategy .......................................................................................... 125 Figure 77 Rubric Grading Strategy Window ............................................................................... 126 Figure 78 Rubric Grading Strategy Example............................................................................... 126 Figure 79 Add a Resource............................................................................................................ 127 Figure 80 Compose a Web page .................................................................................................. 128 Figure 81 Insert a Table ............................................................................................................... 130 Figure 82 Table in enlarged view ................................................................................................ 130 Figure 83 Merged row ................................................................................................................. 132 Figure 84 Cell Properties window ............................................................................................... 133 Figure 85 Horizontal Rule ........................................................................................................... 137 Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 7 I I I n n n t t t r r r o o o d d d u u u c c c t t t i i i o o o n n n elcome to LISD SchoolWeb! LISD is excited to bring SchoolWeb to you as a way to
develop your own web presence! Among the things you will be able to do are to communicate with students and parents, place resources, assignments and quizzes on the Internet
for your students, or manage a forum. This course will begin with the basics. You will learn how
to create your own website within the Moodle structure, how to upload resources for students,
and how to create a calendar for students and parents. And best of all you can access and update
your site from anywhere you have an Internet connection! LISD Vision The vision of Lewisville ISD is to provide a tool that is easy to use for the staff and at the same time provides a platform for parents and students to quickly and easily access pertinent content.
Moodle provides such an environment. In the past, educators have developed their own website
and posted them on the TWEB server that has been provided for that sole purpose. However,
throughout the course of LISD members learning to create sites, there have been requests for
features that were not available. Enter Moodle, hereinafter called LISD SchoolWeb (Moodle and
SchoolWeb may be used interchangeably throughout this course guide.) SchoolWeb in LISD Lewisville ISD is implementing SchoolWeb to provide a solution for teachers to create and maintain a class web page to meet their objectives for their course. The site is called LISD
SchoolWeb and will be available to students and parents via an Internet connection. SchoolWeb
will provide the tools needed to create and maintain your website from the comfort of your home or
anywhere you have an Internet connection. It will also provide a comprehensive list of those
classes such that a student or parent may configure the LISD SchoolWeb environment so they have
immediate and easy access to only the classes for that student. Parents and students need only go to
one web site to view the links to all teachers web pages in the district. W Introduction to LISD SchoolWeb (v1) Technology Lewisville ISD © 2006 2007-06-12 8 What is SchoolWeb? SchoolWeb utilizes an open source program (which means it is free) called Moodle. LISD has installed Moodle on a dedicated server, LISD SchoolWeb, to allow LISD teachers to easily create
their own web sites to integrate into their traditional classroom. These sites can be as simple as
informational sites maintained by the teacher for students and parents, to online extensions of class
work. SchoolWeb is a Course Management System, which means class information and course content can be delivered via the Internet. It allows the classroom to extend onto the web by providing a
common place for students and teachers to go for classroom resources. Using this system, teachers
can post news items, assign and collect assignments, post electronic journals and resources and
much more. Suggested uses: Listed below are some suggested uses of SchoolWeb: Teachers can make a simple web site which posts their syllabus, lesson plans, calendar of
events and other documents for student and parents to access. A teacher can integrate the interactive features of SchoolWeb into the traditional classroom
by posting discussion forums for students, creating online quizzes and presenting content
on the Internet. Teaching teams can have one site that has postings for each of the team members. Note: Care must be taken when placing content for students to access
online. It CANNOT be required of students because many students do
not have Internet access readily available. Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 9 S S S c c c h h h o o o o o o l l l W W W e e e b b b ( ( ( M M M o o o o o o d d d l l l e e e ) ) ) F F F e e e a a a t t t u u u r r r e e e s s s O O O v v v e e e r r r v v v i i i e e e w w w Information Source The basic use of the LISD SchoolWeb is as a common place for teachers to place course resources for student use as well as providing updated information concerning the course. A
teacher may provide resources such as: Any electronic content, Word, PowerPoint, Flash, Video, Sounds etc. Course Syllabus Activities and handouts Reference materials Assignments Web pages created on the fly using web forms (text or HTML) Links to external content on the Internet Calendar items News items Interactive Content The intermediate level of use is in addition to that of the basic content. A concentric location is provided for content that engages the user. At this level of use, the teacher may Create a forum to engage students in a topic of discussion Include quizzes that students can take online using a teacher defined database of questions
for re-use in different quizzes Post assignments that students can upload to the server (assignments are date-stamped and
any file format can be used). Set up a chat session to be available to chat with students. Full Integration SchoolWeb (Moodle) is written to be a full course management system to be used for online courses. This provides the platform for courses to be enhanced by the use of online content, or to
be offered in total on-line. Plans are currently under way at LISD to offer a number of staff
development sessions in the on-line format. However, no plans are currently being considered to
offer student courses on-line due to the multiple legal implications. Note: Care must be taken when placing content for students to access
online. It CANNOT be required of students because many students do
not have internet access readily available. Introduction to LISD SchoolWeb (v1) Technology Lewisville ISD © 2006 2007-06-12 10 Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 11 W W W e e e b b b P P P a a a g g g e e e B B B a a a s s s i i i c c c s s s A web page is a document on the Internet which contains text, multimedia elements, function scripts and other elements. You can create a web page using programming languages or choose a
program which allows you to create the web page as you would a PowerPoint slide or word
document and the software will translate your creation into a web page. Once a web page is created, the goal is to deliver that page to users via the Internet. This requires several resources to make this happen. Refer to the diagram below to see how this takes
place. Figure 1 Web basic cycle Before continuing, consider the steps involved in creating a web site from the inception of the idea. Careful thought and planning must be given to the project before you actually begin the
process of physically creating the website. The tasks to be completed are: Determine your vision Plan/Organize the site Gather data to be included on the site Address user accessibility issues Design the site Create the layout Maintain the site The computer user will open a web browser and an Internet connection. They search for and request a web page. The request goes to a web
Server which routes the
request to the computer
storing the page and
retrieves it for the user. The server sends the
request to the user who
was requesting the web
page. The computers web
browser receives the web
page and translates it for
the user. Introduction to LISD SchoolWeb (v1) Technology Lewisville ISD © 2006 2007-06-12 12 Vision What is your vision for your web site? Consider the following as you are planning your site: What is the purpose of the site? Identify your vision and primary purpose for creating the
site. Determine how a web page fits with your objectives for your courses? What do you want to accomplish? (inform parents and students) Who is the target audience? (parents and students) What kind of information will be included? (assignments, important dates, etc). Gather
content which may include existing documents, scanned images, digital pictures, drawings
and text. Will the users most likely have the most up-to-date browser with all the latest plug-ins?
(memory and processor speed required for graphics and animations) Plan the content and map out the file structure Plan/Organize the Site Prior to beginning your actual site content, spend time visiting other educator web sites to help you gather ideas of what content you might wish to include. Some elements of planning a web site
in SchoolWeb are generic to any web site creation process. Because of the standard features of
SchoolWeb, there is a consistent look and feel to web sites created using this tool. If you wish to do
more advanced web site design, it is recommended that you use a tool such as Macromedia
Dreamweaver MX. This allows you to create a site from a blank page. Prior to creating a web site, you need to do some advanced planning and resource gathering to make the creation process effective. During this process, take into account the features of
SchoolWeb so they can be included in the design. Necessary considerations are: Gathering Resources The construction of the web site will move much smoother if all documents that are to be included have already been gathered. This does not mean you cannot add additional documents
later. Once you have determined what your goal is, you are ready to begin gathering the data that
will be contained on the site. This may include: Begin by gathering all of the resources you will need to place in your site. These include text documents (lesson plans, syllabi), files to be included (lecture notes, PowerPoint presentations,
diagrams, pictures), and web links to additional pages that are a good resource for the content you
teach. Anything that is in a file format can be uploaded to your course (within size limits). Resources Description Text pages These are simple documents much like a Notepad file in windows, or a
Word, Excel, PowerPoint, Publisher, or Inspiration document. Web pages These are created using the HTML editor provided and can include some more
complicated features than a simple text file. An HTML page that has been
created in Dreamweaver can also be uploaded. Links You can link to files in your course as well as various web pages. Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 13 The SchoolWeb Design Cycle In order to create your web page in SchoolWeb, you can follow the design cycle as outlined below. Step Considerations 1. Define your objectives,
intended audience and
the role of the web page
you wish to create. Decide: why you are creating a web page what purpose it will serve will this be for students only or students and parents what role will this web page play in your existing
curriculum 2. Gather resources Gather resources you wish to use and save them in a centralized
place. 3. Configure your class
space Customize your class space by determining which blocks you
wish to be visible to students and parents. 4. Create a directory You need to put all uploaded files in a directory that makes
logical sense when looking for resources. 5. Add content: images,
resources, activities This may be uploading and adding links to files, creating an
html webpage, adding images, etc. 6. Maintain the site On-going maintenance is vital to keep the site useful to the
intended audience. Introduction to LISD SchoolWeb (v1) Technology Lewisville ISD © 2006 2007-06-12 14 User Accessibility According to the US Census Bureau, one in five Americans has some kind of legal disability (Source: December 1997 US Census Brief, Disabilities Affect One-Fifth of all Americans). Most
use a browser like Microsoft® Internet Explorer TM or Netscape® Navigator TM to view Web-based information. However, popular browsers do not always accommodate the needs of all people, some
of which use assistive devices. A website that is accessible to the disabled will consider the following: Visually impaired users Color blind users Users with weak vision that cannot read small text Hearing disabled users Users that cannot use a mouse Users with disabilities like arthritis or other motor-control issues Photosensitive epilepsy not as common but it is addressed by the standards The following is a list of disabilities, the common issues they present and/or solutions that can address these access issues. Blind Software that reads content out loud or solutions that
translate the content to brail. Color blind Site must be developed to not rely on color. Low vision Users with low or weak vision will use browser software
or magnifying software to adjust for disability. Deaf or Hard of Hearing Rely on captioning or text transcripts of audio content. Motor-challenged,
unable to use keyboard
and/or mouse People who do not use a mouse rely on keyboard shortcuts
or pointing devices held in the mouth. Additionally
speech interfaces provide a potential solution. Photosensitive epilepsy People with this disability could have a seizure triggered if
the computer screen has movement, flickering or
animation, which is not in compliance with the rule. Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 15 Design the site As you review existing sites, pay particular attention to the way the information is arranged. Identify those that you consider easy to navigate. A web site that is easy to navigate will be more
useful to the user for whom the site is designed in this case, the students and parents. Consider
the data to be included and sketch a flow chart to assist in creating the links that will be included for
students and other users to easily move through the site. Think of this diagram or outline as a
storyboard for a multimedia project or a movie, giving you an idea of the scope of the project and a
starting point for setting up the file structure you need. Your flow chart may look something like
the one below. (Inspiration is a great program to use as a tool in creating this design). Figure 2 Site flow chart Sketch your website layout Take a few moments to design your website layout. You may use paper and pencil or you may use
a tool that is on your computer called Inspiration. Main Page index.htm Student Page Parent Page AP History AP Government Important Dates Field T rip Form Permission Form Class Policy Assignments Assignments Course Syllabus Introduction to LISD SchoolWeb (v1) Technology Lewisville ISD © 2006 2007-06-12 16 Create the Layout Creating the layout and structure of your site is much like designing printed materials: you develop the concept first. Once you have the details about the type of content you want on the site,
you can begin to draw up all of the details you want on a particular page and sketch out your ideas
for each page. When designing a web page, the following items are very important. When using
LISD SchoolWeb, some of them may not be necessary, depending on the type of content you want
on your site. Consistency It is important to maintain consistency throughout your site. Your objective is to create a professional and interesting site that contains information that is easy to access and
understand. When designing the layout, be consistent in the use of page size, the navigation panel,
fonts, colors and animation. Page size Use the same page size throughout the site. To accommodate older monitors it is recommended to use a page size of 760 pixels by 420 pixels (see p. 17). Working within the
SchoolWeb structure, it is best to limit the page width to 500 pixels. This can either be fixed to the
left of the window or can be positioned in the center. The page size in LISD SchoolWeb is a
relative page size, which will change depending on the users monitor. To make sure the content of
your pages does not move, place ALL content in a table that is 500 pixels wide. This
accommodates the 800x600 resolution monitor. Navigation bar/panel uses the same type of navigation system on each page and place it in the same place so the user can easily find it. Fonts Use fonts that are easy to read and use these throughout the site. This is generally Arial or Times New Roman. To use special fonts to add some pizzazz to your page, create the text as an
image file. Because image files tend to be slower to download, most designers opt for a
combination of the two techniques: standard fonts for the body text, and graphical text for headings
and navigation. Colors Choosing the right color scheme is an important part of identifying your style and capturing your intended audience. Select colors that work together and that will appeal to your
audience and use these throughout the site. If you want to use a lot of colors, it is generally a good
idea to use different tones (of the same color family) rather than hues. Only 216 colors (Web-safe
colors) are common to both Macs and PCs, so it is safer to stay within the web-safe color palette. If
a computer cannot display a color youve specified, it will show the nearest possible match. Animation GIF files are a common format for animation: however, Macromedia Flash creates smaller file sizes which lead to faster download time. The key to animation on your
website is to keep it simple, use as few frames as possible, and try to use animation in small but effective ways have a specific purpose for the animation! You can achieve as much with a few subtle details as you can with many big statements. Be very careful of using multiple animations on the page. Many small moving objects distract the user from the purpose and content of the page and in many cases become irritating! Note: It is very tempting to apply a variety of animations to text;
however, a professional presentation should be consistent in the use of
animations. Remember, the purpose of animated objects is to capture
the attention of the audience. If used excessively, they lose their effect. Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 17 The key factor in viewing a web page isnt the size of the monitor, but the resolution of the page. The most common resolutions are 1024x768 and 800x600. It is important to make sure your
page width fits into the smaller resolutions. It is easier for the user to scroll down rather than
across. Build your page for 800x600 resolutions, which means it should be 760 pixels wide at the
most. To have your web page display entirely in one window, with no scrolling at all, use the
estimated dimensions below. Monitor
Resolution
(pixels) Working
page width
(pixels) Working page
height (pixels) 1024x768 980 600 800x600 760 420 640x480 600 300 Web TV 544 378 PDA 150 150 Figure 3 Page size table (in pixels) Consider some of the newer hardware people may be using. Your target audience will most likely use the common 14-15 inch monitor and a resolution of 800x600. However, new
technologies are always coming out and you need to be aware of some of the various options now
available. To provide you with a visual, consider this illustration. Figure 4 Choose a page size (in pixels) Notebook
800x600 display
Web TV 544x378
pixels
PDA
150x150
pixels Introduction to LISD SchoolWeb (v1) Technology Lewisville ISD © 2006 2007-06-12 18 Viewing Different Resolutions The examples shown below illustrate the importance of considering the resolution that is most likely to be used by the target audience for your web site. This particular web page was created in
1024x768 and is shown as viewed in a resolution setting of 1024x768 and 800x600. As you see in
the 800x600, the user will need to scroll to see the entire page. Remember, it is easier for the
typical user to scroll vertically than to scroll horizontally. This illustrates a page created at 1024x768 and viewed at 800x600 resolution Vertical and
horizontal scroll bars. This illustrates a page created at 800x600 and viewed at 1024x768 resolution Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 19 Maintain the Web site Simply designing, creating and posting the site is not the end of the process. You must maintain the site. It is very important that you keep the site updated because it directly reflects on LISD,
your campus, and you. To make the planning time and effort in constructing the site worthwhile, it: 1. should be updated on a regular basis, 2. should contain information relevant to the intended audience to be useful and effective, 3. should be easy for the user to read and navigate, and it 4. should be professional remember -- it will send a message to the entire World Wide Web
about you, your campus and your district. SchoolWeb Specific Configuration 1. All course must utilize an enrollment key (password). This is to protect the student. If an
enrollment key is not used, the student name and information is viewable by the outside world. 2. It is a good idea to create a backup copy of your data and keep on your local computer or burn
to a cd. In the event of a server crash, you can very easily restore all your data. Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 21 L L L I I I S S S D D D S S S c c c h h h o o o o o o l l l W W W e e e b b b As previously mentioned, LISD SchoolWeb has many powerful features for you to use to create your online content. This course will deal only with the basics. Emphasis will be placed on the
structure of the site as well as the content. You will begin using LISD SchoolWeb as a source of
information for parents and students. Before continuing, however, this next session is to make you aware of what is available and as your experience and comfort level increases, you may wish to add additional content at a later time.
Resources will be the first topic. SchoolWeb Environment Users can access SchoolWeb from almost any browser. It is important to become familiar with the
basis screen elements of the SchoolWeb environment. Figure 5 SchoolWeb Environment The first time you open a newly created course, it will be mostly blank. As shown in the example
above, each course has side blocks and the course content is in the center. You have the option of
which side blocks you wish to show. Two are required: Campus List and Main Menu. If these two
are removed, users will not have easy access to the main page and other campuses. Side Blocks Prior to attending class and before you can begin your LISD SchoolWeb site, you must
have logged in to SchoolWeb. When you have successfully logged in to SchoolWeb and
then notified the webmaster, the administrator will set up your account that will give you
all teacher rights. Once this has been completed, you are ready to begin. Figure 6
SchoolWeb Side blocks and Content Area Introduction to LISD SchoolWeb (v1) Technology Lewisville ISD © 2006 2007-06-12 22 Logging On Action Result 1. To open LISD SchoolWeb, open
Internet Explorer and type the following
address in the address bar: http://spsmoodle.lisd.net/schoolweb/ You should see the LISD SchoolWeb
home page. You can also go to the LISD Home
page and click on Staff/Intranet, then
SchoolWeb. Figure 7 SchoolWeb login 2. Click (Login) as shown above. The Login box will appear. Figure 8 SchoolWeb Login window Breadcrumb - an
alternative to the
back button. Click to login Link to LISD Home page Access to your courses Introduction to LISD SchoolWeb (v2) Technology
Lewisville ISD © 2006
2007-06-12 23 Action Result 3. Type your normal LISD network
username and password and click Login. You should now see the initial view
of your space as shown in Figure 7,
p 11. Side Blocks Defined Side Blocks To add/delete side blocks, click the Turn editing on button. These can
be added or deleted and moved around to fit your needs. People This block has three selections: participants (shows a list of everyone enrolled in the course) Groups Edit profile (allows the user to add personal information to their
profile.) Activities This block contains icons to the different activities or resources in your
course Calendar This block allows the user to post significant events, relative to their
course. Three types of events can be posted: Course (created by teacher and viewable only to course members ) Groups (created by teacher, viewable only to group members) User (created by and viewable only to the use students can add
their own events) Upcoming Events Displays upcoming Calendar events in an abbreviated list with links to the
actual event. If this event is an Assignment, Forum, Quiz or Chat closing
date the participant can link directly to the activity. Search Allows participants to do a Google like search of all Forums, Administration Management tools for the teacher Courses Displays a list of all courses that a participant is enrolled in, allowing one-
click access to another course home page. Latest News The News forum within the course provides a why in which the teacher
can post course news for the participants. Recent Activity Displays two types of information for the user: An abbreviated list of what they have done since their last login A more detailed full report of recent activity. Online User Displays name and image of everyone logged in to the course within the
past 5 minutes. Content Area Side Blocks Introduction to LISD SchoolWeb (v1) Technology Lewisville ISD © 2006 2007-06-12 24 Edit your Profile It is important that you check to make sure all information in your profile is correct. Before continuing, you will check to see that all of the information contained in SchoolWeb is current and
accurate. If not you can easily edit by following the steps below. Action Result 1. To access your profile to verify the
information, click on the link to All
Courses. This link should just under My
Courses. 2. Locate the name of your campus. You
name should be listed as a subcategory of
your campus. 3. Locate and click on your name. You will see a list of teachers for your
campus. 4. Notice this class is listed as
SchoolWeb101 and you are the teacher.
Click on your name as the Teacher: This will open the profile window for you
to view and modify/edit your profile
information. 5. Click on the Edit Profile tab. This opens the window for you to make any
necessary corrections to your profile. 6. Make any necessary changes then scroll
down and click update profile. Note: The profile will only update if all
information is present. This includes the
following required fields:
First name