Handboek Annuleren

HTML-publicatiesjablonen

Zoeken
  1. Adobe Animate-handboek
  2. Inleiding tot Animate
    1. Nieuw in Animate
    2. Visuele verklarende woordenlijst
    3. Systeemvereisten voor Animate
    4. Animate-sneltoetsen
    5. Werken met meerdere bestandstypen in Animate
  3. Animatie
    1. Grondbeginselen voor animaties in Animate
    2. Frames en hoofdframes gebruiken in Animate
    3. Frame-voor-frame-animaties in Animate
    4. Werken met klassieke tween-animaties in Animate
    5. De tool Penseel
    6. Hulplijnen voor bewegingen
    7. Bewegings-tween en ActionScript 3.0
    8. Informatie over animaties met bewegings-tween
    9. Animaties met bewegings-tweens
    10. Een animatie met bewegings-tween maken
    11. Eigenschapshoofdframes gebruiken
    12. Een positie animeren met een tween
    13. Bewegings-tweens bewerken in de Bewegingseditor
    14. Het bewegingspad van een tween-animatie bewerken
    15. Bewegings-tweens manipuleren
    16. Aangepaste versnellingen toevoegen
    17. Voorinstellingen voor beweging maken en toepassen
    18. Animatietween-reeksen instellen
    19. Werken met als XML-bestanden opgeslagen bewegings-tweens
    20. Bewegings-tweens en klassieke tweens
    21. Vormen tweenen
    22. De tool Bone-animatie gebruiken in Animate
    23. Werken met structuren voor personages in Animate
    24. Maskeerlagen gebruiken in Adobe Animate
    25. Werken met scènes in Animate
  4. Interactiviteit
    1. Knoppen maken met Animate
    2. Animate-projecten converteren naar andere documentindelingen
    3. HTML5 Canvas-documenten maken en publiceren in Animate
    4. Interactiviteit toevoegen met codefragmenten in Animate
    5. Aangepaste HTML5-componenten maken
    6. Componenten in HTML5 Canvas gebruiken
    7. Maken van aangepaste componenten: Voorbeelden
    8. Codefragmenten voor aangepaste componenten
    9. Tips en trucs: Adverteren met Animate
    10. Ontwerp en publicatie van virtual reality
  5. Werkruimte en workflow
    1. Penselen maken en beheren
    2. Google-lettertypen gebruiken in HTML5 Canvas-documenten
    3. Creative Cloud Libraries en Adobe Animate gebruiken
    4. Het werkgebied en het deelvenster Tools voor Animate gebruiken
    5. Workflow en werkruimte in Animate
    6. Weblettertypen gebruiken in HTML5 Canvas-documenten
    7. Tijdlijnen en ActionScript
    8. Werken met meerdere tijdlijnen
    9. Voorkeuren instellen
    10. Deelvensters voor ontwerp in Animate gebruiken
    11. Tijdlijnlagen maken met Animate
    12. Animaties exporteren voor mobiele apps en game-engines
    13. Objecten verplaatsen en kopiëren
    14. Sjablonen
    15. Zoeken en vervangen in Animate
    16. Ongedaan maken, Opnieuw en het deelvenster Historie
    17. Sneltoetsen
    18. De tijdlijn gebruiken in Animate
    19. HTML-extensies maken
    20. Optimalisatieopties voor afbeeldingen en geanimeerde GIF-bestanden
    21. Exportinstellingen voor afbeeldingen en GIF-bestanden
    22. Deelvenster Elementen in Animate
  6. Multimedia en video
    1. Grafische objecten transformeren en combineren in Animate
    2. Symboolinstanties maken in Animate en ermee werken
    3. Afbeeldingen overtrekken
    4. Geluid gebruiken in Adobe Animate
    5. SVG-bestanden exporteren
    6. Videobestanden maken voor gebruik in Animate
    7. Een video toevoegen in Animate
    8. Werken met videoactiepunten
    9. Objecten tekenen en maken met Animate
    10. Lijnen en vormen omvormen
    11. Streken, verlopen en vullingen met Animate CC
    12. Werken met Adobe Premiere Pro en After Effects
    13. Deelvensters voor kleuren in Animate CC
    14. Flash CS6-bestanden openen met Animate
    15. Werken met klassieke tekst in Animate
    16. Illustraties opnemen in Animate
    17. Geïmporteerde bitmaps in Animate
    18. 3D-afbeeldingen
    19. Werken met symbolen in Animate
    20. Lijnen en vormen tekenen met Adobe Animate
    21. Werken met bibliotheken in Animate
    22. Geluiden exporteren
    23. Objecten selecteren in Animate CC
    24. Werken met Illustrator AI-bestanden in Animate
    25. Patronen toepassen met het sproeipenseel
    26. Overvloeimodi toepassen
    27. Objecten rangschikken
    28. Taken automatiseren met het menu Opdrachten
    29. Meertalige tekst
    30. De camera gebruiken in Animate
    31. Animate gebruiken met Adobe Scout
    32. Werken met Fireworks-bestanden
    33. Grafische filters
    34. Geluid en ActionScript
    35. Tekenvoorkeuren
    36. Tekenen met de pen
  7. Platforms
    1. Animate-projecten converteren naar andere documentindelingen
    2. Ondersteuning voor aangepaste platforms
    3. HTML5 Canvas-documenten maken en publiceren in Animate
    4. Een WebGL-document maken en publiceren
    5. Toepassingen verpakken voor AIR voor iOS
    6. AIR voor Android-toepassingen publiceren
    7. Publiceren voor Adobe AIR voor desktop
    8. Publicatie-instellingen voor ActionScript
    9. Tips en trucs: ActionScript organiseren in een toepassing
    10. ActionScript gebruiken met Animate
    11. Tips en trucs: Richtlijnen voor toegankelijkheid
    12. Toegankelijkheid in de Animate-werkruimte
    13. Scripts schrijven en beheren
    14. Ondersteuning voor aangepaste platforms inschakelen
    15. Overzicht van ondersteuning voor aangepaste platforms
    16. Toegankelijke inhoud maken
    17. Werken met plug-in voor ondersteuning voor aangepaste platforms
    18. Foutopsporing in ActionScript 3.0
    19. Ondersteuning voor aangepaste platforms inschakelen
  8. Exporteren en publiceren
    1. Bestanden exporteren uit Animate CC
    2. OAM-publicatie
    3. SVG-bestanden exporteren
    4. Afbeeldingen en video's exporteren met Animate
    5. AS3-documenten publiceren
    6. Animaties exporteren voor mobiele apps en game-engines
    7. Geluiden exporteren
    8. QuickTime-videobestanden exporteren
    9. Afspelen van externe video met ActionScript beheren
    10. Tips en trucs: Tips voor het maken van inhoud voor mobiele apparaten
    11. Tips en trucs: Videoconventies
    12. Tips en trucs: Richtlijnen voor het ontwerpen van SWF-toepassingen
    13. Tips en trucs: Structuur geven aan FLA-bestanden
    14. Beste werkwijzen voor het optimaliseren van FLA-bestanden voor Animate
    15. Publicatie-instellingen voor ActionScript
    16. Publicatie-instellingen opgeven voor Animate
    17. Projectorbestanden exporteren
    18. Afbeeldingen en geanimeerde GIF-bestanden exporteren
    19. HTML-publicatiesjablonen
    20. Werken met Adobe Premiere Pro en After Effects
    21. Snel uw animaties delen en publiceren

