F10 Mer CSS Dagens agenda
|
|
|
- Kjell Olofsson
- för 8 år sedan
- Visningar:
Transkript
1 F10 Mer CSS Dagens agenda Stila formulär CSS-genererat innehåll Mediatyper Utskrift Negativa marginaler Sprites Gridbaserade layouter Ramverk
2 Formulär <br />
3 Prydliga formulär #cform { width: 500px;} #cform label { width:140px; text-align:right; display:block; float:left; padding-right:10px; clear:left; } #cform input, #cform textarea, #cform select { width:300px; margin-bottom:20px; } #cform textarea { height:100px; } #cform.checkbox { width:auto; }
4 CSS-genererat innehåll Vi har möjlighet att lägga till innehåll till vårt HTML-dokument med CSS. (Obs! Hamnar inte i DOM) #mainnav li:after { content: " "; } #divtwo:before { content:""; height:5px; width:5px; background:red; } Stöds först från och med IE8 content: url(pin.png);
5 CSS-genererat innehåll
6 Media
7 Mediatyper <body> <head> <link rel="stylesheet" media="print" href="print.css" /> <title>våra produkter</title> </head> Stilmallen "print.css" kommer bara att laddas då dokumentet skrivs ut. Vi har bland andra tillgång till: all, handheld, print, projection, speech, tv, screen default
8 Flera mediatyper samtidigt <body> <head> <link rel="stylesheet" href="basic.css" /> Alla enheter <link rel="stylesheet" media="screen" href="screen.css" /> <link rel="stylesheet" media="print" href="print.css" /> </head> Vid utskrift kommer nu basic.css att användas tillsammans med print.css Användare vid en vanlig skärm kommer att få basic.css att användas tillsammans med screen.css?
9 @media-direktivet <body> <head> <link rel="stylesheet" href="basic.css" /> </head> p { color: red; } #content { float:left; print p { color:black; }
10 Tänk på vid utskrift #mainnav { display: none; }
11 Länkar och utskrift Hur göra med länkar vid print #content a:after { content: " (" attr(href) ")"; }
12 Marginaler margin:5px 10px 30px 10px; alternativt: margin-top:5px; margin-right:10px margin-bottom:30px; margin-left:10px;
13 Negativa marginaler margin-right:-10px; margin-bottom:-10px; margin-left:-10px; margin-top:-10px;
14 body Layout med CSS, del 2 div #top start sida 1 div #content div #container div #navigation div #wrapper Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed elementum mi quis ligula pretium sed rutrum tortor posuere. Vivamus aliquet velit a mauris vestibulum commodo. Etiam cursus suscipit lorem, vel mattis metus facilisis ac. Proin gravida lacinia aliquet. Mauris arcu sem, tempor id gravida quis, lacinia non mauris. Etiam ac ante ligula, a tincidunt odio. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Praesent tristique euismod ipsum, mattis venenatis odio condimentum ac. div #sidebar div #footer
15 Layouter med CSS en bra grund
16 Exempel på klassiska layouter
17 Negativa marginaler Problem: ningen i HTMLkoden Lösning: <div id="wrapper"> <div id="content"> <p> </p> </div> </div> + negativa marginaler
18 Lösningen 1 float:left width:150px #wrapper width:100% float:left Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris
19 Lösningen 2 float:left width:150px margin-right:-150px #wrapper width:100% float:left Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris
20 Lösningen #wrapper width:100% float:left 3 float:left width:150px margin-right:-150px Pellentesque habitant morbi tristique senectus et netus et malesuada margin-left:150px; fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris
21 Lösningen #wrapper width:100% float:left 4 float:left width:150px margin-right:-150px Pellentesque habitant morbi tristique senectus et netus et malesuada margin-left:150px; fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris width:160px; float:right;
22 Lösningen #wrapper width:100% float:left 5 float:left width:150px margin-right:-150px Pellentesque habitant morbi tristique senectus et margin-left:150px; netus et malesuada fames ac margin-right:160px; turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris width:160px; float:right;
23 Lösningen #wrapper width:100% float:left margin-right:-180px 6 float:left width:150px margin-right:-150px Pellentesque habitant morbi tristique senectus et margin-left:150px; netus et malesuada fames ac margin-right:160px; turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris width:160px; float:right;
24 Lösningen 7 Navigation Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris Sidebar Se demo #7
25 Lösningen 7 Navigation Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris Sidebar Se demo #7
26 min/max width/height min-width max-width egenskaper min-width min-height max-height min-height #container { max-width: 1480px; min-width: 960px; } Stöds först från och med IE7
27 Sprites
28 CSS Sprites
29 CSS Sprites socialsprite.png #fbicon #fbicon:hover Se demo
30 CSS Sprites Fördelar Minskad totalstorlek på bilder Färre HTTP-anrop till servern Färre HTTP-anrop från klienten Vi riskerar inte flickering Nackdelar Ovana utvecklare riskerar att lägga bilder som hör hemma i HTML-koden som CSS Sprites. Jobbigare att underhålla stora CSS Sprites Kan bli jobbigare CSS att koda.
31 Gridbaserade layouter Bygger på att man försöker arbeta med kolumner i multipler om 3 eller 4. Fokuserar på kolumner, men rader kan användas i viss utsträckning Ger ett proffsigare intryck och ofta per automatik en snyggare och behagligare sida att titta på. Bygger på kolumner med marginaler.
32 Gridbaserade layouter
33 Ramverk Fördelar Nackdelar Ökad produktivitet Du undviker vanliga misstag Du arbetar in en standard för namngivning Förenklar samarbete Du slipper tänka på webbläsarkompabilitet Du får ren och välstrukturerad kod Tar tid att lära sig Riskerar att ärva fel och buggar Du mister genuin kunskap om CSS Källkod som innehåller mycket onödig kod Du riskerar att fastna i gamla hjulspår Källa:
Rubriktexten. Tilläggsrubrik. Upphovsperson Avdelning 2012
Rubriktexten Tilläggsrubrik Ett citat eller en kort text tagen ur innehållet i broschyren. Texten bör väcka intresse och locka till att läsa broschyren. Texten behöver inte fylla hela det gula fältet.
En mötesplats i centrum
Finlands svenska biblioteksförenings medlemstidning Nr 1/2011 En mötesplats i centrum EAHIL INTERNET LIBRARIAN INTERNATIONAL ISSOME s turpis vel urna luctus dictum. Morbi non libero mauris, vehicula facilisis
Inbjudan till professor Nome Neskens installation
Inbjudan till professor Nome Neskens installation Den 3 februari 2012 kl 18, i Akademisalen, Strandgatan 2, Vasa. www.abo.fi Med anledning av att professor i samhällsvetenskap, med inriktningen rural
Frågan om typsnitt för HT sönderfaller
Typsnitt för Heraldisk Tidsskrift Frågan om typsnitt för HT sönderfaller i två delar: dels omslag, dels inlaga. Val av typsnitt för omslagets styrs av att den grundläggande utformningen av framsidan skall
Grafisk manual. En grafisk guide till vår identitet.
Grafisk manual En grafisk guide till vår identitet www.tstgruppen.se Grafisk manual Innehåll Logotyp 3 Logotyp / Alternativ... 3 Avstånd / placering... 4 Ej tillåten användning... 5 typografi 6 Vår Typografi...
Vår grafiska profil. Antagen av direktionen
Vår grafiska profil Antagen av direktionen 2016-12-16 En viktig del av vår profil är den grafiska. Vår profil ska hjälpa våra kunder att identifiera oss som avsändare och helst minnas oss på ett positivt
kontorsmaterial/visitkort
kontorsmaterial/visitkort Det är viktigt att allt som syns utåt har en enhetlig profil, och här spelar kontorsmaterialet en viktig roll. Med kontorsmaterial menas visitkort, kontaktkort, meddelandeblock,
Välkomna till SJÖLOG 2017! Denna blankett är till för er som skall medverka på SJÖLOG 2017 och som skall presenteras i dess katalog.
Välkomna till SJÖLOG 2017! Denna blankett är till för er som skall medverka på SJÖLOG 2017 och som skall presenteras i dess katalog. Jättekul att ni skall medverka på SJÖLOG 2017! Nu börjar det bli dags
GRAFISK MANUAL Visuell identitet, logotyp och riktlinjer NOVEMBER 2013
GRAFISK MANUAL Visuell identitet, logotyp och riktlinjer NOVEMBER 2013 2 INNEHÅLL Innehållsförteckning INLEDNING... 3 LOGOTYP... 4 Versioner... 4 Användning... 5 Frizon... 5 SYMBOLEN... 6 TYPOGRAFI...
Detta är en dokumentmall för examensarbeten. Dokumentmallen har följande egenskaper:
Detta är en dokumentmall för examensarbeten. Dokumentmallen har följande egenskaper: teckensnittet Times New Roman används genomgående. bröd har storlek 12 punkter och 1,15 radavstånd. i tabellen har storlek
Regular expressions. "regexps" "grep" Jan Erik Moström,
Regular expressions "regexps" "grep" Reguljära uttryck Relativt vanligt att vi vill manipulera eller söka i text Text är inte alltid strukturerad, exempel emailadresser i ett email Definition av mönster
Manual Manual 1 Senaste uppdatering: 2015/03/26 Olsson & Gerthel
Manual Manual 1 Senaste uppdatering: 2015/03/26 Olsson & Gerthel Innehållsförteckning Personalrabatt... 1 Test2... 2 Test... 3 IT... 4 Servern... 5 Nätverket... 7 Personalrabatt Alla som arbetar här har
Årsräkning/Sluträkning Period:
Årsräkning/Sluträkning Period: 2012-01-01-2012-12-31 Överförmyndarenheten Spårvägen 22 12345 Överby X Huvudman Underårig Namn Telefon Personnummer Evald Karlsson 390205-1234 Gatuadress Postnummer Postadress
Utvärdering av Turistbyrå
23/09 2016 09:39:57 Allmänt Enkätens namn Utvärdering av Turistbyrå Upphovsman Richard Žižka Enkäts språk Svenska Enkätens URL http://dev.survio.com/survey/d/u3x3a9g1t0i9u5l9h Första svaret 23/09 2016
Grafisk manual för Göteborgs rättighetscenter. Regler och ramar för användande av logotyp, färger, typsnitt m.m både inom webb och tryck.
Grafisk manual för Regler och ramar för användande av logotyp, färger, typsnitt m.m både inom webb och tryck. 1 Innehåll Sida 3 4 Sammanfattning Sida 5 Färger Sida 6 8 Logotyp Sida 9 Bildspråk Sida 10
Grafisk Profil. Northai
Grafisk Profil Northai Förord Vi har skapat en grafisk profil för Northai som enligt oss speglar företaget på bästa möjliga sätt. Profilen attraherar med dess svenska design tillsammans med de kinesisk
GRÄNSÄLVSGYMNASIET. Samhällskunskap 1b. Vårterminen Baksidan av media. En studie om bullar och bakverk i tidningen.
GRÄNSÄLVSGYMNASIET Samhällskunskap 1b Vårterminen 2016 Baksidan av media En studie om bullar och bakverk i tidningen Ram Streamingsson Innehållsförteckning Inledning... 1 Syfte och frågeställningar 1 Metod
brandbook blågrön innovation
brandbook blågrön innovation blågrön innovation blue green innovations Grafisk profil för Blågrön Innovation (Marint Centrum) joar_l_j@hotmail.com Joar Lisberg Jakobsson 2011 Namnet Blågrön Innovation
Titel. kurs uppgift. Författare A & Författare B cid@student.chalmers.se
Titel kurs uppgift Författare A & Författare B cid@student.chalmers.se Fysik, Göteborgs Universitet Göteborg, 16 november 2015 Abstract Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut purus
Årsräkning/Sluträkning Period: 2013-01-01-2013-12-17
Årsräkning/Sluträkning Period: 2013-01-01-2013-12-17 Överförmyndarenheten Myndighetsvägen 13B 12345 Kungshamn X Huvudman Underårig Namn Telefon Personnummer Astrid Axelsson 0523 71234 600101-1234 Gatuadress
ÄDELFORS FOLKHÖGSKOLA GRAFISK MANUAL. Ädelfors Folkhögskolas nya grafiska manual gäller fr.o.m. den 1 januari 2015
ÄDELFORS FOLKHÖGSKOLA GRAFISK MANUAL Ädelfors Folkhögskolas nya grafiska manual gäller fr.o.m. den 1 januari 2015 INNEHÅLLSFÖRTECKNING FÖRORD Den grafiska manualen 03 Våra kärnvärden 04 LOGOTYP Vår logotyp
Personas och scenarios i webbutveckling - möjligheter och fallgropar. Rósa Guðjónsdóttir - PinkPuffin
Personas och scenarios i webbutveckling - möjligheter och fallgropar Rósa Guðjónsdóttir - PinkPuffin Tema Vad är personas och scenarios? Hur skapar man personas och scenarios? Hur använder man personas
Profilmanual Version 1.0. 2003-12-03
Profilmanual Version 1.0. 2003-12-03 Innehåll Förord 3 Ett varumärke och en logotyp 4 Vår logotyp 5 Logotypens uppbyggnad 6 Logotypens reproduktioner 7 Logotypens fria yta 8 Logotypens storlekar 9 Internationell
Innehåll. Inledning... 3 Typsnitt & färg... 4 Logotyp... 5 Visitkort... 6 Brevpapper... 7 Kuvert... 8 Produkter... 9 Hemsida... 10
Grafisk manual Innehåll Inledning... 3 Typsnitt & färg... 4 Logotyp... 5 Visitkort... 6 Brevpapper... 7 Kuvert... 8 Produkter... 9 Hemsida... 10 2 Inledning Företaget Lorem ipsum dolor sit amet, consectetur
VISUELL IDENTITET FÖR TELTEK
VISUELL IDENTITET FÖR TELTEK En grafisk profil är en viktig byggsten i skapandet av ett starkt varumärke och syftar till att skapa en enhetlig visuell identitet för Teltek som är enkel att känna igen för
Innehåll. 3. Utskrift under arbetets gång...11
Innehåll 1. Om GNS-mallen...1 1.1 Om mallen...1 1.2 Viktiga skillnader...2 1.3 Att arbeta med formatmallar...2 1.3.1 Applicera formatmallar...4 1.3.2 Radera formatering...4 2. Exempel på formatmallar...5
Strategisk informationsförsörjning
Strategisk informationsförsörjning 2015-02-25 Välkommen till en eftermiddag kring begreppet Strategisk informationsförsörjning, eller earkiv som många nog menar att det ska handla om. När det gäller digital
GRAFISK MANUAL LATHUND 1.0 24.10.2013
GRAFISK MANUAL LATHUND 1.0 24.10.2013 INNEHÅLL NYCKELKOMPONENTER 5 LOGOTYP 6 TYPSNITT 16 TYPOGRAFI 18 FÄRGER 22 ANNONSER 27 AFFISCHER 29 Manualen är framtagen av Andrzej Olas PROFORMA HB 2013 2 Välkommen
Grafisk manual 2010/2011 1
Grafisk manual 2010/2011 1 Förord Vi inom Ung Företagsamhet arbetar för fler företagsamma människor och fler företag i Sverige. Vi gör det genom utbildningskoncept i skolan. Var och en inom Ung Företagsamhet
Välkomna! till e-butik.se
Välkomna! till e-butik.se Butiken - Butiken - Admin - Arbeta i butiken - Utseende - Viktigt att tänka på - Tips & Idéer Butiken Varukorgen längst ner 1/4 Butiken Varukorgen högst upp 2/4 Butiken Vänstermenyn
LOGOTYP GO WITH THE FLOW
DESIGNBOK JUNI 2014 LOGOTYP GO WITH THE FLOW + = SÅ HÄR ANVÄNDS LOGOTYPEN Logotypens frizon, 8 mm. Logotypen används endast mot vit bakgrund. PROFILFÄRGER Mogen stark och mustig kallar vi FAIs färgskala.
Läs Mig Först Med fak
Läs Mig Först Med fak Denna fil innehåller några förklaringar till mallarna för Spikblad, Titelblad (Inlaga) samt Pärm. Informationen ges som pratbubblor och markeringar på bilder av den korrekta layouten
Logotyp. Så här kan pilen användas i en punktlist. Frizon för logotyp. Minsta tillåtna bredd är 15 mm
Minimanual 2015 Logotyp Logotypen placeras vanligtvis högerställd i nederkant som avsändare till det huvudsakliga budskapet, med en bredd som aldrig överstiger 41 mm (gäller ytorna A6-A3). Överst till
Denna fil innehåller några förklaringar till mallarna för Spikblad, Titelblad (Inlaga) samt Pärm.
Läs Mig Först Spikblad.. sid 2-3 Titelblad.. sid 4-5 Pärm.. sid 6 Övrigt. Sid 7 Denna fil innehåller några förklaringar till mallarna för Spikblad, Titelblad (Inlaga) samt Pärm. I zip-filen som innehåller
KAMPANJPLATS XX Projektplan
2007-03-01 1 (16) Projektplan Av: Emil Blomqvist 2007-03-01 2 (16) Innehåll 1 Projektidé och mål... 3 1.1 Bakgrund och projektidé... 3 1.2 Projektmål... 3 1.3 Avgränsningar... 3 2 Leverans och överlämning...
ROUND TABLE 117 LINKÖPING-FILBYTER
ROUND TABLE 117 LINKÖPING-FILBYTER Round Table 117 Linköping-Filbyter grafisk profil 2016. Ord och form av Alexander Åkerberg. Fotografi av Oskar Lüren. I Round Table möter du gamla vänner för första gången
Grafisk profil. Rapporter. uppdaterad
Grafisk profil Rapporter uppdaterad 2010-02-11 1 Innehåll Mått och storlekar inlaga S5... 3 Rapportformat S5... 3 Typsnittsformat... 3 Satsyta, mått... 4 Webbrapporter A4... 8 Rapportformat A4... 8 Typsnittsformat...
F02 En första sida. Dagens agenda
F02 En första sida Dagens agenda doctype taggar, element, attribut, värden teckenkodning HTML/XHTML Indentering Block/inline-element Struktur Se demo #2
F03 Stilmallar. Föreläsning 3, HT2014 Stilmallar. Kurser: Webbteknisk introduktion 1IK415. Johan Leitet
Föreläsning 3, HT2014 Stilmallar F03 Stilmallar Kurser: Webbteknisk introduktion 1IK415 Johan Leitet F03 Stilmallar Dagens agenda CSS, Stilmallar Lokala, interna, externa Mediatyper Selektorer - Taggselektorer
Wireframes Arla - Naturens egen sportdryck Christoffer Du Rietz GreatWorks
Wireframes Arla - Naturens egen sportdryck Christoffer Du Rietz GreatWorks Page 2 Startsida... Navigering inom subsiten. Länkar till nya sidor inom substrukturen. Få 25% på träningskläder! Någon i SOK/
REGLER FÖR ANVÄNDNING AV LOGOTYPER, DEKORFÄRGER OCH TYPSNITT
REGLER FÖR ANVÄNDNING AV LOGOTYPER, DEKORFÄRGER OCH TYPSNITT 1 2008 Flemingsberg är ett varumärke Ett varumärke att vara stolta över Flemingsberg är ett varumärke. I stort sett allt som påverkar ett eller
Innehåll. 3. Utskrift under arbetets gång...11
Innehåll 1. Om GNS-mallen...1 1.1 Om mallen...1 1.2 Viktiga skillnader...1 1.3 Att arbeta med formatmallar... 1.3.1 Applicera formatmallar...3 1.3.2 Radera formatering...4 2. Exempel på formatmallar...5
Godkänd av stadsstyrelsen xx.xx.2010
1 s grafiska anvisningar Godkänd av stadsstyrelsen xx.xx.2010 2 Innehåll Logons och den visuella profilens planering och genomförande: Aptual Oy www.aptual.fi Innehåll Logo Vapen Färgsättning Brevmall
F13 HTML5 Dagens agenda
F13 HTML5 Dagens agenda HTML5 Struktur Outline Nya element APIr Microdata/RDF/Microformats WHAT Working Group? Initiativ, 2004, startat av Apple, Mozilla och Opera WHATWG adapterades 2007 av W3C och rekommendationen
Visuell identitet garant
Visuell identitet garant sveriges radio VER 1.3 8 1. Logotypen Logotypen består av ett ordmärke där bokstäverna S och R skapar ett bokstavsmärke. Ordmärke och bokstavsmärke används alltid tillsammans och
GRAFISK PROFILMANUAL
GRAFISK PROFILMANUAL GRAFISK PROFILMANUAL Allt arbete som utförs i Gislaveds kommuns namn har i grunden ett och samma syfte att göra livet lättare för alla som bor och verkar i vår kommun. Med detta i
Visuell identitet P4. sveriges radio VER 1.3 104
Visuell identitet P4 sveriges radio VER 1.3 104 19. P4 / Verktygslåda Verktygslådan för P4 lyfter fram guidens breda, nyfikna och folkliga karaktär. Verktygslådan består av P1:s logotyp i svart, vitt eller
Färgkodning: Turism & Evenemang. Näringsliv. Kommun & Samhälle. Nya Gällivare
GRAFISK MANUAL Färgkodning: För att få en tydlig, visuell indelning av Gällivares olika verksamhetsben jobbar Gällivare med färgkodning. Nedan visas de olika färgerna med tillhörande värden i olika färgrymder.
F02 HTML. Föreläsning 2, HT2013 HTML. Kurser: Klientbaserad Webbutveckling 1DV435. Johan Leitet
Föreläsning 2, HT2013 HTML F02 HTML Kurser: Klientbaserad Webbutveckling 1DV435 Johan Leitet F02 HTML Dagens agenda doctype taggar, element, attribut, värden teckenkodning HTML/XHTML
Riktlinjer och inspiration till dig som gör annonser
Riktlinjer och inspiration till dig som gör annonser Kommunal har tagit fram exempelannonser i stående och liggandeformat. Det finns exempel med röd- och vit utfallande bakgrund. Vårt förstahandsval är
Innehållsförteckning. Innehåll
Javascript övningar Innehåll Detta dokument innehåller flera stycken olika javascript-övningar i olika svårighetsnivåer. Vissa är utförligare beskrivna än andra. Du kan själv välja vilka du vill testa
Martinsons Grafisk manual. Grafisk Manual
Grafisk Manual 1 INNEHÅLLSFÖRTECKNING Martinsons visuella identitet...3 Logotyp...4 Dekorelement...8 Typografi...9 Färger...10 Korrespondensmaterial...11 Pärm...17 Mapp...18 Trycksaker...19 Annonser...24
Dagstidningsannonsering med logga mindre än 42 mm. Dagstidningsannonsering med logga större än A5 samt magasin. Vid svartvita annonser.
LOGOTYP I rekryteringsmaterial 2011/2012/2013 skall etikettlogotypen (labeln) användas. Vit logotyp mot röd botten får endast användas när slutformatet är större än A5 (105 mm bredd), dvs när logotypen
Grafiskt profilprogram 1. Grafiskt profilprogram
Grafiskt profilprogram 1 Grafiskt profilprogram 2015 2 Grafiskt profilprogram Grafiskt profilprogram 3 Innehållsförteckning 4. Logotyp - De olika varianterna av logotypen och hur den används. 6. Typografi
Profilmanual. Övergripande regler och riktlinjer Reviderad: 2011-06-30
Profilmanual Övergripande regler och riktlinjer Reviderad: 2011-06-30 Innehåll Inledning 3 Grafiska grunder 4 Logotyp 5 Färger 6 Teckensnitt Neo Sans 7 Teckensnitt Calibri 8 Teckensnitt Arial 9 Dekor 10
Sara Berlekom Metallvägen 30 719 40 Garphyttan 070-2430821 sara@xoda.se. Webbplats: www.xoda.se www.berlekom.se. Portfolio
Sara Berlekom Metallvägen 30 719 40 Garphyttan 070-2430821 sara@xoda.se Webbplats: www.xoda.se www.berlekom.se Portfolio Utställnings affisch Sara Berlekom Målningar, teckningar och foton Hantverksboden
Alumni International site Kontakta oss A - Ö
Welcome! LOREM IPSUM DOLOR SIT AMET, CONSECTETUR ADIPISCING ELIT. FUSCE EU CONVALLIS DUI. MAURIS RISUS TELLUS, MATTIS AC POSUERE QUIS, PULVINAR AUCTOR TURPIS. Promo 8 promo 23 VEL EUM IURE REPREHENDERIT
GRAFISK M A N U A L SVAB
GRAFISK MANUAL SVAB Ver. 1 080801 Vår grafiska profil... 4 Logotyp... 6 Logotyp - Frizon... 8 Logotyp - Korrekt användande... 10 Logotyp - Felaktigt användande... 12 Färger... 14 Typografi... 18 Layout...
Kooperativet OLJA Oberoende Liv Jönköping Assistans
Grafisk manual 2014 Kooperativet OLJA Oberoende Liv Jönköping Assistans En gemensam bild och upplevelse Våra medlemmar och anställda skapar en bild av oss huvudsakligen genom vårt arbete, men också genom
GRAFISK PROFIL Innehåll
Grafisk profil Innehåll Logotyp...3 Färg...4 Typsnitt...5 Korrespondens...6 Visitkort...10 Butik Återbruk...12 2 Logotyp Ursprungsformat, liggande Stående Nätverk Sverige-Lettlands logotyp består av en
En oas för trädgårds- och inredningsintresserade som söker efter något fint eller bara vill få inspiration och avkoppling.
VÅR PERSONAL Läs om vår engagerade personal! Vi har blommor till speciella tillfällen, krukväxter och trädgårdsväxter Vi inspirerar dig att inreda ditt hus, din trädgård och skapa hantverk själv Vi avlastar
Koncept och (lite) gränssnittsdesign Ove Jansson Baserad på tidigare föreläsningar av Jody Foo och Mattias Arvola
Koncept och (lite) gränssnittsdesign Ove Jansson Baserad på tidigare föreläsningar av Jody Foo och Mattias Arvola Avstämning www.menti.com -> 89 07 2 Anonyma frågor www.menti.com -> 88 66 26 Vad som ska
Grafisk profil RIKTLINJER OCH STÖD I VÅRT KOMMUNIKATIONSARBETE. osthammar.se
Grafisk profil RIKTLINJER OCH STÖD I VÅRT KOMMUNIKATIONSARBETE Tillsammans förmedlar vi bilden av Östhammars kommun Vårt varumärke Den bild vi förmedlar av oss själva är betydelsefull idag kanske mer än
Designprocessen Användarcentrerad design
Syfte Förstå syftet och nyttan med användarcentrerad design Förstå processen Veta vilka metoder som används för att uppnå hög användbarhet Designprocessen Användarcentrerad design Rósa Guðjónsdóttir Vem
Grafisk manual för Karlskoga kommun
Grafisk manual för Karlskoga kommun Grafisk manual för Grafisk Karlskoga manual kommun för Karlskoga Innehåll kommun 2 Därför har vi en grafisk profil Karlskoga kommuns grafiska profil är en del av vårt
SALTSTÄNK. Nummer: 6 Icke RS/TS-kontrollerat medlemsorgan för Göteborgs Sjöscoutkår Årgång: 61
Utgivare: Krabban Krönikör: Åsa-Micaela SALTSTÄNK Nummer: 6 Icke RS/TS-kontrollerat medlemsorgan för Göteborgs Sjöscoutkår Årgång: 61 PINGSLÄGER 2011 Såhär glad är man när man seglar till Nya Elfsborg
1. Om GNS-mallen. 1.1 Om mallen. 1.2 Viktiga skillnader
Innehållsförteckning 1. Om GNS-mallen...1 1.1 Om mallen...1 1.2 Viktiga skillnader...1 1.3 Om formatmallar...2 1.4 Att arbeta med formatmallar...2 1.4.1 Lista formatmallar...2 1.4.2 Applicera formatmallar...3
Del 2 Grafisk profil
Del 2 Grafisk profil 02.1 Logotypen Skåne Nordost logotyp består av den nya symbolen och texten Skåne Nordost. Logotypen ska stå som avsändare för alla kommunikation, internt såväl som extern. Nordost
Korpen. Grafisk manual. Version 3 2012.08.08. Korpen 08.08.12
Korpen Grafisk manual Version 3 2012.08.08 Innehåll 1 Introduktion 1 Introduktion 1 2. Logotype 3 2.1 Översikt 4 2.2 Färger 5 2.3 Placering 6 2.4 Kontrast 7 2.5 Friyta 7 2.6 Format 8 2.7 Andra Användare
Innehållsförteckning. Energiservice Skellefteå Grundläggande grafisk manual
Grafisk manual Innehållsförteckning Visuell identitet... 3 Logotyp... 4 Typografi... 7 Färger... 8 Ikoner... 9 Bildmanér... 11 Mönster... 12 Digitala presentationer...13 Kuvert...14 Brevmall...15 Signatur
Visuell identitet P2. sveriges radio VER 1.3 56
Visuell identitet P2 sveriges radio VER 1.3 56 9. P2 / Verktygslåda Verktygslådan för P2 lyfter fram guidens klassiska och stämningsfulla karaktär. Verktygslådan består av P2:s logotyp i svart, vitt eller
Föreläsning 06, HT2013 HTML5 F06 HTML5. Johan Leitet
Föreläsning 06, HT2013 HTML5 F06 HTML5 Johan Leitet F06 HTML5 Dagens agenda HTML5 Struktur Outline Nya element APIr Microdata/RDF/Microformats WHAT Working Group? Web Hypertext Application Technology Initiativ,
Modern Demokratisk Trygg
Svenska lantbruksproducenternas centralförbund SLC r.f. GRAFISK PROFIL 2015 Modern Demokratisk Trygg 2 3 Använd denna bok som en inspirationskälla. Agency Leroy 2015 4 5 6 7 8 9 SLC är en organisation
BRA. Nytt flygbolag, nya möjligheter. Destinationer. Resenären. Fakta. Mediakanaler. Redaktionell produktion & Projektledning.
Nytt flygbolag, nya möjligheter Sverige har fått ett nytt inrikesflygbolag med mer än 2,2 miljoner passagerare om året. BRA Braathens Regional Airlines är en saanslagning av Malmö Aviation och Sverigeflyg.
Vår grafiska profil en viktig del i hur vi uppfattas.
1 2 Vår grafiska profil en viktig del i hur vi uppfattas. Vår framtoning är egentligen inte bara en grafisk fråga. Det är främst resultatet av det dagliga och konsekventa arbete som vi alla lägger ned
SÅ HÄR SPRIDER VI BILDEN AV HEMSLÖJDEN.
INLEDNING STARTSIDA Har du frågor eller funderingar rörande det här dokumentet? Per Björklund Kommunikatör M: 070-890 94 58 T: 08-54 54 94 58 E: per.bjorklund@hemslojden.org SÅ HÄR SPRIDER VI BILDEN AV
RIKSUTSTÄLLNINGARS BARN- & UNGDOMSSTRATEGI 2012-2014
RIKSUTSTÄLLNINGARS BARN- & UNGDOMSSTRATEGI 2012-2014 Print Visby 2011 INNEHÅLLSFÖRTECKNING 4. 5. 7. 10. Syfte Fokusområden Här beskrivs vilka områden som lorem isum dolor sit. In sed dolor viverra enim
VÄRDENS NYHETER MÖT LEENA. Kundtjänst hjälper dig, sid 8-9 Var med och påverka, sid 3 Så blir nya Telegrafen 12, sid 6-7 LÖVLUNDSVÄGEN SID 4-5
VÄRDENS NYHETER NYNÄSHAMNSBOSTÄDER NR 1 MAJ 2018 MÖT LEENA LÖVLUNDSVÄGEN SID 4-5 Kundtjänst hjälper dig, sid 8-9 Var med och påverka, sid 3 Så blir nya Telegrafen 12, sid 6-7 N 58 54 16.439 E 17 56 51.994
FoU primärvård Fyrbodal FoUU-centrum Fyrbodal Lathund för hur man skriver en rapport för en litteraturstudie
FoU primärvård Fyrbodal FoUU-centrum Fyrbodal Lathund för hur man skriver en rapport för en litteraturstudie Omslag Mallens uppgifter och loggor ska finnas. Rapportnummer lämnas av FoUkoordinator. Titelsidans
SVERIGES RADIO Manual och verktygslåda 1.0
SVERIGES RADIO Manual och verktygslåda 1.0 Välkommen! Varje framgångsrik verksamhet representeras av en tydlig symbol, en logotyp. Likaså kännetecknas varje framgångsrik verksamhet av att den lyckats förmedla
SKL Kommentus. Wireframes - Koncernen. SKL_wireframes_2.0
Wireframes - Koncernen Version: SKL_wireframes_ Innehållsförteckning Navigation - Sidhuvud Navigation - Megameny Navigation - Sidfot Startsida Våra produkter Vår butik Böcker Blankett - Landning Blanketter
Bildspel (Fokus på produkter) Nyheter/Kampanjer Nyheter/Kampanjer Nyheter/Kampanjer
Bildspel (Fokus på produkter) Nyheter/Kampanjer Nyheter/Kampanjer Nyheter/Kampanjer Handla komponeneter direkt! Inspirationsbilder! Våra produkter Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Grafisk manual Förbundet Sveriges Arbetsterapeuter. För förtroendevalda
Grafisk manual Förbundet Sveriges Arbetsterapeuter För förtroendevalda Grafisk manual, för förtroendevalda, december 2011 Förbundet Sveriges Arbetsterapeuter Layout: Malin Stedt Gustavsson och Gelinda
Valutec Grafisk manual
1 INNEHÅLLSFÖRTECKNING Logotyp...3 Färger...5 Typografi...6 Brevpapper...7 Mailsignatur...8 Fax...9 Kuvert...10 Powerpoint... 11 Varseljackor...12 2 LOGOTYP Grundversioner Version 1 är den liggande logotypen
Anvisningar för litteraturstudie kurs Vetenskapligt Förhållningssätt ST-arbete
Anvisningar för litteraturstudie kurs Vetenskapligt Förhållningssätt ST-arbete 1 Innehållsförteckning Anvisningar för litteraturstudie, ST-arbete... 1 Omslag... 1 Sammanfattning... 1 Introduktion... 1
Yrkeshögskolan Novias grafiska manual för Aboa Mare
Yrkeshögskolan Novias grafiska manual för Aboa Mare 2 Innehåll Förord... 2 Logotyp... 3 Logotypens användning... 4 5 Användning av DNV-certifieringsmärke... 6 Färger... 7 Typografi... 8 Annonser... 9 10
Vetenskapligt Förhållningssätt
Flik 5 Vetenskapligt Förhållningssätt Schema för kursen i Vetenskapligt förhållningssätt år 2017 Dag 5 2017-02-09 Tid Moment Lärare 09:00-10:00 Föreläsning EBM, SBU och Cochrane. Minna Johansson 10:00-11:00
SAMTAL MED OCH OM BOKSTAVEN Att ta fram ett teckensnitt
SAMTAL MED OCH OM BOKSTAVEN Att ta fram ett teckensnitt Student: André Falk Lärosäte: hdk, Göteborgs universitet Utgivningsort: Göteborg Utgivningsdatum: Vårterminen 2008 Kurs och utbildningsprogram: Examensprojekt
Kocktävlingen Äkta Rök E-post kundtjanst@aktarok.se
Vår/sommar 2016 Kocktävlingen Äkta Rök E-post kundtjanst@aktarok.se Sveriges Äkta Rök kock 2015 Tisdagen den 5 maj 2015 gick startskottet för Sveriges Äkta Rök kock 2015 som är en kocktävling för professionella
Grafiska anvisningar. Evangelisk-lutherska kyrkan i Finland och dess församlingar EV.LUTH. KYRKAN I FINLAND
Grafiska anvisningar Evangelisk-lutherska kyrkan i Finland och dess församlingar EV.LUTH. KYRKAN I FINLAND 1 Innehåll 1. Inledning För vem, var och hur? 3 2. Kännetecken Kyrkans gemensamma kännetecken
Grafisk manual
Grafisk manual Innehåll Inledning... 3 Logotypen... 4 Placering och frizon... 5 Logotypens färger... 6 Kommunvapnets historia... 7 Typografi... 8 Grafiska element... 9 Budskapen... 10 Färgranden... 11
Utgivningsdatum: 2008-08 Utgivare: Falkenbergs kommun Produktion: www.buddy.se
Grafisk profil Utgivningsdatum: 2008-08 Utgivare: Falkenbergs kommun Produktion: www.buddy.se Den senaste versionen av den grafiska profilen finns på Falkenbergs webbplats, www.falkenberg.se, tillsammans
HEMSLÖJDEN /VISUELL IDENTITET. Har du frågor eller funderingar rörande den visuella identiteten?
a HEMSLÖJDEN INLEDNING STARTSIDA Har du frågor eller funderingar rörande den visuella identiteten? Per Björklund Kommunikatör M: 070-890 94 58 T: 08-54 54 94 58 HEMSLÖJDEN /VISUELL IDENTITET. Sida 1 av
SVERIGES RADIO Manual och verktygslåda 1.3
SVERIGES RADIO Manual och verktygslåda 1.3 Välkommen! Varje framgångsrik verksamhet representeras av en tydlig symbol, en logotyp. Likaså kännetecknas varje framgångsrik verksamhet av att den lyckats förmedla
Walking Dinner i Göteborg!
Walking Dinner i Göteborg! Walking Dinner Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis in pretium libero. Morbi mollis semper purus nec vestibulum. In venenatis commodo est volutpat molestie.
GRAFISKA ANVISNINGAR BUSSPOOLEN - VÄSTERBOTTEN
GRAFISKA ANVISNINGAR BUSSPOOLEN - VÄSTERBOTTEN Logotype och symbol Färger Pantone 485 C 100% svart 70% svart 50% svart 40% svart Pantone 485 C 100% svart 70% svart 70% svart 50% svart 100% svart 40% svart
Grafisk manual
Grafisk manual 2018-04-30 Innehåll Inledning... 3 Logotypen... 4 Placering och frizon... 5 Logotypens färger... 6 Kommunvapnets historia... 7 Typografi... 8 Grafiska element... 9 Budskapen... 10 Färgranden...
EN SAMMANSTÄLLNING AV Grafiska Riktlinjer FÖR GÖTENE KOMMUN
EN SAMMANSTÄLLNING AV Grafiska Riktlinjer FÖR GÖTENE KOMMUN 2009 Nu blir vi en enhetlig kommun! För att Götene kommun såväl internt som externt skall uppfattas som en enhet och vara lätt att känna igen,
[Egen logotyp] Stilmall & presentation av grafisk profil
![[Egen logotyp] Stilmall & presentation av grafisk profil](/thumbs/33/15793700.jpg "[Egen logotyp] Stilmall & presentation av grafisk profil")
[Egen logotyp] Stilmall & presentation av grafisk profil CMYK 0 / 0 / 0 / 20 RGB 209 / 211 / 212 HEX D1D3D4 CMYK 0 / 58 / 100 / 0 RGB 246 / 133 / 31 HEX F6851F Logotypen är nutida; enkel och ren och kommunicerar
Grafisk Profil Manual
Grafisk Profil Manual » Innehåll 1 Inledning - Varför skall man ha en grafisk profil 2 Logotyp - Grundregler, riktlinjer & tillämpning 3 Profilfärger - Färgkoder & tillämpning 4 Typografi - Typsnitt för