Linking & embedding media files & code elements
It is important to understand the distinction between a document file and the media/content/asset and code elements that are either embedded in it or linked to it.
Documents
"Documents" can be thought of as being the "containers" in which media or asset files appear. Documents control layout, styling of text, positioning of images, playback of video etc.
| Document type | Cannot be "embedded" | Can be "embedded" | What can be linked |
|---|---|---|---|
| HTML | Audio, video, images, animations, pdf etc | Text, code (HTML, CSS, JavaScript etc) | CSS, JavaScript, PHP, Images, audio, video, animation, pdf etc |
| Flash | - | Text, fonts, ActionScript, images, audio, video etc | Text, fonts, code, images, audio, video etc |
| Director | Video | Text, fonts, code, images, audio etc | Text, fonts, code, images, audio, video etc |
| Acrobat (pdf) | - | Text, images, fonts, audio etc | - |
Media (or assets)
Media files are individual audio visual elements which can be embedded or linked to a "document" such as ...
- Images.
- Audio files.
- Video files (QuickTime, AVI, MPEG etc).
- Fonts
- Flash movies.
- Shockwave movies.
- Cascading Style Sheets.
- etc
Code elements
HTML, Director, Flash and Visual Basic etc "documents" and files will/can have code elements in embedded in them. Web pages (HTML) can have the following ...
- HTML tags
- CSS
- JavaScript
- PHP
- etc
Linking and embedding
Media files can be linked to a document file or embedded in it.
What is embedding?
Embedding means “integrating” a media file (such as…image, font, sound etc.) into a document. The document becomes a single element with everything contained in it, for example ...
- an Acrobat PDF document can have text, images, and fonts embedded in it
- a Flash file can have text, images, audio, video, fonts etc embedded in it
Media files you may want to EMBED include ...
- Text
- Fonts
- Images
- Small audio files (under 100Kb?)
- GIF animations
- Flash animations (in Director)
| Advantages | Disadvatages |
|---|---|
Following embedding, media cannot normally be edited thus improving copyright security infringement issues. Embedding means no media will fail to appear/playback. Embedding often helps make a document X-platform compatible (Mac & PC) Embedding a font means that text will always appear styled as you wanted it and no font substitution will occur |
Embedding media makes a document bigger. Following embedding, sometimes individual media elements cannot be so easily edited. |
Web pages
Most media files CANNOT be embedded into web pages and must be linked to them. Web pages can have a very limited number of things in them including ...
- code (html, CSS, JavaScript, php etc)
- text
Why the <embed> tag doesn't embed!
In web pages, the <embed> tag allows a piece of media such as a Flash file (.swf) or video clip to be linked to an html document in a way that is often specific to a plug-in replay technology. When the page loads the file will play where it is positioned. This tag should be avoided if at all possible because it is largely deprecated and can produce unpredictable results.
What is linking?
In multimedia, the word linking is used to describe 2 processes ...
- Linking pages or screens together ... also known as hyperlinks. This is the way that you navigate from web page to another. Click here for more advice.
- Linking media files ... to a page/screen layout document, such as images to an html web page.
Linking media files
Linking makes all the media files (video, images, sound, fonts etc.) separate from the document. The document “controls” layout, styling of text, playback of audio and video files etc.
e.g. In HTML (Web) page documents, images, fonts, sound, video, Flash, Shockwave etc. are always linked, never embedded.
Media and other elements that you will need to LINK include ...
- Images (for web sites)
- Large audio files (over 100Kb?)
- GIF animations
- Flash files (for web sites)
- Shockwave Director files (for web sites)
- Video files
- Cascading Style Sheets (for web sites)
- File downloads (such as PDFs, Word docs, free software, templates etc)
Linked media folders
With linking, all media files should be placed into separate organised folders (usually called “media”), stored on the same level as the document file, before being linked to the document. Click here for more.
| Advantages | Disadvatages |
|---|---|
Media can be shared between multiple documents ( such as a logo which must appear on every page of a website) A document can load and unload media elements as and when it needs them thus improving load times and managing limited RAM in an older computer. Media can be updated separately. Multiple people can work on a document and its media files simultaneously. |
|
Fonts
Fonts CANNOT be embedded OR linked to HTML web pages, except by using the new @fontface tag. This means that you must style your site only with fonts which you can reasonably expect will be installed on an end-users system. Stick to ... Arial, Courier, Verdana and Times.
Fonts CAN be embedded in Shockwave (Director), Flash and PDF files.
Linking & embedding examples
| Program | Document / file format | Embedded media/elements | Linked media |
|---|---|---|---|
| Dreamweaver | HTML | Text, HTML tags, CSS, JavaScript, PHP and other code elements | Images, fonts, audio, video, Flash, Shockwave, QuickTime, AVIs etc |
| Adobe PDF | Images, fonts, audio, video, QuickTime, AVIs etc | NONE | |
| DTP (Quark etc) | Native | Text | Fonts, images |
| Director | Movie (.dir) | Text, fonts, audio, images, animation | Video, text, fonts, audio, images, animation etc |
| Video (Final Cut, Premiere) | Native | NONE | Video, images, audio |
| Flash | .swf | Text, fonts, audio, images, animation, video | Text, fonts, audio, images, animation, video |
Planet Of Tunes
This web site has the following linked and embed media files ...
- Embedded >> Text, CSS, some JavaScript and PHP.
- Linked >> Fonts, CSS, images, Shockwave, Flash, video, file downloads (such as word docs and PDFs).
Given Name
Given Name is an enhanced music CDROM which includes Director created interactive presentations for the PC and Mac. Click here for more.
The Director presentations have the following linked and embedded files ...
- Embedded >> Fonts, text, images, audio.
- Linked >> Video.
Related downloads
None at present
Featured artist
