משאבים חדשים עבור מעצבי אתרים ומפתחים (פברואר 2015)

לאחר עושה את זה במשך יותר משנה, החלק הקשה ביותר על כתיבת ערימת המשאבים החודשיים עבור מעצבים ומפתחים הוא המבוא. בזמן שאנחנו בנושא, הנה סיכום פברואר 2015 של המשאבים הטובים והטריים ביותר עבור מפתחי אתרים כמוך.

בפרק זה, אנחנו מסתכלים מיוחד מנוע חיפוש כדי למצוא קטעי קוד - -, מאוד תושייה התייחסות לבעיות במודול Flexbox, ואת כלי הפיתוח של ניהול טוב יותר של צבע, גופן ו gradients.

אנימטור הדרגתי

CSS3 Gradient מאפשר לנו ליצור gradients ללא דמיון באתר שלנו ללא צורך לטעון תמונות. אנחנו יכולים גם לשלב את זה עם CSS3 אנימציה לתת השפעה משכנעת יותר. אבל אם הקוד הוא יותר מדי בשבילך, השתמש בדרך פשוטה אנימטור Gradient ליצור אחד עם ממשק נחמד.

מדריך כיס SVG

מדריך כיס SVG הוא נערך על ידי ג 'וני Trythall. זוהי הפניה שימושי כי ילווה אותך את היסודות של SVG (כגון יצירת צורות וטקסט) כל הדרך לתכונות מתקדמות יותר (כמו יצירת gradients, שבילי נתיבים ודפוסים). הספר מגיע בפורמט Markdown והוא זמין באנגלית ופורטוגזית.

Flexbugs

Flexbox הוא מודול חדש מאוד מבטיח ב- CSS3 זה היה לגמרי לשנות את הדרך בה אנו לבנות פריסות אינטרנט. עם זאת, הוא מגיע גם עם תאימות לדפדפנים בעיות משלה. מאגר זה, Flexbugs, הוא אוסף של באגים אלה ואת הדרכים לעקיפת הבעיה כדי לטפל בהם. זהו משאב מאוד שימושי עבור כל מי שחי על קצה הדימום של האינטרנט.

אייקון

זה מדהים מה אנחנו יכולים להשיג עם CSS פשוט כמו ליצור סמל נוכחי לחלוטין באמצעות רק אלמנט אחד. אייקון היא הספרייה שעושה את זה. בספריה זו, תוכלו למצוא אוסף של סמלים מוכרים המבוצעים רק עם אלמנט אחד ו- CSS. סמלים אלה יטענו מהר יותר וניתנים להתאמה אישית יותר מאשר סמלים מבוססי תמונה.

דילינג'ר

דילינג'ר הוא עורך עיניים מרצון. כאן אתה יכול לכתוב בפורמט Markdown, ומיד לראות את הפלט על הכרטיסיה יד ימין. לנוחותך Dillinger מאפשר לך לייצא את העבודה שלך HTML, PDF, או רק בפורמט קובץ Markdown לאחר שעשית. לחלופין, ניתן גם לחבר אותו לשירות צד שלישי כמו Dropbox ו Github שבו אתה יכול לשמור את הקובץ שלך.

HTML5Up

HTML5Up הוא אוסף של תבניות מבוססות HTML5 חינם. אתה יכול למצוא קומץ של פריסות כי לשרת סוגים שונים של אתרי אינטרנט: עסקים, תיק או סתם בלוג פשוט. כל התבניות מגיבות גם להבטיח כי התוכן ואת פריסת האתר מהנים בגדלים שונים המסך.

צבעי CSS

פעם תוהה מה צבע מסוים נקרא? צבעי CSS מראה את שם הצבע, כמו גם את הקס ו RGBA פורמט עבור אוסף של צבעים בסיסיים. זה מקור טוב למצוא את השילוב המושלם צבע עבור אתרי האינטרנט שלך.

Emmet מחדש להציג

'תצוגה מחדש' היא תוסף של Chrome המנתח את האתר שלך @media שאילתות ומציג את האתר שלך בכל אחד breakpoints שצוין בכל @media שאילתא. אם אתה מחפש כלי שיכול לחסוך לך קצת זמן בעת ​​בדיקת אתרי אינטרנט תגובה, אז זה הכלי שאתה צריך.

סוג

אם תסתכל על ספריית גופן של Google, תוכלו למצוא הרבה גופנים משתנים פרצופים, משפחה, משקל, וסוגים. לפיכך בחירת הצמד הנכון או שילוב של גופנים יכול להיות משימה מוחץ אמיתי. סוג עושה בחירת זוגות גופן פשוט ומהיר אפשרי עבור האוכלוסייה הכללית.

חיפוש

כפי שהשם אמר, זהו מנוע חיפוש כדי לחפש קודים או קטעי קוד של שפות תכנות רבות, כולל JavaScript, C, PHP. מנוע חיפוש זה יניב את התוצאה שלו ממקורות רבים כגון Github, Bitbucket ו- Google Code. זהו כלי חובה חייב להיות עבור coders כבד.