Walrus Final Project

a) My target audience are hipster-tourists who like San Francisco. Also anyone interested in the quake and a bit of history. Noel Gallagher and Oasis fans will probably find the page as well due to my concert content.

b) I planted keywords into the site, in meta and in my general story...and just enough details about events and people for bots to pick up on things. I didn't have to mention the members of Noel's new band, but if somebody google's their names, my site may come up. Directly linking to youtube videos of Noel's songs in my table probably helps as well. I linked to Noel's official homepage, which www.linkpopularity.com says has over 55,000 associated links. I added my own youtube videos which I uploaded myself...and i was sure to use lots of tags on youtube itself so people find it. I think I covered my bases.

c) I flunked out on the contrast for readability at first. I went to kuler and made up a custom color scheme. That helped quite a bit. Still, my nav buttons ended up being too dark. I thought it would be simple to use dark text with a white drop-shadow behind them, but I hit a roadblock there.

Adobe's browser tester let me know that IE9 doesn't show drop shadows. Period. It looked great in Firefox, and chrome only! I re-did my test in the nav area to be lighter, and it worked out alright after much trial and error.

My Mom gave it a looking-over, and pronounced it good and "senior-proof." She's never been able to program a VCR, bless her heart, so I feel it's probably easy enough to navigate for anyone.

d) Nothing really validates thanks to my use of drop shadows and video embed code. It does look great in many browsers though, so I am confident that it is "done right."

I experienced extreme frustration with youtube yesterday. My computer was having it's own technical issues, so when youtube randomly stopped generating link codes and embed codes, I assumed the problem was with me!

I restarted, updated flash, troubleshooted and generally wasted a good many hours trying to make my browser generate youtube code again. Only after a long while did youtube finally start generating pop-up notifications in the comment section that some services were "unavailable" did I realize it was them the whole time! >< I was right in the middle of uploading videos too, which all had to be re-done.


e) I think my images help my site to be greatly more interesting than if it was just text. In fact I'm sure it would be really boring without the images. I'm a pretty sappy romantic writer, so anybody rolling their eyes at that at least has some images to make up for it. :P

I configured still images that were small to have a green border that matched my scheme. Videos had blue. These colors are used elsewhere in the site as well and repeat.

I threw out the border and went extra-wide for some of my best shots, and placed them all in the same place at the bottom. I feel it coaxes "skimmers" who aren't really reading my content anyway to at least look at the images at the bottom, if they know they are down there on every page. Hopefully then some of my more interesting headlines grab their attention.

f) I used high-contrast for my table. White background and dark text. But not too dark, I softened it up a bit with mauve instead of a glaring-red. I kept the font simple, although I really was tempted to use Wingdings. Just kidding. :P

g) I think my media really helps my page to be interesting. I took hi-def video, which is the standard these days. I kept it short and interesting. Rare historical footage I threw in there. Excellent concert coverage with good sound. I don't think anybody needs any plugins to view it, other than perhaps flash. Using the newer code means there's no more annoying popup window. In fact the old embed code gave my computer seizures so I had to change it, wether I liked it or not.