Informatie over HTML-publicatiesjablonen

Een Animate HTML-sjabloon is een bestand dat statische HTML-code en flexibele sjablooncode bevat, bestaande uit een speciaal soort variabelen (die verschillen van ActionScript-variabelen). Wanneer u een SWF-bestand publiceert, vervangt Animate deze variabelen door de waarden die u selecteert op het tabblad HTML van het dialoogvenster Publicatie-instellingen, waarna een HTML-pagina wordt gemaakt waarin uw SWF-bestand is ingesloten.

Animate bevat sjablonen die tegemoetkomen aan de wensen van de meeste gebruikers. Dankzij deze sjablonen hoeft u de HTML-pagina die het SWF-bestand weergeeft, niet handmatig te maken. De sjabloon Alleen Animate is bijvoorbeeld handig als u uw bestanden in een browser wilt testen. Deze sjabloon plaatst het SWF-bestand op de HTML-pagina, zodat u dit kunt bekijken in een webbrowser waarin Flash Player is geïnstalleerd.

Als u een nieuwe HTML-pagina wilt publiceren, gebruikt u dezelfde sjabloon en wijzigt u de instellingen. U kunt aangepaste sjablonen maken met een HTML-editor. Een sjabloon maken is hetzelfde als een standaard HTML-pagina maken, behalve dat u bepaalde waarden met betrekking tot een SWF-bestand vervangt door variabelen die beginnen met het dollarteken ($).

