richtlijnen social networks: linkedin

Social Network RichtlijnenInternet en intranet

Ontwerp Studio DumbarInstructie Studio Dumbar

Versie 1.0Datum Juni 2009

Rijksoverheid

2 van 65Rijksoverheid | Social Networks in Rijkshuisstijl | Studio Dumbar | Versie 1.0 | Juni 2009

Inhoudsopgave

Voorwoord — 3

Introductie — 4

Youtube — 5Voorbeeld — 6Voorbeeld — 7Implementatie (1/4) — 8Implementatie (2/4) — 9Implementatie (3/4) — 10Implementatie (4/4) — 11

LinkedIn.com — 12Specificaties — 13Analyse (1/3) — 14Analyse (2/3) — 15Analyse (3/3) — 16Voorbeeld — 17Implementatie — 18

Facebook.com — 19Specificaties — 20Analyse (1/2) — 21Analyse (2/2) — 22Voorbeeld — 23Implementatie (1/6) — 24Implementatie (2/6) — 25Implementatie (3/6) — 26Implementatie (4/6) — 27Implementatie (5/6) — 28Implementatie (6/6) — 29

MySpace.com — 30Specificaties — 31Analyse — 32Voorbeeld — 33Implementatie (1/4) — 34Implementatie (2/4) — 35

Implementatie (3/4) — 36Implementatie (4/4) — 37

Ning.com — 38Specificaties — 39Analyse (1/2) — 40Analyse (2/2) — 41Implementatie (1/3) — 42Implementatie (2/3) — 43Implementatie (3/3) — 44

Twitter.com — 45Specificaties — 46Analyse — 47Voorbeeld — 48Implementatie (1/3) — 49Implementatie (2/3) — 50Implementatie (3/3) — 51

Chi.mp — 52Specificaties — 53Analyse — 54Voorbeeld — 55Implementatie (1/3) — 56Implementatie (2/3) — 57Implementatie (3/3) — 58

Hyves.net — 59Specificaties — 60Analyse — 61Voorbeeld — 62Implementatie (1/3) — 63Implementatie (2/3) — 64Implementatie (3/3) — 65


Voorwoord

Aan: Werkgroep ImplementatieVan: Fiona AtighiDatum: 19 mei 2009Betreft: richtlijnen Social networks

Beste werkgroepleden,

Voor jullie liggen de richtlijnen hoe om te gaan met de rijksshuisstijl binnen social networks.In dit document is voor acht veel gebruikte social networks (YouTube, LinkedIn, Facebook, MySpace, Ning, Twitter, Chi.mp en Hyves) beschreven wat aan vormgeving kan worden aangepast en hoe de rijksshuisstijl hierop wordt toegepast.

De huisstijl voorbeelden van deze social networks dienen tevens als inspiratie voor andere social networks. Uiteraard denken we hier graag in mee.

We wensen jullie veel plezier en succes met het inrichten van social networks in de rijkshuisstijl.

Namens project 1 Logo,Fiona Atighi


Tijdens de analyse van de verschillende social networks is vastgesteld dat voor vrijwel alle networks geldt dat het toevoegen van een ‘eigen’ huisstijl maar op een aantal plaatsen mogelijk is.

In elk network kan een logo afbeelding worden geplaatst, de tekst kan altijd bewerkt worden maar kleur kan slechts bij een aantal networks aangepast worden. Ook is er een klein aantal networks waar juist alles aangepast kan worden; door gebruik te maken van eigen CSS, is de pagina eenvoudig op te maken naar wens.

In deze richtlijnen wordt per social network aangegeven welke elementen wel en niet aangepast kunnen worden en hoe dat dan het meest eenvoudig kan worden gedaan.

Naast dit document worden logo afbeeldingen en CSS beschikbaar gesteld om het inrichten van social networks te faciliteren.

Introductie


LinkedIn is een social network dat gericht is op professionele netwerken.

Er zijn twee manieren om op LinkedIn kenbaar te zijn: ‘company’ of ‘group’

Een groepspagina kan door iedereen opgezet worden, ook kan iedereen hier lid van worden (soms is een goedkeuring nodig van de groupeigenaar). Een group kan over alles gaan en functioneert meer als een discussieplatform.

Een bedrijfspagina kan door een medewerker worden opgezet en laat de huidige en voormalige werknemers zien.

LinkedIn.com


In LinkedIn is er alleen de mogelijkheid om het logo toe te voegen. Andere elementen als kleur en typografie kunnen niet gewijzigd worden.

