, for everyone. More @ http://goo.gl/7AJzbL -->
<!-- Todo: add easing -->
<svg width="57" height="57" viewBox="0 0 57 57" xmlns="http://www.w3.org/2000/svg" stroke="%23F2EEEE">
<g fill="none" fill-rule="evenodd">
<g transform="translate(1 1)" stroke-width="2">
<circle cx="5" cy="50" r="5">
<animate attributeName="cy"
begin="0s" dur="2.2s"
values="50;5;50;50"
calcMode="linear"
repeatCount="indefinite" />
<animate attributeName="cx"
begin="0s" dur="2.2s"
values="5;27;49;5"
calcMode="linear"
repeatCount="indefinite" />
</circle>
<circle cx="27" cy="5" r="5">
<animate attributeName="cy"
begin="0s" dur="2.2s"
from="5" to="5"
values="5;50;50;5"
calcMode="linear"
repeatCount="indefinite" />
<animate attributeName="cx"
begin="0s" dur="2.2s"
from="27" to="27"
values="27;49;5;27"
calcMode="linear"
repeatCount="indefinite" />
</circle>
<circle cx="49" cy="50" r="5">
<animate attributeName="cy"
begin="0s" dur="2.2s"
values="50;50;5;50"
calcMode="linear"
repeatCount="indefinite" />
<animate attributeName="cx"
from="49" to="49"
begin="0s" dur="2.2s"
values="49;5;27;49"
calcMode="linear"
repeatCount="indefinite" />
</circle>
</g>
</g>
</svg>)
Engedd szárnyalni a fantáziád, légy kreatív de tartsd be az alapszabályokat!
Az alábbi tippek segítséget nyújtanak majd, hogy létrehozhass egy fantasztikus weboldalt (vagy többet)...
Első tipp:
Tervezz!!
A legfontosabb, mielőtt igazán belevágnál a lecsóba, jegyezd fel az összes ötleted, készíts listát! Lehet, hogy egy-kettő üti egymást, leírva is látszik, hogy nem fog működni. Ha lehetőséged van rá, tervezd meg valamilyen programban, hogy hozzávetőlegesen mit hogyan szeretnél elrendezni, de ha kézzel rajzolod meg, az is nagy segítség! Nézelődj, inspirálódj más designerek, alkotók munkáiból, erre a Pinterest, az Instagram, Linkedin, Behance egyaránt alkalmas! Ne félj ellesni az öreg rókáktól pár dolgot, ami tetszik, másolni nem ér de máris elindulhatsz egy általad kijelölt vonalon, a látottak alapján. Jegyezd fel a menüket, az almenüket, oldalakat, kezd el összeírni a témákat és a hozzá tartozó szövegeket, sokkal könnyebb lesz, ha a szerkesztési munkálatok közben csak kimásolod a már kész írást és egy ctr+ V-vel beilleszted, ahelyett, hogy “élesben” kezdesz el pötyögni…
Második tipp:
Képek, képek, képek!
Készítsd össze tematikusan a képanyagot, amit használni fogsz, előre szerkeszd meg őket, hogy ugyanolyan stílusuk legyen, használj filtereket, maszkold meg őket, ahogy jólesik. Én alapból témák szerint nevezem el a képeket és töltögetem fel, külön külön mappába. Nagyon fontos! Amikor feltöltöd a honlapodra a képeket mindig írd meg hozzá az alternatív szöveget, a leírást, a kép címét is add meg, mindent tölts ki!! SEO-zás szempontjából elengedhetetlen, hogy megtedd még akkor is, ha egyébként nem akarod külön megjeleníteni a szöveget később a weboldalon. Próbáld mindig az arculatnak megfelelően megszerkeszteni a képeket, hogy elkerüld a kaotikus hatást. A képek elrendezését illetően használj egyedire szabható galériákat, manapság a slider megoldások a legfelkapottabbak. Keress olyan sablont, ami alapból a kép hangsúlyos elrendezésre van beállítva! Ehhez segítséget nyújthat az előző blogbejegyzésem is. Ne félj megmutatni a képeidet nagy méretben!
harmadik tipp:
harmadik tipp:
Használj grafikákat!
Használj grafikákat!
Véleményem szerint, nagyra értékelik a megrendelők és a látogatók, amikor képek helyett inkább grafikákat vagy illusztrációkat jelenítünk meg a weboldalunkon. Ez duplán megéri, egyrészt a honlapunk első blikkre is artsynak fog tűnni, továbbá nem kell a látogatónak végigböngészni a portfóliónkat ahhoz, hogy reális képet kaphasson képességeinkről. Nagy népszerűségnek örvendenek az animált grafikák, kétség kívül ez lesz a jövő design alapeleme, ami majdhogynem elengedhetetlen lesz minden weboldal számára. Nem kell reneszánsz freskókban gondolkodni, a lényeg, hogy passzoljon a brandhez és legyen kreatív, jópofa.
negyedik tipp:
negyedik tipp:
Fontosak a színek!
Fontosak a színek!
Habár a minimalista stílus örök és időtlen, szerintem egy művészeti oldalnál nem árt, ha kicsit komplexebb megoldásokra törekszünk. Merj játszani a színekkel! Gondold végig, a profilodhoz milyen színek illenek a legjobban? Melyek azok a színpárosítások, amik jól működhetnek és visszatükröznék a személyiségedet? Vigyázz 3-4 színkombónál sose gondold túl, mert akkor olyan hatást érsz el, mintha egy se lenne. Ha megvan, köszönjenek vissza azok a színek a logódban, a honlapodon, az esetleges reklámanyagokon, a csomagoláson, mindenhol, hogy erősítsd a vizuális asszociációkat a márkádhoz! Csinálj nyugodtan több variációt, tapasztalatom szerint úgyse fog elsőre sikerülni a várt eredmény, ezért nem árt ha van a tarsolyodban egy két alternatíva, igazán megéri belefektetni az energiáid! Persze nem azt mondom, ha fekete fehér, akkor fekete fehér, nincs mit tenni.. Érdemes ilyenkor olyan tipográfiát és grafikai elemeket alkalmazni, hogy fel se merüljön az emberfiában más megoldás! Igyekezz a honlapodnál minden egyes blokkban felhasználni a választott színt vagy színeket, én javaslom, hogy már a háttérben köszönjön vissza az árnyalat, de a CTA-gombokban és a főmenüben mindenképp!
ötödik tipp:
ötödik tipp:
Typo és szöveg
tipo és szöveg
Írj olyan szöveget, ami mindenki számára érthető, nem kell szakszavakkal dobálózni égre földre. Nyugodtan beszélj őszintén a munkáidról, magadról senki sem várja el, hogy kész használati utasítást írj meg epikus vers formájában egy portfólió oldaladon. Válassz ki legalább két- három betűtípust, amit használni fogsz mindenféle felületen! Figyelmedbe ajánlom az úgynevezett “handwrite” betűtípusokat, most nagyon dübörög, de vigyázz, hogy mellé egy kevésbé cikornyás fontot is használj, a hosszabb szövegeket mindenképp ebben írd majd meg. Az elementor kigészítő bővítményei között (happy addons,vagy unlimited elements for elemntor)baromi jó megoldások vannak a címsorok variálhatóságára és az összes kreatív és stílusos. Figyelj oda arra is, hogy a legfontosabb címeknek mindig H1es legyen a címsor beállítása az alcímeknek H2 a szövegnek meg p.
