For my Final Project I decided to create a website, with my bosses full permission, for a book publishing company (Graphic Arts Books) I consult/work for.
a. My target audience are people interested in Alaska and Northwest books. This covers a large span of people as the books GAC publishes range from Photo-essay, childrens illustrated titles, cookbooks and non-fiction titles. I choose easy to read classic font styles, and colors that convey the feelings of the northwest and Alaska (blues and greens)
b. I have yet to master the box model....but I feel I'm getting better. That was my main issue. I also do not know what the secret is to using background: url(graphics/name.jpg) as I cannot for the life of me get this function to work. a little disappointing, but because of this I was unsuccessful with the rollovers, and probably would have implemented the technique in places like the table head.
c. the majority of the images used are front covers from the company. I picked the most important titles to feature (new releases and upcoming events). I also used a shot of mt. hood to convey "northwest". the colors of the shot tied in with the o/a site very well also.
d. I chose a border that matched the border of the website (double) I aligned the text right for column a and left for column b. to tie the lines better together. I used colors for the head and background to make the table still readable but that allow it to pop. I did not use lines between rows as I thought this would be overkill.
e. One of the upcoming events was for a book about a foot race. I chose media about the footrace to give people who may not be familiar with it exactly how cool the race and the mountain it is named for are.
f. I had no problems getting my code to validate using firefox validator in the the web toolbar. being careful to check and re-check my code as I designed it was very helpful. I triple checked all links to make sure they worked. and I checked for accessibility using cynthiasays.com (it passed!)
g (SEO) Although Graphic Arts Books name is perhaps not as well known as it's titles, or it's parent company (Ingram) so for the Keywords and meta tags I utilized these aspects. I also focused on a major subject of the company: Alaska as this has less competition then the general subject of publishing. A couple changes I made for better optimization: to my surprise, I noticed GAB's parent company Ingram Publishing services URL didn't receive as high rating as Ingram Content Group's URL so I added both to the "about" page. I also added more descriptive text to the title of each page.
I did use Browserlabs, and will continue to use it in the future. I noticed chrome windows and Firefox (mac) and Safari seemed to be very similar. while other windows browsers seemed to shift my logo head left and right. I tried to adjust this, but it was never consistent from browser to browser which way it would shift so I had to leave it. Not sure how to resolve this - smaller image or absolute positioning perhaps.
Sunday, March 13, 2011
Saturday, March 12, 2011
Final - Megan McFadden
A: I chose to create my site for my "make-believe" graphic design business ... which I plan on starting up for real sometime this year when I'm not so busy. My target audience is very general, it is mostly targeted towards businesses but also regular people who are in search of graphic design services. I chose to keep my site well organized with consistent navigation so it is easy for the user to navigate through. I chose my color scheme based on how I want my company branding to look; it is not tailored for a specific audience. My logo needs work ... but I don't want to waste too much time on that right now.
B: I actually didn't experience any trouble shooting this time around, other than missing a closing p tag. I may have had problems with the image navigation but I pulled my hair out over that on the midterm. Now that I have that figured out, this site was pretty easy for me ... except for the fact that I spent WAY too much time on it and now I'm panicking about studying for my microbiology final.
C: The images provide an example of the designs I have created at my jobs. I hope it contributes to my website since it shows the viewer what my designs are like. I created a thin border and padding around all of the images to help them stand out a little better.
D: I kept my table pretty simple and clean. I made a different color for the headers, made the main items bold, and created a border around everything so it is easy to follow.
E: I had a HORRIBLE time finding media to fit into my site. For my real site, I will not be including any media. For the purpose of this assignment, I found a video regarding the graphic design process and added a link to it so the viewers can watch if it their curious about how the design process works. The video is on YouTube, so the user will need a flash plug-in.
F: I didn't have any problem validating, it went really smooth for me. I just had that missing ending p tag at one point, but that was easily fixable.
G: I added in meta tags, description and keywords, below the title tag to help search engine crawlers index my site. I also tried to use the text "graphic design" a lot throughout my site. I created a Facebook page for my pretend company and added a link to that page (which needs work, of course, but I'll do this once I make the site officially live), and also added a link to my LinkedIn account. I also added a link to my final site on each of the sites I linked to (does that make sense)? I chose to link to these sites in an attempt to benefit from the social media and SEO concept.
H: My browser experience went great! I was really happy that everything looked right in all the browsers I tested (Chrome 8.0-windows, Firefox 3.6-windows, Firefox 3.6-OSX, IE 8.0-windows, IE 9.0 Beta-windows, Safari 5.0-OSX, IE 7.0 -windows, IE 6.0-windows, Firefox 4.0 Beta 7 -windows). The only real issue I had was the .png image rendering in Internet Explorer 6.0 does not seem to catch the transparency on my navigation. I chose not to change this at this time, but I will figure out how to manipulate the graphics so I don't have to use a .png. I do plan on using the browser labs as long as it is available.
I: For the testing requirements, I used the W3Cvalidator for all of my HTML and CSS to make sure it validated, and fixed any errors I had. I checked all of my links and they work just fine. I used http://www.cynthiasays.com/ to test my accessibility and my site passed the verification checklist; I had no warnings.
J: My final site
B: I actually didn't experience any trouble shooting this time around, other than missing a closing p tag. I may have had problems with the image navigation but I pulled my hair out over that on the midterm. Now that I have that figured out, this site was pretty easy for me ... except for the fact that I spent WAY too much time on it and now I'm panicking about studying for my microbiology final.
C: The images provide an example of the designs I have created at my jobs. I hope it contributes to my website since it shows the viewer what my designs are like. I created a thin border and padding around all of the images to help them stand out a little better.
D: I kept my table pretty simple and clean. I made a different color for the headers, made the main items bold, and created a border around everything so it is easy to follow.
E: I had a HORRIBLE time finding media to fit into my site. For my real site, I will not be including any media. For the purpose of this assignment, I found a video regarding the graphic design process and added a link to it so the viewers can watch if it their curious about how the design process works. The video is on YouTube, so the user will need a flash plug-in.
F: I didn't have any problem validating, it went really smooth for me. I just had that missing ending p tag at one point, but that was easily fixable.
G: I added in meta tags, description and keywords, below the title tag to help search engine crawlers index my site. I also tried to use the text "graphic design" a lot throughout my site. I created a Facebook page for my pretend company and added a link to that page (which needs work, of course, but I'll do this once I make the site officially live), and also added a link to my LinkedIn account. I also added a link to my final site on each of the sites I linked to (does that make sense)? I chose to link to these sites in an attempt to benefit from the social media and SEO concept.
H: My browser experience went great! I was really happy that everything looked right in all the browsers I tested (Chrome 8.0-windows, Firefox 3.6-windows, Firefox 3.6-OSX, IE 8.0-windows, IE 9.0 Beta-windows, Safari 5.0-OSX, IE 7.0 -windows, IE 6.0-windows, Firefox 4.0 Beta 7 -windows). The only real issue I had was the .png image rendering in Internet Explorer 6.0 does not seem to catch the transparency on my navigation. I chose not to change this at this time, but I will figure out how to manipulate the graphics so I don't have to use a .png. I do plan on using the browser labs as long as it is available.
I: For the testing requirements, I used the W3Cvalidator for all of my HTML and CSS to make sure it validated, and fixed any errors I had. I checked all of my links and they work just fine. I used http://www.cynthiasays.com/ to test my accessibility and my site passed the verification checklist; I had no warnings.
J: My final site
Friday, March 11, 2011
Final Blog Posting-Jane Ghorashi
a) Who is your target audience?
My target audience are people who are interested in have pets.
b) What trouble shooting did you experience?
Navigation and centering was one of my main issue and I tried to put some images but I cannot center or position my images.
c) How did the images you contribute to your website’s purpose? Did your CSS style add to the “siteness” of your website?
My images contributed quite well for my web site. Some images of the
d) What choice s did you make to improve the readability of your table?
I change the heading to a brighter color and increase the font.
e) How did the media you created contribute to the purpose of your website? What plug-ins does the end user need to display-play.
Adobe flash player would be the main plug-in.
f) Describe your validating experience
I have no problem with validating. Validating help me a lot with html and css
Link.
SEO by Jane Ghorashi
SEO
A) How do you believe Social Media is changing web searching?
It allows people to connect on different media platforms. It’s changing advertisers delivering services to users via social network.
B) What social Media sources do you think would be appropriate to promote a web site?
Face book, Twitter, YouTube are some of the main sources or any websites that receive online traffic.
C) What is your opinion regarding social media influencing web search results?
I think Social Media will have an increasing impact on search results as search engine being to include Social Media in their algorithm. Twitter has had an impact on news and current events as shown as recently happen in Egypt.
Please provide one additional resource to support your opinion:
http://mashable.com/2009/10/16/social-media-changing-lives/
Thursday, March 10, 2011
SEO
How do you believe Social Media is changing web searching?
Content posted on social media sites can end up in general internet search results. This fact has not gone unnoticed by the ad agencies and retailers, as they have now found a new place to market themselves. As their efforts and presence on the social sites creates web activity that the search engines don't ignore, they create the appearance of a larger interwoven web presence in related searches.
What Social Media sources do you think would be appropriate to promote a web site?
YouTube is exploitable for this purpose. If you post useful videos that end with 10 seconds of promotion pointing to your web site, you are likely to drive users there. I can see how people could exploit facebook and twitter by posting a website. And I don't think that is inappropriate, as the people reading the post have freewill to click the link, or "de-friend" you if they have a problem with your promotion tactics.
(Hey - no harm, they're not your REAL friends anyways - just virtual.)
What is your opinion regarding social media influencing web search results?
If it becomes a noticeable problem, I trust the search engine gurus will take notice and filter results to give the searchers what they are expecting. Ethics in the advertising world flex with whatever people will tolerate. Also, I am sure as with any corporation, a search engine company's decision on this topic will be influenced by their corporate relationship with the social media site.
Please provide one additional resource to support your opinion.
This link goes to a Dec 2010 article on "searchengineland.com". They interview Google and Bing to discuss how their search results are influenced by postings on facebook and twitter. What I read between the lines, is that it's not considered a problem, and that the mindset is that these sites are part of the internet landscape, and therefore will continue to influence the search engines. Social Signals
David peterson FINAL
FINAL BLOG QUESTIONS ANSWERED
A.) my target audience is families to young adults looking to purchase a pet for them and their families. The design choices that I chose was a dark background a lighter style heading with black text upon the light heading along with monotone like colors such as white gray and black for easy overall look and feel
b.) Experienced some troubleshooting when I had to deal with the table once again also I had to deal with the problem with the OL and UL sharing LI tags and yet having different CSS values for each.
C.) the images contributed to my website by adding both a humorous and emotional response to human feelings by applying its two people sympathy for animals in need by using pictures of cats that seem to need a good home. My CSS style deed at my site and is by giving a nice soft look to the overall website was creating a more natural feel to the website in the business style of wanting to help animals as a business
D.) I changed the heading top piece of the table to match the same style as the heading tags and increase the font size making it more easy to read for the elderly and those who cannot read smaller text.
E.) the media contributed to my website because I chose a piece that talks about adopting at the events are happening in real time and the anyone can join and choose to bring a new family member home with them which is the point of this website. Adobe flash player would be the main plug-in that someone would need to be able to play this media.
F.) my validation experience actually went pretty well I didn't seem to occur very many validation errors mainly due to useful reusable code in good best practices.
G.) integrating ST oh best practices was very interesting and loudly be a go and see the use for meta-tags but not only this but also to see how useful keywords are truly for search engines and much more.
G.I)
a.) By the use of keywords and using Google ad-words defines select keywords such as "the right pet" I have used these to create good select keywords that people will use inside of search engines increasing my overall chance for people to see my website.
b.) By using SCO meta- tag is allowed me to index my web pages would allow me to be able to create a more effective overall looking web-page.
c.) By the use of links this will increase my usability to my visitors that see my web-page making easier to navigate and more likely for them to remain on my web-page increasing my stickiness as it says in the book.
d.) The contents I've placed inside my web-pages are filled with a congruent theme to help pets in need of a home in need of adoption to get them off the streets.
e.) My style hierarchy using as SEO has allowed my web-page to be more efficient looking at overall more usable to my visitors making it look professional and more like a business is that of a simple civilian website.
H.) my browser lab experience was rather interesting I do believe that I will continue to use it mainly due because the fact I'm unable to see any competitors doing the exact same style of side-by-side display like this also I find it's a valuable resource to see what functions and what doesn't. It was very nice to be able to see the differences in advantages and disadvantages in different styles of coding within different styles of Internet browsers.
I.) after performing all the test requirements list was requested of me on this assignment I have to say that I find it very reassuring that they have a strict code the webpages should be kept to for good re-usability for future websites and more I also like that the accessibility testers help you to be able to learn what it is you need to put on your website to help those who are disabled to be one of fully experience your website to the best of your ability to code.
J.)http://sws.pcc.edu/student/CAS206_pdeangel_13645/davidpeterson67/Final/Final/homep.html
TESTING
www.cynthia.com i seem to have passed most of the test requirements for her accessibility website
M. 508 Standards, Section 1194.22, (m) When a web page requires that an applet, plug-in or other application be present on the client system to interpret page content, the page must provide a link to a plug-in or applet that complies with §1194.21(a) through (l).
* Rule: 6.3.5 - All OBJECT elements are required to contain element content.
o No OBJECT elements found in document body.
* Rule: 6.3.6 - All APPLET elements are required to contain both element content and the alt attribute.
o No APPLET elements found in document body.
* Rule: 6.3.7 - When EMBED Elements are used, the NOEMBED element is required in the document.
o No EMBED elements found in document body.
* Rule: 6.3.8 - All pages that have links to files that require a special reader or plug-in are required to contain the specified text indicating a link to the reader or plug-in.
o Note: This rule has not been selected to be verified for this checkpoint.
Yes
L. 508 Standards, Section 1194.22, (l) When pages utilize scripting languages to display content, or to create interface elements, the information provided by the script shall be identified with functional text that can be read by assistive technology.
* Rule: 6.3.1 - Anchor elements are required not to use javascript for the link target when the NOSCRIPT element is not present in the document. These elements will not cause a failure of the checkpoint if the NOSCRIPT element is found, however, they will be identified.
o No Anchor elements that use javascript for the link target were found in document body.
* Rule: 6.3.2 - AREA elements are required not to use javascript for the link target when the NOSCRIPT element is not present in the document. These elements will not cause a failure of the checkpoint if the NOSCRIPT element is found, however, they will be identified.
o No AREA Elements found in document body.
* Rule: 6.3.3 - Locate elements that use HTML event handlers.
o Note: This rule has not been selected to be verified for this checkpoint.
* Rule: 6.3.4 - When SCRIPT Elements are used, the NOSCRIPT element is required in the document.
o No SCRIPT elements found in document.
Yes
A. 508 Standards, Section 1194.22, (a) A text equivalent for every non-text element shall be provided (e.g., via "alt", "longdesc", or in element content).
* Rule: 1.1.1 - All IMG elements are required to contain either the alt or the longdesc attribute.
o No invalid IMG elements found in document body.
* Rule: 1.1.2 - All INPUT elements are required to contain the alt attribute or use a LABEL.
o No INPUT Elements found within document
* Rule: 1.1.3 - All OBJECT elements are required to contain element content.
o No OBJECT elements found in document body.
* Rule: 1.1.4 - All APPLET elements are required to contain both element content and the alt attribute.
o No APPLET elements found in document body.
* Rule: 1.1.6 - All IFRAME elements are required to contain element content.
o No IFRAME elements found in document body.
* Rule: 1.1.7 - All Anchor elements found within MAP elements are required to contain the alt attribute.
o No MAP elements found in document body.
* Rule: 1.1.8 - All AREA elements are required to contain the alt attribute.
o No AREA elements found in document body.
* Rule: 1.1.9 - When EMBED Elements are used, the NOEMBED element is required in the document.
o No EMBED elements found in document body.
Yes
Accessibility testing
the first link I chose was the link to Google as a means to help others find my website and also to give Google credit in helping others to find my web page thus having a two fold effect to make Google more accepting of my website onto there linked pages ( of course i would need Google's permission for this but I'm quite confident they would accept once i spoke with them over it )
The second link i chose was to w3schools to help theirs to learn how to build there own website and to also give w3schools credit for helping me to build there website this will inspire competition and increase economy between my company and others also will increase w3schools over all influx of people again making it so they are happy with me (again after i request for then to allow me to do so )
Usability overview
Designed my website to enhance user experience by highlighting all the links with a bright background for easy accessibility and maneuverability through the web-pages I also highlighted around each pitcher with a border color picture that was bright yet also monotone so not to make people want to leave the websites due to the color I included some humorous pictures to invoke emotion within the website and also to increase likeliness that people want to purchase a very cute cats or give them the idea that they are going to purchase a cute cats like ones on the pictures I included a very extensive gallery with very nice pictures and borders around them give each one a crystal-clear look and feel making it look professional.
Testing in adobe browser lab
i.)
Chrome 8.0-windows
Firefox-OS X
I explorer 8.0 windows
ii.) some of the wording was bigger then others but over all was pretty much exactly the same
iii.) adjusted some of the text to make it seem more alike one another
A.) my target audience is families to young adults looking to purchase a pet for them and their families. The design choices that I chose was a dark background a lighter style heading with black text upon the light heading along with monotone like colors such as white gray and black for easy overall look and feel
b.) Experienced some troubleshooting when I had to deal with the table once again also I had to deal with the problem with the OL and UL sharing LI tags and yet having different CSS values for each.
C.) the images contributed to my website by adding both a humorous and emotional response to human feelings by applying its two people sympathy for animals in need by using pictures of cats that seem to need a good home. My CSS style deed at my site and is by giving a nice soft look to the overall website was creating a more natural feel to the website in the business style of wanting to help animals as a business
D.) I changed the heading top piece of the table to match the same style as the heading tags and increase the font size making it more easy to read for the elderly and those who cannot read smaller text.
E.) the media contributed to my website because I chose a piece that talks about adopting at the events are happening in real time and the anyone can join and choose to bring a new family member home with them which is the point of this website. Adobe flash player would be the main plug-in that someone would need to be able to play this media.
F.) my validation experience actually went pretty well I didn't seem to occur very many validation errors mainly due to useful reusable code in good best practices.
G.) integrating ST oh best practices was very interesting and loudly be a go and see the use for meta-tags but not only this but also to see how useful keywords are truly for search engines and much more.
G.I)
a.) By the use of keywords and using Google ad-words defines select keywords such as "the right pet" I have used these to create good select keywords that people will use inside of search engines increasing my overall chance for people to see my website.
b.) By using SCO meta- tag is allowed me to index my web pages would allow me to be able to create a more effective overall looking web-page.
c.) By the use of links this will increase my usability to my visitors that see my web-page making easier to navigate and more likely for them to remain on my web-page increasing my stickiness as it says in the book.
d.) The contents I've placed inside my web-pages are filled with a congruent theme to help pets in need of a home in need of adoption to get them off the streets.
e.) My style hierarchy using as SEO has allowed my web-page to be more efficient looking at overall more usable to my visitors making it look professional and more like a business is that of a simple civilian website.
H.) my browser lab experience was rather interesting I do believe that I will continue to use it mainly due because the fact I'm unable to see any competitors doing the exact same style of side-by-side display like this also I find it's a valuable resource to see what functions and what doesn't. It was very nice to be able to see the differences in advantages and disadvantages in different styles of coding within different styles of Internet browsers.
I.) after performing all the test requirements list was requested of me on this assignment I have to say that I find it very reassuring that they have a strict code the webpages should be kept to for good re-usability for future websites and more I also like that the accessibility testers help you to be able to learn what it is you need to put on your website to help those who are disabled to be one of fully experience your website to the best of your ability to code.
J.)http://sws.pcc.edu/student/CAS206_pdeangel_13645/davidpeterson67/Final/Final/homep.html
TESTING
www.cynthia.com i seem to have passed most of the test requirements for her accessibility website
M. 508 Standards, Section 1194.22, (m) When a web page requires that an applet, plug-in or other application be present on the client system to interpret page content, the page must provide a link to a plug-in or applet that complies with §1194.21(a) through (l).
* Rule: 6.3.5 - All OBJECT elements are required to contain element content.
o No OBJECT elements found in document body.
* Rule: 6.3.6 - All APPLET elements are required to contain both element content and the alt attribute.
o No APPLET elements found in document body.
* Rule: 6.3.7 - When EMBED Elements are used, the NOEMBED element is required in the document.
o No EMBED elements found in document body.
* Rule: 6.3.8 - All pages that have links to files that require a special reader or plug-in are required to contain the specified text indicating a link to the reader or plug-in.
o Note: This rule has not been selected to be verified for this checkpoint.
Yes
L. 508 Standards, Section 1194.22, (l) When pages utilize scripting languages to display content, or to create interface elements, the information provided by the script shall be identified with functional text that can be read by assistive technology.
* Rule: 6.3.1 - Anchor elements are required not to use javascript for the link target when the NOSCRIPT element is not present in the document. These elements will not cause a failure of the checkpoint if the NOSCRIPT element is found, however, they will be identified.
o No Anchor elements that use javascript for the link target were found in document body.
* Rule: 6.3.2 - AREA elements are required not to use javascript for the link target when the NOSCRIPT element is not present in the document. These elements will not cause a failure of the checkpoint if the NOSCRIPT element is found, however, they will be identified.
o No AREA Elements found in document body.
* Rule: 6.3.3 - Locate elements that use HTML event handlers.
o Note: This rule has not been selected to be verified for this checkpoint.
* Rule: 6.3.4 - When SCRIPT Elements are used, the NOSCRIPT element is required in the document.
o No SCRIPT elements found in document.
Yes
A. 508 Standards, Section 1194.22, (a) A text equivalent for every non-text element shall be provided (e.g., via "alt", "longdesc", or in element content).
* Rule: 1.1.1 - All IMG elements are required to contain either the alt or the longdesc attribute.
o No invalid IMG elements found in document body.
* Rule: 1.1.2 - All INPUT elements are required to contain the alt attribute or use a LABEL.
o No INPUT Elements found within document
* Rule: 1.1.3 - All OBJECT elements are required to contain element content.
o No OBJECT elements found in document body.
* Rule: 1.1.4 - All APPLET elements are required to contain both element content and the alt attribute.
o No APPLET elements found in document body.
* Rule: 1.1.6 - All IFRAME elements are required to contain element content.
o No IFRAME elements found in document body.
* Rule: 1.1.7 - All Anchor elements found within MAP elements are required to contain the alt attribute.
o No MAP elements found in document body.
* Rule: 1.1.8 - All AREA elements are required to contain the alt attribute.
o No AREA elements found in document body.
* Rule: 1.1.9 - When EMBED Elements are used, the NOEMBED element is required in the document.
o No EMBED elements found in document body.
Yes
Accessibility testing
the first link I chose was the link to Google as a means to help others find my website and also to give Google credit in helping others to find my web page thus having a two fold effect to make Google more accepting of my website onto there linked pages ( of course i would need Google's permission for this but I'm quite confident they would accept once i spoke with them over it )
The second link i chose was to w3schools to help theirs to learn how to build there own website and to also give w3schools credit for helping me to build there website this will inspire competition and increase economy between my company and others also will increase w3schools over all influx of people again making it so they are happy with me (again after i request for then to allow me to do so )
Usability overview
Designed my website to enhance user experience by highlighting all the links with a bright background for easy accessibility and maneuverability through the web-pages I also highlighted around each pitcher with a border color picture that was bright yet also monotone so not to make people want to leave the websites due to the color I included some humorous pictures to invoke emotion within the website and also to increase likeliness that people want to purchase a very cute cats or give them the idea that they are going to purchase a cute cats like ones on the pictures I included a very extensive gallery with very nice pictures and borders around them give each one a crystal-clear look and feel making it look professional.
Testing in adobe browser lab
i.)
Chrome 8.0-windows
Firefox-OS X
I explorer 8.0 windows
ii.) some of the wording was bigger then others but over all was pretty much exactly the same
iii.) adjusted some of the text to make it seem more alike one another
Saturday, March 5, 2011
a. In what way did your table display data easier for your users to view?
It made it easier to show off my pictures.
b. What style choices did you make to improve the readability of your table?
It looks a bit like like the rest of the page, but sticks out a bit.
c. How did the media you created contribute to the purpose of your website? What plug-ins does the end user need to display-play?
I used a song and you need wav to get home.
d. Add a link to your web site within your blog postingBlah
It made it easier to show off my pictures.
b. What style choices did you make to improve the readability of your table?
It looks a bit like like the rest of the page, but sticks out a bit.
c. How did the media you created contribute to the purpose of your website? What plug-ins does the end user need to display-play?
I used a song and you need wav to get home.
d. Add a link to your web site within your blog postingBlah
Subscribe to:
Posts (Atom)