Your SlideShare is downloading. ×
ONLINE KLUB - Ivan Potančok - Webdesign
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

Text the download link to your phone

Standard text messaging rates apply

ONLINE KLUB - Ivan Potančok - Webdesign

479
views

Published on


0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
479
On Slideshare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
1
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. WebdesignIng.Ivan Potančok
  • 2. IntroductionIvan Potančok@ivusko•2000 - 2010freelance webdesigner2010 +•CEO @ vibration.sk
  • 3. Vibration.sk
  • 4. Grafické programyhttp://www.adobe.com/products/photoshop.htmlhttp://www.gimp.org/http://www.adobe.com/products/illustrator.htmlhttp://www.adobe.com/products/fireworks.htmlPrototypovaniehttp://www.balsamiq.com/products/mockupshttp://www.axure.com/
  • 5. Editory CSS+HTML+(PHP)http://www.pspad.com/sk/http://www.eclipse.org/http://www.adobe.com/products/dreamweaver.html
  • 6. Ďalšie nástrojeGoogle chrome + F12Testovanie:Firefox + firebugOperaSafariIE tester
  • 7. Online nástrojehttp://css3generator.com/
  • 8. Vytvorenie logaNápad – hlava, vychádza z názvuKoncepty – brainstormingskica – papier + perovektor – tvarvýber typografie - písmo http://www.google.com/webfonts/ - použiteľné na webe http://www.dafont.com/farbičky – rôzne verzieaplikácia loga – rozmer, odsadenie, logo manuál,vizitky, fb, web, banner
  • 9. Hľadanie color schémyhttp://colorschemedesigner.com/http://kuler.adobe.comFarby na webe v RGB hexa kóde:#FF0000 – červenáFF – pomer červenej00 – pomer zelenej00 pomer modrej#000 – skrátený zápis čiernejwhite – slovný zápis farby
  • 10. Grid systém
  • 11. Prototypovanie - wireframes
  • 12. Prototypovanie - wireframes
  • 13. Základy typografie na webeH1-H6StrongPULOLEmVšetko ako text !
  • 14. Základy typografie na webeCSS vlastnostiFont-sizeColorFont-weightPaddingMarginText-decorationText-align:hoverLine-height
  • 15. Výber šablóny1. Free šablóny -http://wordpress.org/extend/themes/2. Vlastná šablóna3. Premium šablóny
  • 16. Call to action prvkyDostatočne veľkéDostatočne výraznéFarebné, vyzerá ako tlačítko, má stav po nájdení myšou
  • 17. Kde hľadať/kúpiť obrázkyhttp://sxc.hu/http://www.flickr.com/creativecommons/http://www.istockphoto.com/
  • 18. Kde hľadať ikonyhttp://www.iconfinder.com/http://glyphicons.com/http://www.glyphish.com/
  • 19. Mobilná verziaPriamo šablóna je responsiveAlebo pluginhttp://wordpress.org/extend/plugins/wordpress-mobile-pack/screenshots/Alebo dorobím responsive CSS
  • 20. WorkshopSupport email:info@vibration.skPredmet napríklad:onlineklub – design problem – neviem exportovatlogo do šablóny