.
TESOL 2003
Electronic
Village Online
Session


Our Syllabus

onlinemag
YahooGroup Site

2003 EV_Online

Session
Moderators:

Sandy Peters
Anne Davis
Julia Karet

Creating an Online Magazine for Student Writing


Welcome | Members | Syllabus | Week 1 | Week 2 | Week 3
Week 4 | Week 6 | Week 7

Week Five: Introduction to basic web design

Web design is important. Once you have interesting content to put on the web, plan carefully before you begin to create your site. There are a number of design elements to consider. For your web site to be successful, it should look interesting and inviting. Presentation is important!

If you are a newcomer to to web site building, you will probably need to continue working on setting up web pages before you can actually implement principals of web design. Don't worry! Just continue with this week's assignments, and you can apply the principles later.


Activity: Considering design elements

We'll look at three elements of web design:

  1. making your site readable,
  2. making it easy to navigate
  3. using graphics purposefully.

We'll introduce these elements by examining three sections of student writings from Topics.

Note: We do not mean to say these pages have accomplished ideal web design. We have just tried to choose sections where we have tried hard to incorporate these elements ourselves. We have decided to display them in an attempt to illustrate the things we are trying to explain. Please feel free to point out where we may have been unsuccessful!


1: Ways to make it easy for visitors to your site to read.
The key to making your site look inviting to readers is to make it easy to read. There are a number of design elements to consider if you want readable pages.

Open: Unforgettable Experiences
As you explore the pages in this section, consider the following questions. These are questions you need to ask yourself when you are creating your own pages.

  1. Is the font (writing) easy to read or not?

  2. Is there enough contrast between the fonts and the background color to make it easy to read ?

  3. How long is each page? Is there something at the top of the page to catch your attention? Can you get the main ideas of the content of each page as it opens up, or do you have to scroll down to find out what the page is about?

  4. Is the content "chunked" into short meaningful units with enough "white" space around each unit of text to make it easy to read, or is the text too dense to read easily?

  5. Are the lines short enough so that you can easily scan them and read down the page quickly, or do you have to scroll to the right to read each line?

  6. Are the pages organized well enough to make them easy to understand?


2. Ways to make it easy for readers to navigate your site.
Easy site navigation is important. If readers can't move from one part of your site to another without feeling lost and frustrated, they will probably quickly click off of it. Let's consider ways to make site navigation easy.

Open: International Cooking and Eating Trends
As you explore the pages in this section, consider the following questions to discover elements that facilitate navigation throughout a site.

  1. Do the links on the navigational bar to the left of each page (The bars are blue on this site) help you to navigate easily throughout this site? That is, do they help you to go back and forth easily from one article to another?

  2. If you have to scroll down to finish an article, do you find similar links at the bottom of the page to help you navigate between the cover page and the articles? Is it easy to go back and forth from one to another?

  3. Do the links give you a clear idea of what you are linking to?

  4. Does each and every page have a link back to the homepage?

  5. Does each page have links to go to new pages, as well as links to return to pages you have already visited? Does these links help you to know where you are in the site, or do you sometimes feel lost?

  6. Are there enough links to help you navigate through the site successfully?

  7. Do all of the links work, or are some of them broken?


3. Ways to use graphics to enhance and complement your pages.
It's good to use photos and drawings to illustrate your students' work, but it is important to use these images purposely and wisely. They should add meaning to the content, illustrate it, and complement it. They should not overwhelm it and detract from it. Lets look at some linked pages about competitions to see how graphics are used.

Open: Winning Competitions
As you visit these pages, take a look at the photos and consider these questions:

  1. Are they used purposefully or not? Do they add meaning to the content or not? Do they illustrate the writings effectively? Do they add interest to the writing?

  2. What about their size? Do you think they are too big or too small?

  3. Do they download quickly enough for you to enjoy reading the page, or do they download too slowly and make you impatient?


We hope these activities have helped you focus on some basic principles of web design. To read a list of tips about the elements you have just explored, go to Sandy's Basic Web Design Tips for Beginners. If you are a newcomer to web site design, we hope this page will be a useful reference for you once you actually start making your own web site.


Assignment 1

Creating a 'mini-magazine'

For those of you who are beginners:
If you feel confident enough, try creating and linking a few pages about one particular topic in order to get the feel of creating an ezine. Follow the steps below. If you have any problems, just post a message and ask for help.

If you do not have time to create these pages or do not feel ready to share your work, perhaps you could post a brief paragraph or two about what you are planning to do . Or, if you have questions about making web pages and incorporating elements of web design, please feel free to post a message to the group asking for advice.

If you want to take the plunge, here are some suggestions. We realize you do not have student writings ready to go, so why not try creating some brief writings yourself just to get the feel of how to go about it?

  • First, choose a topic you are interested in and create two or three short pages, each one with a 'mini article' written by you about a different aspect of the topic. A paragraph or two is enough. You might consider a topic you would ask your students to write about in your classes.

    Choose a light topic or a serious topic, whatever interests you. For example, you can create a create a unit on: your travel experiences, kinds of leisure time activities, restaurants in your home town, meaningful objects that you treasure, kinds of music you like, short essays or stories you have written, tips for decorating, types of personalities, effects of technology on our lives, environmental problems, changes in our life styles, your views on teaching, or your views of news events.

  • Just choose something that interests you! Remember, the objective is to communicate ideas to readers. Later, you can organize your students' writings in this manner.
  • Next, create a short home page for your mini-magazine. Give it a name and place the name at the top of the page. You might want to write a brief description of the purpose of the magazine.

  • Then put the titles of your individual pages on the home page. Make each title a link to one of the pages. Again, you might like to write a short description of each article you are linking to.

  • On each article page, make a link back to the title page. To make it easy to navigate your site, you can also link to each of the other two pages from each article page..

  • Add a small graphic to each page if you like. They add a lot of interest to a page.

For those of you who are more advanced, try your hand at something really creative! We know already that many of you have some very impressive web sites.


Assignment 2:

Now post a message to the group to share your efforts and feelings about the process with the rest of us. Don't forget to include the URL of your mini-magazine home page.

  • What was easy? What was challenging?

  • If you like, elaborate on the things you have created that you think are well-designed and follow good web-design principles, or tell how you would like to change it or expand it?

If you do not have time to create these pages or do not feel ready to share your work, don't worry. You can always create these pages later on. As we suggested above, you might like to post a brief paragraph or two about what you are planning to do. Or, feel free to post a message with any questions you have at this point.


Return to:
Welcome | Members | Syllabus | Week 1 | Week 2 | Week 3
Week 4 | Week 6 | Week 7 | Our YahooGroup Site | 2003 EV_Online