Leopard OSX web-layout
28 juli 2009 - 15:31   
geplaatst door: DNA
Lol,

Ik ben een beetje aan het stunten met WordPress en nu wil ik graag een web-layout maken in de stijl van Leopard OSX.

Nu ben ik bezig met de menubalk boven-in maar ik vraag me af welk lettertype ik het beste zou kunnen gebruiken? Ik heb nu Veranda opstaan als standaard maar dat komt er toch niet echt in de buurt.

Ja ik weet dat je dit niet zomaar mag kopiëren maar ik heb verder geen bedoelingen met de layout. Dit is puur voor de fun en voor mezelf iets te leren.

Apple = Click, Boom, Amazing!
Leopard OSX web-layout
28 juli 2009 - 18:54    reactie #1
geplaatst door: bertvanderveen
Gebruik Myriad ipv Verdana en je komt een heel eind.
Bert Vanderveen [...]
+++ Applegebruiker sinds 1989 (van System 6 via OSX naar macOS 15)
Leopard OSX web-layout
28 juli 2009 - 18:56    reactie #2
geplaatst door: Nicky
Waar kunnen we je frutsels aanschouwen?
Leopard OSX web-layout
28 juli 2009 - 19:22    reactie #3
geplaatst door: DNA
Ik zal zo snel mogelijk een update doen hier..

Het is best grappig al zeg ik het zelf.   :blush:

Maar omdat ik de pagina (body) 1024 px breed maak moet ik ook steeds de schermresolutie van mijn MB Air in 1024 x 640 zetten. Dit omdat ik daar de vensters en afbeelding vandaan kopieer.  :sigh:

Er komt dan een Finder en Safari venster een beetje over elkaar heen te liggen zodat je in de Finder door het menu kan klikken en in het venster van Safari wil ik dan steeds de pagina laden..
Op de achtergrond heb ik dan de bekende paarse "space" achtergrond-afbeelding en onderaan wil ik dan ook nog de Dock maken. (maar helaas die zal denk ik niet gaan werken)

Apple = Click, Boom, Amazing!
Leopard OSX web-layout
28 juli 2009 - 19:44    reactie #4
geplaatst door: Nicky
Je maakt me heel nieuwsgierig. Met Javascript of anders Flash zal je toch wel iets bewegends kunnen maken met het dock. Maar wellicht is dat voor een probeerseltje iets teveel werk.....
Leopard OSX web-layout
28 juli 2009 - 21:30    reactie #5
geplaatst door: yichalal
of hier lenen...
Leopard OSX web-layout
28 juli 2009 - 21:41    reactie #6
geplaatst door: Feek
Heb je aan deze jQuery iets voor je dock?
Leopard OSX web-layout
28 juli 2009 - 21:44    reactie #7
geplaatst door: Feek

Citaat
yichalal om 21:30, 28-07-2009
of hier lenen...

Zelfde idee :)

Leopard OSX web-layout
28 juli 2009 - 22:00    reactie #8
geplaatst door: DNA

Citaat
yichalal om 21:30, 28-07-2009
of hier lenen...

Ik wist dat ze bestonden kant en klaar maar ik wil het ook nog allemaal zo maken dat ik de hele site kan bewerken via CMS. En zonder of met redelijk weinig kennis van webdesign in het algemeen doe ik het liever stap voor stap.


Maar om alvast een beetje een preview te geven.

http://www.plaatjesupload.nl/bekijken/1792213.html

Ik had al een template genomen welke al redelijk in de stijl van Mac OSX was en iets met niet teveel kolommen erin, ik ga het simpel houden.
Volgens mij is de oude template gemaakt door een Windows gebruiker aangezien dat de 3 bekende bolletjes aan de verkeerde kant zitten. Tot nu toe heb ik het bovenste gedeelte aangepast, de "header".

* De oude site was 1004 breed vandaar dat deze boven en onder nog een beetje afwijkt.

* De bedoeling is dat de rechterkolom komt te vervallen en ik wil Categorieën naar links halen.

* Archief wil ik eigenlijk bovenin de menubalk naast Finder gaan maken want de Finder bovenin heb ik ook klikbaar gemaakt. Het :apple:-tje en de rest is niet klikbaar in de menubalk.

* De linkerkolom wil ik dan nog zo maken dat het Finder venster op de achtergrond doorloopt tot onder.

* Onder de blak van Safari wil ik een witte achtergrond maken tot onderaan en deze wil ik ook wat breder maken omdat de rechterkolom toch weg gaat.

* En onderaan wil ik dan weer een afb. van "De Dock" maken..


Nou we gaan weer even verder knutselen..  :wacko:

Apple = Click, Boom, Amazing!
Leopard OSX web-layout
28 juli 2009 - 22:42    reactie #9
geplaatst door: Sypie
http://www.aqua-soft.org/forum/index.php?showtopic=25882

Daar kun je ook een OS X achtige layout weghalen. Hier kun je die zien: http://www.aqua-soft.org/forum/index.php?act=home

Leopard OSX web-layout
29 juli 2009 - 04:16    reactie #10
geplaatst door: DNA

Citaat
Sypie om 22:42, 28-07-2009
http://www.aqua-soft.org/forum/index.php?showtopic=25882

Daar kun je ook een OS X achtige layout weghalen. Hier kun je die zien: http://www.aqua-soft.org/forum/index.php?act=home

Ja die ziet er ook niet slecht uit..


Zo, nu ik er net achter ben gekomen dat ik een stomme fout heb gemaakt ga ik maar slapen en morgen weer verder knutselen.

* De fout zat hem in "Finder" deze kan nooit in de menubalk staan als het Safari venster boven het Finder venster actief is.   :music:
Ook moet ik het Finder venster gaan dimmen omdat Safari "actief" is.

Nieuwe update:
http://www.plaatjesupload.nl/bekijken/1792873.html

:sleepy:

Apple = Click, Boom, Amazing!
Leopard OSX web-layout
3 augustus 2009 - 21:52    reactie #11
geplaatst door: Peter Villevoye
Houd er rekening mee dat een oppervlakte van 1024 x whatever
eigenlijk altijd nèt te breed is voor veel schermen, omdat je vaak
de scrollbars en andere vensterranden erbij moet tellen.
Ga liever van een iets smallere breedte uit, bijvoorbeeld 980.
Studea — Advies - Training - Begeleiding in DTP, web- en app-design.  En... een PixelFreak !