Tuesday 29 October 2013

OUGD504 - Design Production - Design for web - Studio brief 2 - workshop 1

Web introductory workshop and written workshop sessions 

Aims of session:

  • Web standards and limitations
Acronyms, Abbreviations etc.
Designing for the lowest common denominator
  • Layout
  • Setup
  • Basic coding
Limitations 

  • Originally there were only 216 web safe colours - now computers can host over 6mil colours!

What's a Favicon?
Favicon is a little icon on the tab of chrome and sometimes at the start of a URL.


When Coding

  • The head of a website in coding is the place to store all data for the site - this part isn't actually visible is just used for dictating what the website should do.
  • The title in 'head' is title of page on the tab not necessarily viewed on the page.
  • Anything that you want to be visible on a site should be in between the body section.
  • Every part of the content of the website needs to be in one folder on the computer itself - if not this produces error 404 because the website can't find the page needed in this one file.
  • NEVER put any spaces, symbols, numerical characters or capitals when naming your site folder. It also needs to be 8 characters or less.
Setting up a basic website using DreamWeaver:

In this demonstration I have named both my folder and my website 'root'. 


Home page should be saved as index for it to work correctly.


The pages will start to appear in the side bars and folders.


An asterisk next to the name of the site on the tab in dreamweaver indicates a site with unsaved changes:





Commonalities of navigation solutions in websites:

  • Nav bar at the top / left of the screen
  • Footer
  • Search bar top right of screen
  • Top left back button
  • Social media buttons top right of screen
  • Start of the website on the home page
  • Logo top left as home page link throughout site
  • Breadcrumbs for navigating through product sites


Un-commonalities of navigation solutions in websites:

  • Landing page (old fashioned)
  • Left to right scrolling (becoming more popular)
  • Paralax scrolling (becoming more popular)
  • No navigation bar at all
  • Everything on one page



No comments:

Post a Comment