Dreamweaver Tutorial

Extract Tool

 

Extract PSD

OR HTML/CSS of image

Codes it for you

 

Bootstrap: slice everything up , DIV tags, frames and tables to layout content

Tags for Content

: Header

:Body- Article tag- positioning content, sidebar

Positioning: Float TAG, column spans.

Col.Span 1 – space across number of columns e.. 2 columns Col.Span 2

 

Adobe Library- upload and share content.

Ways of colour systems : RGB HEX

 

Scale of Pictures/ PNGs

Pixel ratio of PNGs.

 

Photoshop:

Generate-Image assets

 

File export= Layers to Files

Compresses to JPGS/PNGS

Send to IMGs Folder

Transparency

Trim Layers : trims layers for you.

Run.

 

 

 

 

 

 

 

 

 

 

 

Asset management- file structure

Broken Links

Layout, content wont work or show up on webpage.

SITE- Manage site – Server FTP file transfer protocol.

INTRANET- stored locally

MY SITE: Folders

Images Folder

Videos

Sound

CSS

HTML- Call INDEX- sent to server

Templates are good- does coding for you.

CSS:

CSS designer

sources

create new CSS

Name as :

save in MYSITE folder

Screen Shot 2017-03-13 at 13.29.47.png

GUI Graphic user interface

PAGE PROPERTIES- Change colour of background/text

Source – stylesheet.css

Make sure CSS is selected IN FILES TAG

selectors: body (select body tags)

PROPERTIES , untick ‘showset’

search for image URL- Select image

Screen Shot 2017-03-13 at 14.10.09.png

Screen Shot 2017-03-13 at 13.16.25.png

Screen Shot 2017-03-13 at 13.18.05.png

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s