أفضل 25 مقالة تصميم ووردبريس من 2016
نشرت: 2016-12-22كان عام 2016 مليئًا بالاتجاهات الجديدة الرائعة في عالم تصميم الويب. من دروس CSS الجديدة إلى أفضل ممارسات WordPress إلى النصائح العملية لتنمية وكالتك ، قمنا بتغطية كل ذلك في The Layout.
للتأكد من عدم تفويتك لأفضل محتوى لدينا لهذا العام ، قمنا بتجميع أكثر القصص شعبية لدينا حتى تتمكن من قراءة أفضلها قبل بدء عام 2017.
لذلك دون مزيد من اللغط ، إليك أفضل 25 مقالًا عن تصميم ووردبريس من 2016.
25. أفضل 10 ملحقات WordPress مفضلة لدينا
إن غربلة دليل WordPress Plugin يشبه إلى حد ما الوقوف في متجر للحلوى - فكلها تبدو مثيرة للغاية لتجربتها! وفي هذه الأيام ، هناك مكون إضافي لكل شيء تقريبًا: التحسينات الأمنية ، وتعزيزات الأداء ، وتحسين محركات البحث ، والقائمة تطول وتطول.
في النهاية ، فإن المكونات الإضافية التي تقرر تثبيتها متروكة لك تمامًا ولاحتياجات موقعك. ولكن لمساعدتك في بدء الفرز عبر الجماهير ، قمنا بتجميع قائمة بأهم 10 مكونات إضافية.
24. ما تحتاجه لبناء مدونة جميلة على ووردبريس
يعد التدوين أداة رائعة لزيادة الوعي بالعلامة التجارية أو تنمية الأعمال التجارية أو حتى مجرد استخدامها كمنفذ إبداعي. وفي هذه الأيام ، أصبح إنشاء موقع الويب الخاص بك أسهل من أي وقت مضى.
هل أنت مستعد لبناء مدونة WordPress التي تحلم بها؟ إليك ما ستحتاجه للبدء.
23. 17 خطًا مجانيًا للتنزيل في عام 2016
تبحث لتحديث مكتبة الخطوط الخاصة بك مع بعض المحارف الحديثة؟ وجدنا بعض الخيارات الرائعة التي تم إصدارها هذا العام وكان علينا فقط المشاركة!
فيما يلي 17 خطًا مجانيًا ممتازًا لمنح مشروعك المظهر المثالي.
22. أين تجد أفضل الصور المجانية لعام 2016
هل تبحث عن صورة مخزون مجانية عالية الجودة؟ ليست صورة مخزنة عامة لطيفة. صورة حقيقية تجذب الانتباه ، تتميز بالعمق واللون وتلميح من "قصة" عنها. نحن نعيش في تقاطع مصادفة بين التصوير الرقمي والاقتصاد التشاركي والإنترنت. تظهر مواقع مشاركة الصور المجانية التي تعرض صورًا عالية الجودة في جميع أنحاء الويب ، وتقدم بوفيهًا رائعًا من صور Creative Commons Zero (CC0).
فيما يلي خمسة من مواقعنا المفضلة للعثور على أفضل الصور المجانية.
21. 32 موضوعًا مجانيًا ورائعًا من قوالب WordPress يمكنك الاطلاع عليها في عام 2016
سواء كنت تعمل على موقع WordPress لامع وجديد تمامًا أو تقوم بتحديث العلامة التجارية على موقع موجود ، فقد حان الوقت بين الحين والآخر للعثور على سمة جديدة للعمل معها. وعلى الرغم من وجود الكثير والكثير من السمات المميزة الممتازة ، إلا أنه من الرائع مواكبة سمات WordPress المجانية أيضًا. خاصة إذا كنت تعمل مع عميل أصغر بميزانية محدودة ، فإن العديد من هذه السمات المجانية ستوفر الوظائف الأساسية والخيارات التي يحتاجون إليها.
تحقق من قائمتنا الخاصة بموضوعات WordPress المجانية الرائعة من عام 2016!
20. كيف تصنع قالبًا فرعيًا لـ WordPress
عادة ، يكون العثور على السمة المثالية أقرب إلى المستحيل ؛ هناك دائمًا بعض التعديلات التي يجب القيام بها. لذا ، لماذا لا تأخذ سمة افتراضية لطيفة لـ WordPress ، مثل Twenty Fifteen ، وتجعلها خاصة بك بحيث تبدو وتعمل بالطريقة التي تريدها؟ سيوفر لك إنشاء موضوع فرعي الكثير من الوقت والصداع على الطريق (صدقني).
اتبع هذا البرنامج التعليمي لإنشاء قالب WordPress الفرعي المخصص الخاص بك بسهولة.
19. كيفية تحسين أداء وسرعة موقع WordPress الخاص بك
أنت تعلم أن سرعة الموقع أمر بالغ الأهمية لنجاح عملك (وعمل عميلك). مرارًا وتكرارًا ، تصدم رأسك بإحصائيات مخيفة مثل "يتوقع نصف مستخدمي الويب تقريبًا تحميل موقع ما في ثانيتين أو أقل" ، و "يميل المستخدمون إلى التخلي عن موقع لم يتم تحميله في غضون ثلاث ثوانٍ . " من السهل أن تشعر بالإحباط في هذه المرحلة من المشروع ، لكن لا تقلق.
قبل أن تطرق باب مضيف الويب الخاص بك أو تضيف الكثير من المكونات الإضافية البسيطة ، اتبع هذه الخطوات السهلة لجعل موقع WordPress الخاص بك سلسًا وصلبًا وسريعًا للغاية.
18. كيفية إضافة jQuery إلى قالب WordPress الخاص بك
jQuery هي مكتبة جافا سكريبت شائعة جدًا ، إن لم تكن الأكثر شهرة. في الواقع ، من الشائع جدًا أن يتم تحميل WordPress تلقائيًا. (بدأ هذا في WordPress 3.8.1.) لمجرد أن WordPress يأتي مع jQuery ، لا يعني ذلك أنه جاهز للاستخدام فور إخراجه من الصندوق. إذا كنت تستخدم أو تنشئ سمة لم يتم استدعاء jQuery فيها حتى الآن ، فسيتعين عليك القيام بأمرين قبل أن تتمكن من البدء في استخدامه.
اتبع هذا البرنامج التعليمي لتحميل jQuery إلى أي سمة WordPress.
17. تصميم الويب مقابل تطوير الويب: ما الفرق ولماذا هو مهم؟
هل سبق لك أن اتصل بك عميل محتمل لمعرفة ما اعتقد أنه تصميم ويب جديد ، عندما اتضح أن ما يحتاجونه حقًا هو مطور؟ ربما كانت لديك تجربة محرجة في التوضيح لمؤلف الإعلانات الخاص بك أنك مطور وليس مصممًا ، وأن النسخة بحاجة إلى الإصلاح لتوضيح ذلك؟ الخلط بين تصميم الويب وتطوير الويب هو خطأ شائع جدًا يرتكبه الأشخاص ، خاصة عندما يكونون مبتدئين في هذا الشيء الجديد الذي نطلق عليه interwebs.
هناك فرق حقيقي بين تطوير الويب وتصميم الويب. تعرف على ما هو ولماذا هو مهم.
16. كيفية إنشاء مكتبة "آخر مشاركة" باستخدام Owl Carousel
يأتي WordPress مع أداة "المشاركات الأخيرة" التي ستسحب عناوين أحدث مشاركاتك إلى شريط جانبي وربطها بالمنشور الكامل. المشكلة في ذلك هي أن أداة المشاركات الأخيرة محدودة للغاية. ماذا لو كنت بحاجة إلى شيء أكثر أناقة وقليل من الوظائف؟ على سبيل المثال ، ماذا لو كنت تريد سحب الصورة المميزة ومقتطفًا ، ومن نوع منشور مخصص؟
هذا هو المكان الذي يأتي فيه Owl Carousel ، لمساعدتك على السير في طريق DIY وبناء موقع أحلامك. اتبع هذا البرنامج التعليمي لإنشاء مكتبة "المشاركات الأخيرة" الخاصة بك!
15. كيفية إضافة Font Awesome إلي موقع WordPress الخاص بك
Font Awesome هي مجموعة أيقونات قوية تحتوي على أيقونات متجهة قابلة للتطوير. والمثير للدهشة أنه مجاني (قد تكون مجموعات الرموز باهظة الثمن ، مما يجعلها صفقة رائعة). يتيح Font Awesome أيضًا إضافة سهلة إلى سمة WordPress الخاصة بك ، مما يوفر وقتًا ثمينًا لأنك لست بحاجة إلى إنشاء هذه الرسومات وحفظها بنفسك.
اتبع هذا البرنامج التعليمي لمعرفة كيفية إضافة Font Awesome إلى موقع WordPress الخاص بك.
14. كيفية إنشاء رأس موقع لزجة
أصبحت رؤوس مواقع الويب التي تظل في مكانها عند تمرير المستخدم عنصر تصميم شائعًا للغاية. إنها تتيح للمستخدم الوصول بسهولة إلى التنقل دون الحاجة إلى التمرير لأعلى في كل مرة يريد فيها اختيار صفحة أو خيار مختلف.
اتبع هذا البرنامج التعليمي لإضافة رأس موقع ويب مثبت بسهولة إلى موقع WordPress الخاص بك.
13. كيفية توفير الوقت في إنشاء مواقع WordPress جديدة
بغض النظر عن مدى حبك لـ WordPress أو تصميم مواقع الويب ، فهناك جزء واحد من الوظيفة يمكن أن يصبح رتيبًا بعض الشيء: إعداد تثبيتات WordPress جديدة. قبل أن تتمكن حتى من البدء في التفكير في إضافة تخصيصات جميلة إلى مواقعك ، عليك أن تبدأ بالأساسيات: السمة والمكونات الإضافية والإعدادات.
لكن لا تقلق - فهناك طريقة لتسريع هذه الدورة الزائدة عن الحاجة. اتبع هذا الدليل لتسريع العملية والعودة إلى بناء مواقع جميلة!
12. كيفية إضافة خريطة جوجل سريعة الاستجابة في ووردبريس
نظرًا لكونه حل الخرائط الأكثر شيوعًا ، فإن إضافة خرائط Google إلى موقع WordPress الخاص بك لا يمكن أن يكون أسهل. ستوفر تقنية الخرائط سهلة الاستخدام هذه معلومات العمل ومعلومات الاتصال والتوجيهات إلى الموقع الذي تختاره ، مما يجعل التنقل مريحًا للغاية للمستخدمين.
هل أنت جاهز لإضافة خريطة إلى موقع WordPress الخاص بك؟ سيغطي هذا البرنامج التعليمي كيفية استخدام مكون إضافي لإضافة واحد وطريقة DIY.
11. كيفية إضافة خيارات لمخصص WordPress
يمكن أن يكون مُخصص WordPress مربكًا بعض الشيء في البداية ، ولكن بمجرد الغوص ، ستجد أنه أسهل من المتوقع. إنها أداة رائعة لك (أو لعملائك) لتغيير سمة ، بالإضافة إلى أنه يمكنك حقًا جعلها ملكًا لك عن طريق إضافة خيارات مخصصة.
لذلك دعونا نقسمها - وإليك كيفية استخدام أداة التخصيص لخيارات السمة.
10. أفضل قنوات سلاك للمصممين
أصبح Slack سريعًا وسيلة اتصال مفضلة للعديد من المصممين والمبدعين. إنه يجعل التواصل مع زملاء العمل والأصدقاء ممتعًا وفعالًا وسهلًا. لكن أحد أفضل الأجزاء في Slack هو أن الأشخاص قد انضموا معًا لإنشاء مجتمعات تركز على موضوعات محددة.
إذا كنت مستعدًا للانضمام إلى المحادثة ، فإليك 16 من أفضل قنوات Slack للمصممين.
9. أسهل طريقة لتطوير مواقع WordPress محليًا
عند إنشاء موقع WordPress ، قد يكون من المغري البدء في إجراء التغييرات متى وأينما تريد ، مباشرة على الموقع المباشر. تعديل CSS صغير لأنماط الأزرار لن يضر بأي شيء ، أليس كذلك؟
حتى التغييرات البسيطة يمكن أن تكون محفوفة بالمخاطر ، وهذا هو سبب وجود قاعدة ذهبية معينة لتطوير WordPress: عندما تقوم بتطوير مواقع WordPress ، حتى لو كنت تقوم فقط بتغيير بسيط في التعليمات البرمجية ، فلا يجب عليك أبدًا إجراء تغييرات مباشرة على موقع مباشر.
يعد استخدام بيئة التطوير المحلي أمرًا بالغ الأهمية لتطوير مواقع WordPress المخصصة. تعرف على كيفية إعداد جهاز بسهولة وكفاءة باستخدام هذا الدليل!
8. كيفية استخدام CSS Feature Queries
تعد استعلامات ميزات CSS طريقة لتنفيذ طريقة أصلية للمتصفح لاكتشاف الميزات. تحلل هذه الاستعلامات ما إذا كان المستعرض قد نفذ خاصية CSS بشكل صحيح أم لا. بشكل أساسي ، يقوم المتصفح "بإبلاغ" ما إذا كانت خاصية أو قيمة CSS معينة مدعومة أم لا. تحدد النتيجة ما إذا كنت تريد تطبيق كتلة من CSS أم لا.
هل أنت متحمس لاستخدام ميزات CSS الجديدة ، لكنك قلق بشأن إمكانيات المتصفح؟ تعرف على كيفية مساعدة CSS Feature Queries في الحفاظ على سير الأمور بسلاسة.
7. 9 اتجاهات لتصميم الويب يجب معرفتها في عام 2016
وصلت صناعة تصميم الويب إلى نقطة مثيرة للاهتمام حيث يرغب المصممون في القيام بأكثر من مجرد إنشاء موقع - فهم يريدون سرد قصة. أكثر من أي وقت مضى ، فإن الهدف من موقع الويب هو الترفيه والإعلام. تعرض قائمتنا تسع طرق مختلفة لرواية تلك القصة ، من الفقرات السينمائية المذهلة إلى التفاعلات الدقيقة المبهجة.
لم يفت الأوان بعد - إليك أهم تسعة اتجاهات لتصميم الويب لعام 2016!
6. كيف يمكن أن تساعدك الإيرادات المتكررة في توسيع نطاق وكالتك
قد يبدو أحيانًا توسيع نطاق وكالتك إلى نشاط تجاري ناجح ومستدام مهمة مستحيلة ، ومن السهل فهم السبب. يستغرق التشاور مع العملاء الكثير من الوقت ، وفي نهاية اليوم ، تكون مقيدًا بساعة بها ساعات كثيرة قابلة للفوترة.
سر توسيع وكالتك؟ أضف قنوات الإيرادات المتكررة إلى نموذج عملك!
5. مواد مطبوعة مجانية لمساعدة المصممين على البقاء منظمين
أنت مصمم ، لذا ربما يمكنك تصميم النموذج المثالي وطباعته. ولكن إذا كنت تبحث عن حل أسرع ، فهناك مصممين آخرين لديهم نفس الفكرة ، وقد ابتكروا بعض الهدايا المجانية الرائعة التي يمكنك تنزيلها لجهود مؤسستك الشخصية.
إذا كنت مستعدًا لنقل مؤسستك إلى المستوى التالي (مجانًا!) تحقق من هذه الطابعات الرائعة للمصممين.
4. كيفية إنشاء تخطيط بسيط باستخدام CSS Grid Layouts
جزء من كونك مصمم هو معرفة ما يخبئه مستقبل تصميم الويب. تعد CSS Grid Layouts بمثابة تغيير لقواعد اللعبة وستساعد في تخفيف بعض الإحباط حول تحديد المواقع التي كان على المصممين التعامل معها لسنوات عديدة. على الرغم من أنها ليست ممارسة شائعة تمامًا حتى الآن ، إلا أنها شيء نتطلع إليه.
اتبع هذا البرنامج التعليمي البسيط لتتعلم أساسيات CSS Grid Layouts!
3. لماذا تعتبر SSL مهمة لموقع WordPress الخاص بك
SSL. ربما سمعت عن هذه الأحرف الثلاثة الصغيرة من قبل ، لكن هل تعلم أنها يمكن أن تفيد حقًا موقع WordPress الخاص بك؟ قبل أن نتحدث عن الكيفية التي ستساعد بها موقعك ، دعنا أولاً نتعرف على ماهية SSL بالضبط.
إليك ما هو SSL ، ولماذا تريده ، وكيفية الحصول عليه بسهولة على موقع WordPress الخاص بك!
2. كيفية استخدام تقنيات قص وإخفاء CSS و SVG
تعد SVGs رائعة للعمل على الويب ، ويسمح القص والإخفاء ببعض الطرق الشيقة لإظهار أو إخفاء أجزاء من رسومات الويب الخاصة بك. يتيح استخدام هذه الأساليب أيضًا مزيدًا من المرونة في تصميماتك لأنك لست مضطرًا لإجراء تغييرات يدويًا وإنشاء صور جديدة - كل ذلك يتم باستخدام التعليمات البرمجية.
اتبع هذا البرنامج التعليمي لتبدأ بسهولة مع قص وإخفاء CSS و SVG.
1. 20 مكتبة JavaScript للتسجيل في عام 2016
تعد مكتبات JavaScript أداة مفيدة بشكل لا يصدق لأي مصمم أو مطور ليكون على دراية بها. يمكنهم إضافة بعض الوظائف الفائقة القوة إلى موقعك أو تحسين التصميم ، مما ينتج عنه تجربة أفضل لمستخدميك.
في حين أن هناك عددًا لا حصر له من الموارد ، نعتقد أن مكتبات JavaScript العشرين هذه ستأخذ موقعك إلى المستوى التالي في عام 2016 بالتأكيد.
هذا يكمل قائمتنا لأفضل مقالات WordPress والتصميم من 2016! ماذا كانت بعض المفضلة لديك؟ شارك روابطك في التعليقات أدناه لمساعدتنا في تطوير قائمتنا!