01Kā tas atšķiras no veidņu izvēlnes
Veidņu galerijas parāda gatavu dizainu un lūdz, lai jums tas patīk vai nepatīk. Šis rīks iet vienu slāni dziļāk: katrs no sešiem turpmākajiem virzieniem balstīts uz īstu, strādājošu fotogrāfa portfolio, kas tika patiešām izpētīts (ekrānuzņēmumi, dzīvais izkārtojums, aprēķinātās krāsas, aprēķinātie fonti), nevis uz paleti, ko kāds izdomājis, lai tā skaisti izskatītos krāsu paraugā. Piemēram, redakcionālajā virzienā izmantots EB Garamond, jo tieši šajā burtveidolā ir salikta īsta modes fotogrāfa vietne, un tas saskaņots, tieši izpētot lapu.
Divi paraugi parādījās gandrīz visās īstajās vietnēs, uz kurām šis rīks balstīts, un tie ir iestrādāti katrā virzienā: navigācija paslēpta aiz vienas hamburgera ikonas bez redzama saišu saraksta, pat datorā, un vienlaikus viens liels attēls, nevis režģis. Saskarnes krāsas visur ir gandrīz nulle: krāsu dod fotogrāfija, nevis saskarne.
02Ko jūs iegūstat beigās
Viena strukturēta uzvedne, kas aptver kopējo virzienu, precīzas hex krāsas, fontu nosaukumus un savienojumu, lapu sarakstu, navigācijas uzvedību, galerijas izkārtojumu un attēlu ietvarus, iekļaujamās funkcijas, hostinga ieteikumu ar reālām izmaksu atšķirībām un fiksētu būvkvalitātes prasību kopumu (pieejams alt teksts, adaptīvi pārtraukuma punkti, nekādu cieti ierakstītu noslēpumu, slinki ielādēti attēli). Ielīmējiet to savā iecienītajā MI kodēšanas lietotnē, un tai ir viss nepieciešamais, lai sāktu.
03No uzvednes līdz dzīvai vietnei: pilns ceļvedis
Uzvedne ir dizaina uzdevums, nevis finiša līnija. Šeit ir katrs solis starp tās nokopēšanu un īstu URL, ko varat likt uz vizītkartes, bez maksas vai gandrīz bez maksas.
Nokopējiet uzvedni un atveriet MI kodēšanas lietotni
Der Claude, Cursor, Claude Code, Windsurf vai Replit MI aģents, jebkas, kas jūsu vietā var rakstīt un saglabāt failus, ne tikai tērzēt. Ja neesat tādu lietojis, pārlūka opcijai, piemēram, claude.ai vai Replit, instalēšana nav vajadzīga: ielīmējiet uzvedni kā pirmo ziņu.
Ļaujiet tai izveidot, tad patiešām apskatiet, ko tā izveidojusi
Palūdziet izveidot vietni kā statisku HTML/CSS/JS (vai kā norādīts uzvednes hostinga sadaļā) un parādīt priekšskatījumu. Pārbaudiet sešas lietas, ko uzvedne prasīja (krāsas, fontus, galerijas uzvedību, navigāciju, ietvarus, lapas), pirms ejat tālāk. Nepareizu akcentkrāsu salabot tagad ir daudz lētāk nekā pēc tam, kad fotogrāfijas jau ievietotas.
Nomainiet uz savām īstajām fotogrāfijām, biogrāfiju un kontaktinformāciju
Aizstājiet katru vietturi attēlu un katru aizpildījuma teksta rindu. Palūdziet MI lietotnei katrai fotogrāfijai uzrakstīt īstu, konkrētu alt atribūtu, nevis „image1.jpg“, bet reālu aprakstu, jo tā ir gan pieejamības prasība, gan neliels SEO pluss. Šis ir arī brīdis, kad jāpārbauda, vai kontaktforma tiešām norāda uz e-pasta adresi, ko jūs lasāt.
Izvietojiet to bezmaksas hostingā
Ja izvēlējāties līmeni „Statiska & bezmaksas“, palūdziet MI lietotnei jūs pavadīt, savienojot projekta mapi vai GitHub repozitoriju ar vienu no hostiem, kas norādīti augstāk esošās izvēlnes lapā Hostings. Visi četri veido un izvieto automātiski pēc katras izmaiņu nosūtīšanas; pēc savienošanas nekādas manuālas augšupielādes.
Savienojiet savu domēnu (neobligāti, bet vērts)
Bezmaksas apakšdomēns (piemēram, yourname.netlify.app) sākumam der labi. Kad esat gatavs yourname.com, tas ir domēna pirkums plus viena DNS izmaiņa, kas sīki aprakstīta tālāk.
04Kuru bezmaksas hostu izvēlēties?
Jebkurš no šiem bez maksas ieliks statisku vietni tiešsaistē, ar bezmaksas HTTPS un bezmaksas līmeni, kas viegli sedz personīgā portfolio trafiku. Bezmaksas līmeņa ierobežojumi mainās diezgan bieži, tāpēc lapā Hostings norādītos skaitļus uztveriet kā vispārēju ainu, nevis precīzus pašreizējos datus, un pirms izvēles pārbaudiet katra pakalpojuma sniedzēja cenu lapu.
Palūdziet MI kodēšanas lietotnei izpildīt faktiskos izvietošanas soļus kopā ar jums: „savieno šo projektu ar Netlify“ ir pilnīgi normāls lūgums, un tā parasti var jūs pavadīt cauri konta izveidei un pirmajai izvietošanai dažu minūšu laikā.
05Domēna savienošana
Domēns ir neliela gada maksa (parasti 10 līdz 20 USD gadā atkarībā no paplašinājuma), atsevišķa no hostinga, kas paliek bezmaksas. Trīs daļas:
- Nopērciet domēnu. Namecheap, Cloudflare Registrar vai Google Domains pēctecis (Squarespace Domains).
- Pievienojiet DNS ierakstu. CNAME (vai A ierakstu), kas norāda jūsu domēnu uz hostu, pievienots reģistratora panelī. Tās ir divas rindas reģistratora tabulā:
CNAMEpriekšwww, kas norāda uz adresi, ko jums dod hosts, piemēram,your-portfolio.netlify.app, unAieraksts tīrajam domēnam, kas norāda uz hosta IP. - Pievienojiet to hostā. Ielīmējiet to pašu domēnu sava hosta iestatījumos „custom domain“; HTTPS izveidojas pats.
Katram hostam lapā Hostings ir cilne „Custom domain“ vai „Domains“, kas parāda precīzo pievienojamo ierakstu: nokopējiet to, pievienojiet pie sava reģistratora un gaidiet. DNS izmaiņas parasti stājas spēkā dažās minūtēs līdz dažās stundās, reizēm līdz 24 līdz 48 stundām. Jūsu MI kodēšanas lietotne var jūs pavadīt cauri jūsu reģistratora panelim, ja iestrēgstat; nofotografējiet iestatījumu lapu un pajautājiet, kur klikšķināt. Redzams slēdzenes simbols, nav brīdinājuma „nav drošs“: tā ir finiša līnija.
06Pārbaudes saraksts pirms palaišanas
Piecas minūtes ar šo sarakstu notver lielāko daļu no tā, kas liek portfolio izskatīties nepabeigtam. Pārbaudes ir augstāk esošās izvēlnes lapa Pirms palaišanas; atķeksējiet tās pa ceļam.
07Biežāk uzdotie jautājumi
Nē. Jūs izdarāt vizuālas izvēles, rīks uzraksta detalizētu uzvedni vienkāršā angļu valodā, un jūsu MI kodēšanas lietotne to pārvērš pašā vietnē.
Katrs virziens balstīts uz īstu, strādājošu fotogrāfa portfolio, kas tika tieši izpētīts, nevis izdomāts no nulles, līdz pat precīza fonta saskaņošanai ar īstu vietni.
Nav konta, nav reģistrēšanās, nekas nav jāmaksā. Fotogrāfijas, ko nometat uz atskaņošanas indeksu, tiek zīmētas uz audekla jūsu pārlūkā un to nekad neatstāj.
8 līdz 20 jūsu labākie attēli, eksportēti kā optimizēti JPG vai WEBP, īsa biogrāfija un logotips, ja tāds ir. Tas ir uzskaitīts piezīmēs zem sienas.