Sidebary, Widgety, Motywy, HTML5+CSS3, Responsywność. strona internetowa dostosowująca się do rozdzielczości urządzenia na jakim jest oglądana (dosłownie wrażliwa na jego rozdzielczość). Technika tworzenia stron responsywnych polega na tworzeniu paru wersji strony dostosowanej do różnych rozdzielczości. Podczas wczytywania strony lub zmiany jej rozdzielczości strona responsywna sprawdza aktualną rozdzielczość i dostosowuje się do niej poprzez wczytywanie odpowiednich wersji grafik oraz innych elementów. Często w stronach responsywnych inaczej zorganizowane są elementy nawigacji. Więcej na http://trojmiasto.us

1. WordPress Sidebary, Widgety, Motywy, HTML5+CSS3

2. Złożoność projektów rośnie, doba nie maleje

3. HTML5+CSS3 - dostępność

4. HTML5+CSS3 - znaczniki

5. HTML5+CSS3 – semantyka, geolokalizacja

6. HTML5+CSS3 – rozszerzenia charakterystyczne dla przeglądarek

7. HTML5+CSS3 nowe selektory
Uwaga na Internet Explorer 7-9 i
wcześniejsze wersje!
• HTML 5 jest wciąż rozwijany i zmieniany
• Kierować się zasadą „stopniowego
usprawniania” i „wdzięcznej degradacji”

8. Sidebar
functions.php
sidebar.php

9. Widgety

10. Widgety
Better Recent Posts Widget Pro – 4$
Rating-Widget: Star Rating System

11. Widgety
Popular Posts Bar Widget ($8)
Image Widget

12. Widgety
Advanced Categories Widget ($4)
Youtube Channel Gallery

13. Widgety
WP Biographia
Opening Hours

14. Widgety
Tabbed Login Widget
Dexs Navigation Tree

15. Widgety
Social Icons Widget
My Social Counter for WordPress ($10)

16. Widgety
Business Contact Widget
WP Tab Widget

17. Widgety
Polldaddy Polls & Ratings
WYSIWYG Widgets / Widget Blocks

18. Widgety – kiedy drag and drop przestanie
działać
Pokaz budowania menu

19. Header i footer

20. Motywy – jak wybrać najlepszy?
Czytelnicy podejmuj decyzj o tym czy zosta na stronie, czy i dalej ą ę ć ść w kilka sekund
Od szablonu zależy to jak będziesz postrzegany w d ługoterminowej perspektywie
Od szablonu zależy funkcjonalność twojego bloga
1. Określ swoje potrzeby
2. Responsywność
3. SEO!
4. Dokumentacja
5. Support oraz aktualizacje
6. Ocena / recenzje
7. Obrazki
8. Pliki PSD
9. Integracja z wtyczkami
10. Obsługa plików t łumaczeń
11. Układ treści
12. Sposób konfiguracji
13. Jak szybko ładuje się szablon?
14. Czy możliwe jest dostosowanie wyglądu szablonu bez umiejętno ści programowania?
15. Czy kod szablonu nie jest “prze ładowany”? (audyt)
16. Czy szablon obs ługuje wszystkie przeglądarki?

21. Motywy – gdzie nabyć?

22. Responsywność

23. Responsywność
Głównym zarzutem przeciwko RWD jest pobieranie nadmiernej
ilości danych na urządzeniach mobilnych.
Np. mimo że layout ma 480px szerokości, pobiera się obrazek o
szerokości 1920 i skaluje do wielkości 480.
Biblioteka adaptive images wysyła odpowiednią wersję obrazka w
zależności od początkowej rozdzielczości.
http://adaptive-images.com/

24. Responsywność – przydatne narzędzia
https://addons.mozilla.org/en-US/firefox/addon/firebreak/
Obok paska wyszukiwnia w Firefoxie, pokazuje aktualną szerokość ekranu
http://screenqueri.es/
Narzędzie do emulowania różnych urządzeń i rozdzielczości
https://github.com/thepeg/MediaTable
Szerokie tabele dostosowane do RWD
http://www.netmagazine.com/features/50-fantastic-tools-responsive-web-design
Wiele innych rozwiązań dla RWD - od projektowania po skrypty i emulatory

25. Responsywność

26. PPyyttaanniiaa??

27. TTeerraazz PPaann mmaa rreellaakkss
Przerwa 15min