HTML – Hypertext Markup Language

Total Page:16

File Type:pdf, Size:1020Kb

HTML – Hypertext Markup Language HTML – Hypertext Markup Language Computer Science and Engineering n College of Engineering n The Ohio State University Lecture 9 HTML Computer Science and Engineering n The Ohio State University o Hypertext Markup Language o Key ideas: 1. Connect documents via (hyper)links o Visual point-and-click o Distributed, decentralized set of documents 2. Describe content of document, not style o Structure with semantics o Separation of concerns o Rephrasing these key ideas: 1. Hypertext 2. Markup Markup: Describing Content Computer Science and Engineering n The Ohio State University o WYSIWYG n A paragraph or bulleted list in MS Word n Benefits: o No surprises in final appearance o Quick and easy o Control: Author can use visual elements to stand in for structural elements o WYSIWYM n A paragraph or list in LaTeX n Benefits: o More information in document (visual & semantic) o Lack of Control: Author doesn't know how to apply visual elements properly for structure Abstraction vs Representation Computer Science and Engineering n The Ohio State University \section{To Do List} \begin{enumerate} \item{Study for midterm} \item{Sleep} \end{enumerate} Authors Lack Requisite Expertise Computer Science and Engineering n The Ohio State University o What's wrong with the following page? Chapter 9 Now that we have the ability to display a catalog containing all our wonderful products, it would be nice to be able to sell them. We will need to cover sessions, models, and adding a button to a view. So let's get started. Iteration D1: Finding a Cart … Evolution of HTML Computer Science and Engineering n The Ohio State University o HTML (Berners-Lee, early 90's) o HTML 2.0 (W3C, '95) o HTML 3.2 (W3C, '97) o HTML 4.0 (W3C, '97) n To form a more perfect union… o HTML 4.01 (W3C, '99) n To smooth out the edges… big dog for years o The great schism n W3C: XHTML 1.0 ('00), 1.1 ('01), 2.0 n Everyone else: HTML Forms, WHAT… o Capitulation ('09): W3C abandons XHTML 2.0 o HTML5 (October 2014) n One ring to rule them all… n (includes XHTML5, but no one seems to care) Page Validation Computer Science and Engineering n The Ohio State University o Design-by-contract: n Strong ensures, weak requires n Be strict in output, permissive in input o Browsers (taking HTML as input) are permissive n "Tag soup" still renders o Web authors (writing HTML as output) should be as strict as possible n But permissive browsers hide errors! o Solution: use a validator n See validator.w3.org n Checks for syntax problems only Example Computer Science and Engineering n The Ohio State University <!DOCTYPE html> <html lang="en"> <head> <title>Something Short and Sweet</title> <meta charset="utf-8" /> </head> <body> <p> Hello <a href="planet.html">World</a>! <br /> <img src="pic.png" alt="a globe" /> </p> </body> </html> Example Computer Science and Engineering n The Ohio State University <!DOCTYPE html> <html lang="en"> <head> <title>Something Short and Sweet</title> <meta charset="utf-8" /> </head> <body> <p> Hello <a href="planet.html">World</a>! <br /> <img src="globe.png" alt="a globe"/> </p> </body> </html> Example (Rewritten) Computer Science and Engineering n The Ohio State University <!DOCTYPE html> <html lang="en"> <head> <title>Something Short and Sweet</title> <meta charset="utf-8" /> </head> <body> <p> Hello <a href="planet.html">World</a>! <br /> <img src="pic.png" alt="a globe" /> </p> </body> </html> Type Declaration for HTML 5 Computer Science and Engineering n The Ohio State University <!DOCTYPE html> <html lang="en"> <head> <title>Something Short and Sweet</title> <meta charset="utf-8" /> </head> <body> <p> Hello <a href="planet.html">World</a>! <br /> <img src="pic.png" alt="a globe" /> </p> </body> </html> Document Type Declarations Computer Science and Engineering n The Ohio State University o HTML 5 <!DOCTYPE html> o HTML 4.01 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> o XHTML 1.0 Strict <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1- strict.dtd"> Type Declaration for HTML 5 Computer Science and Engineering n The Ohio State University <!DOCTYPE html> <html lang="en"> <head> <title>Something Short and Sweet</title> <meta charset="utf-8" /> </head> <body> <p> Hello <a href="planet.html">World</a>! <br /> <img src="pic.png" alt="a globe" /> </p> </body> </html> Element Tags: Nested Start/End Computer Science and Engineering n The Ohio State University <!DOCTYPE html> <html lang="en"> <head> <title>Something Short and Sweet</title> <meta charset="utf-8" /> start tag </head> content <body> end tag <p> Hello <a href="planet.html">World</a>! <br /> <img src="pic.png" alt="a globe" /> </p> </body> </html> Structure: Nesting of Elements Computer Science and Engineering n The Ohio State University html lang: en element attr name: attr value head body content title meta p charset: utf-8 Hello a ! br img href: planet.html src: pic.png ald: a globe Something Short World and Sweet Attributes: Name/Value Pairs Computer Science and Engineering n The Ohio State University <!DOCTYPE html> <html lang="en"> <head> <title>Something Short and Sweet</title> <meta charset="utf-8" /> </head> <body> <p> Hello <a href="planet.html">World</a>! <br /> <img src="pic.png" alt="a globe" /> </p> </body> </html> Structure of Example Computer Science and Engineering n The Ohio State University html lang: en element attr name: attr value head body text title meta p charset: utf-8 Hello a ! br img href: planet.html src: pic.png alt: a globe Something Short World and Sweet HTML Entities Computer Science and Engineering n The Ohio State University o Familiar problem: Encoding n Is <br /> a tag or (literal) content? n Meta-characters (e.g. '<') need to be escaped o HTML entities represent a literal &#dddd; n Where dddd is the "unicode code point" (as a decimal number) &#xhhhh; n Where hhhh is the code point in hex &name; n Where name is from a small set (lt, gt, amp…) o Examples: &#60; &#x3C; &lt; &#9829; &#x2665; &hearts; Kinds of Elements Computer Science and Engineering n The Ohio State University 1. Document structure elements n Root of tree is always <html> n Two children: <head>, <body> 2. Head elements n (Meta) information about document 3. Body elements 1. Block o Content that stands alone o Starts new line of text o May contain other elements (block or inline) 2. Inline o Intimately part of surrounding context o Does not interrupt "flow" of text o May contain other inline elements Block vs Inline Computer Science and Engineering n The Ohio State University flow body inline paragraph heading horz rule blocks Demo: 3D View in FF Dev Tools Computer Science and Engineering n The Ohio State University Required Structure for HTML5 Computer Science and Engineering n The Ohio State University html lang: en element attr name: attr value head body text title meta charset: utf-8 Common Head Elements Computer Science and Engineering n The Ohio State University o <title>: required, must be only text n May be displayed in window title bar o <script>: client-side code to run o <link>: other documents to use n Commonly used for style information o <meta>: information about the information (document) n <meta http-equiv="…" content="…" /> becomes a header field in HTTP response! <meta http-equiv="Content-Type" content= <meta http-equiv="Location" content=… <meta http-equiv="Last-modified" content=… n <meta name="keywords" content="…" /> Common Block Elements in Body Computer Science and Engineering n The Ohio State University o Text n Paragraph <p>, horizontal rule <hr> n Headings <h1> <h2> … <h6> n Preformatted <pre>, quotations <blockquote> o Lists n Ordered <ol>, unordered <ul>, definition <dl> n Item in list <li> (<dt> <dd> for definitions) o Table <table> o Form <form> (and some form elements) o Sectioning (HTML 5) n Article <article>, section <section> n Header <header>, footer <footer> n Canvas <canvas> o Generic container for flow content <div> Common Inline Elements Computer Science and Engineering n The Ohio State University o Anchor <a> o Phrasing and text n Emphasis <em>, strong emphasis <strong> n Code snippet <code> n Inline quotation <q> n Inserted text <ins>, deleted text <del> o Image <img> o Form elements o Generic container within flow content <span> o Visual markup: deprecated n Bold <b>, italic <i>, underline <u> n Typewriter font <tt> n Font control <font> And Don't Forget Comments Computer Science and Engineering n The Ohio State University o Comments set off by <!-- … --> o Beware: they do not nest Tables Computer Science and Engineering n The Ohio State University o Row <tr> o Cell of data <td> o Header cell (for row or column) <th> o Caption <caption> o And some more exotic ones too n Header (repeat if splitting) <thead> n Body <tbody> n Footer (repeat if splitting) <tfoot> Table Example Computer Science and Engineering n The Ohio State University <table> <caption> Important Dates in CSE 3901 </caption> <tr> <th scope="col">Quiz</th> <th scope="col">Day, time</th> </tr> <tr> <th scope="row">Midterm 1</th> <td> Friday, Sept 21, in class</td> </tr> <tr> <th scope="row">Midterm 2</th> <td> Monday, Oct 22, in class</td> </tr> <tr> <th scope="row">Final</th> <td> Wednesday Dec 12, 12:00&ndash;1:45 </td> </tr> </table> Table Example Rendered Computer Science and Engineering n The Ohio State University Hyperlinks Computer Science and Engineering n The Ohio State University o Anchor tag with href attribute <a href=…>some text</a> some text o Clickable element o Click results in: an HTTP request
Recommended publications
  • Musical Notation Codes Index
    Music Notation - www.music-notation.info - Copyright 1997-2019, Gerd Castan Musical notation codes Index xml ascii binary 1. MidiXML 1. PDF used as music notation 1. General information format 2. Apple GarageBand Format 2. MIDI (.band) 2. DARMS 3. QuickScore Elite file format 3. SMDL 3. GUIDO Music Notation (.qsd) Language 4. MPEG4-SMR 4. WAV audio file format (.wav) 4. abc 5. MNML - The Musical Notation 5. MP3 audio file format (.mp3) Markup Language 5. MusiXTeX, MusicTeX, MuTeX... 6. WMA audio file format (.wma) 6. MusicML 6. **kern (.krn) 7. MusicWrite file format (.mwk) 7. MHTML 7. **Hildegard 8. Overture file format (.ove) 8. MML: Music Markup Language 8. **koto 9. ScoreWriter file format (.scw) 9. Theta: Tonal Harmony 9. **bol Exploration and Tutorial Assistent 10. Copyist file format (.CP6 and 10. Musedata format (.md) .CP4) 10. ScoreML 11. LilyPond 11. Rich MIDI Tablature format - 11. JScoreML RMTF 12. Philip's Music Writer (PMW) 12. eXtensible Score Language 12. Creative Music File Format (XScore) 13. TexTab 13. Sibelius Plugin Interface 13. MusiXML: My own format 14. Mup music publication program 14. Finale Plugin Interface 14. MusicXML (.mxl, .xml) 15. NoteEdit 15. Internal format of Finale (.mus) 15. MusiqueXML 16. Liszt: The SharpEye OMR 16. XMF - eXtensible Music 16. GUIDO XML engine output file format Format 17. WEDELMUSIC 17. Drum Tab 17. NIFF 18. ChordML 18. Enigma Transportable Format 18. Internal format of Capella (ETF) (.cap) 19. ChordQL 19. CMN: Common Music 19. SASL: Simple Audio Score 20. NeumesXML Notation Language 21. MEI 20. OMNL: Open Music Notation 20.
    [Show full text]
  • WYSIWYM – Integrated Visualization, Exploration and Authoring of Semantically Enriched Un-Structured Content
    Semantic Web 1 (2013) 1–14 1 IOS Press WYSIWYM – Integrated Visualization, Exploration and Authoring of Semantically Enriched Un-structured Content Ali Khalili a, Sören Auer b a AKSW, Universität Leipzig, Augustusplatz 10, 04109 Leipzig, Germany [email protected] b CS/EIS, Universität Bonn, Römerstraße 164, 53117 Bonn, Germany [email protected] Abstract. The Semantic Web and Linked Data gained traction in the last years. However, the majority of information still is contained in unstructured documents. This can also not be expected to change, since text, images and videos are the natural way how humans interact with information. Semantic structuring on the other hand enables the (semi-)automatic integration, repurposing, rearrangement of information. NLP technologies and formalisms for the integrated representation of unstructured and semantic content (such as RDFa and Microdata) aim at bridging this semantic gap. However, in order for humans to truly benefit from this integration, we need ways to author, visualize and explore unstructured and semantically enriched content in an integrated manner. In this paper, we present the WYSIWYM (What You See is What You Mean) concept, which addresses this issue and formalizes the binding between semantic representation models and UI elements for authoring, visualizing and exploration. With RDFaCE and Pharmer we present and evaluate two complementary showcases implementing the WYSIWYM concept for different application domains. Keywords: Visualization, Authoring, Exploration, Semantic Web, WYSIWYM, WYSIWYG, Visual Mapping 1. Introduction more efficient and effective search interfaces, such as faceted search [29] or question answer- The Semantic Web and Linked Data movements ing [17]. with the aim of creating, publishing and interconnect- – In information presentation semantically enriched ing machine readable information have gained traction documents can be used to create more sophis- in the last years.
    [Show full text]
  • Latexfür Musiker
    LATEXfür Musiker Michael Enzenhofer Dezember 2016 Inhaltsverzeichnis I. Der erste Einstieg3 1. LATEX 4 1.1. Geschichte von LATEX............................4 1.2. Grundprinzip von LATEX...........................4 1.3. Finale versus LilyPond . .5 1.4. Word versus LATEX..............................7 1.5. Vorteile von LATEX..............................9 2. LATEX-Editoren 11 2.1. Die Qual der Wahl . 11 2.2. TeXShop die Wahl für Mac OSX . 11 2.3. Editor – Viewer . 12 3. Erster Umgang mit LATEX 13 3.1. Die Computertastatur . 13 3.2. LATEX-Befehle . 13 3.3. LATEX-Packages . 16 3.4. Der LATEX-Quellcode . 17 3.5. Dokumentenklasse . 19 3.6. Gliederung des Dokumententeils . 20 4. Die musikalische Notation 21 5. Zusätzliche Pakete 26 6. Weitere Befehle 28 7. Bilder einfügen 31 7.1. \includegraphics . 31 7.2. Bild-Positionierung . 36 7.3. figure-Umgebung . 37 7.4. sidecap . 38 7.5. picinpar . 39 8. Linkempfehlungen 42 2 Teil I. Der erste Einstieg 3 1. LATEX sprich: „Latech“ 1.1. Geschichte von LATEX Das Basis-Programm von LATEX ist TEX. Dieses wurde von Donald Ervin Knuth während seiner Zeit als Informatik-Professor an der Stanford University von 1977 bis 1986 entwickelt. Auf TEX aufbauend entwickelte Leslie Lamport Anfang der 1980er Jahre LATEX. Der Name LATEX ist eine Abkürzung für Lamport TEX. Lamports Entwicklung von LATEX endete gegen 1990 mit der Version 2.09. Die aktuelle Version LATEX2 wurde ab 1989 von einer größeren Zahl von Autoren um Frank Mittelbach, Chris Rowley und Rainer Schöpf entwickelt. 1.2. Grundprinzip von LATEX Im Gegensatz zu anderen herkömmlichenTextverarbeitungsprogrammen, die nach dem What-You-See-is-What-You-Get-Prinzip (WYSIWYG) funktionieren, arbeitet man in LATEX mit CODE.
    [Show full text]
  • What's in Extras
    What’s In Extras 2021/09/20 1 The Extras Folder The Extras folder contains several sub-folders with: • duplicates of several GUI programs installed by the MacTEX installer for those who already have a TEX distribution; • alternates to the GUI applications installed by the MacTEX installer; and • additional software that aE T Xer might find useful. The following sub-sections describe the software contained within them. Table (1), on the next page, contains a complete list of the enclosed software, versions, supported macOS versions, licenses and URLs. Note: for 2020 MacTEX supports High Sierra, Mojave and Catalina although some software also supports earlier versions of macOS. Earlier versions of applications are no longer supplied in the Extras folder but you may find them at the supplied URL. 1.1 Bibliography Bibliography programs for building and maintaining BibTEX databases. 1.2 Browsers A program to browse symbols used with LATEX. 1.3 Editors & Front Ends Alternative Editors, Typesetters and Previewers for TEX. These range from “WYSIWYM (What You See Is What You Mean)” to a Programmer’s Editor with strong LATEX support. 1.4 Equation Editors These allow the user to create beautiful equations, etc., that may be exported for use in other appli- cations; e.g., editors, illustration and presentation software. 1.5 Previewers Separate DVI and PDF previewers for use as external viewers with other editors. 1.6 Scripts Files to integrate some external programmer’s editors with the TEX system. 1.7 Spell Checkers Alternate TEX, LATEX and ConTEXt aware spell checkers. 1.8 Utilities Utilities for managing your MacTEX distribution.
    [Show full text]
  • Reproducible Research II: Sharing Files
    Reproducible Research II: sharing files LPO 9951 | Fall 2015 Contents The common thread . 1 Writing . 2 Equations . 5 References . 5 Graphics . 5 Attribution . 6 Ownership . 8 Final word . 8 PURPOSE In the last lecture on reproducible research, we discussed version control through git. Git works better with some types of file formats than others (e.g., plain text vs. MS Word). Today we will discuss a few of these not only in the service of using git, but with the purpose of improving how you can collaborate with others and share your work. We’ll also discuss attributions and ownership. The common thread Despite their seemingly different approaches to structuring text, the following syntaxes share two primary characteristics: 1. They are structured and saved using plain text files 2. They follow a WYSIWYM rather than WYSIWYG philosophy Plain text The simple MS Word .doc or .docx is a single file, right? Yes and no. The reason non-PC systems sometimes have trouble with MS Word documents is (1) they are saved in a proprietary format, and (2) those files are better thought of as file systems rather than as a single file. In other words, your MS Word document isn’t simply a record of the words on your screen, but also of a large number of format and system settings. This file structure is why, if you have tried, GitHub doesn’t display Windows documents that you may have pushed to it. Git works best with plain text (ASCII) files. There are a limited number of characters available, but for most of your scripting, you’ll be fine (do you really need that umlaut in your variable names?).
    [Show full text]
  • The LYX Tutorial
    The LYX Tutorial 1 by the LYX Team January 20, 2008 1 If you have comments or error corrections, please send them to the LYX Documenta- tion mailing list, [email protected]. ii Contents 1 Introduction1 1.1 Welcome to LYX!..........................1 1.2 What the Tutorial is and what it isn’t ................1 1.2.1 Getting the most out of the Tutorial............2 1.2.2 What you won’t find....................2 2 Getting started with LYX3 2.1 Your first LYX document......................3 2.1.1 Typing, Viewing, and Exporting..............4 2.1.2 Simple Operations.....................4 2.1.3 WYSIWYM: Whitespace in LYX.............5 2.2 Environments............................6 2.2.1 Sections and Subsections..................7 2.2.2 Lists and sublists......................8 2.2.3 Other environments: Verses, Quotations, and more.... 10 3 Writing Documents 11 3.1 Document Classes.......................... 11 3.2 Templates: Writing a Letter..................... 12 3.3 Document Titles........................... 13 3.4 Labels and Cross-References.................... 14 3.5 Footnotes and Margin Notes.................... 16 3.6 Bibliographies............................ 17 3.7 Table of Contents.......................... 17 4 Using Math 19 4.1 Math Mode............................. 19 4.2 Navigating an Equation....................... 20 iii iv CONTENTS 4.3 Exponents and Indices....................... 21 4.4 The Math Toolbar.......................... 21 4.4.1 Greek and symbols..................... 21 4.4.2 Square roots, accents, and delimiters............ 22 4.4.3 Fractions.......................... 22 4.4.4 TEX mode: Limits, log, sin and others........... 23 4.4.5 Matrices........................... 23 4.4.6 Display mode........................ 24 4.5 More Math Stuff.........................
    [Show full text]
  • CSCM10 Research Methodology a Taster of LATEX WYSIWYG
    WYSIWYG Systems CSCM10 Research Methodology A Taster of LATEX Anton Setzer • WYSIWYG = \What You See Is What You Get". http://www.cs.swan.ac.uk/∼csetzer/lectures/ • What you type in can be seen directly on the screen. computerScienceProjectResearchMethods/current/index.html • Microsoft Office Word is the main example of a WYSIWYG system. October 22, 2017 CSCM10 Lecture 4, 11/2/16: LATEX 2/ 32 Advantages/Disadvantages of WYSIWYG Systems WYSIWYM • WYSIWYG systems are relatively easy to use. • In WYSIWYG systems typesetting to be done by the user. • Problem: most users are not professional type setters. • WYSIWYM = \What You See Is What You Mean". • In most systems (e.g. Word) you can see only the output, but • Instead of doing the typesetting directly the user says: not the formatting information. • This is a headline. • Difficult to detect that one headline is in 11 pt and another in • This is a section title. 12 pt, or one headline in one font, and another in a slightly • This text is normal text. different font. • This is a mathematical formula • Therefore output is usually inconsistent. • Main examples: TEXand LATEX. • Usually output not of printable quality. • Programming is difficult, definition of macros restricted and difficult. CSCM10 Lecture 4, 11/2/16: LATEX 3/ 32 CSCM10 Lecture 4, 11/2/16: LATEX 4/ 32 Advantages/Disadvantages of WYSIWYM Systems LATEX • Steeper learning curve. • Separation of output from input, therefore what you write needs to be compiled into text. • Can create text in print quality. • TEX developed by Donald Knuth in order to typeset a new • Many publishers print articles typeset in LATEX directly, or after version of his books \The art of Computer Programming".
    [Show full text]
  • Introducing Document Preparation with LATEX Stan Reeves a Introduction Introducing Document Preparation with LTEX LATEX Editors
    Introducing Document Preparation with LATEX Stan Reeves A Introduction Introducing Document Preparation with LTEX LATEX Editors Automation Prosper Stan Reeves Beamer Posters Department of Electrical and Computer Engineering June 28, 2010 1 / 38 TEX(τχ) is a typesetting system. METAFONT – Font description language A point on a glyph is found as the intersection of a line segment and a Bezier´ cubic curve Computer modern typeface. 62 parameters control the widths and heights of elements Author of TEX Donald Knuth (1978), computer science professor at Stan- ford TEX Introducing Document Preparation Preparation of a document involves with LATEX Entering text Stan Reeves Formatting text Introduction Display on a screen Printing LATEX Editors Automation Prosper Beamer Posters 2 / 38 TEX Introducing Document Preparation Preparation of a document involves with LATEX Entering text Stan Reeves Formatting text Introduction Display on a screen Printing LATEX Editors TEX(τχ) is a typesetting system. Automation METAFONT – Font description language Prosper A point on a glyph is found as the intersection of a line Beamer segment and a Bezier´ cubic curve Posters Computer modern typeface. 62 parameters control the widths and heights of elements Author of TEX Donald Knuth (1978), computer science professor at Stan- ford 2 / 38 A total-fit line-breaking algorithm Assigns badness. Minimizes SS of badness Hyphenation algorithm Removes prefixes and suffixes Will attempt to put a break between consonants in a pattern of the form vowel-consonant-consonant-vowel. Line breaks LATEX is a set of macros for TEX Written by Leslie Lamport (1984), current release LATEX2" TEX and LATEX Introducing Document Preparation with LATEX Math spacing carefully derived based on typesets in: Stan Reeves Acta Mathematica Indagationes Mathematicae Introduction Addison-Wesley’s books LATEX Editors Automation Prosper Beamer Posters 3 / 38 Hyphenation algorithm Removes prefixes and suffixes Will attempt to put a break between consonants in a pattern of the form vowel-consonant-consonant-vowel.
    [Show full text]
  • Create Pretty Documents with LATEX!
    Create Pretty Documents with LATEX! Evan Brummet, Patrick Davis, & Micah Fogel Kane County Institute Day 1 March 2019 What is TEX? Developed in 1978 by Donald Knuth for The Art of Computer Programming (Volume 2) A typesetting system (as opposed to a WYSIWYG text editor, like MS Word) Metafont (description language for vector fonts) Donald Knuth (Source: www-cs-faculty. stanford. edu/ ˜ uno ) and Computer Modern (a family of typefaces) What is LATEX? Originally released in the early 1980s by Leslie Lamport A simplified “rewrapping” of TEX for content creators LATEX 2ε: The New Standard LATEX Leslie Lamport (Source: http: // www. lamport. org/ ) Why use LATEX? Why use LATEX? It makes things pretty. It’s quicker. (After a sizable learning curve!) It’s cross-platform. It’s open source and free. It’s the standard for mathematics publication. It’s being integrated into text editors. It allows you to focus on content. What You Need To Get Started Distribution: the typesetting system itself MiKTEX (Windows), MacTEX (MacOS), TEX Live (Windows and Linux) Editor: a front-end to use LATEX Emacs, Kile, LyX (WYSIWYM), Overleaf, ShareLATEX, Texmaker, TEXnicCenter, TEXstudio, TEXworks, Vim So let’s try it already! https://www.overleaf.com/ http://staff.imsa.edu/˜fogel/latex The Big Machinery Document Classes: types of documents you can create, defines a set of basic LATEX commands article: for writing journal articles, short reports, etc. beamer: for creating slides or presentations (Like this one! ) book:, for putting together books Others... Packages: sets of use-specific LATEX commands to facilitate document creation geometry: for changing the page margins, etc mathtools: for typesetting mathematics (extension of amsmath) tikz: for drawing diagrams Many others..
    [Show full text]
  • Scientific Writing 6951
    Scientific Writing 6951 Wednesdays 10-12 Room 0.008 http://www.astro.uni-bonn.de/~izzard/writing.html Scientific Writing Today: Software Tools ● Writing tools ● WYSIWYG ● WYSIWYM ● Graphics tools ● Plotting ● Diagrams ● Images ● Web content ● Presentations Scientific Writing What you see is... ● … what you get. WYSIWYG ● … what you mean. WYSIWYM Scientific Writing WYSIWYG ...what you see is what you get. ● e.g. Libre/OpenOffice Write, M$ Word Scientific Writing WYSIWYG … what you see is what you get. ● Pros ● Complete package (templates, graphics, add-ons, spell/grammar check) ● Easy to use : saves time ● Often required for e.g. grant applications :( ● Cons ● WYSI not quite WYG! e.g. multiformat/print ● Inefficient? (bloated) ● Journal-compatible? Equations? ● Expensive? (proprietary software) Scientific Writing Output issues Scientific Writing Proprietary Formats (e.g. doc) ● Always changing! ● doc 2000 vs doc 1997 vs docx vs ... etc. ● Compatibility issues Following reverse engineering … by Sun and OpenOffice.org, Microsof released a .DOC format specification under the Microsoft Open Specification Promise. However, this specification does not describe all of the features used by (the) DOC format and reverse engineering remains necessary. https://en.wikipedia.org/wiki/DOC_(computing) ● Word (from 2007) now uses the Open Office XML format by default Scientific Writing Compatibility issues openoffice MS word Scientific Writing Compatibility issues openoffice MS word Scientific Writing WYSIWYM ...what you see is what you mean. ● Separation of presentation and content: ● Focus on document contents ● Looks taken care of for you – don't worry! ● e.g. LaTeX & its editors Scientific Writing LaTeX ● Document markup language Text annotated with instructions e.g. \begin{document} Joy, beautiful spark of the gods, daughter from \textcolor{red}{Elysium}, \textbf{we}, drunk with fire, step into your holy shrine, \emph{Heavenly One}.
    [Show full text]
  • Travels in TEX Land: Using Your Favorite Editor with TEX David Walden and Yuri Robbers
    The PracTEX Journal, 2006, No. 4 Article revision 2006/09/5 Travels in TEX Land: Using Your Favorite Editor with TEX David Walden and Yuri Robbers Abstract In this column in each issue Dave Walden muses on his wanderings around the TEX world. In this column he is joined in his meandering by Yuri Rob- bers. Walden discusses the benefits of the fact that one can use the editor of one’s choice with TEX and the various system built on top of TEX, and Robbers lists a number of the editors that are optionally available. Walden speaks in the first person in sections 1–4; Robbers speaks in the first per- son in section 5. 1 Introduction Many reasons are given by proponents of TEX as the benefits of using TEX. These typically have to do with excellent typesetting, logical structuring of documents, and so forth. Another reason that is sometimes given has to do with the fact that with TEX one can choose the text editor best suited to one’s needs. More people in the world use a word processor such as MS Word to do their document processing. Using a word processor such as MS Word that has in- visible, undocumented, proprietary markup means you have to use its built-in, WYSIWYG editor that knows about that markup. This has several potential dis- advantages: (1) you have to learn a new editor for each different word processing system (e.g., Word, Word Perfect, etc.) you decide to use or learn changes to the editor user interface with each new release of the word processor; (2) GUI-based editing often takes a lot more key strokes to do simple things than an editor like WinEdt or Emacs (I provide an example in section 2); (3) an editor like MS Word’s does not seem to have a lot of traditional useful features that an editor like WinEdt or Emacs has (I provide examples in sections 3 and 4).
    [Show full text]
  • A Javascript Framework for Visual and Native XML Editors
    A JavaScript Framework for Visual and Native XML Editors Jochen Graf Thesis submitted to University of Cologne Faculty of Arts and Humanities for obtaining the degree MAGISTER ARTIUM in Humanities Computer Science (Historisch-Kulturwissenschaftliche Informationsverarbeitung) Prof. Dr. Manfred Thaller For Monasterium.net Table of Contents 1. Introduction................................................................................................................1 2. Related Work..............................................................................................................3 2.1 Semantic Content Authoring Tools........................................................................4 2.2 XForms.................................................................................................................6 2.3 Online Code Editors............................................................................................10 2.4 Summary.............................................................................................................11 3. Terminology.............................................................................................................12 3.1 MVC....................................................................................................................12 3.2 WYSIWYG..........................................................................................................13 3.3 WYSIWYM..........................................................................................................14
    [Show full text]