Webwerf-promosiebaniere het een van die mees onfeilbare instrumente geword wanneer dit kom by die lok van kliënte en gebruikers. Aangesien hulle aantreklik en toeganklik vanaf enige platform waarin hulle gebruik word.
Die skep van ‘n promosiebanier deur HTML- en CSS-kodes is ook een van die mees volledige maniere waarop u toegang het. Aangesien beide kode gereedskap laat jou promosiebanier so aantreklik lyk as oorspronklik.
Om hierdie rede, sal ons jou wys die stappe wat jy moet volg sodat jy ‘n kreatiewe promosiebanier kan skep en visueel aantreklik met CSS- en HTML-kodes. Op hierdie manier sal jy die basiese kennis vir die ontwerp van hierdie element op jou webblad hê.
Basiese konsepte van CSS en HTML-kode
Een van die mees toeganklike maniere om skep promosie- en kreatiewe baniere vir jou webblad is deur die HTML- en CSS-kodes. Dit is dus nodig dat jy die basiese konsepte wat elkeen het, hanteer voordat jy jou banier begin programmeer.
Dus die kode HTML is nie ‘n programmeertaal nie, maar eerder ‘n opmerktaal. Wel, dit word gebruik om die konsep van ‘n webblad te definieer, soos kleure, beelde, tekste, lyste, onder andere. Dus kan HTML-dokumente gebruik word om webblaaie te skep.
Op hierdie manier word HTML- en CSS-kodes gewoonlik geïdentifiseer as ‘n tussenpunt tussen wat programmering en ontwerp is. Aangesien CSS en HTML, saam met JavaScrip, die visuele deel van ‘n webblad uitmaak, ook bekend as die Front-End.
Op sy beurt is die CSS-kode die aanvulling vir HTML, aangesien CSS skep ‘n klem op styl of die estetiese deel van die webwerf.
Daarom is hierdie twee kodes een van die beste alternatiewe om professionele webblaaie te skep en daarby in te sluit kreatiewe professionele banier deur sy funksies.
Wat moet ek in gedagte hou om kreatiewe baniere te ontwerp?
Wanneer ons ‘n banier ontwerp, moet ons ‘n reeks dinge in ag neem sodat dit aantreklik wees in die oë van die publiek Aan wie ons wil spreek en dus nie ongesiens verbygaan soos die res van advertensies op die netwerk nie, sal ons in hierdie artikel die punte aandui waarop jy jou aandag moet vestig wanneer jy ‘n banier skep:
Eerstens jy moet duidelik wees oor die doelwit, dit wil sê om te weet watter produk jy gaan aanbied en ‘n advertensieveldtog net daarvoor te skep. As jy verskeie produkte wil verkoop, werk afsonderlik daaraan. Genereer op hierdie manier meer verkeer op die netwerke en jy sal meer verbruikers bereik.
Jy behoort weet op watter gehoor jy die produk sal fokusom die kliënt te ken is uiters belangrik, hiervoor moet jy die geslag, ouderdom en nasionaliteit in ag neem, om smaak te ken wat deur die meerderheid verkry kan word, sal jou ook help om die mees treffende advertensiebanier te skep.
Die boodskap wat jy in die banier gaan gee moet kort en direk wees, as jy nie duidelik is of baie teks sit nie, sal mense ophou om dit te lees, aangesien dit vir hulle vervelig sal word. Laaste maar nie die minste nie jou banier moet ‘n aantreklike ontwerp hêDaar moet harmonie wees tussen agtergrond en lettertipes, estetika is baie belangrik, jy kan ook kies tussen die animasie daarvan of die maak van ‘n statiese banier.
Jy moet baie versigtig wees wanneer jy jou advertensiebanier ontwerp, aangesien sommige ontwerpfoute ver van om kliënte te lok jou produk afstotend kan maak, is dit ‘n paar foute wat jy ten alle koste moet vermy:
Gebruik nie die regte lettertipes nie (tipografie) Hierdie deel is baie belangrik, want dit dra die boodskap wat ons aan die verbruiker wil oordra, dit moet ‘n leesbare lettertipe met die toepaslike grootte wees, dit word nie aanbeveel om meer as twee lettertipes te gebruik nie, dit genereer chaos in die beeld.
Moenie foto’s van te hoë gehalte gebruik nie, dit veroorsaak dat ons banieradvertensie stadiger laai en daarom deur die meeste geïgnoreer word. Probeer ook om ‘n geskikte kleurpalet te gebruikbaie belangrik om nie vier kleure in die banier te oorskry nie.
Moenie baie teks in die prent gebruik nie, as jy ‘n hele testament in jou advertensie skryf, sal jy net die potensiële verbruiker verveel, wat sal vertrek sonder om ‘n kwart van die advertensie te lees. Daarbenewens moet jy altyd probeer om die handelsmerk van die produk uit te lig..
Tans is promosiebaniere een van die aantreklikste digitale bemarkingsinstrumente. Aangesien dit moontlik is voeg daardie promo banier HTML en CSS by na sosiale netwerke of webblaaie om gebruikers te lok en die aandag te trek.
Om te begin, moet jy die kodereël van jou webblad oopmaak en toegang tot die HTML-afdeling. Sodra jy daar is, moet jy die titel aan jou promosiebanier gee, jy kan ‘n eerstevlakkopskrif gebruik. Dan moet jy ‘n ondertitel of ‘n h2 gebruik om die voorwerp of rede vir jou bevordering te definieer.
Nou kan jy ‘n derde vlak opskrif of h3 gebruik om vas te stel hoeveel die titel gaan wees. afslag waarmee jou promosie sal tel. Nou kan jy ‘n paragraaf stel om meer gebruikers se aandag te trek deur dit as ‘n beperkte promosie te definieer en ‘n merker-anker in te voeg om na die versoek vir daardie promosie te herlei.
Later, vir die promosie om soos ‘n banier te lyk, moet jy ‘n baniermerker invoeg. div insluiting aan begin en einde van jou HTML-kode.
Sodra jy die geskep het promosiebanier met HTML-kode dit is tyd dat jy die ooreenstemmende kreatiewe aanraking aan die banier maak deur die CSS-kode te gebruik. Om dit te doen, moet jy ‘n merkerwolk met CSS vir jou webblad gebruik om dit te styl.
Om dit te doen, is dit ideaal dat jy begin deur jou promosiebanier ‘n agtergrond te gee, dus moet jy begin deur die naam van jou banier in te voer. Synde, in die geval van die vorige instruksie, dié van die houer div. Nou, om voort te gaan om die agtergrond van die banier te plaas, moet jy voeg eiendom ‘agtergrond’ in en die kleur waarmee jy wil hê jou promosiebanier moet gesien word.
Aan die ander kant, as u wil hê dat u promosiebanier ‘n agtergrondprent moet bevat, soos die oorspronklike logo van u webwerf, moet u die ‘agtergrondbeeld’-eienskap gebruik. Om dit te gebruik, moet jy gee dit die waarde van ‘n URL wat die prent bevat wat jy as agtergrond wil gebruik.
Net so, deur die kode ‘agtergrondgrootte’ te gebruik, kan jy die grootte van die prent of kleur waarmee jou promosiebanier gedek sal word. Op hierdie manier, wanneer jy die kenmerke van jou keuse bygevoeg het, sal jy suksesvol ‘n heeltemal oorspronklike promosiebanier geskep het.
het navigasieskakels
Dit is baie belangrik om ‘n banier met ‘n navigasieskakel te skep, aangesien dit op hierdie manier sal gaan van ‘n eenvoudige beeld na advertensies op die net, daar is bladsye soos Oleoshop wat maak dit vir ons maklik om ‘n skakel te kry, met ‘n stap-vir-stap verduideliking en teen ‘n baie bekostigbare prys. Neem dit as ‘n klein belegging om jou besigheid te laat groei.
Ontwerp die lintbanier
As jy ‘n moderne banierkwotasie wil skep, kan jy na die gebruik van HTML/CSS3CSS3 is een van die beste opsies, want dit is meer robuust, wyd ondersteun, het feitlik onbeperkte moderne en estetiese ontwerpopsies plus prettige grafika.
Voeg ‘n uitlegstyl by
Om ‘n banierontwerp te skep, moet ons die CSS-programmeertaal gebruik. Daarmee kan ons ontelbare effekte, kleure en ontwerp volgens ons idee deur kode toepas. As ons nie baie idees het oor die ontwerp nie, kan ons idees soek op platforms soos Pinterest. Ons kan ook vir ontwerp- of banier-sjablone op die web soek wat in sommige gevalle die kode beskikbaar sal hê om die basis van die ontwerp te hê en dan kan ons na ons smaak aanpas.
Hoe om ‘n responsiewe banier met HTML of CSS te ontwerp
As jy ‘n HTML-banier wil skep, kan jy na die Google Web Designer-toepassing gaan. Sodra die program op jou rekenaar geïnstalleer is, druk ‘skep nuwe lêer’ dan voeg ons ons beelde by en skep ons banier. Dit bly net om die resultaat uit te voer
Aan die ander kant, om ‘n CSS-banier te ontwerp, kan ons ook na die Google Web Designer-toepassing gaan of ‘n vinnige soektog in die blaaier uitvoer om die CSS-stylkode te kry wat ons nodig het om die banier op ons webwerf te vertoon, wat slegs die spasies vervang wat hulle dui ons aan. ‘n Goeie een kode bron is TheDigitalMike bladsy.
Vandag is daar ‘n wye verskeidenheid toepassings vir redigering op die web, wat ons kan help om animasies by die kode van ons advertensiebanier te voeg. Creatopy is een van hulle, as jy ‘n beginner is en jy weet nie van kodebestuur nie, dieselfde jy kan jou eie advertensies animeer.
Creatopy het sy eie HTML5-redigeerder, ons kan ook duisende sjablone vind om professionele geanimeerde advertensies te skep. bied meer gereedskap vir kodeskeppingVolg net hierdie eenvoudige stappe:
Gaan na die Creatopy-platform, soek die beskikbare baniergroottes in die kieslys, kies een en begin ontwerp, deur die HTML 5-redigeerder kan ons die animasie kies waarvan ons die meeste hou, ons pasmaak deur die lettertipe en beelde by te voeguiteindelik animeer ons die banier deur die voorheen geselekteerde sjabloon toe te pas en die resultaat af te laai.Sommige soorte promosiebaniere wat jy kan ontwerp
Daar is verskeie advertensiebanierformate op die web, sommige meer treffend as ander. Sommige van die mees geskikte om ‘n produk te verkoop is die volgende:
Kop-styl baniere is diegene wat is boaan die bladsy geleë. Omdat hulle ten volle sigbaar is, is dit diegene wat die meeste verkeer genereer, dit wil sê, hulle bereik die grootste aantal mense.
Die reghoekige banier aan die onderkant van die bladsy, dit is die algemeenste, alhoewel hulle op die lang termyn nie soveel besoeke as die opskrifte verskuif nie baie mense bereik.
Banier in inhoud, dit is die baniere wat jy kan in die middel van ‘n bladsy vind wanneer jy byvoorbeeld die nuus lees, is hulle meer geneig om gesien te word omdat hulle onverwags inbars, synde een van die wat die meeste verkeer genereer.
Mees gebruikte kodes in CSS om advertensiebaniere te maak
Die kodes is die basis van die banier, daar is ‘n groot verskeidenheid kodes wat sekere aspekte daarvan redigeer, of dit nou tipografie, kleur of rand is. Hieronder sal ons ‘n paar van die mees gebruikte in advertensiebaniere noem:
Die kode ‘Font familie’wat ‘n tipografiese font daarstel, vergesel van die ‘font-styl’, wat die styl definieer (normaal, kursief of skuins). Ons het ook ‘font-variant‘ wat kleinletters na hoofletters omskakel, maar kleiner; ‘grens: 1px solied #000’ wat die rande aanpas, ‘kleur: #fff’ vir tekskleur en ‘wydte: 100px’ vir breedte in pixels, spesifiek 100 pixels.
Vir grafiese elemente
Die gewildste CSS-kodes vir die wysiging van beelde is ‘breedte’ wat die breedte van ‘n element of beeld verander, gewoonlik gedefinieer in pixels, ‘hoog’ definieer die hoogte van ‘n element ‘agtergrondkleur’ wat die agtergrondkleur van ‘n element verander, ‘agtergrondprent‘ wat uiteindelik die agtergrondprent vir ‘n element sou wees ‘agtergrondposisie’ wat die posisie van die prent binne die agtergrond aandui.
Vir spasies of kantlyne
Die gewildste in hierdie kategorie is: ‘marge-top’ wat marge op is, ‘kantlyn-regs’ om die kantlyn na regs te skuif, ‘marge-bottom’ beweeg marge af, ‘kantlyn-links’ linkerkantlyn, ‘letterspasiëring’ ruimtes te skep.
om teks by te voeg
Ten slotte is die kodes wat ons gebruik om die teks van ons banier te wysig ‘Font familie’ om die lettertipe te stel, ‘font-styl’‘font-variant‘Y ‘font-gewig‘ wat die dikte van die lettertipe wysig.