GroepspaginaEr kunnen twee formaten logo’s worden geplaatst die elk op verschillende pagina’s door de site heen getoond worden. De eerste is het zogenaamde ‘large logo’, dit is het primaire logo en staat hier in het geel aangegeven. Het tweede is een ‘small logo’ en staat hier in het rood. Beide logo’s zijn noodzakelijk om een grouppagina te kunnen vullen.

BedrijfspaginaHiervoor bestaat er maar één logo, het ‘company logo’, dit is iets groter dan de andere twee. Het company logo staat hier in het blauw aangegeven.

Specificaties

Referentie kleur Naamgeving Grootte Formaten Max File grootte Verkleining* Afsnijden Noodzakelijk

Group PaginaLarge logo 100px x 50px PNG/JPEG/GIF 100kb - nee ja

Small logo 60px x 30px PNG/JPEG/GIF 100kb - nee ja

Company PaginaCompany Logo 100px x 60px PNG/JPEG/GIF 100kb - nee nee


Op deze afbeeldingen zijn de lokaties van de logo’s te zien in de pagina’s. Het ‘small logo’ staat hierbij als een icoon in de topbalk op de volgende lokaties:

Afbeelding:1. Zodra een nog niet ingelogde bezoeker de group-

pagina bezoekt is er een login pagina te zien.2. Zodra een ingelogde bezoeker die nog geen lid is van

de grouppagina de pagina bezoekt.3. Zodra een ingelogd lid van de grouppagina de pagina

bezoekt.

Het ‘large logo’ is alleen te zien op de overzichtspagina bij een ingelogde gebruiker die nog geen lid van de grouppagina is.

Analyse (1/3)

1. LinkedIn login pagina, tijdens browsen kom je direct op een grouppagina aan

3. Grouppagina, lid

2. Grouppagina, geen lid


In lijstpagina’s zijn zowel het ‘small logo’ als het ‘large logo te zien. In de ‘my group’ pagina staat het ‘small logo’ en in de group zoekresultatenpagina staat het ‘large logo’.

Analyse (2/3)

1. My Group overzicht 2. Groups search result pagina


Bij een companypagina wordt de inhoud voornamelijk automatisch gegenereerd. Men zal wel eerst een companypagina moeten aanmaken en opzetten.Het ‘company logo’, hier te zien als een blauwe box, is niet verplicht om te plaatsen en is alleen zichtbaar op de homepagina. Zodra hier niets geplaatst is zal de gereserveerde ruimte worden weggelaten.

Andere social network sites hebben standaard afbeeldingen bij ontbrekende ‘company logos’, maar LinkedIn niet. Op pagina’s zoals zoekresulaten en profielpagina wordt er helemaal geen logo weergegeven.

Analyse (3/3)

1. Company pagina overzicht

2. Company search results pagina (Company logo is hier nooit zichtbaar) 3. Profiel pagina (Company logo is hier nooit zichtbaar)


In LinkedIn kan gebruik worden gemaakt van twee logoversies, small en large.

Omdat het complete logo onleesbaar wordt als dit wordt gebruikt, is er gekozen voor het plaatsen van alleen het beeldmerk.

In tegenstelling tot het logo ‘omgeving derden’ (met hanglijn waar het logo onder staat), wordt in dit geval gebruik gemaakt van wit vlak met het beeldmerk erop.

Voorbeeld

1. Voorbeeld LinkedIn pagina


Om de logo’s te implementeren op LinkedIn hoef je maar op één lokatie te zijn. Als eerste log je als user in om een nieuwe group aan te maken. Dit is te vinden in de linkerkolom, hier aangegeven met nummer 1.

In de My Group overzichtspagina kun je alle groepen zien waarvan je lid bent. Vervolgens klik je op ‘Create a Group’ (nummer 2) aan de rechterzijde van de pagina.

Nu verschijnt er een formulierpagina (afbeelding 4) waarin het ‘Large logo’ en het ‘Small logo’ geplaatst kunnen worden (nummer 4 en 5), ook moeten er de volgende gegevens worden ingevuld.

1. Groepsnaam2. Groepstype3. Samenvatting4. Volledige omschrijving5. Email van de groepsbezitter6. Goedkeuring (bevestiging geven dat je de Term of

Service gelezen hebt en hiermee akkoord bent).

Implementatie

1. My Groups overzicht

4. Create a group

2

1

2. Large Logo

3. Small logo

4

5

richtlijnen social networks: linkedin

Documents