Week 12

Implications for open source software, potentially in future jobs

If Jason has taught us one thing, it's the value of open source (free) software.
In our future careers as digital engineers, we will no doubt at one point be the ones with the most insight into creating websites in our workplace, with this comes the knowledge of how much companies and individuals charge to 'create' websites, when chances are they have most likely made use of these open source software sites and not done a huge amount of work. Here is where I am able to step in and save the day but cutting the huge cost this usually incurs by 'doing it myself'. Aka, utilizing and fully customizing a free pre-made web design/template/page and making it seem a much bigger and more complicated job than it really is.
Ultimately saving the company time money and securing ones respect.

Week 11

This week, Jason introduced us to pre made web page templates and widgets

The page templates we looked at were on:
os-templates.com
The site had 'free response templates' which were layouts that automatically resized with different screen sizes, but were more complicated to use
The 'basic templates' were what we focused on, which give a complete webpage, minus links, images and content. The sites templates were really clean looking and simple to navigate.
+We can use these for our next assessment but must change all the content, fonts, background colours etc, to make it unrecognisable so to speak.
Although these templates have no copyright.

The widgets we explored were on codrops:
tympanus.net
They're really usefull little interactive elements to give our webpages edge. Although changing all the content of these, as they usually came with the code of an entire webpage was a little more difficult.
+These can also be used for the next webpage assessment but must be relevant to the websites purpose.

Week 10

The experience of navigation the web on mobile devices compared to laptops/ desktop computers

During my adult life, mobile devices enabled with internet browsing capabilities have absolutley boomed. In the modern day portable devices are most desirable for their convenience primarily, as well as in the moment sharing of text images and videos. Mobile devices as they are smaller and have lest content to generate seem to run faster, than traditional computers, also due to their wifi and mobile internet connection in contrast to dial up and broadband connections. Usage on mobiles devices is primarily bundled with mobile phone credit and turn out a better deal for users. While these bundles exsist too for home phone and computer internet, landlines are quickly phasing out, replaced by the innovation of the 'smart phone'.

Apps, created for the mobile device enable users to interact with the internet much quicker, easier and smoother than before. The combination of phone camera and photo sharing app means in just 5 seconds a photo can be captured and published online, where as with a computer an image is taken with an external device, imported and then uploaded onto a website. I personally feel Facebook is so dominant in it's industry because it has realised the move and has a constantly updated to improve the mobile experience, as well as optimise the experience for users who still access the site via a computer.

The rise of mobile devices and internet usage absolutley has had an impact on social situations.
It is rare for an individual to leave the house and return for any period of time without accessing the net on a mobile device, whether it be a neccesity like internet banking or email, or simply a habbit to kill time, like social networking and browsing online stores. You can literally do almost anything on mobile devices now, which is much easier then getting up, driving or walking to where things need to be done and returning.

Socially it seems like a negative turn for technology but rpactically mobile internet devices have really made life much easier.

Week 9 Privacy and Free Software

Open source programs are an excellent way to obtain software via sharing servers rather than paying expensive annual program costs. Knowledge of this software may impress potential employers

Good uses of this software can be taking advantage of 'eraser' programs. These are invaluable to knowas data is never actually completely deleted until you employ the use of one of these programs to overwrite the original file location about 60 times.This process will 'paint over' the data and render it unrecoverable.

PNGS cannot be animated, use gif
Use these animated gifs in website assessment for logo or in an image. Can also make them transparent so you can see whats behind the gif. COOL. An idea is to use an animated gif AS a rollover.

Week 8

Super great tips for the upcoming assessment (also my realization that up until this point in my life i have been misspelling assessment) due Friday pf the break week - October 4th

• Make sure images and files are in same webpage folder
• Avoid cheesy bad fonts
• Show proficiency in  photoshop
• Name images/files as what they are
• Show code knowledge with some complex elements
• Shows creativity in visuals and writing
• Be careful with font colour visibility
• Must be visually interesting
• Limit unnecessary scrolling
• Must have a logo
• Do not centre text on page
• Image links in pages and videos and LOTS OF IMAGES for good  marks
• Don't have 'hanging' words, a single word on a line
• Have a visually pleasing yet not overwhelming layout
• Break up text to capture attention 
•  

MUST:
Have a site map: a Photoshop created image showing the link through process to get to each page and how they fit together, Google site map for examples, and a brief description of content for identification.This does not go on the webpage but with the statement.
Have a statement, describing the process, what  worked, what didn't, inspiration etc. Similar to last assessment.
These two files go on heliozoa in the assessment folder.

Only gifs and pngs can have transparent backgrounds. Jpegs cannot.

Make sure to always check what layer you are editing on in Photoshop

Gimp is a good replacement (free) for Photoshop

Portable Apps.com (PC only) allows you to download software free to your memory stick which can be uploaded onto and computer.

Week 7

Week 7

Next assessment
If our website vision isn't yet completely formed yet, think of something relatively like it and (don't steal but) borrow inspiration from that site.
If it is similar in any way to anything that already exists, make sure to differentiate. The website needs to reflect originality.
Images are another large component of the assessment, they will appear somewhat ammeter but that's okay. All base images need to be own created or taken. Any layer images used to edit own image must be from Wikimedia Commons.
If looking to cut out a section of an image look for something with a simple background.
Mythical creatures - involves a lot of photo shop work
Light hearted and humorous  sites are okay. the language does not have to be
Gimshop & Komposer is the same as Photoshop, free to download from home but same high quality.
To optimize Google Image search, access search tools. From here you can choose size, line drawing, colour etc.
To cut a section of an image, save both, have them open in Photoshop.
Layers. Your background is your base image, and you have a layer over the top to edit in.
If an image is locked make a copy and delete the original.
The history option is good if you mess up an image, it gives all the steps done so far to the image.
There are 3 components to the Lasso tool, regular lasso tool is tricky to use, you have to free hand draw, the polygonal  lasso allows you to click to click and straight lines appear, the magnetic lasso identifies colour differences and is good if a clear contrast background is present in the original image.  The eraser is another way to delete unwanted background.
The magic wand allows to to change the tolerance  to select the right amount of the image to delete.
You want to lasso the background you don't want, then delete it.

