Tuesday, November 22, 2016

OUGD504 - Design for Screen - Coding

Different languages of coding: 

What you see:

HTML - Hyper Text Markup Language
CSS - Cascading Style Sheets

The functionality / How things work:

Java - Android Language
Java Scrips - Advanced effects and added interactivity 

Server languages that communicates between a webpage and a server. If you were designing a website like sos you would need developers who know how to use: 

SQL (sequel)- Database language 
PHP - Sever Based language 

iOS - Apple language
Ruby - Twitter 

The iphone replaced flash and action script - massive shift in programmes, no one uses action script anymore. 

Designing for screen involves designing for browsers such as google chrome, firefox, safari, internet explorer and opera on devices such as Desktop Computers, laptops, tablets, mobile phones and televisions. 

Designers must take into consideration the screen proportions and orientations of devices and create responsive screen designs. eg:

Burger button: Drop down menu / list of different buttons - good for mobile phone devices.

Row of buttons at the top of the laptop screen. 

72 ppi is the default resolution of the size of file due to the speed of the internet that the user is accessing the page through. Users give a website 2 seconds to load or leave. 

Accessibility for all 

Text on the internet has to be actual text and not an image as it needs to be able to be read out by screen readers for users with visual impairments. This is the law. Photographs also need tabs to describe what is in the image. 

Have to find royalty free typefaces that can be distributed for free on screen. As typefaces can be downloaded for free and are accessible to everyone who visits the website. 

HTML

Works with open and closed tabs: <home> open </home> close

HOW TO MAKE THE EASIEST WEBSITE IN THE WORLD

WYSIWYG - what you see is what you get

<html>            - tells the browser what language you're speaking in 
   <head>        - this isn't visual in the design, can be used for added functionality
       <title>       
       ASOS
       </title>
   </head>
           <body>
           20% off for students!
           </body>
</html> 

This file has to be saved as index.html so it's accessible across the world. If it is not saved as this it will not open the page. 

Codecademy.com - good resource for helping you learn code 

2 Books to learn code - 


No comments:

Post a Comment