Deprecated: Creation of dynamic property Savant3::$currentGuide is deprecated in /srv/vhosts/styleq.ugent.be/htdocs/WWW/lib/Savant3-3.0.1/Savant3.php on line 928

Deprecated: Creation of dynamic property Savant3::$languages is deprecated in /srv/vhosts/styleq.ugent.be/htdocs/WWW/lib/Savant3-3.0.1/Savant3.php on line 928

Deprecated: Creation of dynamic property Savant3::$language is deprecated in /srv/vhosts/styleq.ugent.be/htdocs/WWW/lib/Savant3-3.0.1/Savant3.php on line 928

Deprecated: Creation of dynamic property Savant3::$editableText is deprecated in /srv/vhosts/styleq.ugent.be/htdocs/WWW/lib/Savant3-3.0.1/Savant3.php on line 928

Deprecated: Creation of dynamic property Savant3::$editableH2 is deprecated in /srv/vhosts/styleq.ugent.be/htdocs/WWW/lib/Savant3-3.0.1/Savant3.php on line 928

Deprecated: Creation of dynamic property Savant3::$editableH3 is deprecated in /srv/vhosts/styleq.ugent.be/htdocs/WWW/lib/Savant3-3.0.1/Savant3.php on line 928

Deprecated: Creation of dynamic property Savant3::$styleGuideChapter is deprecated in /srv/vhosts/styleq.ugent.be/htdocs/WWW/lib/Savant3-3.0.1/Savant3.php on line 928

Deprecated: Creation of dynamic property Savant3::$availableMenus is deprecated in /srv/vhosts/styleq.ugent.be/htdocs/WWW/lib/Savant3-3.0.1/Savant3.php on line 928

Deprecated: Creation of dynamic property Savant3::$hideEditableBorders is deprecated in /srv/vhosts/styleq.ugent.be/htdocs/WWW/lib/Savant3-3.0.1/Savant3.php on line 928

Deprecated: Creation of dynamic property Savant3::$pageName is deprecated in /srv/vhosts/styleq.ugent.be/htdocs/WWW/lib/Savant3-3.0.1/Savant3.php on line 928

Deprecated: Creation of dynamic property Savant3::$content is deprecated in /srv/vhosts/styleq.ugent.be/htdocs/WWW/lib/Savant3-3.0.1/Savant3.php on line 928

Deprecated: Creation of dynamic property Savant3::$breadcrumbs is deprecated in /srv/vhosts/styleq.ugent.be/htdocs/WWW/lib/Savant3-3.0.1/Savant3.php on line 928

Deprecated: Creation of dynamic property Savant3::$javascriptFilesAdditional is deprecated in /srv/vhosts/styleq.ugent.be/htdocs/WWW/lib/Savant3-3.0.1/Savant3.php on line 928

Deprecated: Creation of dynamic property Savant3::$cssFilesAdditional is deprecated in /srv/vhosts/styleq.ugent.be/htdocs/WWW/lib/Savant3-3.0.1/Savant3.php on line 928

Deprecated: Creation of dynamic property Savant3::$activeMenu is deprecated in /srv/vhosts/styleq.ugent.be/htdocs/WWW/lib/Savant3-3.0.1/Savant3.php on line 928

Deprecated: Creation of dynamic property Savant3::$menu is deprecated in /srv/vhosts/styleq.ugent.be/htdocs/WWW/lib/Savant3-3.0.1/Savant3.php on line 928

Deprecated: Creation of dynamic property Savant3::$user is deprecated in /srv/vhosts/styleq.ugent.be/htdocs/WWW/lib/Savant3-3.0.1/Savant3.php on line 928
UGent style guide

Menu

Naar inhoud

Websites

Inloggen NL - EN

Deprecated: Creation of dynamic property Savant3::$chapter is deprecated in /srv/vhosts/styleq.ugent.be/htdocs/WWW/templates/websites/navigatie.tpl.php on line 12

Deprecated: Creation of dynamic property Savant3::$section is deprecated in /srv/vhosts/styleq.ugent.be/htdocs/WWW/templates/websites/navigatie.tpl.php on line 15

Deprecated: Creation of dynamic property Savant3::$styleGuideSections is deprecated in /srv/vhosts/styleq.ugent.be/htdocs/WWW/templates/websites/navigatie.tpl.php on line 18

