Chrome
skróty klawiaturowe – keyboard shortcuts
- tryb incognito – CTRL + SHIFT + N
testowanie w Chrome
- F12
- menu boczne (trzy pionowe kropki – More options):
- show media queries
- show rulers
- add device pixel ratio
- add device type
- boczny panel ELEMENTS i zakładki:
- Styles
- Event Listeners
- DOM Breakpoints
- Properties
- img
- currentSrc – do sprawdzenia jakie zdjęcie jest wczytywane
- img
- Accessibility
zmiana lokacji w devtools
- otwieramy menu Customize and control DevTools (ikona 3 pionowych kropek)
- more tools
- sensors
- ustawiamy Geolocation wg potrzeb i odświeżamy stronę
testowanie wydajności strony w chrome:
- Performance
- dolny panel (jeśli jest nie widoczny włączamy go poprzez ESC)
- Rendering
- paint flashing – zaznacza na zielono elementy które wymagają Paint podczas malowania czyli są zasobochłonne – obciążają przeglądarkę
- FPSmetter – licznik klatek na sekundę przy wykonywaniu danej animacji
Pluginy
- JSON Formatter
- Lighthouse
- Form Filler – autouzupełnianie formularzy
- Vue.js devtools
- Linkclump – pozwala na otwarcie wielu zaznaczonych linków kombinacją klawisza myszy i wybranym klawiszem, do indywidualnego ustawienia w opcjach
- WooRank – SEO Analysis & Website Review
- Check My Links – plugin do sprawdzania poprawności linków i wyszukania broken links
bardzo przydatne
- AdBlock — best ad blocker
do pobierania filmów ze stron
do formularzy
devTools
- Vue.js devtools
- Xdebug helper
- JSON Formatter
- Cookie Inspector
- Servistate HTTP Editor & REST API Client
- var_masterpiece
Linki
- Copy All Urls
- Copy URL To Clipboard
- Link Klipper – Extract all links
- Linkclump
SEO
- SEO Analysis & Website Review by WooRank
- Check My Links
graficzne i wizualne
- Dimensions
- Muzli 2 – Stay Inspired
- ColorZilla
Print Screen
- Nimbus Screenshot & Screen Video Recorder
Językowe, tekst
Hope this helps and happy coding :)
Zobacz jeszcze
pozioma linia hr
tag pozwalający zasygnalizować tematyczną zmianę treści lub wizualne oddzielenie od siebie sekcji treści hr { background-color: #ddd; border: 0 none; clear: both; color:...