Animate HTML-sjablonen hebben de volgende speciale kenmerken:

  • Een eenregelige titel die wordt weergegeven in het pop-upmenu Sjabloon op het tabblad HTML van het dialoogvenster Publicatie-instellingen.

  • Een langere beschrijving die wordt weergegeven wanneer u klikt op Info op het tabblad HTML van het dialoogvenster Publicatie-instellingen.

  • Sjabloonvariabelen die beginnen met een dollarteken ($) die aangeven waar parameterwaarden moeten worden ingevoegd wanneer Animate het uitvoerbestand genereert.

    Opmerking: Voeg een backslash voor het dollarteken toe (\ $) als u een dollarteken om een andere reden in het document wilt gebruiken.

  • De HTML-tags object en embed die voldoen aan de tagvereisten van respectievelijk Microsoft Internet Explorer en Netscape® Communicator® of Navigator®. Houd u aan de volgende tagvereisten om te zorgen dat een SWF-bestand correct op een HTML-pagina wordt weergegeven: Internet Explorer gebruikt de HTML-tag object om een SWF-bestand te openen, terwijl Netscape de tag embed gebruikt.

HTML-publicatiesjablonen aanpassen

Wijzig de variabelen in de HTML-sjabloon om een afbeeldingskaart, een tekstrapport of een URL-rapport te maken of om aangepaste waarden in te voeren voor de meest gangbare parameters van de Animate HTML-tags object en embed (voor browsers die ActiveX-besturingselementen respectievelijk invoegtoepassingen gebruiken).

Animate-sjablonen kunnen elke gewenste HTML-inhoud voor uw toepassing bevatten of zelfs code voor interpreters zoals ColdFusion en ASP.

  1. Open de Animate HTML-sjabloon die u wilt wijzigen in een HTML-editor. Deze sjablonen bevinden zich op de volgende locaties:

    • Windows XP of Vista: opstartschijf:\Documents and Settings\gebruiker\Local Settings\Application Data\Adobe\Flash CS5\taal\Configuration\HTML\. De map Application Data is meestal een verborgen map; mogelijk moet u de instellingen in Windows Verkenner wijzigen om deze map weer te geven.

    • Mac OS X 10.3 en hoger: Macintosh HD/Applications/Adobe Flash CS5/taal/First Run/HTML.

      Het opstartstation is het station van waaraf het Windows-besturingssysteem wordt opgestart (gewoonlijk C:). De gebruiker is de naam van de persoon die is aangemeld bij het Windows-besturingssysteem. Taal is een afkorting van de taal. In Nederland is taal bijvoorbeeld ingesteld op 'nl' voor Nederlands.

  2. Bewerk de sjabloon.
  3. Sla de sjabloon op in dezelfde map als waaruit u deze hebt ingelezen.

  4. Als u de sjablooninstellingen op het SWF-bestand wilt toepassen, selecteert u Bestand > Publicatie-instellingen, klikt u op HTML en selecteert u de gewijzigde sjabloon. Animate wijzigt alleen de sjabloonvariabelen in de geselecteerde sjabloon.

  5. Selecteer de overige publicatie-instellingen en klik op OK.

