-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
238 lines (238 loc) · 19.3 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
<!DOCTYPE html>
<html lang="sv">
<head>
<meta name="keywords" content="Webbplats,Webbdesigner,Webbutvecklare,Webbprogrammerare,Robert Roos">
<meta name="author" content="Robert Roos">
<meta charset="utf-8">
<meta name="viewport" content="width:device-width, initial-scale=1.0" />
<title>Robert Roos - Frilansande Webbprogrammerare</title>
<link href="/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<link href='https://fonts.googleapis.com/css?family=Open+Sans:300,700%7C' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/StyleSheet.css">
<link rel="stylesheet" href="css/StyleSheet-Print.css">
<link rel="stylesheet" media="screen and (max-width:900px)" href="css/StyleSheet-Handheld.css" />
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-2147007-8']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link rel="apple-touch-icon" href="pics/touch-icon.png">
</head>
<body>
<div id="container">
<header>
<nav>
<ul id="menu">
<li><a class="ScrollSec1" href="#">Start</a></li>
<li><a class="ScrollSec2" href="#">Tjänster</a></li>
<li><a class="ScrollSec3" href="#">Referenser</a></li>
<li><a class="ScrollSec4" href="#">Om mig</a></li>
<li><a class="ScrollSec5" href="#">Kontakt</a></li>
</ul>
</nav>
<h1>Robert Roos</h1>
<h2>Frilansande webbprogrammerare</h2>
<div><a class="ScrollSec1" href="#"><img class="zoomImage" src="css/pics/Arrow-down-white.png" width="64" alt="Icon for scrolling down"></a></div>
</header>
<main>
<div class="articleFarm startSection">
<div id="bulbHolder">
<video id="bulbVideo" style="min-width: 100%; min-height: 100%; overflow: hidden; z-index: -999;" autoplay loop muted>
<source src="pics/bulb2.mp4" type="video/mp4">
</video>
<article class="videoArticle">
<div class="videoArticleOverlay">
<h1>Välkommen!</h1>
<section>
<p>Idag är din webbplats ofta ditt första möte med en en potentiell kund.
En professionell webbplats såväl <strong>stärker ditt företag och varumärke</strong>, som
öppnar nya möjligheter för kommunikation och försäljning.</p>
<p>Jag designar och bygger webbplatser och avancerade interaktiva webbapplikationer. För såväl privatpersoner som medelstora företag.</p>
<p>Vill du bygga en profil för att <strong>synas och lyckas på webben</strong>, eller <strong>söker du en ny medarbetare?</strong></p>
<p><strong>Då har du hittat rätt!</strong></p>
</section>
<div class="textCenter"><a class="ScrollSec2" href="#"><img class="zoomImage" src="css/pics/Arrow-down-white.png" width="64" alt="Icon for scrolling down"></a></div>
</div>
</article>
</div>
</div>
<div class="articleWhite webdevSection">
<article>
<h1>Tjänster</h1>
<section>
<aside class="noshow">
<div class="designImage"></div>
</aside>
<h3>Design</h3>
<p></p>
<p>Jag designar inbjudande, välstrukturerade och lättnavigerade <strong>webbplatser</strong>.</p>
<p>Webbplatser med <strong>responsiv design</strong>, vilket innebär att din webbplats fungerar lika bra i mobilen som på surfplattan och laptopen.</p>
<p><a id="showDesignDiv" href="#">Läs mer</a></p>
<div id="designDiv">
<p>Jag arbetar även utifrån såväl <a href="http://www.w3.org/Translations/WCAG20-sv/">W3:s rekommendationer</a> för tillgängligt webbinnehåll,
som användarrekommendationer och riktlinjer som är allmänt vedertagna bland professionella webbutvecklare.</p>
<p>Detta betyder för dig som kund att webbplatsen jag bygger åt dig är <strong>noggrant designad</strong> för att så många som möjligt, så enkelt som möjligt
skall kunna tillskansa sig den information de eftersöker.</p>
</div>
<h3>Funktionalitet</h3>
<p>En bra webbplats är precis som dig, <strong>mer än bara sitt vackra yttre!</strong></p>
<p>Jag utvecklar olika typer av system, allt från webbutiker till forum, bloggar och olika typer av administrationssytem. Helt enkelt applikationer som förenklar din vardag och ökar på din
produktivitet och effektivitet.</p>
<p>Som kund hos mig kan du känna dig säker på att få ett <strong>robust och pålitligt system</strong>.</p>
<h3>Söker du en ny kollega?</h3>
<p>Vad roligt! Då tror jag att min
<a href="http://se.linkedin.com/pub/robert-roos/66/b37/7a3" target="_blank">LinkedIn</a> följt av min <a href="http://www.github.com/rr222cy" target="_blank">Github</a> säkerligen är av
intresse! <!--<a href="files/Robert-Roos-CV.pdf" target="_blank">Här</a> finns även mitt CV som PDF.</p>-->
<div class="clear"></div>
</section>
<div class="textCenter"><a class="ScrollSec3" href="#"><img class="zoomImage" src="css/pics/Arrow-down.png" width="64" alt="Icon for scrolling down"></a></div>
</article>
</div>
<div class="articleGrey refSection">
<article>
<h1>Referenser</h1>
<section>
<div class="sectionBox floatRight">
<h3>Homesharp</h3>
<p>Homesharp är ett system för att koppla samman en rad olika hemautomatiseringsprylar och dess API:er till ett och samma API och GUI.</p>
<p>Utvecklades under ett projekt om 10 veckor vid Linnéuniversitetet med uppdragsgivare Cob Media.</p>
<p><strong>Tekniker:</strong> Node.js, Express, Jade, HTML5/CSS3, JavaScript/jQuery, MongoDB.</p>
<p><a href="https://github.com/HomeSharp" target="_blank">Besök Homesharp på Github</a></p>
</div>
<p style="text-align: center;">
<img src="pics/Laptop_Homesharp.png" width="620" alt="Skärmbild på Homesharp, denna bild visar en del av Quartz startsida.">
</p>
<hr />
<div class="sectionBox floatRight">
<h3>Mixtapeify</h3>
<p>Mixtapeify möjliggör backup och delning av Spotifyspellistor, hämtar information om låtar genom Spotifys API samt möjliggör direktuppspelning.</p>
<p>Utvecklades under ett projekt om 4 veckor vid Linnéuniversitetet.</p>
<p><strong>Tekniker:</strong> PHP5 (MVC), HTML5/CSS3, JavaScript/jQuery, MySQL.</p>
<p><a href="https://github.com/rr222cy/MySpotifyPlaylists" target="_blank">Besök Mixtapeify på Github</a></p>
</div>
<p style="text-align: center;">
<img src="pics/Laptop_Mixtapeify.png" width="620" alt="Skärmbild på Mixtapeify, denna bild visar en del av Mixtapeifys startsida.">
</p>
<hr />
<div class="sectionBox floatRight">
<h3>Podnow</h3>
<p>Podnow är ett hobbyprojekt jag driver. Webbplatsen hanterar podcasts, där en skrapare automagiskt hämtar hem nya avsnitt.
Medlemshantering, podcastprenumerationer, kommentering, hörda avsnitt, spellistor m.m mera erbjuds.</p>
<p><strong>Tekniker:</strong> ASP.NET C#, Entity Framework, Bootstrap 3, HTML5/CSS3, JavaScript/jQuery, MSSQL.</p>
<p><a href="http://www.podnow.se" target="_blank">Besök Podnow</a></p>
</div>
<p style="text-align: center;">
<img src="pics/Laptop_Podnow.png" width="620" alt="Skärmbild på webbplatsen Podnow.se, denna bild visar en del av webbplatsens startsida.">
</p>
<hr />
<div class="sectionBox floatRight">
<h3>RobertRoos.se</h3>
<p>Min personliga blogg som drivs med hjälp utav Wordpress, på ett av mig kraftigt modifierat tema.</p>
<p><strong>Tekniker:</strong> Wordpress, PHP, HTML5, CSS3, JavaScript/jQuery MySQL.</p>
<p><a href="http://www.robertroos.se" target="_blank">Besök RobertRoos.se</a></p>
</div>
<p style="text-align: center;">
<img src="pics/Laptop_RobertRoosSE.png" width="620" alt="Skärmbild på webbplatsen Robert Roos Bloggen. Visar sitens startsida där senaste bloggposterna visas.">
</p>
<hr />
<div class="sectionBox floatRight">
<h3>Time to Shine Foundation</h3>
<p>Ideellt arbete där jag satte upp en webbplats för organisationen Mwambike Foundation som arbetar med föräldralösa barn i Uganda. Sidan drivs med Wordpress på ett av mig modifierat tema.</p>
<p><strong>Tekniker:</strong> Wordpress, PHP, HTML5, CSS3, JavaScript/jQuery MySQL.</p>
<p><a href="http://timetoshinefoundation.se/" target="_blank">Besök Time to Shine Foundation</a></p>
</div>
<p style="text-align: center;">
<img src="pics/Laptop_Mwambike.png" width="620" alt="Skärmbild på webbplatsen Podnow.se, denna bild visar en del av webbplatsens startsida.">
</p>
<hr />
<div class="sectionBox floatRight">
<h3>Kvittrande</h3>
<p>Kvittrande var en site med huvudfokus på en yngre målgrupp mellan 12 - 25 år. Innehöll bland annat roliga filmklipp, bilder och spel.
Arbetade mycket med att integrera webbplatsen mot Facebook, Twitter och andra sociala medier, samt SEO.</p>
<p><strong>Tekniker:</strong> XHTML 1.0 Strict, CSS 2.1, jQuery/AJAX, ASP 3.0, MySQL-databas..</p>
</div>
<p style="text-align: center;">
<img src="pics/Laptop_Kvittrande.png" width="620" alt="Skärmbild på webbplatsen Kvittrande. Bilden visar sitens startsida där senaste filmklippen och bilderna visas.">
</p>
<hr />
<div class="sectionBox floatRight">
<h3>Roosweb</h3>
<p>Ett hobbyprojekt jag i många år arbetade med och drev. Ett nöjescommunity där spel, bilder,
filmklipp med mera delades och publicerades av sidans medlemmar. Sidan innehöll även ett forum, profiler, gallerier, klotterplank m.m.</p>
<p><strong>Tekniker:</strong> XHTML 1.0 Strict, CSS 2.1, jQuery/AJAX, MySQL, ASP 3.0.</p>
<p><a href="http://www.roosweb.se" target="_blank">Besök Roosweb</a></p>
</div>
<p style="text-align: center;">
<img src="pics/Laptop_Roosweb.png" width="620" alt="Skärmbild på webbplatsen Podnow.se, denna bild visar en del av webbplatsens startsida.">
</p>
</section>
<div class="textCenter"><a class="ScrollSec4" href="#"><img class="zoomImage" src="css/pics/Arrow-down.png" width="64" alt="Icon for scrolling down"></a></div>
</article>
</div>
<div class="articleBlue aboutSection">
<article>
<h1>I think, therefore I am. I think.</h1>
<section>
<h2>Kort om mig</h2>
<img class="picRight fullWidth" src="pics/Robert-Roos-New.jpg" width="250" alt="Porträttbild på Robert Roos" />
<p>Hej, trevligt att råkas!</p>
<p>26 år gammal bosatt i Skövde kodar och designar jag webbplatser som frilansande <strong>webbprogrammerare</strong>.</p>
<p>Förutom <strong>ett brinnande intresse för IT och programmering</strong>, ligger även samhällsvetenskapliga frågor, musik och teknik mig varmt om hjärtat.
Gillar att hålla mig uppdaterad och ha koll på det senaste.</p>
<p>Innehar även kandidatexamen i data- och systemvetenskap.</p>
<h2>Tekniker jag använder</h2>
<p><strong>Frontend:</strong> HTML5/CSS3, JavaScript/jQuery/AJAX, Bootstrap 3, SASS</p>
<p><strong>Backend:</strong> ASP.NET C# (Web Forms och MVC), Entity Framework 6, PHP, ASP 3.0, Java</p>
<p><strong>Databaser:</strong> MySQL, MSSQL, MongoDB</p>
<h3>Övrigt</h3>
<p>Utöver detta arbetar jag även med design, främst med hjälp utav <strong>Adobe Photoshop</strong> och <strong>Adobe Illustrator</strong>.
Är även en flitig användare av <strong>Git</strong> och <a class="whiteA" href="http://www.github.com/rr222cy" target="_blank">Github</a></p>
</section>
<div class="textCenter"><a class="ScrollSec5" href="#"><img class="zoomImage" src="css/pics/Arrow-down-white.png" width="64" alt="Icon for scrolling down"></a></div>
</article>
</div>
<div class="articleComputer contactSection">
<article>
<h1 class="textBorder">Kontakta mig</h1>
<section>
<p> </p>
<aside>
<h3>Sociala nätverk</h3>
<p> </p>
<a href="https://twitter.com/RobertRoos_" target="_blank"><img class="zoomImage" src="pics/Twitter.png" width="48" height="48" alt="Ikon som föreställer Twitters logotyp" /></a>
<a href="https://www.linkedin.com/pub/robert-roos/66/b37/7a3" target="_blank"><img class="zoomImage" src="pics/LinkedIn.png" width="48" height="48" alt="Ikon för LinkedIns logotyp" /></a>
<a href="skype:robertroos_" target="_blank"><img class="zoomImage" src="pics/Skype.png" width="48" height="48" alt="Ikon som föreställer Skypes logotyp" /></a>
<a href="https://github.com/rr222cy" target="_blank"><img class="zoomImage" src="pics/GitHub.png" width="48" height="48" alt="Ikon som föreställer Githubs logotyp" /></a>
<p> </p>
<h3>Epost</h3>
<p><a class="whiteA" href="mailto:[email protected]">[email protected]</a></p>
</aside>
<h2>Hör av dig!</h2>
<form name="ContactForm" action="#" method="post">
<fieldset>
<label class="leftalign" for="Subject">Ärende:</label>
<input type="text" name="Subject" id="Subject" placeholder="Skriv gärna vad ärendet gäller" required><br />
<label class="leftalign" for="Email">E-post:</label>
<input type="email" name="Email" id="Email" required placeholder="Ange din e-post så jag kan kontakta dig"><br />
<label class="leftalign" for="Message">Meddelande:</label>
<textarea name="Message" id="Message" disabled>Tills vidare föredrar jag om du kontaktar mig genom något av de sociala nätverk jag listat till höger, eller genom mejl.</textarea>
</fieldset>
<input type="submit" name="Submit" id="Submit" value="Skicka meddelandet" disabled>
</form>
</section>
</article>
</div>
</main>
<footer>
© 2006 - 2017 Robert Roos. All rights reserved. - <a id="ScrollToTop" href="#">Till toppen</a>
</footer>
</div>
<script type="text/javascript" src="js/scripts.js"></script>
</body>
</html>