Videoképernyők 2025, Január
Megvan ez a nyolc legfelső szintű navigációs fül, de a Főoldal az egyetlen, amely "működik". Csak azért, hogy legyen néhány oldalunk, amivel dolgozhatunk, néhány oldalt kitesszük a következőre:
Ha jól emlékszem, a Google Code Prettify programmal alkalmaztam a szintaxis kiemelését a CSS-Tricks kódblokkján. Tudod, hol van egy olyan sorban, mint "
Most telepítettük a Prism.js-t, és működőképessé tettük. Ebben a képernyőn megtaláljuk a Holnap téma nevű témát, és beépítjük a színeit a szintaxisba "
Csináltunk egy kis munkát a fejléceken, de többet fogunk találni ezeken a képernyőn. A fejlécek minden webhelynek fontos szempontjai. Jól végzett "
Most, hogy van egy blogbejegyzés területünk, amellyel dolgozhatunk, valóban belemerülhetünk a blogbejegyzések tipográfiájába. A webhely vitathatatlanul legfontosabb tipográfiája, mivel "
Szerintem nagyon szép, ha van egy egyedi fájl (.scss), amely a tipográfia túlnyomó többségéhez tartozik az oldalon. A Normalizálás elég sok tipográfiával rendelkezik "
A Typecast (a forgatás idején bétaverzióban) egy nagyon ügyes webalkalmazás a webes tipográfiával való játékhoz. Remek kezelőfelületet kínál a játékhoz "
A "Ne gondold túl a rácsokat" koncepciót folytatva, csak néhány egyszerű párnázás segítségével kapunk ereszcsatornákat a rácsban. Megtartjuk a kitöltési számot "
Mielőtt néhány tipográfiai munkát végeznénk, azt gondoltam, hogy kijavítjuk a bosszantó dolgot, ahol a képek a cikk és a rácson kívül esnek el. A "
Most, hogy egyedi helyi tartományt futtatunk, használhatjuk a PHP-t. A "P" a MAMP-ban a "PHP" =). A PHP használata azt jelenti, hogy használhatjuk a következőket: Például: "
Írhatnánk saját Sass @mixins-t, hogy segítsünk a CSS3-as dolgokban (például a színátmenetekben), de van már Sass keretrendszer, Compass néven, amely
A webhely kialakítása nagyon rácsszerűvé válik. Moduljaink nagyon tisztán helyezkednek el egy rácsba. De a rácsok nem összetettek és furcsák? És talán mi "
Ebben a szupergyors képernyõben a MAMP segítségével állítunk be egy URL-t, amelyet felhasználhatunk a helyi fejlesztéshez. Ez számos okból hasznos: Linkelhetünk a következőre:
Bemutatjuk a @media lekérdezések fogalmát a CSS-ben. Sok minden, amit a Sass használata ebben a projektben lehetővé tesz számunkra, az az, hogy SZÁRAZ maradjon (ne ismételje meg magát). Megcsináltuk"
Kezdjük azzal, hogy kissé módosítjuk a logótípust, de aztán átugrunk ikonok hozzáadásával a fő navigációba. Amikor a navigációt a Photoshopban terveztük (Video "
Felállítottunk egy új Kitet a Typekitben a v10-hez. A márkaépítéshez egyelőre a Proxima Nova Soft programot és néhány más betűtípust fogunk használni, amelyek a HF & J betűkhöz hasonlóan mutatnak a "
Eddig a tényleges webhely egyáltalán nem hasonlít a Photoshop tervezésére. Ebben a képernyőn átgondoljuk, hogy pontosan ezt tegyük, kezdve a tetején a "
Néhány pozicionálási trükköt használunk a logó bal szélének és a fő tartalmi területnek a felsorolására, miközben a fejléc továbbra is a "
A felhasználói ügynök (alapértelmezett) CSS eltávolítása a legtöbb elemből általában jó ötlet. Ezt régóta "univerzális" alaphelyzetbe állítások vagy olyan dolgok hajtják végre, mint az Eric "
A Photoshop-makett nézegetése közben elkezdünk írni HTML-t, hogy leírjuk, mit is nézünk. Természetesen a HTML5-öt használjuk, amikor csak "
Kezdjük eldobni a szöveget a fő navigációban, csak azért, hogy lássuk, hogyan fog illeszkedni, hogyan működik a méretezés, a színek stb. Néhány szöveg elég szorosan illeszkedik "
Biztosan nem vagyunk örökre "készen" a Photoshopban ehhez a tervezéshez, de van annyi munkánk, hogy elkezdhessük ennek a tervnek a létrehozását a böngészőben. Után"
Elkezdjük a webhely legfelső szintű (fő) navigációjának tervezését. Az asztal méretének képernyőjével kezdjük (elismerten tetszőleges szélességgel), de "
A fejléc / márkajelző doboz alá adunk néhány extra réteget, hogy a "papírköteg" kinézetet kapjon. Nincs nagy metafora vagy bármi, csak némi látványt ad hozzá "
Az egész webhely "modulokra" épül. Minden apró dolog szó szerint egy dobozban lesz (vizuálisan és végső soron a kódban is). Mi"
Ez egy hangfelvétel egy Skype-hívásról Erin Kissane és jómagam között. Erin írta a tartalmi stratégiáról szóló könyvet, így szerencsés voltam, hogy segítséget kaptam és "
A böngészőben történő tervezés fantasztikus és minden, de a Photoshop alkalmazással a legkreatívabb vagyok, amikor a legnagyobb szükségem van rá: amikor az üres vászonnal nézek szembe. "
Üdvözöljük! Ez elég nagy út lesz, és mint minden út, ez is egyetlen lépéssel indul. Első lépésünk a "
Ez az újratervezés nem csak az újratervezés kedvéért. Minden elképzelhető módon szeretnék fejleszteni a webhelyen, amellyel javíthatja a webhelyet. Az egyik"
Beszéltünk már az SVG kézzel történő optimalizálásáról. Manuálisan dönt a részletekről és arról, hogy milyen dolgokat lehet kombinálni vagy eltávolítani. Ebben"