2. Navigatie

In de header ziet de bezoeker op welke UGent-website hij zich bevindt. Header, broodkruimel en footer vormen samen de basislayout.

Navigeren doorheen de website gebeurt via elementen die zich in de header en footer bevinden.

Bekijk het sjabloon 'Basislayout' met de navigatie-elementen

Onderstaand zie je 4 voorbeelden van headers toegepast op bestaande websites.


Deprecated: Creation of dynamic property Savant3::$editableh3key is deprecated in /srv/vhosts/styleq.ugent.be/htdocs/WWW/templates/websites/navigatie.tpl.php on line 47

A) Basisvariant zonder titel

  • Logo linksboven: linkt altijd door naar homepagina www.ugent.be of www.ugent.be/en (naargelang de taal van je website)
  • In blauw vlak:
    • Zoekbox
    • Eventuele snellinks (vb. 'Voor medewerkers')
    • Taalkeuze (steeds voluit geschreven vb. 'In English')
  • Topnavigatie: 
    • Max. 6 items naast elkaar (op mobiele toestellen wordt dit een 'hamburger'-menu)
    • Doelgroepen: via uitklapmenu 'Info voor'

 

Bekijk het sjabloon 'Basislayout' met de navigatie-elementen

B) Variant met korte titel (vb: www.ugent.be/student)

  • Idem als Variant zonder titel
  • In blauw vlak:
    • Korte titel (max. 25 karakters): aanklikbaar met link naar de homepagina van je website
    • Eventuele relevante snellinks

 

Bekijk het sjabloon 'Homepagina centrale doelgroep'

C) Variant met lange titel (vb. www.ugent.be/di/laim)

Gebruik deze variant bijvoorbeeld voor vakgroep, onderzoeksgroep of labo.

  • Idem als Variant zonder titel
  • In blauw vlak:
    • Lange titel (max. 2 regels)
    • Terugklik naar 'Home Faculteit ...' en 'Home UGent'

De broodkruimel geeft het hiërarchische pad weer vanaf de homepage tot de pagina waar de gebruiker zich bevindt.

Broodkruimels zijn een aanvulling op de navigatie van je website: zij helpen de gebruiker om zich te oriënteren. De broodkruimel laat ook toe dat de gebruiker snel naar een hoger niveau springt.

Het broodkruimelpad helpt bovendien om beter te scoren in Google.

Richtlijnen

  • De broodkruimel begint steeds met Home
  • Alle onderdelen zijn aanklikbaar behalve het laatste item
  • De onderdelen worden gescheiden door het groter-dan-teken '>'

De footer onderaan de webpagina herhaalt de belangrijkste navigatie-items. We respecteren dezelfde volgorde als deze van de links in de topnavigatie.

A) Basisvariant

Generieke fat footer

  • 3 eerste hoofditems uit topnavigatie van je website met eronder de corresponderende sublinks
  • Sociale media iconen (mouse-over in originele kleur van het social mediakanaal)
  • Links voor Feedbackformulier - Disclaimer - Cookies - Toegankelijkheid - Aan-/afmelden
  • Copyright vermelden is aangewezen, maar niet verplicht. Vermeld 'Universiteit Gent' als auteursrechthebbende en het jaartal van eerste publicatie (vb. '© 2015 Universiteit Gent') of meerdere jaren als er nadien aanpassingen gebeuren (vb. '©2015-2017 Universiteit Gent').

B) Variant incl. facultaire icoon

Dit voorbeeld is relevant voor faculteiten, vakgroepen, onderzoeksgroepen of labo's die terugklik willen voorzien naar de homepagina van de (bovenliggende) faculteit.

Het facultaire icoon (zie 2.7 Faculteit iconen) komt erbij tussen de linklijsten en sociale media iconen. De inhoud van de linklijsten kan je zelf herprogrammeren naargelang je website.

Navigatie op lange detailpagina's met veel tussentitels. Elke link in de subnavigatie stemt overeen met een H2-titel op de pagina (zie 3.2 Typografie).

Dit navigatiemenu beweegt mee wanneer de gebruiker op en neer scrollt doorheen de pagina of wanneer hij een link in de subnavigatie aanklikt.

Zie template 7.4 Detailpagina met paginanavigatie

Naar boven