I hope you guys like my site, it's been a good fun class. I learned a lot.
(If my site doesn't appear right away give it a little time. My media has been uploading for more than an hour now.)

Catch you on the flip side:

My San Francisco Travel Journal Page

Scholz - Final

Final

Who is your target audience? Please respond to the required questions found in the Design and Planning section.

My target audience is people who are interested in legends and myth. Specifically legendary locations. I opted for calming earthy colors with my banner being a sandstone color with blue lettering to go with the blues and greens found throughout the rest of the site. I have more images of Atlantis than anything else on the site so I figured a blue/green color combination would work out well. As an added bonus the color scheme is soothing on the eyes so it's much more relaxing to read it.

Discuss your SEO planning and integration. Please discuss how you integrated the requirements stated under the SEO section.

I started out with figuring the combination of keywords I wanted to use. While Atlantis has a bunch of hits some of my other keywords...not so much. I checked them out with google adwords. The site name I used is already taken regrettably so I'd have to change it to may legendarylands.org the .com is just an empty page with a promise of maybe doing something with the domain in the future (lol). I duplicated the keywords used in my headers and via some of the links I used to make the site a bit more crawlable. The images I used I used the individual cities/countries that they represented. All of my images are creative commons images with several of them completely open content because of the original publication date.

Discuss your Testing experience. Please include Accessibility, Browser, and Usability testing.

Cythiasays likes my page. All of my images have alt text but I ran into some problems checking my page out in other browsers. Originally my firefox beta version hated the page so I had to uninstall it and install a non beta version. Then the default for the browser was no images loading which actually helped me confirm that all my alt text was there. I got it up and running though. Usability testing was done by a couple of my friends. Most of them checked it in Chrome but after asking them they checked it in other browsers as did I. IE, Firefox, Safari, Chrome.

Describe your validating experience. What troubleshooting did you experience?

I did run into problems with my breadcrumbs so I had to modify the code a bit to make it validate correctly. As is always the case. My rich media videos do not validate in xhtml strict.

How did the images you use contribute to your website's purpose? Did your CSS style add to the "siteness" of your website?

The images are designed to invoke wonder and curiosity which is really what legendary places are all about. It makes people curious. The colors found in the pictures are also reflected on the color scheme of the site. They balance well with each other which makes the pages flow better.

What style choices did you make to improve the readability of your table?

In my case I just used the table to contain a gallery of pictures as I couldn't think of the right kind of information to compare within it. I did run into some functionality issues with my form in firefox and IE while it displayed fine in chrome. I looked through the code and couldn't figure out what was causing the issue so I placed the contact form within a table to format the data better and actually it looks pretty nice.

How did the media you created contribute to the purpose of your website? What plug-ins does the end user need to display-play?

The video I used is a perfect example of the endless documentaries that can be found on the history channel, history international, national geographic, and the science channel. I should know, I always DVR them. lol As with all youtube embedded videos they require a flash plug in which all up to date browsers have.

Final

a. Who is your target audience?

My audience is a family of a 6 year old child. I expect for it to be used as a way to teach the child that there are consequences to ones carelessness. The family need to have an interest on the Brother Grimm's Stories. I hope that some Grimm viewers will catch a glimpse and show it to their children.

b. Discuss your SEO planning and integration. Please discuss how you integrated the requirements stated under the SEO Section.

Well I planed and integrated the SEO section of the assignment by using the help of Gloogle Adwords in order to get the best words in for the meta tags. As far as content, it is pretty straight forward because the website tells the story of Little Red Riding Hood. Links are related to get back at me the designer as well as links to the story I based the website on.

c. Discuss your Testing experience.

It seems to be accessible in the the following browsers tested Firefox, Google chrome, safari. It works well on both Mac OsX and Windows platforms. For usability testing my husband and mother were able to navigate through it with easy no complaints there .

d. Describe your validating experience. What troubleshooting did you experience?

It went smoothly the media incorporation was the hardest. Finding an appropriate piece to put in. I ran into some trouble with the images being too big, so had to re-size them.

Also, due to the iFrame used to insert the YouTube video, the index.html page does not validate completely. The iFrame presents the only validation issue on the site.

e. How did the images you use contribute to your website’s purpose? Did your CSS style add to the “siteness” of your website?

I think the images add an element that appeals to the children and the CSS along with a table layout helped my website look more professional.

f. What style choices did you make to improve the readability of your table?

I used images, kept it clean with a thin border and used as a small image gallery.

g. How did the media you created contribute to the purpose of your website? What plug-ins does the end user need to display-play?

It looks good just got it from YouTube and paste it into the page. I believe flash and Quicktime

h. Add a link to your web site within your blog posting

Final

Website Final

Hello class:

It was a fun term. I enjoyed taking the class. I hope to see you in another class.
Journal:
a. My target audience for my website is school age kids from age 8 or older. I tried to appeal to my audience by providing more colorful borders and headings as opposed to pastels, earth tones, or greys. I also used a fun fantasy font called Papyrus for the headings that I thought seemed more fun to incite interest. The menu buttons are decorative with feet print to make the buttons pop out more and provide a dinosaur theme to the site. When the buttons are rolled over the feet print have a inner drop shadow to appear as though the feet print are making an impression on the button. I also added a little section called "Fun Facts" that provides tidbits about dinosaurs with a cartoon graphic to appeal to the younger crowd.

b. The SEO planning I used was to include relevant words as best I could into the header tags and links. The meta tags use keywords that are the most common words throughout my site. I also checked the words in Google Adwords to make sure the words I used are the best. All of my words have a low competition rating. Also, I have links are to popular websites related to the subject matter of my site. I checked the website for the American Museum of Natural History at linkpopularity.com and it is a very popular website and is well traveled. It should help my search ranking because they have a lot of content about dinosaurs.

c. I checked with the colour contrast tool to fix issues with contrast. I checked the site with cynthiasays.com and passed my accessibility with alt tags. I tested my site in firefox, safari, IE, and chrome. I checked it in browser lab, but it show safari layout all messed up so I double checked it in a live safari browser and it appeared okay in all browsers tested.

My tester's name is Valarie. She said she liked the fun facts at the top of the page because it caught her attention. She suggested to move the fun fast section lower in the page, but I couldn't think of an efficient way to do that because my content would be shoved below the fold, so I kept it there. She also advised for me to move a link on my trivia page because the link was at the bottom as was unnoticeable. So now I have it above the media content where it's more visible. Also, she noticed my font on my heading was different on the first page and didn't seem to match the rest of the site, so I changed the layout and color to make it uniform.

d. I validated my html and css. Everything passed except for the embed tag I had to use for the media file linked from Youtube. I tried an iframe tag originally, but it wouldn't play in IE so I had to use the embed and param tags, but the param tags don't validate.

e. I used images that were directly related to the information they were arranged by. The box model made the images appear more finished and uniform.

f. I changed the font color to white because the background are different colors and provided a border between cells. I collapsed the table to show a clean separation between cells.

g. The media needs a flashplayer plugin. The media is from youtube and it provides a fun example of how dinosaurs are in movies. It captures the attention of the user.

h. http://sws.pcc.edu/student/CAS206_pdeangel_43493/byronstine50/final/index.html

This was a fun website to make. I didn't think I would enjoy the testing phase, but I received a lot of feedback and neat ideas.

Jorgine Agasa - Final

a. Who is your target audience? Please respond to the required questions found in the
Design & Planning Section.
My target audience is anybody who is looking for a freelance illustrator for their projects I think. I want to be able to showcase work to a large variety of people so despite the urges, the garish colors were kept to a minimum.

The site should help the user focus on the art. So aside from some lime green peppered throughout the site, it's a pretty basic grey and white color scheme.

The color scheme:
grey: #303030
lime green: #40e749
white: #ffffff

b. Discuss your SEO planning and integration. Please discuss how you integrated the
requirements stated under the SEO Section.
Like everyone else, used alt and meta tagging with a few links here and there.

c. Discuss your Testing experience. Please include Accessibility, Browser, and Usability
testing.
Patty, I think you had some issues about why there was a link to the homepage on the header despite it looking the same as the illustration page, but I believe it is kind of good to at least have the original index in there somewhere. The roomie and her sister tried it out and they didn't seem to have any problems finding anything, or at least didn't really mention any. They said a title would help out somewhere so I have to think of something for those.

d. Describe your validating experience. What troubleshooting did you experience?
Aaa this was a nightmare! The site didn't even register on the school computers and just the accumulation of minuscule problems made it into one giant headache. The header wasn't the right proportion, parts of the images weren't bleeding over, the links wouldn't overlay, the buttons would still register even though they weren't part of the coding, the list goes on. Eventually everybody helped out and Patty was gracious enough to let me keep the links as text instead of using image buttons if I changed them enough.

Speaking of which, the CSS is not completely validated since text shadows are part of CSS 3 and the youtube embedding is making the validation freak out, as it normally does, but it is functional. Other than that everything else should be fine...? At least it is on this computer.

e. How did the images you use contribute to your website’s purpose? Did your CSS style add to the “siteness” of your website?
This site was all about the images. This is basically a portfolio website to help showcase illustrations. Basically every single image has a class or ID selector on it.

f. What style choices did you make to improve the readability of your table?
The table is basically a sidebar full of thumbnails, that acts as a secondary navigation for the site. They're large enough to display the some of the illustration that each box is linking to but not so large they'll take up the rest of the screen.

g. How did the media you created contribute to the purpose of your website? What plugins does the end user need to display-play?
Not much other than to exhibit exuberance of getting emails, particularly regarding commission work. Also that I really like that video, it cracks me up every time. Originally was gonna use an animation reel but I haven't done anything worth showing or allowed to show in many, many, many years. Yikes!

h. Add a link to your web site within your blog posting

Jo's Illustration Site

Shakif's Final

Testing
 All Testing requirements must be discussed in your blog posting.

1. Usability overview
i. Describe how you designed your site to enhance the user experience
I changed the wrapper a lot for each page to enhance the organization of the page.

ii. Have one other person test your site
Yes I picked someone who isn't well using the web which is my mother.

b. On your blog posting: add the person’s first name and at least four
comments that this individual said about your website
Mother's comments
-Organized
-Interesting
-Colors easy to read on text
-Career page too much information squeezed in.

2. On your blog posting, please state if you integrated these comments to
your website. Why or why not?
a. Test in Adobe Browser Lab
i. List the three browsers you used
Firefox and few different versions of IE
ii. What differences to you observe?
That the margins we're shifted different.
iii. What changes did you make to your web page after testing browser in browser

Fixed the margins with align on the css.


Blog Posting
a. Who is your target audience? Please respond to the required questions found in the
Design & Planning Section.
My target audience we're sports fan around the Portland area that are interested on reading more about Brandon Roy's life and career, much like a biography.
My primary color's we're #000000,#FFFFFF,##880000 and #0000A0.

b. Discuss your SEO planning and integration. Please discuss how you integrated the
requirements stated under the SEO Section.
Planning was very simple and I used alt and meta tagging.

c. Discuss your Testing experience.  Please include Accessibility, Browser, and Usability
testing.
Unlike my midterm, I had less errors and more usability coding wise that made my website more organized for the readers.

d. Describe your validating experience.  What troubleshooting did you experience?
Some troubleshooting experience i went through was involving the media with the re-sizing with the video.

e. How did the images you use contribute to your website’s purpose? Did your CSS style
add to the “siteness” of your website?
Well I used over the years of Brandon Roy like young ages, high school, college and nba and the purpose was for the viewers who he was.

f. What style choices did you make to improve the readability of your table?
The table I used as a stats table to read over the years what he average in basketball.

g. How did the media you created contribute to the purpose of your website? What plugins does the end user need to display-play?
I added a tribute to Brandon Roy as a link underneath career page and the purpose was just entertain the audience with a well done video.

h. Add a link to your web site within your blog posting
http://sws.pcc.edu/student/CAS206_pdeangel_43493/shakifdowllah01/Final/homepage.html

Josh Landis - Final

a. Who is your target audience? Please respond to the required questions found in the Design & Planning Section.
- My target audience is people who wish to participate in product testing/wish to become a human test subject. Well that and portal fans.
-My primary color scheme was #45BBED #000000 #ffffff #45BAEF
I pretty much borrowed the logo's color scheme along with companion cube's color scheme for the cube page.

b. Discuss your SEO planning and integration. Please discuss how you integrated the requirements stated under the SEO Section.
-i used meta tags, alt tags and relevant headings

c. Discuss your Testing experience. Please include Accessibility, Browser, and Usability testing.
- Testing actualy went pretty well. Displayed properly in all browsers. No complaints during my usability testing with my test subject takusaurus, The media page took about 1.5 seconds to load but it is a media page with 2 videos so i think its pretty safe to say that one was unavoidable.

d. Describe your validating experience. What troubleshooting did you experience?
- Oddly enough it went pretty well. My only issue was one css3 related error.

e. How did the images you use contribute to your website’s purpose? Did your CSS style add to the “siteness” of your website?
- Well the images helped to show examples of products developed by aperture science.

f. What style choices did you make to improve the readability of your table?
-font size

g. How did the media you created contribute to the purpose of your website? What plug-ins does the end user need to display-play?
- The media was a fun addition. The first video was a great example of what test subjects may experience during their time at the enrichment center and the second was a great ad for the turrets. (to bad we cant really buy one...... oh well....)

h. Add a link to your web site within your blog posting
Click Here!

ps- My site planning is stored in my final folder.