Week 10 - Graduate VICTORIOUS!

Thanks for the fun, Dr. Simon! I hope you enjoy my site and blog. (Next week I'll be enjoying the Carribean by cruise ship as a graduation present!)

Site Reviews - Week 9

http://www.flashvista.com/
With news, tutorials and an almost overabundance of Flash websites, FlashVista provides a plethora of resources for the adventurous Flash developer. The design of that website itself is a little overwhelming- lots of text on a white background without a lot of direction for the eyes. It looks more like an advertising page that most web surfers avoid than a resource site, especially for design.

http://www.lukamaras.com/tutorials/cool-design/hitech-floating-menu.html
No surprises site about Flash tutorials. Great detail and lots of information. Unimaginative but extremely functional and easy to navigate design.

http://www.sitepal.com/
This was an UNBELIEVABLE concept! This site helps you construct an avatar and connects voice messages with it for web sites, blogs, email and more. They will take your own picture and construct an avatar that looks like you, and you can even record your own voice for the message. I went to http://www.americantesol.com/ to check out some in action, and it was really cool to see how they used the avatars on their site and as part of their educational program.

http://www.adobe.com/products/flash/
Premier vehicle for creating interactive content. Flash incoporates imports from Photoshop and Illustrator to power up the graphics side of the program. Expensive, but worth the money for anyone serious about design with a long-term goal in mind.

http://www.swishzone.com/index.php
Site for interactive content creation software. News, some tutorials, and ideas are all sections of the site as well. One of the most interesting features of this site was the 8 languages provided for browsers, selected by country flag in the top right of the screen.

http://www.hotscripts.com/
Huge resource site with lots of scripts, links, helps and ideas. Really busy visual site, a little bit offputting to my eye. I would only use this site if I found it with a web search for something specific.

http://www.soundstageav.com/mastersonaudio/20050201.htm
Great explanation of the MP3 format. Decent site design- I liked that the background was cream and not bright white.

http://audacity.sourceforge.net/
AWESOME sound editor. I just recently used Audacity in a tech teacher workshop I attended. The possibilities for recording and editing audio are endless with this software, especially in conjunction with royalty free music or a free digital music composer.

http://www.pandora.com/
What a FANTASTIC site! You type in your favorite artist, song or genre, and it personalizes your radio station. Just for fun, I typed in "Love Shack" by the B52s, and it played "Lovefool" by The Cardigans, "Little Miss Can't Be Wrong" by Spin Doctors, "Money for Nothing" by Dire Straits, and "Simply Irresistible" by Robert Palmer.

http://www.trellian.com/webpage/
Trellian is an absolutely free web page editor, with some of the same features as FrontPage and DreamWeaver. It also supports some Photoshop plug-ins for image editing. The website provides tips, a user manual, free downloads, and a useful FAQ page.

http://www.seamonkey-project.org/
SeaMonkey is an all-in-one internet app suite. Including and email and newsgroup client, IRC chat, and HTML made simpler. It uses a lot of the same source code as other Mozilla programs. The site itself is nice, soothing colors, and easy to use. Mozilla is my favorite web company!

Fancy Buttons and Menus and Audio and Video - Week 8

Fancy buttons and menus are aesthetically pleasing navigational tools for site users. They can be individual graphics, regions of one whole graphic, or images of fancy text. Adding an interesting layer of design, they also serve a practical function. In my site, I chose to put in a single menu graphic, and add an image map to create links on each page. The step-by-step instructions in the book were very useful.

Audio and video files are essential pieces of every person's web experience. Just look at any teen's mySpace page and you find at least one multimedia item, with most incorporating up to or more than a dozen. The first choice a web designer has is whether to link to the file on an external page or embed it in an existing one. This depends on the size and format of the multimedia file, because of the necessity for some files to also have an embedded player. Many sites have streaming background music for users. It is important to give users a choice by allowing them to turn the sound off, so that those who listen to their own music are not disturbed or distracted by your choice. Videos are huge files, but can be effective for illustrating points or impressing potential clients. I don't really see a need for any at this point, but possibly could add tutorial videos in the future.

Site Reviews - Week 8

http://en.wikipedia.org/wiki/Wikipedia:Public_domain_image_resources
Basically, this wikipedia page is a long list of links to resources and web sites for images. Some of the categories include historical, art, books, logos, postage stamps, culture, religion, computer-generated, and many more.

http://www.libraryspot.com/images.htm
Library Spot provides a list of links gathered specifically for searchers. Their mission states: "We created LibrarySpot.com to break through the information overload of the Web and bring the best library and reference sites together with insightful editorial in one user-friendly spot." These hand-selected sites are easier to wade through than the millions of hits a Google search unearthed.

http://www.readwriteweb.com/
A Web technology news site, there were a lot of interesting articles about current trends, developments and products. My favorite was the Top 10 YouTube videos of all time- the information in the article was interesting, with music artists taking 7 of the 10 slots. I really liked the format and design of the web page- lots to look at without being overwhelming.

http://www.footnote.com/
What an amazing site!! This site has digital images of documents from around the world. Mome than 4.4 million images have been uploaded since the site's inception. The site has a partnership with the US National Archive to digitize primary source documents integral to American history. I was completely unaware this site existed, and I was floored by how much is available.

http://www.adobe.com/products/photoshop/index.html
Photoshop is the premier photo editing tool in graphic design right now. The possibilities are pretty much endless for an experienced user, especially with all the add ons available. Another advantage is the prevalence of tutorials, helps and idea sites online.

http://www.gimp.org/
Gimp is the GNU Image Manipulation Program. It shares some of the same features as Photoshop, but is a free, open source program. 'Nuff said.

Images - Week 7

This is almost an overwhelming topic- so much of what users of a website take away are the images they view. Whether pictures, graphics, text that functions as a graphic, or animations, images work together with the color scheme to convey a mood to the user. Three questions which should guide the selection process are:
1. Is it relevant?
2. Is it interesting?
3. Is it appealing?
A variety of things can be used to enhance, clean up and modify image files to create the emotion, look or feel you seek in the overall scheme of your site. Photoshop and other similar programs have editing software that allows you to crop, filter, modify colors and shapes, as well as use aspects of one picture with another to create a completely new idea.

Another major issue in using images is ownership rights. There are several options, including self-originated photography, royalty-free stock photography, rights-managed stock photography and images with a Creative Commons license (free for use under certain conditions). One option that should be avoided is stealing copyrighted images from other sites.

Personally, I'm using graphics I created in Photoshop from images with a Creative Commons license, which allows all use except for commercial. Since the site I have is a school site, there is no conflict of interest.

Making Money with your Site and Javascript and DHTML - Week 7

There are a variety of ways to earn money with your site. These include:
- Soliciting donations (ex. http://american.redcross.org/ - non-profit institution)
- Advertising content (ex. any search engine you use: Google, Yahoo, etc.)
- Affiliate programs (ex. http://affiliate-program.amazon.com/gp/associates/ - an Amazon.com affiliates program that earns money for web sites that refer purchasers to Amazon)
- Sell merchandise (ex. http://www.megagear.com/ - web store for MegaTokyo webcomic)
- Sell content (ex. http://www.encyclopediabritannica.com)
This is certainly not a part of my web project, but definitely something I am glad to be aware of for the future.

JavaScript and DHTML are two types of coding that establish advanced interactivity for a web site. JavaScript provides a way to add dynamic text, such as current and accurate date and time information. It also allows for a wide range of modifications to basic HTML tags. Scripts can also be accessed like a CSS sheet- externally from the page they are viewed in.

Dynamic HTML is a combination of three parts: scripting languages, CSS sheets and the HTML Document Object Model (DOM), which treats a page of HTML as a collection of objects. The first step is to identify each object, so that the scripts written will be able to identify which object to modify. One of the most popular of these functions is the image roll over- changing an image or color of an image when the mouse rolls over that section of the page. Another is collapsible pages, a feature used extensively in computer-based programs such as Windows Explorer that allow a user to expand or collapse folders for ease of finding items. This can be used in web pages for the same purpose- to expand or limit the amount of text a user is expected to look at on any given page.

Site Reviews - Week 7

http://ilovetypography.com/
Hugely informative site about typography, including thousands of fonts, (at least) hundreds of articles, and too much knowledge to assimilate in one shot! The article 15 Excellent Examples of Web Typography was really informative, making me realize my fonts were boring but adequate!

http://typographica.org/
Typographica is an online journal about typography, with articles that convey news, opinions and commentary on fonts and other typographic designs. One of the cool parts of this site was the "Typefaces of..." a variety of years. The ones immediately accessible from the front page were 2004-2007 by year. My favorite was BistroScript, seen here.

http://abc.planet-typography.com/
This "virtual museum of typography" is divided into four subcategories:
- Classic (1480-1890)
- 20th Century
- Modern
- Miscellaneous
Unfortunately, none of the links seemed to work, so I was unable to peruse beyond the main page.

http://www.alistapart.com/topics/design/typography/
A List Apart is a magazine published for web designers, so the content on this page is relevant, practical and interesting to examine from a designer's point of view. A couple of the articles I looked at discussed grid systems for positioning text, formatting text in CSS and using CSS to actually retrieve fonts from online for site visitors so the text does not have to be frozen in image form. Pretty cool stuff!

http://www.noupe.com/css/using-css-to-fix-anything-20-common-bugs-and-fixes.html
This article is amazing- 20 step by step fixes for CSS to polish up the minor issues that crop up with web design. Straightforward, it provides an image of the code so that it's easy to grasp and copy, which is a huge asset to newbies.

Attracting Visitors and Letting Them Talk to You - Week 6

This week's chapters discuss how to both attract and interact with visitors to your website! Attracting visitors is a process that requires a strategic plan in order to succeed over the long run. This process includes:
- Building a great site
- Sharing links with like-minded friends and related websites
- Creating and perfecting meta-tags
- Submitting your site to Internet directories
- Submitting your site to Internet search engines
- Test, reassess to figure out whether the above strategies are enough to generate the amount of traffic you want
This provided some interesting pieces of knowledge, but nothing major that I am going to utilize with my site for this class. I especially learned from the section about meta-tags, and how to use descriptions and keywords to attract users who will benefit from or enjoy accessing your content.

Interacting with visitors can take many forms: email links, form submissions, forums and/or groups. My site has the simplest form of these, the basic email link. I included it on each page as a webmaster contact, as well as on the staff page for each staff member. It is the easiest to code, as well as arguably the most recognizable for browsers. Forms are html coded forms of contact which provide a survey-like response for visitors, providing questions and answers in a limited format which are then submitted to the webmaster by an email. Finally, the most popular type of visitor interaction is forums, which can also be called groups, discussion boards, etc. This provides multiple visitors the opportunity to interact with one another, while the previous two only allow for one way communication with the web designer. Forums are asynchronous communication that provide space for users to post and respond to one another on any topic, in almost any format.

Site Reviews - Week 6

http://urbandirty.com/
Urban Dirty provides textured background photos covered under a Creative Commons license for design projects. These images are free to use, the artist just asks the user to credit the web page somewhere in the work. Some of the images are fascinating, carrying an artistic raw edge.

Best Textures
A group on Flickr, this collection currently has 1,402 images that serve as textured backgrounds for use by web designers. Ranging from nature shots to wall art, these images bring a wide variety of scale, perspective and mood to a project. I found a couple of shots of parchment I want to play around with.

Torley Textures
These texture collections provide seamless tiling, are available for any use and are in lossless PNG format. Also hosted on Flickr, the artist generously made them useful to all. Some of my favorites in this group were ones that looked like paint on a canvas, brushstrokes and all.

Deviant Art Textures
This site offers an overwhelming amount of resources for artists, and the texture section is no exception. I downloaded a few to play with, including a grunge page of text, a couple of photoshopped colors with light specks or patterns.

Grunge Textures
The graphics on this site are organized efficiently, easily accessible from the idex page. Another Creative Commons user, they ask that you link back. Interesting pictures, but nothing that looks useful for my design.

Grunge Style
This article published by smashing magazine online explains more about grunge and Web 2.0 design. I liked the explanations and examples they provided. It will help me as I work toward designing my own site. I want to see how I can integrate some of the elements they mentioned.

Vandelay Design
Tuturials, sweet tutorials! This site was IMMEDIATELY bookmarked because I am getting ready to start experimenting with Photoshop, and there are 40 video tutorials. I will so be back!

2007 Web Design Trends (and Cliches)
The top 6 web design trends of 2007 and some fabulous examples!

Web 2.0 Tutorials Round Up
Another fabulous tutorial site... on the back burner for emergencies.

Screen Resolutions and Aspect Ratios
Fascinating information about screen resolution average data across the globe. It's limited, of course, since the sample size is determined by visitors to one website, but a good idea for new web designers as to how big to design their pages.

---

Wow- this is a lot to digest and compile into useful knowledge. I am excited to start using some of the information and getting to final selections for my pages!

Page Layout Tools and Frames - Week 5

Chapter 9 in the Missing Manual talks about some page layout tools developed in HTML. The two major ones are table-based and style-based layouts. Tables are possibly the most basic of layout tools, infinitely customizable as to size, organization, and even the visibility of the outlines. However, they are notoriously sensitive to deal with, and if any one tag is missing, the page itself can be horrendously warped. Style sheets, on the other hand, create a much simpler format for HTML code. Since the sheet is a separate document which the page references, all the formatting standards are not necessary in the HTML, because they are dictated by the style sheet. This is the style which utilizes the cascading style sheets which have already been discussed earlier this semester. I've been working on these already, and I think they have great potential. However, I have a long way to go to make them seem effortless!

Frames are another tool in the web developer's arsenal. Chapter 10 talks about how to create them, and the (dis)advantages of using them on a web page. They have all but disappeared from many large web sites, mostly because they are annoying to a wide population of web users, not to mention unable to be viewed on cell phone web browsers. The basic concept of frames is that they split the browser viewing window into several different web pages, each broadcasting their own content. That is how the navigation bar is able to stay the same, no matter what is in the main part of the page. Blackboard is an example of this, because within the course site the navigational bar to the left stays static, no matter what the body text is in the right/center of the screen. I will probably utilize some of this design for the navigational part of the site, although I am considering just adding the code to each individual page. It's bulky, but at least it makes each page more cohesive. I will have to play with it to see.

Site Review - Week 5

This week's site to review, Colors on the Web, was suggested mostly because of its value as a reference for the web site project. There was lots of information, both theoretical and practical. My favorite part were the tools, which included the Color Wizard, Color Wheel and Contrast Analyzer. These three were quickly identifiable and accessible from the main page, and were extremely useful in helping me recognize and understand key concepts for color in web design.

Graphics and Links - Week 4

This week's chapter on graphics both reinforced some personal preferences for design that I already had and gave me a few more ideas for my site. I had already decided to take my own digital pictures as illustrations to avoid copyright issues, and I will definitely continue with that idea! The codes explained and illustrated are really useful, and I am looking forward to getting some of them on my page to see how they work. The book recommended the website Stock.XCHNG for royalty free pictures. I liked the set up of the site, registered and found some amazing pictures. I will be using this site in the future!!

The chapter discussing links brought up some great points about external and internal links, site file organization, bookmarks, the importance of keeping links current and functional, and the importance of redirects. Redirect links are ways to link back to other websites that either link to or support you in some way. This can also be effective for web sites that you borrow material from, as long as you legally use the material and don't steal it. For example, the counter Dr. Simon uses has links to the website that generated the code to credit the authors and possibly get other web masters to use their software. This becomes essential in web etiquette, interacting with and supporting a network of connected people that will help build traffic for all involved parties.

Overall, this is really useful, basic information that I am going to integrate with other aspects of web design we've already discussed. I'm familiar with it from the user standpoint, but have lots to learn practically from the design standpoint.

Color - Week 4

I was amazed while reading chapter 2 of the Beaird book. I never realized how much went into color design, both in the psychology of using particular colors, as well as theory behind how to choose and use combinations of color. This will be an important chapter to avoid some of the pitfalls of terrible websites that we have explored in previous weeks.

One of the exercises in the book was to choose a color and record your top three reactions. I chose red:
1. Jackie - my best friend, who looks smashing in red
2. Strawberries - yum!
3. Fire trucks
These were all positive for me, and strong in emotion... just as the book discussed. Whether or not it increased my metabolism, well, that's a mystery!

Another useful discussion was about color schemes, such as monochromatic, analogous, complementary, split complimentary, and other variations. It helped me by showing examples and discussing the elements of such schemes. I scrapbook as a hobby, so it was great to see another way I can apply color selection other than personal preference and eyeballing it!

Site reviews - Week 4

http://webstyleguide.com/index.html
I really liked this site for three reasons:

1. Simple design, easy on the eyes
2. Great, no-nonsense information
3. Fantastic navigation, especially the directional links at the bottom right of the page

http://universalusability.com/access_by_design/index.html
This site had an amazing amount of information relating to accessibility for users. I had never thought about some of the topics they addressed, both for users with physical difficulties or "normal" users who have preferences that lead to their exclusion.

http://www.jjg.net/ia/
J.J.G.'s site provides some useful graphical representations of technical concepts. His focus on user experiences is a good perspective to ingest while continuing to tweak the design of my site. I want to be sure that I consider all angles as I immerse myself in design so I can step back and effectively evaluate my current progress as well as the feasibility of the structure for users.

50 More Excellent Blog Designs
These were great blogs to look at- I scanned the main page and looked in detail at 5-6 of them. My favorite was Pop Stalin. I started thinking about my own blog here and what I could change about it to make it more personally designed. Then I remembered that I need to code my web page. Gotta keep my priorities straight!

Layout and Composition - Week 3

The first chapter of the Beaird book discusses some basic principles of design as they practically apply to web design. Overall, the book is a hands-on guide to aesthetically pleasing design, with a variety of relevant examples and worthwhile exercises.

Chapter 1 - Layout and Composition

One of the most significant parts of this process is planning. I was impressed by how Beaird discussed the need to identify the purpose for the site, information that should be included, and the importance of good communication with clients. Since I will be designing my own site, the communication will not be a relevant piece, but I can tell that the planning process will be key to a good overall design and help me determine the amount of information which should be contained on one page.

I also liked Beaird's three factors which make up good design:
- Pleasing design, but content focused
- Easy to use with intuitive navigation
- Each page is easily recognizable as part of the same site
These factors will be a good overall goal and guide as I walk through the design process.

Additionally, I learned a significant amount from the section about the "Rule of Thirds." As I experimented on paper with my own layout ideas, the grid created with the rule of thirds principle helped form a framework for comparison and evaluation of the various designs. I will definitely be thinking about how things work together according to this guideline.

Finally, there were a variety of other methods listed, such as balance (symmetrical and asymmetrical), unity, proximity, repetition, emphasis, placement, continuance, isolation, contrast, and proportion. All of these will be important tools as I build my site from the ground up.

HTML Text Tags and Style Sheets - Week 3

Chapter 5 covered a variety of basic HTML tags relating to text. In addition, it discussed the usefulness and importance of style sheets in order to cut the amount of individual text coding by providing an overall protocol for the entire page or site. I know I'll be using these, but they were almost all familiar to me through previous experience.

Chapter 6 covers a topic new to me: Cascading Style Sheets (CSS). I am familiar with the term and concept, having computer geek friends, but have never constructed my own. I paid close attention to the chapter, so that I could formulate my own CSS instructions for my web site. I was impressed at how many different ways you can manipulate the instructions to change the formatting of the entire site.

Other key information contained in 6 include font formatting tips, like using "graphic text" - images of text used in place of buttons or headers. These can be perfected in digital editing software and saved as images so they are consistent across web browsers and not affected by other font styles. Also addressed are spacing and text alignment commands, borders, and class selectors. Class selectors allow a web designer to create formatting commands for a variety of "classes" in order to cut down on the overall time in coding a page.

Site reviews - Week 3

http://www.icann.org/
This site is of a very basic design, most likely due to the non-profit nature of the organization, although it is a tech-based group. It was last updated February 1, which seems like a long time in cyberspace. The Internet Corporation for Assigned Names and Numbers (ICANN) is an organization that coordinates access to websites internationally. Their mission statement says, "The mission of ICANN is to coordinate, at the overall level, the global Internet's systems of unique identifiers, and in particular to ensure the stable and secure operation of the Internet's unique identifier systems." It was interesting to see what they do to make sure that sites are accessible from anywhere.

http://www.internettrafficreport.com/
This site was completely awesome! It was intriguing to to see how the Internet is in use across the globe in real time. The FAQ page is very useful, explaining some complicated technical concepts in understandable language. The intra-page links help the user easily find whatever they need defined without excessive scrolling. Overall, a concise and simple web site that doesn't look cheap or assault the eyes.

http://www.internetworldstats.com/stats.htm
Along the same lines as the "Traffic Report," this site details more permanent statistics like total users, access penetration, and growth. They provide a variety of links to other related organizations to provide a big picture of Internet usage and related issues across the globe. Designwise, I did not like how much scrolling the welcome page involved. I think an additional page for links to other organizations would be more effective and cut down on initial page size.

http://www.caida.org/
The organization's mission statement greets you at the top of the main page. It states, "CAIDA, the Cooperative Association for Internet Data Analysis, provides tools and analyses promoting the engineering and maintenance of a robust, scalable global Internet infrastructure." This site is a mega-mart of information, with a large database of papers and other academically valid sources. I really liked the two tier navigation system at the top of the page, directing users down from a main category into smaller ones to make the overwhelming amount of information manageable.

http://pewresearch.org/
Great site! Its design is good without being intrusive, a standard three column format which works well because it invokes the image of a newspaper. This lends itself to credence and believability. Especially in this age of distrusting the accuracy of web sites, designers can use echoes of trustworthy print sources to make users more comfortable. Graphics are used masterfully, with small pictures, graphs, charts, and other visual elements drawing the reader's attention to key articles and information. Hidden drop down menus at the top of the page provide a fantastic organizational structure for the site, allowing users to find supporting pages with less clicks. While not the most visually exciting of this week's sites, it earns my highest ranking for other outstanding design elements!

http://usfweb2.usf.edu/ur/webadmin/webguide.html
This site outlines the guidelines for website use at USF. It covers both school generated sites and user generated sites, although there are less guidelines for the latter. Legal issues are addressed, as well as general content and technical specifications. This is clearly an informational site without much thought about design, although it is not overtly unattractive.

Power Tools - Week 2

MacDonald discusses several HTML editors and their advantages, features, and disadvantages. I have explored a few of them, and I have decided to move ahead with Nvu as my HTML editor. I do not have access to FrontPage or Dreamweaver, so despite their amazing features, I cannot further explore their possibilities.

Some of the things I like about Nvu include:
- Free!!
- Available for my iMac
- Multiple views to examine my design, including color-coded HTML tags for easy identification and the fabulous WYSIWYG view. I am not a programmer, so that view is much more like the desktop publishing software with which I am most familiar.
- Similarities to other software include the all-important "undo" feature, and most of the menus are similar to typical office software.

In creating a test page, I really enjoyed the process and made a great start toward my site template. See the results at http://myweb.usf.edu/~mjosephs/Nvutest.html

Putting Your Page on the Web - Week 2

Chapter 3 talks about putting your page on the web. The broad topics discussed include web hosting, the parts of a URL (uniform resource locator), domain names, web space, uploading files, general broadband issues, associated email addresses, and other various frills.

I think the easiest way to practically address these issues is using the book's "Web host checklist" (p. 67) to evaluate my needs for this design project.
- Web space: I am not sure of my needs at this time, but the space at USF should be sufficient for the size site I am constructing.
- Bandwidth: I shouldn't need much, this will be a relatively simple site with little to no multimedia that requires extra computing power.
- Domain name: I am not going to register a domain name for this site, since the purpose is strictly personal/academic in nature.
- Email addresses: This is already provided by USF. Thank you, Academic Computing!
- FTP access: SSH is the bomb! Thanks again, USF.
- Tech support: I have ample tech support through USF, an abundance of tutorials, and some of my tech-savvy classmates.
- Statistics: I am still considering whether or not to add stats to this site- I know that in the future, should I design other pages, I do think they are important for usability and user information.
- FrontPage extensions: I will not need these as I am not using FrontPage for this project.

Site reviews - Week 2

http://www.w3.org/
This site was chock full of great information, but I was overwhelmed by the lack of white space. I did like the three column format, and really appreciated the left and right columns being on a colored background to provide visual distinction from the center. It was nice to have a search box at the top of the right column, a generally intuitive place to look. It is clear that this site is all about information access, and not so much about user attractiveness.

http://www.w3schools.com/default.asp
I like this site better than the above... although it is very text heavy, the gray background color is not as harsh as a bright white background to the eyes. I looked through the HTML tutorial, it was clear, detailed and easy to follow. A+ from me! For a beginning designer, it might be too much information, but someone with even a little bit of HTML or XML experience should find it to be an excellent resource.

http://www.cas.usf.edu/lis/distance/tutorials/
All the basics are here! No major design elements or flaws to speak of, just a useful and functional web page. I looked at the SSH tutorials before class on Thursday and they were very helpful. I like the use of Captivate to show users what they should see when they perform the operations on their own computer.

Creating Your First Page - Week 1

The anatomy of a web page is written in HTML: HyperText Markup Language. This language tells the Web browser how to format a specific page for a user, as well as linking different documents together. It is relatively simple to create, using a simple text editor with preview capability in any web browser on your computer- no internet connection required! However, the wide range of possibilities created by this simple file are almost unlimited, based on the creator's skill and knowledge of HTML tags and the correct order of using them.

HTML basics:
Container tags - Used mostly to format page elements that are "contained" between a beginning and ending tags.
Standalone tags - These tags insert something on the page, but do not affect other content.
Nesting tags - This is the practice of using a variety of tags one inside another to accomplish more complicated formatting, such as text that is both bold and italic.
Document tags - A minimum of three container tags establish a true HTML document. These are: "html," which tells the browser that the page is encoded in HTML; "head," which designates the header of the page that includes the title displayed in the title bar, search keywords, and a style sheet; and "body," which holds the actual content to be displayed by the page.

10(ish) most important tags:
Name: Type
Bold, italic, underline: Container
Paragraph: Container
Line Break: Standalone
Heading: Container
Horizontal Line: Standalone
Image: Standalone
Anchor: Container
Unordered list, list item: Container

Using this information, I created my first attempt at an HTML document, titled Under Construction. It is available from my USF account at: http://myweb.usf.edu/~mjosephs/underconstruction.html

Planning a Web Site - Week 1

The first step in any successful website is planning. In chapter one of his book, MacDonald discusses some basic ideas about websites and presents some of the first decisions to be made about the site as a whole. I am going to go through his broad subject categories and discuss how I will be addressing those topics in my site for this class.

1. Types of sites
The many types of website accessible on the Internet include: personal, blogs, resume, topical, event based, promotion, and business. I will be constructing a business-style site for the media center I work in at Harmony High School.

2. Understanding your audience
This encompasses several factors, including hardware issues such as monitor variations that affect color and fonts, connection speeds, browser-specific features such as plug ins, and other technical complications. In order to avert this, it is suggested that designers check the functionality of their sites on a variety of web browsers and operating system platforms.

3. The lifespan of your site
At the outset, it is important to know the intended lifespan of your site, in order to plan for regular updates and new content. If you design a site poorly at the outset, it becomes very difficult to change content easily, leading to quickly outdated content that discourages users.

4. Practice good design
Some of the tips given in this section include stay simple, be consistent, and know your audience. These are important because they help the designer stay focused on the essential purpose for the final site: usability. Simplicity, consistency, and end user satisfaction are key elements in planning a good site.

5. Ingredients of a web site
- Web pages: my site will consist of 5-6 individual pages
- Web space: for the purposes of this project, I will use my USF web site to host the pages
- Domain name: at this point, a domain name is unnecessary
- Web design tools: I am currently looking into Kompozer and Adobe Dreamweaver
- Hyperlinks: Not only a requirement of the project, but an integral part of any website
- Extras: search engine listing, establishing forums, animations, audio and video

All of these factors contribute valuable knowledge to the planning process of building a site framework, and determining how to allocate information across a variety of pages. I am ready to get started, which is the next chapter!

Introduction

This is my weekly blog for the Summer 2008 Instructional Graphics course at USF. I will use it throughout the semester to discuss the topics and issues covered in class by my professor, texts, and classmates. I look forward to seeing the final result!