How to present a graph und Hilfe:Tabellen: Unterschied zwischen den Seiten

Aus ZUM-Unterrichten
(Unterschied zwischen Seiten)
Markierung: 2017-Quelltext-Bearbeitung
 
(akt - Wie formatiert man eine Tabelle?)
Markierung: 2017-Quelltext-Bearbeitung
 
Zeile 1: Zeile 1:
Quite often there is a '''graph''' a '''table''' or a '''chart'''. Here we can learn to
'''Tabellen''' können im Wiki entweder mit den allgemein gängigen HTML-Elementen gestaltet werden oder mit Wikisyntax. Die Wikisyntax ist eingängig, schlank und einfach. Sie wird im Folgenden beschrieben. Der Gebrauch von HTML wird hingegen nicht näher erläutert, sondern als bekannt vorausgesetzt.
* '''understand'''
* '''analyse''' and
* '''interpret'''


these charts.
Tabellen sind kein grafisches Gestaltungsmittel. Sie dienen allein dem Zweck, gleichartige Informationen übersichtlich darzustellen. Da Tabellen deutlich komplizierter zu lesen sind als normaler Text, sollten sie nur dann eingesetzt werden, wenn sie ihren eigentliche Zweck erfüllen.


== Type of charts ==
{{Box|Empfehlung|Verwenden Sie zum leichteren Erstellen von Tabellen die Erweiterte Bearbeiten-Werkzeugleiste.|Hervorhebung2}}
* A '''line chart''' shows changes over a period of time, showing data and trends.
* A (vertical or horizontal) '''bar chart''' is used to compare different items.
* A '''pie chart''' displays the size of each part as a percentage of a whole.
* A '''table''' is a convenient way to show a large amount of data in a small space.
* A '''diagram''' is a drawing showing arrangements and situations, such as networks, distribution, fluctuation ...
* A '''flow chart''' is a diagram that represents a workflow or process. A flowchart can also be defined as a diagrammatic representation of an algorithm,


'''Can you find the matching pairs?'''
== Auszeichnung von Tabellen in Wiki-Syntax ==


<div class="memo-quiz" lang="en">
{| class="wikitable"
{|
! MediaWiki !! Beschreibung
| flow chart || [[file:Calligra Flow icon.svg|125px]]
|-
|-
| pie chart || [[File:JFreeChart 3D pie chart sample.svg|125px]]
| <code><nowiki>{|</nowiki></code>
|Beginn der Tabelle (<em>vorgeschrieben</em>, entspricht <code><nowiki><table></nowiki></code>)
|-
|-
| bar chart || [[File:Bar graph.png|125px]]
| <code><nowiki>|+</nowiki></code>
| Tabellenüberschrift (<em>optional</em>, entspricht <code><nowiki><caption></nowiki></code>) Die Überschrift steht zwischen dem Beginn der Tabelle und der ersten Tabellenzeile. Sie kann nur einmal pro Tabelle verwendet werden.
|-
|-
| line chart || [[File:Oxygen480-actions-office-chart-line-stacked.svg|125px]]
| <code><nowiki>|-</nowiki></code>
| Tabellenzeilen (entspricht <code><nowiki><tr></nowiki></code>) In der ersten Reihe optional.
|-
|-
| table || [[File:Table icon.svg|125px]]
| <code><nowiki>!</nowiki></code>
| Tabellenkopfzelle, (<em>optional</em>, entspricht <code><nowiki><th></nowiki></code>) Stehen die Kopfzellen weiterer Spalten in einer Reihe, werden sie durch doppelte Ausrufezeichen (<code>!!</code>) getrennt, ansonsten steht zu Beginn jeder neuen Zeile ein Ausrufezeichen (<code>!</code>).
|-
| class="code"  | <code><nowiki>|</nowiki></code>
| class="tabxpl" |Tabellendaten (<em>vorgeschrieben</em>, entspricht <code><nowiki><td></nowiki></code>)  Stehen die Tabellendaten weiterer Spalten in einer Reihe, werden sie durch doppelte senkrechte Striche (<code><nowiki>||</nowiki></code>) getrennt, ansonsten steht zu Beginn jeder neuen Zeile ein senkrechter Strich (<code><nowiki>|</nowiki></code>).
|-
|-
| diagram || [[File:Faenza-x-dia-diagram.svg|125px]]
| class="code"  | <code><nowiki>|}</nowiki></code>
| class="tabxpl" | Ende der Tabelle (entspricht <code><nowiki></table></nowiki></code>)
|}
|}
</div>


