nemuchtorstont.ru

Ontwerp `n webwerf

Die ontwerp van `n goeie webwerf kan lyk soos `n uitdagende taak, maar solank jy die basiese beginsels in gedagte hou, sal jy die proses interessant en pret vind. Dit gaan oor meer as net `n goeie voorkoms! Ons sal jou die basiese beginsels en enkele algemene riglyne wys om jou te help om webwerwe te ontwerp wat mense keer op keer besoek.

stappe

Metode 1
Die 3 basiese reëls

1
Reël # 1: Luister na jou kliënt. Miskien ontwerp jy "die wêreld se beste webwerf ooit in die geskiedenis van die heelal en daarbuite," met ryk swartes, verfynde lettertipes en helder, artistieke kleure vir `n werf wat skree "verken my nou!" Ongelukkig wou jou kliënt `n oranje spyskaart met helder pienk en oranje letters hê. U word afgedank, en u beste webwerf ooit - waarvan die kliënt die regte het - is êrens op hul rugsteunskyf, sonder dat iemand dit weer sien.
  • Bestudeer die korporatiewe identiteit van u kliënt. Laat die kliënt u `n paar webwerwe wys wat hulle liefhet. Dit gee jou nie net `n idee van wat hulle wil nie, maar dit gee jou ook `n paar ontwerp idees waaraan jy dalk nie gedink het nie.
  • As jy gedink het ons was grap oor die oranje en pienk webwerf, dink aan hierdie koel, verfynde webwerf:
Prent getiteld Website-dunkin donuts.jpg
  • 2
    Reël # 2: Ken jou gehoor en wat hulle soek, en pas jou ontwerp dienooreenkomstig aan. Die rede waarom mense webwerwe het, is omdat hulle wil hê dat ander mense hulle moet sien. Dit kan insiggewend, of kommersieel wees, of om `n sekere teikengroep te vermaak. Jou werk as ontwerper is om te weet vir wie jy ontwerp, en om dit op die bladsy te hou wanneer hulle daar eindig.
  • Jy mag dalk dink: "As dit goed lyk, bly hulle." Maar dit hoef nie noodwendig die geval te wees nie. Neem byvoorbeeld vaste eiendom. Hier is `n webwerf met `n helder, prettige ontwerp. Dit het `n baie wit spasie wat `n oop voorkoms, helder kleure en `n moderne breedbeeldformaat bied met skakels op `n prominente plek:
    Prent getiteld Santa Monica Real Estate 1.jpg
  • Kyk nou na hierdie benadering om Real Estate in dieselfde area te verkoop: rommelryke en baie besige, dowwe kleure en bedek in advertensies.
    Prent getiteld Santa monica trulia.jpg
  • Raai wat beter werk vir mense wat `n huis soek? Reg, die een waar huise daarop! Wanneer mense soek vir dit "huise te koop in Santa Monica," hulle gee nie om hoe `n webwerf lyk nie. Hulle wil nie oor die makelaar lees nie, of sien pragtige foto`s van die stad nie. Hulle wil huise sien.
  • 3
    Reël # 3: Luister na jouself. Jy verstaan ​​wat die kliënt wil hê, en jy weet wat jou mark soek. Nou is dit uiteindelik tyd om aandag te gee aan jou, die ontwerper!
  • Bou `n sjabloon in die grafiese sagteware van u keuse. Skep die elemente van jou bladsy op verskillende lae (sodat jy later dinge kan verander sonder om die hele sjabloon te vernietig). Hierdie elemente kan wees:
  • header. Dit is `n element wat op elke bladsy van jou werf dieselfde is. Die hoofstuk bestaan ​​uit die titel en die logo van die webwerf, asook skakels na die ander dele van die webwerf (bv. Oor, Kontak, ens.). Visueel en feitlik bind alles saam. Dit is `n goeie oefening om die eerste knoppie op `n menubalk te koppel aan die tuisblad.
  • Kom ons kyk byvoorbeeld na Apple:
    Prent getiteld Apple home landing page.jpg
  • Soos met die meeste Apple-dinge, het hul tuisblad `n baie slanke, ongekompliseerde ontwerp. Gee aandag aan die menubalk bo, met logiese onderwerpe vir elke knoppie, plus `n soektogveld - altyd `n goeie idee as jou werf dit ondersteun. Kom ons kyk nou na `n bestemming bladsy vir een van die knoppies, die iPad, om `n paar elemente te sien:
    Prent getiteld Ipad landing page.jpg
  • Die menubalk verander net deur die iPad-knoppie te verduister.
  • Die onderwerp van die bestemmings bladsy word in groot swart letters vertoon.
  • `N Nuwe subkieslys verskyn sodat jy meer oor die produk kan leer. As jy op een van hierdie knoppies klik, sal jy sien dat elke bladsy nuwe inhoud bevat, afhangende van die onderwerp, maar sal identies wees in uitleg en ontwerp.
  • Dikwels sal elke hoof onderwerp in jou kieslysbalk verskillende subopskrifte hê wat jy moet invul. In plaas daarvan om `n tweede menubalk te skep, kan jy pop-up spyskaarte gebruik soos hierdie voorbeeld van Musician`s Friend:
    Prent getiteld Mf menu menu.jpg
  • sidebar. Dit sal op baie bladsye van jou webwerf gesien word, maar nie noodwendig op almal nie - die konteks bepaal. Dit is egter `n baie belangrike element, en moet versigtig ontwerp word om intuïtief te wees en nie te rommel nie. In teenstelling met die menubalk, kan die inhoud van `n sidebar baie dinamies wees. Bekyk hierdie twee sidebars van eiendomsmarketer Trulia Die eerste is vir kopers:

    Prent getiteld Trulia buy.jpg
  • En die tweede is vir huurders. Let op die heeltemal verskillende fokus vir baie soortgelyke inligting, en dit word op presies dieselfde plek in die sidebar vertoon:

    Prent getiteld Trulia rent.jpg
  • body. Dit is waar dit alles gebeur, en dit is die mees veranderlike deel van jou ontwerp. Byvoorbeeld, as jy `n e-handelswebwerf ontwerp, kan een bladsy `n produkoorsig in die liggaam hê, terwyl die volgende 20 artikels te koop het. Jou werk is om die twee saam te bind sodat hulle nie visueel onsamehangend is nie. Gebruik dieselfde kleure, lettertipes en koppelvlakelemente om alles saam te bring.
  • Footer. Dit is iets wat elke webwerf nie nodig het nie. Dit word dikwels gebruik vir dinge wat `n verdere noue koppelvlak rommelig kan maak of toegang tot minder belangrike dele van die werf bied. Hier is `n voorbeeld van Groupon:
    Prent getiteld Groupon footer.jpg


    • Metode 2
    riglyne

    1
    Ontwerp `n goeie gebruikerskoppelvlak. Positioneer die verskillende elemente van die webwerf, soos die titel, zijbalken, logo`s, beelde en teks op elke bladsy op dieselfde plek om jou site navigeerbaar en intuïtief te maak.
    • Hou dieselfde kop aan die bokant van elke bladsy. Of die inhoud van jou webwerf baie herhalende elemente toelaat, maak seker dat die bokant van elke bladsy dieselfde is.
    • Gebruik logika in jou ontwerp. Die elemente op `n enkele bladsy moet logies bestel word volgens belang of onderwerp - die verskillende bladsye op die webwerf moet ook wees.
  • 2
    Skep `n konsekwente styl. Waar die uitleg jou strukturele konsekwentheid van jou werf moet gee, moet die styl hulle tematiese harmonie gee.
  • Hou dit by twee of drie hoofkleure en maak seker dat dit goed bymekaar pas.
  • Moenie te veel fonts of groottes gebruik nie. As jy `n paar wil alternatiewe, gebruik dit op elke bladsy op dieselfde manier.
  • Gebruik Cascading Style Sheets (CSS) om `n eenvormige styl te behou en om dit makliker te maak om elemente op `n hele webwerf te verander sonder om afsonderlik na elke bladsy te gaan.
  • 3
    Maksimum leesbaarheid. Om jou teks makliker te lees, kan jy dit in kleiner dele verdeel.
  • Gebruik onderskrifte en gepaste spasiëring om elk van die dele te skei.
  • Gebruik vet letters of verskillende groottes om die hiërargie en belang van die onderwerpe te wys.
  • Kyk hoe jy teks behandel. Moenie die lettertipe te klein maak nie en verhoog die lynspasiëring om groot stukkies teks makliker te lees. Groot stukkies teks is moeiliker om te lees - verdeel hulle in kleiner paragrawe.
  • 4
    Maak jou webwerf universeel leesbaar. Gebruik standaard HTML en vermy tags, funksies en plugins wat slegs beskikbaar is vir een handelsmerk of weergawe van `n blaaier.
  • Alhoewel die meeste moderne blaaiers en rekenaars komplekse beelde kan hanteer, sal alles mooi lyk as jy jou beelde kleiner maak en optimaliseer vir die web. Weeg die belangrikheid van kwaliteit teen die belangrikheid van spoed.
  • 5
    Toets jou webwerf. Maak dit elke skakel werk soos jy sou verwag, en dat beelde korrek verskyn.
  • U kan sommige gebruikers toetse organiseer deur lede van u teikengroep te toets, die duidelike en gemaklike gebruik van u ontwerp en gee terugvoering op u webwerf.
  • 6
    Publiseer jou webwerf. Koop `n domeinnaam as jy dit nog nie gedoen het nie. Kontroleer gereeld of skakels steeds werk en luister na voorstelle wat besoekers per e-pos aan jou stuur.

    • wenke

    • Alhoewel jy vry is om die uitleg te ontwerp gebaseer op jou eie persoonlike visie of dinge wat jy op ander webwerwe gesien het, kan dit makliker wees om `n kant-en-klare ontwerp te koop.
    • Moenie die besoeker bombardeer met oulike, spesiale prente nie. Flash animasie, helder kleure, patrone agtergronde, en musiek wat outomaties gespeel word tydens die laai van `n bladsy was pret eksperimente in die 90`s, maar nou sal hulle gebruikers wegry. Hou dit eenvoudig vir eenvoudige agtergronde wat kontrasteer met die tekskleur vir maksimum leesbaarheid.
    • Jy kan altyd CSS gebruik om die afstand tussen paragrawe te optimaliseer.
    • Vir besoekers met `n ouditiewe of visuele gestremdheid kan jy ondertiteldokumente, klank afskryf en `n boodskap oor toeganklikheid byvoeg. Hoewel tabelle `n doeltreffende manier is om inligting te organiseer, kan visueel gestremde besoekers wat skermleser sagteware gebruik, nie die materiaal in die korrekte volgorde hoor nie.
    • Laat jou besoekers spaar ink: gebruik `n aparte stylblad vir gedrukte bladsye.
    • Skakel agtergrondprente uit wanneer die drukparameters gestel word.
    • Gebruik swart teks op `n wit agtergrond.
    • Verwyder die menubalk en onnodige beelde.

    waarskuwings

    • Vermy plagiaat en hou by alle kopieregwette. Moenie willekeurige beelde wat jy aanlyn vind, of selfs strukturele elemente, sonder toestemming byvoeg nie. Alles wat jy op jou webwerf gebruik, moet wettig sowel as eties gesond wees.
    Deel op sosiale netwerke:

    Verwante