Malperek bersivdar naha ji bo karsaziyek serhรชl pรชdivรฎyek bingehรฎn e. Lรช bi rastรฎ tรช รงi wateyรช ku meriv malperek bersivdar e รป feyde รป feydeyรชn rastรฎn รงi ne? Bixwรฎnin da ku hรปn fรชm bikin ka meriv รงawa malpera xwe veguhezรฎne amรปrek hรชzdar รป berbelav ku hewcedariyรชn temaลevanek zรชde girรชdayรฎ รป mobรฎl peyda dike.
Naha domaina xwe tomar bikin รป ji bo her hewcedariyรช pakรชta mรชvandariyรช hilbijรชrin. Bikaranรฎna hรชsan รป kontrolkirina malpera xwe bรชyรฎ dijwarรฎ! Dest bi hilbijartina karรปbarรช mรชvandariya xweya nรป bikin!
ย
ย Pakรชtรชn mรชvandariya me kifล bikin!
Malperek bersivdar รงi ye?
Malperek bersivdar hatรฎ sรชwirandin lรฎsteya jimareya tรชlefonรช ya 2024-a nรปvekirรฎ ji cรฎhanรช ku bixweber bi her ekranรช re were adaptekirin! รงi sermaseyek! tablet an smartphone be. Ev tรช vรช wateyรช ku sรชwirandin! wรชne รป naverok mezinbรปn รป ji nรป ve saz dikin da ku ezmรปna รงรชtirรฎn bikarhรชner a gengaz pรชลkรชลรฎ bikin ! bรชyรฎ ku amรปrรช bikar bรฎnin.
Feydeyรชn malperek bersivdar pir in รป ji adaptasyona hรชsan berbi dรฎmenรชn cihรชreng diรงin.
- Tecrรปbeya bikarhรชner a pรชลkeftรฎ : Malperek ku bi her amรปrekรช ve girรชdayรฎ ye! navรฎgasyonek nerm รป xwerรป pรชลkรชลรฎ dike ! rรชjeyรชn terikandinรช kรชm dike รป dema ku li ser malperรช derbas dibe zรชde dike.
- SEO ya รงรชtir : Google di pozรฎsyona encamรชn lรชgerรฎnรช de ji malperรชn bersivdar hez dike . Hebรปna malperek ku bi cรฎhazรชn cihรชreng re tรชkildar dibe dikare dรฎtina weya serhรชl bi girรฎngรฎ baลtir bike.
- Zelalbรปnek mezintir : Ne hewce ye ku guhertoyรชn cihรชreng รชn malperรช ji bo cรฎhazรชn cihรชreng biafirรฎnin! rรชveberiya naverokรช hรชsan bikin รป lรชรงรปnรชn pรชลkeftin รป lรชnรชrรฎnรช kรชm bikin.
- Zรชdebรปna seyrรปsefera mobรฎl : Bi zรชdebรปna karanรฎna cรฎhazรชn mobรฎl re! malperek bersivdar piลkek bazarรช ya mezin digire ! ku dihรชle hรปn bigihรฎjin hejmareke zรชde bikarhรชneran.
- Berdewamiya Markayรช : Sรชwiranek domdar di hemรฎ cรฎhazan de nasnameya dรฎtbarรฎ ya marqeyรช xurt dike! wรชneyek domdar! profesyonel diafirรฎne.
ย
Hรชmanรชn bingehรฎn รชn sรชwirana bersivdar
Ji bo afirandina malperek bersivdar! pรชdivรฎ ye ku meriv hรชmanรชn jรชrรฎn fam bike รป bikar bรฎne:
Plansaziya herikbar รป torรชn maqรปl
Pรฎvana ลilavรช li ลรปna yekeyรชn meriv รงawa platforma daneya xerรฎdar a xwe xurt dike sabรฎt รชn wekรฎ pixel! yekรฎneyรชn pรฎvanรช yรชn tรชkildar! wek sedรฎ! bikar tรฎnin. Ev nรชzรฎkatรฎ piลtrast dike ku hรชmanรชn sรชwiranรช bi pรฎvana dรฎmenderรช re rรชjeyรฎ dibe .
Mรฎnakรฎ! danรฎna firehiya konteynerek ji% 100 dibe sedem ku ew her gav tevahiya firehiya konteynera dรชรปbavรช xwe dagir bike! bรชyรฎ ku mezinahiya ekranรช be.
Tรปrรชn maqรปl รชn ku li ser bingeha CSS Grid an Flexbox-รช tรชne รงรชkirin amรปrรชn hรชzdar in ku ji bo รงรชkirina sรชwiranรชn ลikilรฎ ne. CSS Grid dihรชle hรปn hรชmanan di nav torek du-alรฎ de saz bikin! dema ku Flexbox ji bo sรชwiranรชn yek-alรฎ รงรชtir e. Her du nermbรปn รป kontrolek mezin li ser sรชwiranรชn bersivdar pรชลkรชล dikin.
Pirsรชn medyayรช
Pirsรชn medyayรช stรปnek sรชwirana daneyรชn hong kongรช bersivdar e. Ew dihรชlin ku hรปn ลรชwazรชn CSS-รช yรชn cihรชreng li ser bingeha taybetmendiyรชn cรฎhazรช bicรฎh bikin ! wek firehiya ekranรช! bilindรฎ! rรชgez รป รงareseriyรช.
Ev tรช vรช wateyรช ku hรปn dikarin nexลeyek biafirรฎnin ku li gorรฎ mezinahiya ekrana bikarhรชner bi rengek dรฎnamรฎkรฎ diguhezรฎne.
Mรฎnakรฎ! pirsek medyayรช dikare diyar bike ku li ser ekranรชn piรงรปktir! naveroka sereke divรช tevahiya firehiya ekranรช dagir bike! dema ku li ser ekranรชn mezin dibe ku ew ji hรชla kรชlekek ve were dorpรชรง kirin.
Pirsรชn medyayรช qaรฎdeyรชn CSS-รช yรชn mรฎna min-fireh รป herรฎ zรชde bikar tรฎnin da ku ลรชwazรชn taybetรฎ bicรฎh bรฎnin dema ku ลert pรชk tรชn.
Wรชneyรชn nerm
Wรชne hรชmanek mecbรปrรฎ ya her malperรช ne! lรช ew dikarin ji bo sรชwirana bersivdar pirsgirรชkek รงรชbikin. Pรชdivรฎ ye ku wรชne bixweber mezinahiya xwe biguhezรฎnin da ku li sรชwirana malperรช biguncรฎnin bรชyรฎ ku kalรฎteyรช winda bikin .
Taybetmendiya srcset HTML destรปrรช dide te ku hรปn guhertoyรชn cihรชreng รชn wรชneyek ji bo mezinahiyรชn dรฎmenderรช yรชn cihรช diyar bikin! รป pรช ewle bin ku bikarhรชner tenรช wรชneya herรฎ guncav ji bo cรฎhaza xwe dakรชลรฎne.
Tรฎpografiya bersivdar
Pรชdivรฎ ye ku tรฎpografรฎ li gorรฎ mezinahiya ekranรช biguncรฎne da ku xwendin รป gihรฎลtinรช misoger bike . Bikaranรฎna yekรฎneyรชn pรฎvanรช yรชn tรชkildar รชn wekรฎ rem รป em dihรชle hรปn tรฎpan bi rรชjeyรฎ pรฎvan bikin. Yekรฎneyรชn rem bi mezinahiya tรฎpa root (html) re tรชkildar in! dema ku em bi mezinahiya tรฎpรชn konteynera xwe re tรชkildar in.
Bicรฎhkirina tรฎpografiya bersivdar tรช vรช wateyรช ku qaรฎdeyรชn CSS-รช yรชn ku mezinahiya fontรช li gorรฎ firehiya ekranรช eyar dikin diyar dikin. Mรฎnakรฎ! li ser ekranรชn piรงรปktir! ji bo xwendina hรชsantir divรช nivรฎs mezin รป bi cรฎh bin.
ย
Meriv รงawa kontrol dike ka malperek bersivdar e
Ji bo kontrol bikin ka malperek bersivda Malpera bersivdar r e! hรปn dikarin รงend rรชbazan bikar bรฎnin:
- Testa Guherรฎna Mezinahiya Gerokรช: Bi destan piรงรปkkirina pencereya geroka xwe รป dรฎtina ku hรชmanรชn malperรช รงawa diguncรฎnin rรชyek hรชsan รป bandorker e ku ceribandina bersivdayรฎnรช ye.
- Bikaranรฎna amรปrรชn serhรชl: Amรปrรชn mรฎna BrowserStack dihรชle hรปn bersivdariya malperรช li ser cรฎhaz รป รงareseriyรชn cihรชreng kontrol bikin.
- Analรฎzkirina kodรช: Kontrolkirina pirsรชn medyayรช รป teknรฎkรชn sรชwirana bersivdar รชn din รชn di CSS-ya malperรช de dikare piลtrast bike ku malper ji bo adaptasyona amรปrรชn cihรชreng hatรฎ รงรชkirin.
Bikaranรฎna รงarรงoveyรชn bersivdar
รarรงoveyรชn bersivdar รชn mรฎna Malpera bersivdarย Bootstrap รป Weqfรช amรปrรชn hรชzdar in ku รงรชkirina sรชwiranรชn bersivdar hรชsan dikin . Van รงarรงove cรปrbecรปr hรชmanรชn pรชล-avakirรฎ pรชลkรชลรฎ dikin! wek ลebek! biลkok รป pรชลek! yรชn ku jixwe xweลtir in ku li ser ekranรชn cihรชreng bixebitin.
Bootstrap : Yek ji รงarรงoveyรชn herรฎ populer! Bootstrap tora 12-stรปnรฎ bikar tรฎne ku dihรชle hรปn cรฎhรช rรปpelรช li yekรฎneyรชn maqรปl dabeล bikin. Bi vรฎ rengรฎ รงรชkirina sรชwiranรชn ku bixweber bi firehiya ekranรช re tรชkildar in hรชsan dike.
Mรฎnakรฎ! hรปn dikarin diyar bikin ku babetek ลeล stรปnan li ser ekranek mezin (col-lg-6) รป diwanzdeh li ser ekranek piรงรปk (col-sm-12) digire.
Weqf : Wek Bootstrap! Weqf ji Malpera bersivdarย bo avakirina sรชwiranรชn bersivdar amรปrรชn maqรปl pรชลkรชลรฎ dike. Ew xwedan torek xwerรป heye ku dihรชle hรปn tevgera hรชmanan li ser cรฎhazรชn cihรชreng diyar bikin. Wekรฎ din! Weqf taybetmendiyรชn pรชลkeftรฎ yรชn wekรฎ gihรฎลtina รงรชkirรฎ รป hรชmanรชn modular รชn ku li gorรฎ hewcedariyรช tรชne zรชdekirin vedihewรฎne.