HTML-sjabloonvariabelen

In de volgende tabel worden de sjabloonvariabelen vermeld die Animate herkent:

Kenmerk/parameter

Sjabloonvariabele

Sjabloontitel

$TT

Start van sjabloonbeschrijving

$DS

Einde van sjabloonbeschrijving

$DF

Animate-titel (SWF-bestand)

$T1

Animate-titel (SWF-bestand) voor metagegevens van zoekmachines

$TL

Beschrijving van metagegevens voor zoekmachines

$DC

XML-reeks met metagegevens voor gebruik met zoekmachines

$MD

Breedte

$WT

Hoogte

$HT

Film

$MO

HTML-uitlijning

$HA

Herhaling

$LO

Parameters voor object

$PO

Parameters voor embed

$PE

Play

$PL

Kwaliteit

$QU

Schaal

$SC

Salign

$SA

Wmode

$WM

Apparaatlettertype

$DE

Achtergrondkleur

$BG

Filmtekst (gebied waarin filmtekst moet worden geschreven)

$MT

Film-URL (locatie van URL van SWF-bestand)

$MU

Afbeeldingsbreedte (niet-opgegeven afbeeldingstype)

$IW

Afbeeldingshoogte (niet-opgegeven afbeeldingstype)

$IH

Bestandsnaam van afbeelding (niet-opgegeven afbeeldingstype)

$IS

Naam van afbeeldingskaart

$IU

Taglocatie voor afbeeldingskaart

$IM

QuickTime-breedte

$QW

QuickTime-hoogte

$QH

QuickTime-bestandsnaam

$QN

GIF-breedte

$GW

GIF-hoogte

$GH

GIF-bestandsnaam

$GN

JPEG-breedte

$JW

JPEG-hoogte

$JH

JPEG-bestandsnaam

$JN

PNG-breedte

$PW

PNG-hoogte

$PH

PNG-bestandsnaam

$PN

Verkorte sjabloonvariabelen gebruiken

De sjabloonvariabelen $PO (voor object-tags) en $PE (voor embed-tags) zijn handige elementen. Elke variabele zorgt dat Animate eventuele afwijkende waarden invoegt voor enkele van de meest gangbare parameters voor object en embed, waaronder PLAY ($PL), QUALITY ($QU), SCALE ($SC), SALIGN ($SA), WMODE ($WM), DEVICEFONT ($DE) en BGCOLOR ($BG).

HTML-voorbeeldsjabloon

Het onderstaande sjabloonbestand Default.HTML uit Animate bevat een groot aantal van de meestgebruikte sjabloonvariabelen:

$TTFlash Only 
$DS 
Display Adobe SWF file in HTML. 
$DF 
<!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Transitional//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&quot;> 
<html xmlns=&quot;http://www.w3.org/1999/xhtml&quot; xml:lang=&quot;en&quot; lang=&quot;en&quot;> 
<head> 
$CS 
<title>$TI</title> 
</head> 
<body bgcolor=&quot;$BG&quot;> 
<!--url's used in the movie--> 
$MU 
<!--text used in the movie--> 
$MT 
<object classid=&quot;clsid:d27cdb6e-ae6d-11cf-96b8-444553540000&quot; codebase=&quot;http://fpdownload.adobe.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0&quot; width=&quot;$WI&quot; height=&quot;$HE&quot; id=&quot;$TI&quot; align=&quot;$HA&quot;> 
<param name=&quot;allowScriptAccess&quot; value=&quot;sameDomain&quot; /> 
$PO 
<embed $PEwidth=&quot;$WI&quot; height=&quot;$HE&quot; name=&quot;$TI&quot; align=&quot;$HA&quot; allowScriptAccess=&quot;sameDomain&quot; type=&quot;application/x-shockwave-flash&quot; pluginspage=&quot;http://www.adobe.com/go/getflashplayer&quot; /> 
</object> 
</body> 
</html>

