14
Ikonos navigációs megoldások
Minap találtam egy szép gyűjteményt navigációs megoldásokra. Voltak köztük szépek, és voltak olyanok, amiért pénzt is kértek. Nos, én ezek közül párat megcsináltam, és közzéteszem teljesen ingyen és bérmentve (természetesen CC licenc alatt).

Rögtön négy verziót is készítettem, közös tulajdonságuk, hogy azonos HTML vázra épülnek, azonos ikonokat használnak, JavaScript mentesek, kizárólag CSS-ből történik az “animálás”.
Nézzük meg őket közelebbről is.
- Az első megoldásnál csak akkor jelenik meg a navigáció szövege, ha fölé viszed az egeret.
- A másodiknál szimplán csak a háttere változik a navigációs menünek.
- A harmadik verziónál a kép pozíciója változik, így egy kicsit izgalmasabbá teszi.
- A negyedik verzióban az ikonok mérete változik, ezzel tovább fokozva a harmadik verziót. (Itt megjegyzendő, hogy ha ezt élesben szeretnéd alkalmazni, akkor ilyenkor inkább cseréld ki a képet egy nagyobbra, mert így elég pixeles lesz a nagyítástól.)
Ezek kombinálása, és felhasználása már a Te feladatod lesz
. Nyomja a Tetszik gombra, ha tényleg tetszett, de csak akkor!
![]()
A menük elkészítéséhez szabad szoftvereket (Linux Mint Debian, gedit, OpenOffice) és a Milky ikonszettet használtam. A bejegyzés bármely része – beleértve a letölthető csatolmányokat is – felhasználható a Creative Commons Nevezd meg! – Így add tovább! 3.0 Unported (CC BY-SA 3.0) licenc alatt, de ez nem vonatkozik a használt ikonszettre.


Egy
Egy weboldal grafikai tervezésénél, ha a SEO és Accessibility szempotokat is figyelembe veszünk, nem használunk olyan szöveges elemeket, melyeket majd képként kell megjelentíteni, nem használunk például élsimítást a szöveghez, hogy az a valóságban is szövegként (pl:
Szijártó József 