Web Design 2 #3 Chapter 15 and 16

For this blog i am going to solely focus on Chapter 16 which discusses redoing a website. This really interested me because I love the idea of fixing things such as a out of date website or a poorly designed website. As a beginning web designer i feel this is a great thing to start with because you have the content you need all you have to do is figure out a better solution and an overall solution to the problem of the original website. All in all it is just problem solving .  I found an excellent video for this. The video is sort of long but the idea behind it is where to start. It tells you to get an overall look and feel for your website by doing these three steps : 1. Define it in words first2. Use visual metaphors
3. Know the history & the rules of design. http://www.youtube.com/watch?v=P8QQ_WMX2x8&list=SL&feature=sh_e_se In other words the three steps are telling you to know design and know it well . Know how to describe what you are trying to do , use metaphor to help get your idea across visually, and know the rules of design. You can not expect to design a website and not know the basics. Being in web design two this should be fairly familiar. However i was just using this video as something to catch people up. Another helpful link that i found was http://www.universitybusiness.com/article/10-tips-successful-website-redesign This also gives you steps to a successful website redesign. Those 1o steps are : Define strategic goals, do your homework, don’t forget ADA and web standards, Put on your project manager hat, spend quality time with your content, invite feedback, don’t forget to test , Get a CMS when you redesign, Embrace incremental redesign, and don’t worry. This is basically telling us to know what you are design and know it well. If you are redesigning a housing companies website know how they talk , and know what they mean when they use logistics. That link is pretty straight forward so i wont reiterate it all. All in All you need to know your content well when you choose to redesign.

Advertisements

Web Design 2 #2

Typography seems like such a simple concept , but yet there is so much to understand with this term. When it comes to websites and coding, typography can become very tedious and cumbersome. The book gave us 6 guidelines for using typography when designing a website. You must first limit yourself to two fonts. If you use anymore than two it can become very distracting and lead to someone leaving your website. Such as this example : http://www.soccergiftshop.co.uk/ . The next thing that the book said about typography was how we should restrict color. Meaning if the page uses unnecessary color it may confuse the viewer. Although this is an interesting website this use of color on this website becomes confusing and unnecessary : http://www.posttypography.com/. The third guideline that the book gives us would be matching font size to margin width so that it is easily readable. This website does the complete opposite which is why this is a great guideline to follow:http://www.giftshop.ed.ac.uk/site/index.cfm?killnav=1. The fourth guideline would be using a grid format. As suggested in chapter 12 the grid can be your best friend. It will allow for your viewer to follow your page easily. An example of a great grid website layout would be : http://www.wilsonminer.com/. The fifth guideline would be to design to encourage reading. This means that you are to use things such as pull quotes or oversized opening paragraphs to get the viewer engaged. This website does an excellent job with that: http://99designs.com/ . And last but certainly not least the sixth and final guideline would be to set your type to a baseline grid. This will bring overall harmony to your page. An example of this would be :http://www.alistapart.com/d/settingtypeontheweb/example.html. This video that i found on youtube emphasis this whole set of guidelines very well: http://pixeldreams.com/2011/. So as you can see with following all of these guidelines you can create an interesting and dynamic website and keep the viewer engaged .

Web Design 2 : #1

Through reading these few chapters the thing that stuck out the most to me was how beneficial CSS is to a web designer. CSS is a standard layout language for the web. Some things that are beneficial about it would be that it conserves bandwidth which in return saves the site owner money. Another thing that makes it beneficial would be how it reduces the design and development time . Through saving the time and money for a designer  this will allow for more efficient website. Another factor that plays into how CSS is helpful would be how it reduces updating time and maintenance time. Two final things would be how it increases its accessibility and it allows for the designer and site owner to be relieved to know that clients will have a more difficult time breaking the site.

The second beneficial thing that i found out of the readings for this week would be how HTML is the markup to stick with. The book gives us five reasons to stick with HTML. These reasons include : It works better in all browsers, it is more forgiving of errors, and it does not require as many formal closing elements.

The website below is an example of how CSS is beneficial to web designers:

http://www.drostdesigns.com/top-12-benefits-of-using-css-for-web-pages/

Overall throughout my reading of these few chapters i have come to realize that even as a beginning web designer i should become very comfortable with CSS and HTML as a whole because all in all they will help me get through projects easier and more efficiently.

Quality Assurance Testing

Quality Assurance Testing… What is it? Well it is basically checking and checking and triple checking how your website will work. There are many different stages you will have to check your website at before and after it goes live. Things to assure during the testing and checking would be spelling and grammar, accessibility, browser checks, and validation. Knowing that once is not enough, is the key in this step. It is better to be safe than sorry at this point. Once you go live on the web its live and everyone can see it. Now going back to those different checklist items. When you think of spelling and grammar that is pretty basic and easy to understand. Then we move on to accessibility this is the point where you make sure that it will be easy to find and maneuver and every one can have access if that is what you so desire. With the validation aspect this is the point where the validator will double check everything and see if there are any mistakes or things that they think may need to be corrected. For the area of browser checks, this is where you check and see how your site will look on a variety of browsers and see if there are any specific things that need to be changed like pixelation or any such thing. Then at this point you deploy it to the web. After this is done do another check. Yes! this may seem like to much checking but in the end it will be worth it. It is better to be safe then sorry.

Accessibility

When thinking about using the web let alone just the computer if i had a disability , it would be so difficult. I am not even sure how i would handle that. I have a friend who is paralyzed from the waist down and his hands are paralyzed too however he gets a family member to tape pencils to his hands and he types using pencils. It is not the ideal way of typing or something anyone who isn’t disabled would type but for him it is all that he has and it works for him. When thinking about things like vision. This becomes tricky because all that do on the web is see everything is based off of how we see and what we see to allow us to know what is going on in the world. However there are particular websites now that will read to you what is being portrayed on the site.

Through researching this idea of disability and the web i came across some interesting things. I found this website that pretty much laid out avariety of scenarios and how poeple this those disbailities cope with it . http://www.w3.org/WAI/EO/Drafts/PWD-Use-Web/. On this website they gave examples like: an online shopper with color blindness, or a reporter with repetitive stress injury, or and online student who is deaf, and many more. Some ways that they coped with this would be by: control keys on the keyboard, captured audio portions, and user control of style sheets.

This idea of disabilities can becomes a hardship but being aware of them as designers can be a great thing . Knowing that everyone of every ability is potentially your client for a particular website means that you not only have to design and develop a website that will work for the seeing and the mobile but also for the people who cant see or are immobile.

trends on the web

I found this awesome website that basically lays out the trends of the web in 2011. It explains things such as the traditional fold. Which is something that we discussed in class. It tells us that the fold no longer exists because people are using may different platforms to view websites. There are even now websites that are specifically designed to be viewed via mobile devices. Some other things that the writer suggested were becoming a new hit were; typography, applications, grids ( breaking the grid), images ( huge), css3, texture ! , info graphic, single page, 3d, and social media convergence. With all of these new technologies that are being developed everyday the web is changing drastically. We cant sit down and decide o this is what is going to happen in the near future with the web and thats just how it will be period end of discusion. Because in fact, the web is changing as we speak. New things are coming and old things are being altered and coming back and are better than ever. This is the world of design.

http://webdesign.tutsplus.com/articles/design-theory/the-state-of-web-design-trends-2011-annual-edition/