The font used throughout the design is called Source Sans Pro. It’s the first open source font designed by Adobe. It was published under the SIL Open Font License. The source files can be downloaded via Sourceforge and Github. (Source: Wikipedia)
The font can also be embedded with Google Fonts.
At the beginning, the Roboto font by Google was considered as an alternative. Both fonts – Source Sans Pro and Roboto – have very complete families, from very light to bold font styles.
We went for the Source Sans Pro because of her more distinctive character while being extremly readable. This font choice gives the website a modern look.
We use the font weights Regular and Bold. For emphasizing text, the italics provided with the font can be used. Please take care of using the real italics, not only slanting the regular font with <em>.
The design of the logo is based on our font choice, Source Sans Pro. It is a combination of the sans serif fontface with the recently released Source Serif.
While the clean and simple sans serif shows our commitment for transparency, openness, modernity, the serif font stands for tradition. Both aspects mixed together are what makes this project special.
The icon reminds both the austrian flag (red-white-red) and a sending/transmitting symbol. The ending .at also represents austria and completes the url depicted in the logo: offenesparlament.at
Logo Download
The logo is available in the most current formats for web and print applications:
- logo-offenesparlament_cmyk.pdf
- logo-offenesparlament_rgb.pdf
- logo-offenesparlament_rgb.png
Negative versions of the logo are also provided:
- logo-offenesparlament_cmyk_neg.pdf
- logo-offenesparlament_rgb_neg.pdf
- logo-offenesparlament_rgb_neg.pdf
The icon can be used separately in some cases:
- logo-icon-offenesparlament_rgb.png
The design comes with a colorscheme that is both colorful and soft. We often have long pages with a lot of text and tables, so the colors needed to work for structuring the site. It should look friendly, not too technical – we want to attract users with all kind of backgrounds, and therefore need the site to look human/welcoming. And last but not least, the colors needed to display the variety of the austrian parties.
The main color (used in the navigation bar throughout the site) is blue. It is also used for the background of the homepage in a slighly lighter hue.
An overview on the colors used on the site (in RGB, the percentages refer to the original color):
- Text color black 0/0/0
- Linkcolor blue 0/111/213
- Linkcolor blue hover im Header and Footer (50%) 127/183/234
- Blue Header Background 30/69/99
- Grey Footer (85%) 38/38/38
- Light Red 245/95/87
- Red 236/55/51
- Red 50% for icons in the search bar 245/155/153
- Grey 50% for icons in the search bar, grey text, etc. 127/127/127
- Grey text footer (25%) 191/191/191
- Blue background homepage (95%) 41/78/107
- Grey search bar (10%) 229/229/229
- Grey text entry field in search bar (18%) 209/209/209
- Blue background lightbox 30/69/99 with opacity 0.9
- Grey lines in tables (15%) 217/217/217
Parties: - ÖVP 65/60/77 - Grüne = green 63/146/91 - SPÖ = red 236/55/51 - FPÖ 94/148/186 - Neos = pink 215/76/107 - Stronach = yellow 243/188/64 - BZÖ = orange 243/120/62
Other: - Green box element (Top10, etc.)
- fill color (10%) 235/244/238
- border color (25%) 207/228/214
- Light red box element (subscription form) - fill color (5%) 254/247/246 - border color (20%) 253/223/221
- Blue box element (laws) - border color and fill color lower part (15%) 221/227/232 - fill color upper part (5%) 244/246/247
- Buttons - border color light red 245/95/87 and fill color 255/255/255 (text and icon in light red) - hover: border and fill color 245/95/87 (text and icon changes to white)
We have a number of basic text formatting covered, such as headlines, lists, etc …
Tables always start with a white header row and bold text. All the other rows are alternating a a white and light grey background (5% of blue 30/69/99). The rows are separated by light grey horizontal lines. There are no vertical lines or other elements to reinforce the columns. This way, the tables look simple, yet organised.
Text in tables is smaller than normal paragraph text. Icons can be used as needed. There is a generous padding in the table fields.
Links within the content are formatted in blue and change opacity when hovered.
offenesparlament.at is a very text and table-heavy site. While more visualisations are part of our wishlist and might be realized in a next step, we needed smaller visual elements to help our readers and make the content easier to understand. That is where colors and, just as important, icons come in.
We used symbols that are based on the Streamline Icon Set (Line Version). To fit our needs, some icons were edited or created from scratch and added, such as the parliament icon.