Afbeeldingskaart maken ter vervanging van een SWF-bestand

Animate kan een afbeeldingskaart voor elke gewenste afbeelding genereren en daarbij de functie handhaven van knoppen die een koppeling naar een URL bevatten. Als een HTML-sjabloon de sjabloonvariabele $IM bevat, voegt Animate de code voor de afbeeldingskaart in. De variabele $IU geeft de naam aan van het GIF-, JPEG- of PNG-bestand.

  1. Selecteer in het document het hoofdframe dat u als afbeeldingskaart wilt gebruiken en geef deze het label #Map in de Eigenschapcontrole voor het frame (Venster > Eigenschappen). U kunt elk hoofdframe gebruiken dat knoppen bevat waaraan de handelingen getURL van ActionScript 1.0 of 2.0 zijn gekoppeld.

    Als u geen framelabel maakt, maakt Animate een afbeeldingskaart met de knoppen in het laatste frame van het SWF-bestand. Deze optie genereert een ingesloten afbeeldingskaart, geen ingesloten SWF-bestand.

  2. Doe het volgende om het frame voor de afbeeldingskaart te selecteren:

    • Voor PNG- of GIF-bestanden geeft u het frame het label #Static.

    • Voor JPEG plaatst u tijdens het publiceren de afspeelkop in het frame dat voor de afbeeldingskaart moet worden gebruikt.

  3. Open de HTML-sjabloon die u wilt wijzigen in een HTML-editor.
  4. Sla de sjabloon op.
  5. Selecteer Bestand > Publicatie-instellingen, klik op Indeling, selecteer een indeling voor de afbeeldingskaart en klik op OK.

    Voeg bijvoorbeeld de volgende code in een sjabloon in:

    $IM 
<img src=$IS usemap=$IU width=$IW height=$IH BORDER=0>

    Dit kan de volgende code produceren in het HTML-document dat wordt gemaakt met de opdracht Publiceren:

    <map name=&quot;mymovie&quot;> 
<area coords=&quot;130,116,214,182&quot; href=&quot;http://www.adobe.com&quot;> 
</map> 
<img src=&quot;mymovie.gif&quot; usemap=&quot;#mymovie&quot; width=550 height=400 border=0>

Tekst- en URL-rapporten maken

De sjabloonvariabele $MT zorgt ervoor dat Animate alle tekst uit het huidige SWF-bestand als commentaar invoegt in de HTML-code. Dit is handig als u de inhoud van een SWF-bestand wilt indexeren en deze zichtbaar wilt maken voor zoekmachines.

De sjabloonvariabele $MU zorgt dat Animate een lijst genereert met de URL's waarnaar handelingen in het huidige SWF-bestand verwijzen en die lijst als commentaar invoegt op de huidige locatie. Zo kunnen controlehulpmiddelen de koppelingen in het SWF-bestand detecteren en controleren.

Metagegevens voor zoekmachines insluiten

Met de sjabloonvariabelen $TL (titel van SWF-bestand) en $DC (beschrijving van metagegevens) kunt u metagegevens in het HTML-bestand invoegen. Hierdoor is het SWF-bestand beter zichtbaar voor zoekmachines en levert dit zinvollere zoekresultaten op. Gebruik de sjabloonvariable $MD als u de metagegevens wilt invoegen als een XML-reeks.

Verwante informatie

Adobe-logo

Aanmelden bij je account

Snelle koppelingen

Al je lidmaatschappen weergeven Je lidmaatschappen beheren

Juridische kennisgeving    |    Online privacybeleid