Ionnsaich a bhith nad mhaighstir Zen air markup

Tha an comharrachadh, no an comharrachadh, a ’toirt iomradh air cànanan markup no tagadh mar a tha iad HTML agus CSS, agus tha fios againn uile cho pianail sa tha e bileagan fhosgladh is a dhùnadh aon ri aon gus teamplaid lìn a chruthachadh ...

Gu dearbh tha fuasglaidhean ann airson seo, tha aon dhiubh fèin-thoilichte le leithid IDE Dreamweaver shit gorm-ghiffon annasach mura ceannaich thu plugins bhuaithe o Deasachadh Komodo glè throm... is e a ’phuing gu bheil luchd-deasachaidh IDE no còd a tha ro luchdaichte le roghainnean gu tric a’ cur bacadh air an obair ann an dòighean do-thuigsinn; tha a leithid ann Dreamweaver tha sin gad lìonadh le còd sgudail na tha thu a ’gineadh gu grafaigeach agus a tha trom, daor agus grànda. gorm-ghiffon tha e gu ìre mhòr draghail oir tha e an-asgaidh, an-asgaidh, ach tha leth de na roghainnean glèidhte airson luchd-cleachdaidh pàighte ... chan eil sin spòrsail. Agus mu dheireadh tha againn Komodo-deasaich, a tha gu math, cumhachdach agus làn roghainnean ach tha e trom (100mb in iddle) agus tha e duilich a stèidheachadh.

Chan e an armachd as fheàrr le leasaiche lìn no dealbhaiche lìn na IDE ann an stoidhle tanca cogaidh le mìle armachd air a mhullach, tha e na dheasaiche teacsa sìmplidh, cuid de plugins agus an comas a bhith a ’taipeadh mar neach tinn ... ris an sin cuir draoidheachd na Còdachadh Zen agus bidh anns na corragan aca an inneal as fheàrr airson comharrachadh a chaidh a chruthachadh a-riamh (co-dhiù dhòmhsa).

Ach ... dè an ifrinn a th ’ann Còdachadh Zen?

Gu sìmplidh, is e plugan sònraichte a th ’ann a tha a’ frithealadh mar ìre tarraing-sìos airson HTML agus CSS a chaidh a chruthachadh a-steach Javascript agus ri fhaighinn le mòran de na foillsichearan as ainmeil (notepad ++, Komodo-edit, Gedit, Kate, Bluefish, Geany, Dreamweaver, msaa).

Aha, chan eil mi fhathast a ’tuigsinn beachd damn dè tha thu ag ràdh ...

Mar sin tha mi a ’sealltainn dhut le eisimpleir shìmplidh; Cuimhnich air an rud toirt air falbh? Uill, atharraich e gu crìonadh, smaoinich gun gabh thu loidhne de chòd HTML / CSS a thuit ann an aon loidhne agus gun fhosgladh mar chùirteir no a phasgadh air ais ... A bheil thu airson faicinn ciamar? Feumaidh tu dèanamh cinnteach gu bheil dà rud agad airson toirt air obrachadh:

Air adhart Còdachadh Zen air a stàladh anns an deasaiche agad.
Dèan eòlas air na h-òrdughan agus an co-chòrdadh gus a chleachdadh.

Ceart gu leòr, corragan chun chòd:

html>head+body

Faic an loidhne còd sin? Uill sin an co-chòrdadh airson HTML, tha e sìmplidh:

An toiseach cuiridh tu ainm an taga (html) an uairsin tha thu a ’comharrachadh dè na tagaichean a tha gu bhith taobh a-staigh an taga sin (>) agus an uairsin ainm nan tagaichean a tha a’ dol am broinn an taga sin (ceann agus bodhaig). Tha an soidhne ‘+’ a ’sealltainn gu bheil ceann agus bodhaig nan dà bhileig eadar-dhealaichte agus nach eil an dàrna cuid taobh a-staigh an taobh eile, tha e coltach ri bhith ag ràdh«còmhla ach gun mheasgachadh«… An uairsin, chì sinn dè a chruthaicheas an loidhne còd sin nuair a bhrùthas na h-iuchraichean draoidheachd (anns a 'chùis agam CTRL + E.):

Gu dìreach, 4 sreathan de chòd air an dèanamh a-steach do aon, a tha a ’nochdadh gu draoidheil nuair a bhrùthas tu air a’ chothlamadh iuchrach cheart… agus faodaidh tòrr a bharrachd a bhith ann; mar eisimpleir:

html>head+body>ul#lista_ordenada>li.listilla*5

An aon chiallachadh, ach cuiridh sinn rudeigin eile ris ... ma tha thu eòlach air cuid de CSS tuigidh tu gu bheil sinn a ’cur ID, clasaichean agus, rudeigin nach robh fios agad gu cinnteach; luchd-iomadachaidh ... dè tha seo! Fuck thu troimh-chèile mi!

Gabh air do shocair, tha seo gu math sìmplidh, dh ’innis sinn dha na tha gu h-àrd gu bheil taobh a-staigh a’ chuir a-steach taga «ul», chan eil dad neònach, mhìnich mi seo gu h-àrd, an uairsin, bidh sinn a ’sònrachadh ID, ma tha fios agad air CSS tuigidh tu gu bheil iad sin air an comharrachadh leis an soidhne ‘#’, agus taobh a-staigh an liosta neo-òrdaichte sin (ul) bidh sinn a ’cur còig bileagan leis a’ chlas (clas) listilla, bidh mi a ’mìneachadh seo gu h-aithghearr. Gu dearbh tha e gu math sìmplidh, tha ‘#’ a ’comharrachadh gur e ID a th’ ann, an uairsin tha ‘li.listilla’ ag ràdh gum feum sinn bileag «li» a chruthachadh leis a ’chlas listilla« li class = listilla »agus an uairsin, bidh sinn ag ràdh«ath-aithris a mhaireas còig tursan«. Dè a bheir dhuinn mar thoradh air:

Dusan loidhne de chòd air a sgrìobhadh ann an aon loidhne agus ann an ùine nas lugha 😉

Agus faodar sin a dhèanamh cuideachd le CSS, ged nach leudaich mi an artaigil le bhith a ’sealltainn na tha follaiseach (gu h-ìosal bheir mi seachad liosta iomlan de mhealltairean dhut Còdachadh Zen).

Feumaidh mi a dhaingneachadh nach obraich seo gus zillion ceud mìle loidhne a dhèanamh ann an aon, o chan e, tha crìoch agus dòigh air seo a chleachdadh. Mar eisimpleir ma tha sinn airson rudeigin mar seo a dhèanamh:

html>head>title+meta+body>ul#lista_ordenada>li.listilla*5

Dè ann an teòiridh a bu chòir seo a thoirt dhuinn (thoir sùil air an loidhne comharraichte san ìomhaigh mu dheireadh):

Bheir e seo dhuinn:

A tha a ’sealltainn nach urrainn dhut draoidheachd a dhèanamh le seo an dàrna cuid; Cuimhnich gum feum maighstir Zen den chòd a bhith mionaideach agus luath, agus bidh a bhith a ’dèanamh rudan ceàrr a’ toirt air falbh astar agus ùine, mar sin, an dòigh cheart airson sgrìobhadh gu sgiobalta agus le Còdachadh Zen bhiodh seo:

html>head>body>ul#lista_ordenada>li.listilla*5

Bidh thu a ’leudachadh agus taobh a-staigh an taga cinn:

title+meta

A bheireadh an còd ceart dhut:

Ged a tha Còdachadh Zen Tha tòrr a bharrachd rudan aige ri shealltainn dhut agus is dòcha nach e a bhith a ’sgrìobhadh loidhne-àithne eile taobh a-staigh ceann an rud as fheàrr, agus mar sin bidh sinn a’ cleachdadh àithne eile, «leudachadh le giorrachadh"anns a 'chùis agam ctrl + alt + e fosglaidh sin bàr beag far an urrainn dhuinn còd Zen a sgrìobhadh agus faicinn mar a nochdas e ann an àm fìor. Bi faiceallach, chan eil mi a ’moladh a h-uile càil a sgrìobhadh le seo ach sgrìobhadh taobh a-staigh nan structaran a chaidh a chruthachadh mar-thà, is e sin, cruthaich na structaran mòra an toiseach agus an uairsin bheir thu mion-fhiosrachadh annta leis an roghainn seo.

Agus tha mòran de òrdughan fìor fhionnar taobh a-staigh an Còdachadh Zen, is e an rud gu bheil thu gan sgrùdadh aon uair ‘s gu bheil thu gan stàladh agus ag ionnsachadh an cleachdadh; Leis a ’phlug seo cha bhith feum agad air fèin-ghluasad no criomagan airson css no html, gu dearbh, le seo tuigidh tu gur e sgudal ùine iomlan a th’ anns na roghainnean sin taobh a-staigh an dà chànan prògramaidh sin 😉

Agus dhaibhsan aig a bheil ùidh, seo an CheatSheet oifigeil den Còdachadh Zen, chì thu e ann an cruth ODF o PDF meadhanach math AN SEO


Tha susbaint an artaigil a ’cumail ri na prionnsapalan againn de moraltachd deasachaidh. Gus aithris a dhèanamh air mearachd cliog an seo.

20 bheachd, fàg do chuid fhèin

Fàg do bheachd

Seòladh-d cha tèid fhoillseachadh.

*

*

  1. Uallach airson an dàta: Miguel Ángel Gatón
  2. Adhbhar an dàta: Smachd air SPAM, riaghladh bheachdan.
  3. Dìleab: Do chead
  4. Conaltradh an dàta: Cha tèid an dàta a thoirt do threas phàrtaidhean ach a-mhàin fo dhleastanas laghail.
  5. Stòradh dàta: Stòr-dàta air a chumail le Occentus Networks (EU)
  6. Còraichean: Aig àm sam bith faodaidh tu am fiosrachadh agad a chuingealachadh, fhaighinn air ais agus a dhubhadh às.

  1.   mafuinn thuirt

    Tha e glè inntinneach dhomh!

    Tha mi a ’dol a dh'fheuchainn gu cinnteach!

  2.   mafuinn thuirt

    Aon cheist, nach bu chòir an cruth "ceann> corp" corp a chruthachadh am broinn a ’chinn? Gus na tha sinn ag iarraidh fhaighinn, nach bu chòir dhuinn "ceann + corp" a chuir?

    Ma tha mi troimh-chèile tha mi duilich!

    Gracias

    1.    Nano thuirt

      Tha, tha ainm taga sam bith roimhe le ">" a ’nochdadh gu bheil e a’ dol taobh a-staigh an taga a chaidh ainmeachadh roimhe; anns a ’chùis seo, mar a chanas tu, tha ceann> bodhaig a’ comharrachadh gum biodh an corp a ’dol am broinn a’ chinn, rud a tha fios againn a tha ceàrr.

      Agus tha, tha ceann a bharrachd air a ’bhodhaig coltach ri concatenating, tha thu ag innse dha gum bi iad a’ dol am broinn taga eile ach nach bi gin dhiubh a ’dol am broinn an fhir eile, sa chùis seo html> head + body

  3.   Seacharto thuirt


    Amen

  4.   103 thuirt

    Glè, glè mhath, gu pearsanta is fheàrr leam luchd-deasachaidh teacsa sìmplidh a chleachdadh airson an seòrsa rud seo agus Zen Coding oir is e seo an rud as fheàrr a chunnaic mi airson HTML.

    Chòrd seo rium gu mòr: html: xt agus dhaibhsan a tha airson a bhith an dùil htlm: 5

  5.   auoszx thuirt

    Hmm, uill cha do chleachd mi prògraman coltach ri Dreamweaver a-riamh, feumaidh mi an Zen Coding seo fheuchainn ...

    PS: Am pàipear-balla sin a th ’agad… an ann le teans an tè a rinn mi?

    1.    Nano thuirt

      Tha ach am fear bho FromLinux

  6.   Esaeil thuirt

    Glè mhath, bha luchd-deasachaidh teacsa aotrom a-riamh a ’còrdadh rium, is e am fear a tha mi a’ cleachdadh a-nis Geansaidh agus tha a bhith a ’faicinn gu bheil e a’ faighinn taic airson an teapot draoidheachd gu cinnteach gam bhrosnachadh gus feuchainn air

  7.   Lupine III thuirt

    Uill, chan e prògramadh an rud a th ’agam, dè a chuir às dhomh an deasg, dè a bhios tu a’ cleachdadh, gnome 3 no aonachd, dè a th ’ann? Tha e gu math fionnar, gus faicinn a bheil mi a ’fàgail mèinn coltach ris
    Mura h-eil inntinn agad mo fhreagairt, bhithinn gu math taingeil 😀
    PS: tha, tha mi bho uinneagan, is e seo a tha aig an Oilthigh xD

    1.    Nano thuirt

      Aonachd, leis a ’chuspair bunasach agus lughdaich e neo-sheasmhachd a’ phannail.

      1.    neomyth thuirt

        Bidh mi cuideachd ag obair le uinneagan, leig dhomh meal a naidheachd a chuir ort air an deasg agad gu math fionnar.

  8.   jassandre thuirt

    Tha an artaigil gu math inntinneach ... tha mi ga fhaicinn glè fheumail. Co-dhiù, chuir stàladh plugan Zen Coding airson Gedit iongnadh orm agus is e sin gum feum thu am pasgan iomchaidh a luchdachadh sìos airson Gedit3. Ann an làrach còdaidh oifigeil Zen tha ceanglaichean a ’phlug airson Gedit air an tabhann, ach tha e seann-fhasanta oir tha e airson Gedit 2 a tha ga dhèanamh do-dhèanta a chleachdadh anns an dreach làithreach Gedit3 a rèir an stiùireadh stàlaidh.

    Chan eil plugins Gedit a chaidh a sgrìobhadh airson dreach 2 ag obair anns an dreach 3 ùr, oir tha e a ’cleachdadh GTK3, fhad‘ s a tha Gedit2 a ’cleachdadh GTK2. Gus plugan a chleachdadh ann an Gedit3 feumaidh tu suim a ghabhail de na leanas:

    Directory ùr: ~ / .local / share / gedit / plugins
    Feumar an leudachadh .gedit-plugin ath-ainmeachadh .plugin
    Fosgail am faidhle agus deasaich an ceann-cinn [Gedit Plugin], agus atharraich e gu [Plugin]
    Cuideachd atharraich IAge = 2 airson IAge = 3

    Faodaidh an fheadhainn a chleachdas Gedit3 plugan Zen Coding a luchdachadh sìos bhon cheangal gu h-ìosal:

    https://github.com/mtrovo/zen-coding-gedit3

    Tha mi an dòchas gum bi e feumail dhut.
    Taing.

    1.    air ais thuirt

      THUGAIBH, bha an duilgheadas sin agam dìreach !!

    2.    Ailig-m7 thuirt

      Sgoinneil gun do bhuail thu an duilgheadas a bh ’agam! GRAX!

  9.   Eilidh thuirt

    Gu math feumail, ged airson an deasachadh seo ann an html no cànan sam bith air an lìon agus feadhainn eile is fheàrr leam BlueFish no Aptana Studio.

    Tapadh leibh!

    1.    Nano thuirt

      Bidh Bluefish a ’fàiligeadh ann an rud no dhà mar a bhith comasach air geàrr-dhealbhan agus stuth meur-chlàr a ghnàthachadh, agus chun an latha an-diugh chan urrainn dhomh na cuòtan a dhèanamh fèin-ghluasadach, agus tha sin gam thoirt a-mach à tòrr trioblaid airson a bhith a’ dìochuimhneachadh càraid a dhùnadh.

      Aptana, tha e dìreach a ’còrdadh rium, tha e sgrìobhte ann an Java agus tha eisimeileachd ann a tha a’ cur an siostam agam ann an cunnart ... gun a bhith a ’toirt iomradh air an sin dhòmhsa (tuig gu math, AIRSON ME) Java = shit.

  10.   v3on thuirt

    Tha mi air a bhith ga chleachdadh airson ùine mhòr, air a mholadh!

  11.   Rafael thuirt

    Halo, artaigil exelene ...
    Chan eil mi airson a bhith a ’faireachdainn mar mhaighstir Zen :-), ach an leudachadh a tha thu a’ moladh:

    html> head> title + meta + body> ul # order_list> li.listilla * 5
    (tha sin a ’fàiligeadh leudachadh)

    faodar a dhèanamh ceart le bracaidean gu buidheann, rudeigin mar seo:

    html> (ceann> tiotal + meta) + (bodhaig> ul # òrdaichte_list> li.listilla * 5)
    bidh seo a ’leudachadh mar a bha dùil

    thaobh

  12.   Felipe thuirt

    tha am plugan seo air a stad agus emmet a chuir na àite (http://emmet.io/)

  13.   Ulysses thuirt

    A bheil fios aig duine mar a stàlaicheas mi e ann an Archlinux airson kate? Tapadh leat.