[[File:Graphs-vocabulary.svg|400px]]
* Grundsätzlich muss jede Zeile und jede Spalte in einer neuen Zeile beginnen, sofern Sie nicht die doppelten senkrechten  Striche <code>||</code> bzw. Ausrufungszeichen <code>!!</code> verwenden.
{{clear}}
* Jedes Auszeichnungselement (mit Ausnahme des Tabellenendes) kann optional ein oder mehrere HTML-Attribute beinhalten. Die Attribute stehen, getrennt durch einfachen Leerraum, in der gleichen Reihe wie die Auszeichnungs-Elemente.
'''Can you find the correct terms?'''
* Die Zellen und die Überschriften (<code>|</code> oder <code>||</code>, <code>!</code> oder <code>!!</code> sowie <code>|+</code>) führen Inhalt mit sich. Trennen sie Auszeichnung und Inhalt in einer Zeile durch einen senkrechten Strich (<code>|</code>). Der Inhalt einer Zelle folgt dann in der gleichen Zeile oder in der nächsten Zeile. Letzteres ist z.&nbsp;B. dann der Fall, wenn der Inhalt mit Wiki-Elementen ausgezeichnet ist, die ihrerseits eine neue Zeile benötigen (z.&nbsp;B. Listen, Aufzählungen oder verschachtelte Tabellen). Dann steht der Inhalt stets in einer neuen Reihe.
<div class="lueckentext-quiz" lang="en">
* Die Tabelle und die Tabellenzeilen (<code>{|</code> und <code>|-</code>) beinhalten nicht unmittelbar Inhalt. Hinter hier eingefügten Attributen folgt <strong>kein</strong> senkrechter Strich.
This is a line graph with two lines. One is a ''solid'' line (3). The other is a ''broken'' line (4) - you can use this if you can't use different colors. A ''dotted'' line (number 5) is often used to show projections into the future.


* The horizontal ''x-axis'' (2) shows often the timeline.
== Eine einfache Tabelle ==
* the vertical ''y-axis'' (1) has got a ''scale'' (6) with units.
</div>


== Presenting a Graph ==
Eine einfache, schmucklose Tabelle
{| class="wikitable"
 
<pre>
{|
|Orangen
|Äpfel
|-
|-
! Introduction !! Topic !! Circumstances   
|Brot
|Kuchen
|-
|-
| This graph shows … || the results of our products … || over 10 years.
|Butter
|-
|Eiskrem
| The diagram outlines … || the rates of economic growth … || between 2020 and today.
|}
|-
</pre>
| This table lists …  || the top ten agencies … || in the industrial world.       
 
|-
{|
| This pie chart represents…  || the company's turnover …  || for this year in our sector.       
|Orangen
|Äpfel
|-
|-
| This line chart shows … || the changes in sales … ||over the past year.
|Brot
|Kuchen
|-
|-
| This chart breaks down … || the sales of each salesman  …|| during the past ten weeks.       
|Butter
|Eiskrem
|}
|}


== Trends ==
=== ⇗ Upward Movement ===
<div class="grid">
<div class="width-1-2">
verbs
* (to) go up
* (to) extend, (to) expand
* (to) grow
* (to) increase
* (to) raise
* (to) rise (rose, risen)
* (to) progress
* (to) push/put/step up
* (to) boom/soar/climb
* (to) jump, (to) skyrocket   
* (to) reach a peak, (to) peak   
* (to) reach an all-time high       
</div>
<div class="width-1-2">
nouns:
&nbsp;<br>
* (an) extension, expansion   
* (an) increase
* (a) growth
* (a) raise (US), a rise (UK)<br><bR>
* (a) progression<br><br>
* (an) upswing
* (a) boom
* (a) jump 
* (a) peak
</div>
</div>
=== ⇘ Downward Movement  ===
<div class="grid">
<div class="width-1-2">
verbs
* (to) go down
* (to) cut
* (to) decrease
* (to) decline
* (to) drop (off)
* (to) fall (off) (fall, fell, fallen)
* (to) reduce
* (to) plunge, to plummet
* (to) collapse
* (to) slump, (to) go bust
* (to) bottom out
</div>
<div class="width-1-2">
nouns:
* (a) cut
* (a) decrease, (a) downswing
* (a) decline
* (a) drop
* (a) fall
* (a) plunge
* (a) reduction
* (a) collapse (dramatic fall)
* (a) slump
</div>
</div>
=== ⇒ No Movement ===
<div class="grid">
<div class="width-1-2">
verbs
* (to) keep ... stable
* (to) remain stable
* (to) hold ... constant
* (to) stay constant
* (to) stabilize
* (to) stand at
* (to) remain steady
</div>
<div class="width-1-2">
nouns:
* stability
</div>
</div>


=== ⮍ CHANGE OF DIRECTION ===
===Alternative===
<div class="grid">
<div class="width-1-2">
verbs
* (to) level off
* (to) level off/out, to flatten out
* (to) stop falling/rising
* (to) stop rising and start falling
</div>
<div class="width-1-2">
nouns:
* (a) levelling-off
* (a) change
</div>
</div>


=== Interactive Exercises ===
Ist der Inhalt Ihrer Tabelle kurz und knapp, besteht er also nicht aus langen (Ab)Sätzen, so kann die Verwendung von <code>||</code> einen lesbareren Code liefern. Fügen Sie zudem noch zusätzliche Leerzeichen ein, um die Lesbarkeit zu erhöhen. Die Darstellung der Tabelle verändert sich dadurch nicht.  
[[File:Different-graphs.svg|left|Graphs and trends]]
{{clear}}
'''Look at the graphs and match graph and sentence.'''


<div class="lueckentext-quiz" lang="en">
<pre>
{|
{|
|  Orangen  ||  Äpfel  ||  mehr
|-
|-
| A. The investment level rose suddenly. || ''Graph 3''
|   Brot    ||   Kuchen  ||  mehr
|-
|-
| B. The sales fell slightly in the final quarter. || ''Graph 7''
| Butter  || Eiskrem  ||   noch mehr
|-
|}
| C. The R&D budget has stabilized over the past few years. || ''Graph 8''
</pre>
|-
 
| D.  At the end of the first year, sales stood at 50 per cent of the present level. || ''Graph 1''
{|
|-
|  Orangen  ||   Äpfel  ||   mehr
| E. The price peaked before falling a little and then maintaining the same level.|| ''Graph 6''
|-
| F.  There has been a steady increase in costs over several years.|| ''Graph 4''
|-
|-
| G. The sudden collapse in share prices has surprised everyone.|| ''Graph 2''
|   Brot    ||  Kuchen ||   mehr
|-
|-
| H. The share value has steadily declined.|| ''Graph 5''
|  Butter  || Eiskrem  ||  noch mehr
|}
|}
</div>
{{#ev:youtube|_gYID-l3K0E}}
{{How to}}
== Weblinks ==
*[http://www.eslflow.com/describinggraphstables.html Linkliste] (eslflow.com)
* [http://bees4work.pbworks.com/f/Company+Trends+Student.pdf Describing Trends] (onestopEnglish.com)


[[Kategorie:Unterrichtsidee]]
{{Hilfe Navigation}}
[[Kategorie:Englisch]]
[[Kategorie:Analyse]]
[[Kategorie:Wirtschaft]]
[[Kategorie:Wortschatz]]
[[Kategorie:Chemie]]

Aktuelle Version vom 21. Mai 2022, 13:51 Uhr

Tabellen können im Wiki entweder mit den allgemein gängigen HTML-Elementen gestaltet werden oder mit Wikisyntax. Die Wikisyntax ist eingängig, schlank und einfach. Sie wird im Folgenden beschrieben. Der Gebrauch von HTML wird hingegen nicht näher erläutert, sondern als bekannt vorausgesetzt.

Tabellen sind kein grafisches Gestaltungsmittel. Sie dienen allein dem Zweck, gleichartige Informationen übersichtlich darzustellen. Da Tabellen deutlich komplizierter zu lesen sind als normaler Text, sollten sie nur dann eingesetzt werden, wenn sie ihren eigentliche Zweck erfüllen.


Empfehlung
Verwenden Sie zum leichteren Erstellen von Tabellen die Erweiterte Bearbeiten-Werkzeugleiste.

Auszeichnung von Tabellen in Wiki-Syntax

MediaWiki Beschreibung
{| Beginn der Tabelle (vorgeschrieben, entspricht <table>)
|+ Tabellenüberschrift (optional, entspricht <caption>) Die Überschrift steht zwischen dem Beginn der Tabelle und der ersten Tabellenzeile. Sie kann nur einmal pro Tabelle verwendet werden.
|- Tabellenzeilen (entspricht <tr>) In der ersten Reihe optional.
! Tabellenkopfzelle, (optional, entspricht <th>) Stehen die Kopfzellen weiterer Spalten in einer Reihe, werden sie durch doppelte Ausrufezeichen (!!) getrennt, ansonsten steht zu Beginn jeder neuen Zeile ein Ausrufezeichen (!).
| Tabellendaten (vorgeschrieben, entspricht <td>) Stehen die Tabellendaten weiterer Spalten in einer Reihe, werden sie durch doppelte senkrechte Striche (||) getrennt, ansonsten steht zu Beginn jeder neuen Zeile ein senkrechter Strich (|).
|} Ende der Tabelle (entspricht </table>)
  • Grundsätzlich muss jede Zeile und jede Spalte in einer neuen Zeile beginnen, sofern Sie nicht die doppelten senkrechten Striche || bzw. Ausrufungszeichen !! verwenden.
  • Jedes Auszeichnungselement (mit Ausnahme des Tabellenendes) kann optional ein oder mehrere HTML-Attribute beinhalten. Die Attribute stehen, getrennt durch einfachen Leerraum, in der gleichen Reihe wie die Auszeichnungs-Elemente.
  • Die Zellen und die Überschriften (| oder ||, ! oder !! sowie |+) führen Inhalt mit sich. Trennen sie Auszeichnung und Inhalt in einer Zeile durch einen senkrechten Strich (|). Der Inhalt einer Zelle folgt dann in der gleichen Zeile oder in der nächsten Zeile. Letzteres ist z. B. dann der Fall, wenn der Inhalt mit Wiki-Elementen ausgezeichnet ist, die ihrerseits eine neue Zeile benötigen (z. B. Listen, Aufzählungen oder verschachtelte Tabellen). Dann steht der Inhalt stets in einer neuen Reihe.
  • Die Tabelle und die Tabellenzeilen ({| und |-) beinhalten nicht unmittelbar Inhalt. Hinter hier eingefügten Attributen folgt kein senkrechter Strich.

Eine einfache Tabelle

Eine einfache, schmucklose Tabelle 

{|
|Orangen
|Äpfel
|-
|Brot
|Kuchen
|-
|Butter
|Eiskrem 
|}
Orangen Äpfel
Brot Kuchen
Butter Eiskrem


Alternative

Ist der Inhalt Ihrer Tabelle kurz und knapp, besteht er also nicht aus langen (Ab)Sätzen, so kann die Verwendung von || einen lesbareren Code liefern. Fügen Sie zudem noch zusätzliche Leerzeichen ein, um die Lesbarkeit zu erhöhen. Die Darstellung der Tabelle verändert sich dadurch nicht. 

{|
|  Orangen  ||   Äpfel   ||   mehr
|-
|   Brot    ||   Kuchen  ||   mehr
|-
|  Butter   ||  Eiskrem  ||   noch mehr
|}
Orangen Äpfel mehr
Brot Kuchen mehr
Butter Eiskrem noch mehr


Hilfen im ZUM-Unterrichten: Vorlagen, allgemeine Hilfeseiten

Einstieg

  1. Inhalte erstellen
    • neue Seiten anlegen
    • Texte einfügen
    • Überschriften
  2. Medien einbinden
  3. Lernpfad erstellen
    • Unterseiten
    • Fortsetzung

Vorlagen

Wartung und Pflege

neuen Platz finden

allgemeine Wiki-Hilfe

Abgerufen von „https://unterrichten.zum.de/index.php?title=How_to_present_a_graph&oldid=127920“