Skip to main content
2 of 3
update
allcaps
  • 1.8k
  • 1
  • 16
  • 18

Headings (proportinal font) and code blocks (background, mono spaced font) are typographical the simplest and cleanest solution. It will work with small snippets and big (page overflowing) examples:

Python

print "Hello world!"

JavaScript

alert('Hello world!');

SQL

SET SERVEROUTPUT ON;
BEGIN
    DBMS_OUTPUT.PUT_LINE('Hello, world!');
END;

Headings can be space consuming. Especially when you have a lot short snippets. Commenting the language name as label is a good alternative:

# Python
print "Hello world!"

// JavaScript
alert('Hello world!');

-- SQL
SET SERVEROUTPUT ON;
BEGIN
    DBMS_OUTPUT.PUT_LINE('Hello, world!');
END;

Separate these snippets with a small white gap. So your reader sees it as three blocks.

UPDATE

An example of inline code:

Now type print 'Hello World!'. Well done!

Again monospace and gray background. A monospaced font for code is an obvious choice. But there are other methods to create 'contrast' between body copy and code. Obvious typographic methods for making distinctions are typeface, size, color, position, shape, etc.

To make a distinction between the two programming languages, you can choose from the same pallet.

allcaps
  • 1.8k
  • 1
  • 16
  • 18