Table of Contents:
Introduction: What you will find in this report
Earlier generations: Their Experiences
Web Designer Principles As I See It (Jeff Glover too!)
Psychological Aspects to Web Design: Why Do We Do That?
What It's Like to Become a Web Designer: My Experience
Annotated Index to Web Design: It's easy to get some help!
In this report, you will find out about my experiences designing my very own web pages. As a beginner, I can offer some advise to those who haven't designed a page yet, or encouragement to those who are learning, as I am still in the learning stage also. I designed a very simple web page about four years ago in my ICS 101 class, but since then, everything has changed. I had to relearn how to make a web page for this class. It really is a lot simpler than it was four years ago. Hopefully, when I find the time, I can make a web page that is a little more personal, for myself. In this report, you will hear more about my experiences as well as other students' experiences. For this report, I cruised through previous generation's reports to learn about their experience with web design. In this report, I will add a few of their important and useful comments. Next, I will tell you about a web site designed by Jeff Glover. This site is called "Sucky to Savvy" and it is about improving your web site design. It's an interesting page. Following that, I will discuss Psychological aspects to web design. In this section, I will comment on Dr. James' view of the topic. Next I will tell you all about my experience in becoming a web designer. And last, but not least, I have included an annotated index to web design. Hopefully this section will be useful to you. This is where you can learn more about designing your own page. I hope that my page is useful to you. I am doing it for the grade, but I chose this topic because I am hoping that I can learn more about web design to be able to help others learn more about it.
The student pages cover the same information and topics. They don't seem to vary too much, how can they if they have the same assingment rules? What I am going to do in this section is to comment on other pages on the same topic. I will tell you what it was about the page that I liked, and why. As for the information content, I feel that it will be redundant to comment more about it because I covered the same information on my page. Hopefully this section will inspire you to take a look at other student pages and learn from them or relate to them as I have.
The first page on this topic that really caught my attention is a page done by Scott Chang. The reason that I liked Scott's page is because it is really easy to read. What I mean by easy to read is that his English isn't so I tproper and boring. He speaks through personal experience. What I also mean by easy to read is that the color contrast on his page makes reading it easier. The background is gray with black text and his links are yellow, they catch your attention and aren't too bright to read. It seems that the aim of his page is to tell the reader about his personal experience rather than to tell the reader what to do when designing a page. Scott is an experienced web designer, meaning that he has done it before this class. His advice comes from more experienced level than the other student reports I read.
Another page that I found that I thought was well done is called "Thoughts From A Web Designer", by Erin. What I liked about her web page is that I thought it was very encouraging. Erin is a beginner designer, learning through the experience as I am. She offers a lot of advice that she learned through the experience. She admits to being "Lost, nervous, and clueless" when she began with this class. She was also scared. She is now more confident and feels that there is a lot more to learn and feels that she would like to continue even beyond this class. I liked her page because I can relate to her experience. I think that I am at the same level as she was at this same point.
Another page that
I liked is by Leslie called " How
I Stopped Worrying & Learned to Love the Web". Some information
content that I found on her page that was different than others was a little
section about how your links are a representation of yourself. She
makes a good point in this section, she said
"Whatever topic(s) you choose to join on the Internet also dictates
the structure of your web page. For
example, if you want to put up your resume as a web page, you must make
sure that the links attached to it are
professional. You DO NOT want a possible future employer to be looking
at your resume which has links to
your home page, which has links to your favorite rock band's site, which
has links to the legalize marijuana
home page, etc."
I never thought
about my links in this way and I am glad that I read Leslie's idea because
it is something that I will pay more attention to when adding links to
my pages.
(FYI - all of the links in this section come from the same page, so you don't necessarily have to click on each individual link, you can just go to the main page if you want to discover it all for yourself. I provided a very brief description of each in parentheses so that you don't have to visit the page unless something in particular grabs your interest.)
There is a page done by a guy named Jeff Glover called "Sucky to Savvy". This page is about improving your web page design to make it more pleasant to your visitors. The address for this page is http://jeffglover.com/ss.html. The purpose of this site is to get people to realize what makes a web page good and what makes it bad. The way that Jeff got most of his "sucky or savvy" information is from feedback from web surfers on what they thought was sucky or savvy. This page has changed in the past couple of years as attitudes and technology changes with time. Jeff also plugs his CD ROM on this page. The first page you get to is the introduction page (cover page). It basically says what I just summarized. From this page, you can click on the "Sucky to Savvy" icon to enter the site. There are also links on the bottom for frequently asked questions, feedback, and what is new.
When you enter the site, on the left hand side, you have a list of the top sucky things, the most savvy things, and then some extra tips. These lists are clickable. There is a brief explanation of what is found on the web pages: What is it. why is it sucky or savvy, and what you can do about it. From this page, you can then click on a "next" button that links to the first sucky thing, the whole explanation and a link to the next, and so forth. Here is a clickable list of the sucky things: blink (text that blinks all the time, which is hard to read and annoying) auto background music & sounds (sounds that automatically play and don't stop) loud background images (backgrounds that are too busy or loud so that it makes reading the text difficult) Gratuitous Use of Frames (windows that are divided into more than one window, independent of each other) Overusing Image Maps (one huge image that you have to wait for the entire image to load so that you can click on one small part of that image) Construction Signs/Notes (signs that say that a site is under construction, signs that never get removed or say when the site will no longer be under construction) Scrolling Marquees (text that scrolls across the screen) Javascript Alerts (dialog boxes that pop up when you enter a site) Ticker-Tape Status Bars (messages that scroll across the bottom of the page -- in the gray area, useless).
Now for the list of the savvy stuff, these are things that people find to be pleasing to see on a page: Flexible Window Widths (this means creating pages that work with any visitor's monitor, no matter what their window width is), Use Thumbnail Graphics (using smaller, low resolution images - you can click on the small images to increase their size, so you can choose which images you really want to look at), Use Height & Width Tags (enhances the way your web page loads), ALT Tag your important images (gives descriptions to users who don't load images), Include Contact Info (its simple, add your email address so that people who visit your site can contact you), Be Unique! (duh..), Optional Plug-Ins (plug-ins enhance the page, with sounds, animations etc.. for those who like to see/hear the page).
And lastly, there are a bunch of Extra Tips. These are simple tips: Speed vs. Design (finding the balance between a nice lookin' site and something speedy and easy to load), Using JPEGs & GIFs Intelligently (JPEGs should be used for pictures and GIFs should be used for art/graphics), Using GIF Animations Effectively (don't let them take over focus of your page!), Cookie Crumbs (don't eat while creating you web site... nah just kidding, a preference file for a web site that stores info i.e.. saves your password for you so that you don't have to type it every time), Common HTML Mistakes & Myths (there's quite a few, so you should go read them), Using META Tags (header on your web page that will provide search engine summaries), Planning Your Site (just plan ahead, know what you are putting on your page and make sure you don't go off on a tangent, know who you are creating the site for, educate yourself, look at other sites for ideas, etc.), Web Site File Organization (organize your files, know what http://something.somewhere.someway.attachedto.me all this stuff means, know what your named your files, gifs etc.), Link Lunacy (having too many links that people leave your site before they read all of your stuff -- gee. I guess maybe I'll run into that problem??)
You can either go through these pages one by one using the next button, or you can choose from the list on the left hand side of his page which topic you would like to read about. I went through each page one by one using the next button so that I could have a thorough understanding of this page. If I were in a rush or just looking for specifics, I would use the list on the left hand side. Its handy!
So far, all of this is Jeff Glover's opinion. Now what about mine? Well, Glover's is a tough act to follow. I agree with all of what he said. In my opinion, the things that I would put on my "don't do this on your web page list" would be: BRIGHT COLORS - you can't read that right? what it says is BRIGHT COLORS. They are hard to read, if you can't see that this is hard to read, then I congratulate your magnificent eyes. The second thing that I can't stand is a busy background. If the background is so busy, it makes it hard to concentrate on the text, which should be the focus of the page. The last "don't do" is have sounds that automatically play on your page. Sometimes people have a hard time turning the sound off, sometimes they are at work, in a quite office and then they enter a page that blasts the song "YMCA" and everyone in the office turns to look. Wouldn't that suck?
Some things that I do like to see on web pages are graphics. I think that a piece of art here and there is a great break from looking at all text all the time. A picture can hold a thousand words sometimes, and you don't have to be a speed reader to read those thousand words if it is in a picture. If I knew how to put pictures on this page, I would do it. Maybe I'll add some sometime. Or maybe you'll see some on my other pages. I also like different fonts. I think that a different font can make a page look a lot nicer. This font that I am using is nothing spectacular or wild, but it is not Times New Roman anymore. I noticed that on one of my web pages, the way that the font appears depends on what computer I am using. I don't know why, but I tried to make it a little different. I have also found that many beautiful looking pages have really lame information content or some pages with the best information aren't that beautiful. I think that creating a web page can be seen as an art, some people have the time or talent for it and some don't. As with the information, some people have the time and talent to present information that is really wonderful, and some don't. It is sometimes hard not to judge a book by its cover, because most people just naturally do it. If a page looks nice, people are more likely to read it than if it looks bad. I try to give pages a fair chance, if am not attracted to what it looks like, I try to read some of it anyways before going on. It would be sad to think that people may come on this page and think, hey this is boring looking *click*, because I put a lot of time into it. On the other hand, if someone were to judge my page like that before looking at the content, I think that I would rather them "click off" than judge it, telling me you should "do this" or "don't do that" to MY page.
Dr. James, my
professor of CyberPsychology, has a page titled "Social
Psychological Principles of Home Page Architecture". As a part
of this assignment, I am supposed to read his page, pick three of my favorite
ideas from his page and explain what they are.
First, I liked
the introduction, the Birth
of Cyberspace. In this section, Dr. James introduces the idea of having
"home" on the internet. He lives in a house with his family, cats
and plants and then he considers his page on the internet as his second
home where he also spends a great deal of time. When asked to explain himself,
he said he had a difficult time explaining to his friend who didn't quite
understand the concept. Dr. James said that his page was considered
his second home because he spends a lot of time there, he fixes it up all
the time, people visit his home and communicate to him through it, etc.
It is simply his "virtual home". In the second half of this section,
Dr. James explains the start of the Internet. It was first used by government
and research companies who hooked up their computers over their telephone
lines to share some files. Years later, companies (like Netscape) began
to join in and the Internet multiplied. Now anyone can be a part of the
great World Wide Web by creating their very own virtual homes. I
thought that it was neat that Dr. James thinks of his page as a "home".
It is not a house to live in physically, but you can house your files,
thoughts, passions there. You can have virtual pets and plants in this
"home" too if you want. It has an address, much like your home.
I also like this section because I liked Dr. James' enthusiasm and interest in the Internet, so much as to call his page his second home. I never really thought of a web page to have so much personal meaning to a person. I have this web page but I consider it to be work. I don't come here to play, I just do it because it is an assignment. My interest in having a personal web page is growing a lot. I would really like to have the time to personalize my pages and enjoy working on them with such passion as Dr. James does. I would like to add pictures to my pages so that my family and friends who are miles away can enjoy them, I would love to use it more to communicate with people and I think that this could be a neat hobby. It is certainly a bonus to know how to use the internet and create pages because the Internet is still growing incredibly fast.
The second idea that I liked was the second section, Home Pages are Loved. In this section, Dr. James talks about his love for web pages. Some words that Dr. James used in this section to describe feelings for these web pages were "proud", "ecstatic", "magnificent", "appreciate it", he even said "I could hardly keep myself from trying to interfere with him" while explaining a time that he was showing his Home Page. Dr. James was a little disappointed when his friend didn't show as much enthusiasm as he did. I think that it is because his friend hasn't experienced designing a web page. This is one of my favorites of the entire page because I can relate to it. In my own personal experience, I know that after creating a web page, it is easier to appreciate another person's page because you realize how much time and effort they spent on their page. I realize that it is true, that web pages are so much fun to look at now, especially if they are personal, and well done. Dr. James said something in this page that goes along with what I have just realized. He said, "My love is in My Home Page architecture -- and this requires an inside view, a perspective obtainable only through doing the work of a cyberspace architect." It is easier to appreciate and admire someone's page if you went through the same experience. After reading this section again, I thought of a new title for this section. I think that Dr. James should have called it "Home is Where the Heart Is".
The last idea
that I liked was in the Psychological
Characteristics of Hypertext Links. The idea that I liked in this section
is that hyper links can have more than one feature (or meaning to it).
I just thought of a link as a button to click that leads you somewhere
else, so what. Well, according to Dr. James, it is not just that.
"The study and analysis of linkage structure is the study and analysis
of communicative acts in cyberspace by members of a virtual learning community."
What this means is that using a link is a communicative act between people
who visit or use the pages in the Internet. The three different features
of a link are: affective (the motivation for a person to create the
link - what is the purpose of the link?), cognitive (what new information
will the visitor be led to by this link?) and sensorimotor (the appearance
of the link - how was it created, what does it look like?). All of
my links are text only. The purpose of them are to reference my information
and to lead the reader to more complete details since most of my information
is summarized. After reading this section, I began to think about
why I link to the things that I link to. It also gave me the desire to
want to create link buttons that are appealing to the eye instead of just
clickable text. Maybe I will do this on my personal home page when
I learn how to do it!
Yay! You are reading this right now, that means that I actually did write this page, finish it, and publish it on the net. So you see, there is hope. In this section, I am going to tell you all about my experiences making these pages... hopefully you can learn from it.
As I mentioned in the introduction, I had made a page about four years ago in my ICS class. Back then it was a little different. As I remember it, it was very hard and confusing. I did everything in codes and symbols in text form and in a simple word processor called notepad. It has been four years since then and I decided that I wanted to make another web page, (That's why I took this class) Also, it wasn't too bright of me to throw away all of my ICS notes, because in those notes were my instructions on making a page and also my web page address, yep that's right, I accidentally threw away my address. The last time I saw that page was the last day of that class. I've done searches on it and couldn't find it. So, here I am making a new page.
Well as I said, this time around, it wasn't as difficult. At the beginning of the semester, I was really overwhelmed. I thought that I had to use all those codes and symbols. We started the class off using html commands in notepad. I thought that I would have such a stressful time creating my web page because I thought that I would have to learn all the html terminology, codes, rules etc. But guess what...I discovered that you can simply design your page in Microsoft Word and save it as an html file. So right now, as I type, I am in Word. It is really simple, you can use the tool bars to change your font, your color, alignment etc. You don't have to use codes for all of these commands, just click your mouse on the icon! Well, now isn't that great?! So at the beginning of the semester, my pages were duller. They all had a white background, black Times New Roman font, and they just looked "blah". As you can see, my web page isn't that high tech or fancy, but it is a lot nicer than just a black and white page. I am still in the learning phase, for example, today I learned how to make the background blue. On my earlier pages, they are all white, with just colored text. (I will probably go change them now, or maybe I will keep them that way to see the changes I've gone through this semester). What I would like to learn is how to put pictures on my pages. That is my next goal. For some reason, I can make links to pictures but I am having a hard time figuring out how to put the pictures directly on the page itself.
In the future, I would like to design a web page that is a bit more personal. I have been inspired by the things that I read for this assignment. I started my personal page but I don't think that I will have the time to finish it until this semester is over with. You can find this page here. (it only has a teeeny bit!) I am sure that in the future we will use web pages for a lot more, so I would like to keep up with working on my pages.
I do have some advice for future generations. The most important of all when doing your assignments (which entails designing a web page) is not to procrastinate. Doing research for your page takes time, and so does making the page itself. If you don't already know how to make your page using Microsoft Word, I suggest that you go check it out. Just make your page like you would make a document, add your colors, fonts etc. and when you save it, save it as your page.html rather than your page.doc. This saves it as an html file rather than a document. You can cut and paste things, draw things, basically use any word command. Also, I would suggest that you look at other student's pages, take notice of what is attractive, and what is not. then apply these to making your page. It is also a good idea to keep a couple of copies of your web page. One of my discs got ruined, but luckily, I had a back up copy. The best piece of advice that I can offer is to have fun. I know that doing these pages means working, but that is what you are in college for. You are expected to work and learn. You should plan on having fun too. Suggestions to make it fun... don't be so formal and boring, add pictures, crazy fonts and neat links. Of course, pick a topic that seems most fun to you, you have a lot to choose from.
What advice do I have for the instructor with regard to his attempt to build the online generational community classroom? Well, I think that if we keep linking to previous students, and building on their work, the generational curriculum will keep on enhancing itself. An idea for a future project would be to pair up students and have them design a page together. I think that this would be a good idea because after a while, I feel like I am repeating myself in these reports. Combining my ideas with another student's ideas could produce new, interesting ideas. I think that if there was a paired assignment, we could easily learn from each other. For instance, one of the students may know how to add pictures and neat effects and be able to teach the other student. One student may introduce an idea that the other student would have never thought of. I know that we are supposed to learn from reading other students reports, and visiting their pages, but after a while, all the reading gets to be too much. I personally learn better through doing rather than reading. I found that there isn't much teacher support or student interaction in lab. Most of the students just go home to work on their assignments. If there was a paired project, this would encourage interaction among the students and support from the teacher.
Here are a few links that can help you in designing you page.
1. http://www.whywhat.com/ This page offers a tutorial. In the tutorial, you can learn about "basic html, font type, cool tables, frames galore, multimedia, form help, java script, style sheets, aol help, mapping." You can get information on downloads, links, useful tips. There is a guest book and message board.
2. http://jeffglover.com/ss.html Jeff Glover's page, that I spoke about earlier. This page tells you what is good and what is bad on a web page. It doesn't necessarily tell you how to make a page, it just tells what to do and what not to do when you are making your page.
3. http://www.zikzak.net/~acb/hacks/htmlth.html This page is for those of you who have a sense of humor. It is called The HTML Terrorist's Handbook or, Composing Evil HTML It is basically a page on how to make an irritating page. (Or a sucky page as Jeff Glover would put it.) Advice: don't follow the instructions found on this page if you want an A in Dr. James' class.
4. http://www.ncsa.uiuc.edu/General/Internet/WWW/HTMLPrimer.html This page is for the person who is looking for good documentation on using HTML. There is a guide here for HTML coding.
5. http://www.w3.org/Provider/Style/Overview.html This page is a guide that is designed to help you create your www hypertext database - web page. This guide teaches you good web page etiquette.
6. http://www.geocities.com/Athens/Acropolis/5969/index.html This page is great. It is a tutorial in five lessons. It has an HTML coding guide that is really easy to read. You can also learn how to use MS Word for your web designing. I would recommend this page.
7. http://www.soc.hawaii.edu/leonj/leonj/leonpsy/instructor/architect.html This is Dr. James' page on Social Psychological Principles of Home Page Architecture. It is not an instructional page, it covers different topics such as "The Functions of Home Pages", "Principles of Cyberspace Architecture for Virtual Learning Communities", "Informational Content of Home Pages" and much more.