Wednesday, 18 September 2013

Unit 44 Website Design

Javascript:
We use javascript when designing web pages as it helps us to provide certain functions. If javascript wasn't used in the makeup of a website then you'd end up with a site that has all the form but none of the function, in that it may look aesthetically pleasing but it won't function as well as it possibly could. Another use for javascript is certain interactive aspects such as videos and games, simple inclusions which can make a site infinitely more likeable. A final use of javascript could be to animate certain parts of a webpage, through constant resizing/reshaping of elements. By doing this you could easily make a page look more busy and interactive, which could help in making the website experience feel more immersive.

Javascript is near perfect for altering web pages as it's based entirely in your browser. This allows you to change aspects of a website with relative ease and have them implemented very quickly.

HTML:
HTML is an entirely different tool to javascript in that it lets you tamper with the basic looks and structure of a website. An example of things HTML can alter would be colours, borders, spacing and font stuff. Again, similarly to javascript, HTML is very necessary in creating a website in that without it you may have a fully functioning page but the odds are it will look very basic and rather shoddy. All of this will make people feel less inclined to stay on your site and more likely to look elsewhere for a place to waste time.

Other than just HTML, CSS helps you sort out the presentation of a website. You can implement images and shapes on HTML and precisely alter their positions and sizes on CSS. To use a poor metaphor, if HTML gave you the ability to choose what clothes you put on in the morning, CSS would give you the option of changing the size and colour of each item of clothing.






http://www.codecademy.com/robin.claassens



Imagine all the necessary points for the previous task/s are all present.
Failing that, there's a crack squad of little people working on fixing any issues.

;]



Research Web Design Issues.


  1. Aesthetic qualities
  2. Access speed
  3. Content is king
  4. Web standards
  5. Websafe colours
  6. Image formats
  7. Font families
  8. Fluid vs fixed
  9. Responsive web design
  10. Layout
  11. Advantages of HTML5 over older HTML versions
  12. Readability
  13. Usability
  14. Consistency 
  15. Navigation
  16. Accessibility
  17. Cross browser compliance


1. If a web page isn't aesthetically pleasing it may be difficult to navigate. An unappealing webpage will also possibly discourage people from visiting it in the future.

2. Access speed refers to the speed it takes for the webpage to load. This was more of an issue in the days of dial up and snail's-pace internet speeds but the way a site is laid out could effect the time it takes for it to fully load. Some people aren't as patient as others.

3. Content is the only thing that realistically will draw people in to viewing your page. If the content isn't up to scratch then people will be more inclined to not visit your website in the future. Additionally, if you have the right information but it's set out poorly then people won't put in the effort to make sense of it.

4. Web standards refers to standards that all web pages are judged by.

5. There are a select number of colours that are universal to all browsers and operating systems, these are known as websafe colours, outside of these are colours specific to certain operating systems or browsers. These colours can still be used but if you use them you run the risk of alienating certain users by not having them appear properly.

6. Webpages can only show 4 filetypes when it comes to images. These include .jpeg, .gif, .png and .tif. If an image of any other filetype is included in a webpage it won't properly appear.

7. Font families are important and need to be thought about when putting a website together. If you choose a font to use throughout your page and it's not available on another browser the font will default to a different font and possibly ruin the feel of your page.

8. What's meant by fluid or fixed is the way the webpage scales when the browser window size is altered. A fluid page will alter and scale with a changing page size, whereas a fixed page will crop and sheer off the edge of the screen.

9. Responsive web design hints at the need for a website to respond quickly otherwise the user will lose interest and leave the page.

10. The layout refers to the positioning of things in HTML and CSS. Without a decent layout it may be difficult to navigate a website properly/with ease.

11. Advantages of HTML5 over older HTML versions

12. A site's readability refers to how easy it is for a user to extract all the data from a website. A site with poor readability will be more efficient and probably better laid out.

13. A site with decent usability will be easy to navigate and therefore easy to learn from. If a site has poor usability it could be possible to become lost in the information which could lead to frustration and an inevitable exit from the site.

14. The consistency of a website refers to how well a site flows, for want of a better word. For example a site with poor consistency may have many different fonts/font sizes within a body of text. Poor consistency within a site could make it look scrappy and of a low quality.

15. A website with decent navigation will allow for the user to easily move between different internal web pages and retrieve the information they desire. A site with poor navigation could lead to the user becoming lost and leaving the page.

16. An accessible website will be on that caters for users who may have certain needs or difficulties.

17. Cross browser compliance refers to a site's ability to run consistently on multiple browser platforms. Eg. A website created for firefox may not run on chrome properly as chrome may have different internal settings.


Website Evaluation-




























Above is a screenshot of my finished webpage, I ended up going for a minimalist theme to my site which I feel can be seen throughout my design. I decided to make the overall colour-scheme of my page greyscale as I felt it was best to accommodate the minimalist feel.

I'm happy with my navigation bar, as you can see from the screen grab, the current page is highlighted in orange whereas the normal pages are a slightly lighter shade of black. As you highlight a possible page to visit the name appears in full black which by comparison is a noticeable difference but slight enough that I would consider it minimal.

I'm generally quite happy with my design as a first attempt, I feel like I'm much more comfortable with the processes involved in creating a website and how to implement buttons and navigation aspects etc.

If in future I was to make another website I'd spend more time learning how implement textures over borders to make everything more aesthetically pleasing as I feel like my above efforts are very basic in nature.