Week 6

Next assessment; Next week must have concept decided and pages (organisation of the site)

Must be a page devoted to something alive/was alive/ feels/ lives

An obituary, tributes, achievements, bio, diagram of thing, environment, its blog,

Dreamweaver
Appears differently on versions.

Begin with html. Has templates, which we can make use of for this first assessment. These template create the whole layout, links, leaves room for logo, places for content and headers/text.

Split view enables you to see the code and the preview pane at the same time, and highlights the created portion when code is highlighted.

Links- link from one file to another. The visible link does not distinguish where the click goes to, the link field down the bottom does. All the link does is tells the computer to go from one file (page) to another. To create the pages to link to, go file save as, and the new page will appear up the top in a new tab

Name pages one, two three, four, five

Don’t write text directly onto page, write into word, edit, spell/grammar check etc and then transfer.

Any word/phrase can be a link.

Table sets- design layout from scratch by making one big table set and merging squares.

OR

Make three tables, one for a navigation panel, one for the banner and one for the general content

Images

All images have to be mine; aka taken or created, although parts of images can be edited on top of your own. Can be taken with phones, but resolution is usually too large- need to be resized

You don’t want to use images from the web because they are usually copyrighted.

Wikimedia commons – free use images, sound and other media files. Aim to use low resolution images. When saving images, make sure to save images in the same folder as the html files.

When you file insert image, the code will be img src=…   Html just holds the image.

If the image isn’t saved in the html folder, the code changes. Identifying the destination of the image is what the code says. If the image is moved, it needs to be re inserted.

Images come with code imbedded inside them that usually refer back to a server, so that the image owner can track the image use. The only ways to avoid this are to scrap the image right back or take your own image.

Image services – companies that sell images. Fanpop.Take pictures of socks in all different circumstances, scenarios, doing different things,

IDEA: a page for a crusty old sock
PAGES: profile, recommended Laundromats, soaking recipes, XXX sox, notice board-jobs/personals/sale

On the heliozoa.com server there are helpbooks on photoshop, dreamweaver & commics.

-Komposer is a free version of dreamweaver

Week 5

Week fives lecture began pleasantly with the extension of our first Assessment from Friday to Sunday.
Tips discussed toward the assignment included:

• Spell checking written explanation
• Putting written text right before the end body tag for easy navigation
• Write in explanation about types of code experimented with & used
• What was learnt by the end of the process
• Initial plans 
• Technical problems encountered/early attempts
• Artistic aims
• Sources - written not listed

Dreamweaver & composer were both discussed (explicitly not in relation to this assessment though) and explained as software that automatically generates code by editing the visual. Super easy compared to writing code from scratch (blind). 

We received a break down and tips on Assessment 3.

The next assessment requires us to create a webpage devoted solely to an idea, person, object, literally anything; but it must be a clearly defined idea. The website/concept must not already exist.We should form a navigation pane (menu), although our webpages won't be big enough to require it, it was noted as good practice. 

Early tips for the assessment included keeping fonts all the one kind, never centering text and keeping the whole layout and formatting simple.

Week 4

Week 4

Assesments must be on the server by 12pm MIDDAY- able to be done via filezilla online or the program

remember colour is always COLOR

*TIP put a draft on a few hours prior to avoid heartbreat if computer looses its shit, name version** and version FINAL

component tips
code, use multiple types of code (css/java/html)

statement, include fails, attempts, aim

artwork, use layers, complexity in shading and general concept

Artwork ideas: mouse over effects, scrolling marquees, a contrasting scene below original scene

Make a grid (table colour each box individually, divide every 10 accross - table setup

DUE FRIDAY

Week 3

Week 3

Assesment, best way to begin is to map out simply the image on a grid paper, to navugate the boxes and go from there with colour etc.
With the aid of photoshop or a colour picker site/table to get the codes for each specific colour.

tabes sets make it difficult to put boxes in specific places

css enables you to put boxes in any specific place on the page eg. left;92834pxs top 2938472pxs;

marks between every 10 squares accross makes editing and navigation much easier, saves time.

Due end of week 5

z index, alows you to put certain items at the front or behind other things eg zindex;298472pxs

Week 2

Week 2

First assesment: creating an image out of code in text, to transfer onto a webpage.
Save every version while editing and working on code.
Code is unforgiving, if it doesn't work you've fucked up, not the computer.
Criteria: 3 components - the more code used the higher the mark -the more complex the concept and image the '' '' - the better the written explanation the '' ''
The internet. Literally made up of millions of computer networks, 'servers'. Servers store websites, data & information. Each server has a completely unique IP address (a number). Each website has a unique address eg. www.blahblahblah.shit the www leaves room for a sub domain within the website eg.learning.griffith


Key elements of the net:
Web page - the visible page
html/css - the code written to depict the what happens on the webpage
web browser - the host to the webpage created eg.Firefox, chrome etc
web server - the servers IP address eg. 8008135

we3schools killer site for code/ tutorials / tips

Week 1

Week 1

E: timothy.fitzgerald@griffith.edu.au W.Nelson@griffith.edu.au

Filezilla: Host: heliozoa.com User:wfw2@heliozilla.com Password: wfw2rocks

Subject doesn't use learning@griffith

Jason is crazy.