البحث في الموقع

من المستحيل -تقريبًا- السير بمهنة الكتابة كمستقل بدون امتلاكك معرض أعمال (Portfolio). إن كنت محظوظًا فقد تحصل على بعض الإحالات من عملائك السابقين لفرص عمل جديدة. لكن في حال كنت حديث العهد في هذه المهنة فعليك أن تأخذ بنفسك زمام المبادرة في البحث عن عمل. يعني هذا أن تتقدّم بالكثير من العروض للكثير من العملاء المحتملين، ألقي صنارّتك في المياه إن عَلِق بها عميل ما سيلقي نظرة على واجهتك ومنها تنطلق الأمور. قد تبدو فكرة تصميم معرض أعمال تبني عليها عملك مرهبة أو مكلفة، لا تقلق فهي ليست كذلك. لديك الكثير من الخيارات لفعل ذلك بأرخص ما يمكن. سأحدّثك هنا عن الطرق الّتي أفضلّها بنفسي (وغالبيّتها مجّانيّة). فيما يلي، فسنذكر لك 4 طرائق لبناء معرض أعمال يستهدف الجمهور العربيّ تستطيع استخدامها لمخاطبتهم، يليها 4 طرائق لاستهداف الجمهور الناطق باللغة الإنجليزية. ## استهداف الجمهور العربي 1. مدونات الجزيرة هذه الخدمة المقدّمة من شبكة الجزيرة الغنيّة عن التعريف حديثة العهد نسبيًّا. توفّر هذه المدوّنة فرصة للكتّاب والمدوّنين العرب لنشر أعمالهم ومقالاتهم ونشر اسمهم.تتبّع الجزيرة سياسة انتقائيّة في السماح لما يُنشر على مدوّنتها وذلك لضمان جودة النشر ولرفع قيمة المحتوى العربيّ. هذا م يزيد من اتنافسيّة النشر على الموقع ويجعل من حصوله أمرًا مهمًّا يرفع من شأن كاتبه. كما يمكن مشاركة التدوينات على مواقع التواصل الاجتماعيّ لزيادة الإقبال عليها وهو ما تدعمه شبكة الجزيرة بشكل متميّز. يمكنك البدء النشر عند التسجيل على موقع المدوّنة. 2. ساسة بوست تعرّف ساسة بوست عن نفسها بأنّها "مشروع إعلاميّ عربيّ إلكترونيّ مستقلّ تشاركيّ يهدف إلى خلق تجربة ذات هويّة متحرّرة وفريدة المضمون". لم يكن موقع ساسة بوست مفتوحًا منذ البداية لمشاركات المدوّنين بل كان مقتصرًا على المحتوى الخاصّ بالشبكة. لكنّه لاقى منذ افتتاحه قسم "مقالات الرأي" إقبالًا كبيرًا من المدوّنين العرب وكاتبي المحتوى. من الأسباب الّتي قد تجعلك تفضّل هذا الموقع هو تحكّمك الكبير بتنسيق منشوراتك. أيضًا فإنّ الموقع يقبل منشورات بشكل أكبر من مدوّن الجزيرة الانتقائيّة -على سبيل المثال-. 3. أكاديمية حسوب تنتمي أكاديميّة حسوب لعائلة شركة حسوب حالها حال موقع مستقلّ الشهير. وهو ما يوفّر لك ميّزة العمل على نفس الشبكة الّتي تنشر بها، إذ يتكامل الموقعان لتظهر المقالات التي تُنشَر على أكاديمية حسوب في حسابك في مستقل ليتمكن العملاء من الاطلاع على عمل بسهولة. النشر على أكاديميّة حسوب يشابه النشر على المنتديات في جلبه للردود والنقاشات. كما توفّر مساحةً للتعلّم عبر دروس وتدريبات توفّر لك الوصول إليها. "باب المُساهمة على الأكاديمية مفتوح لكل من يرى في نفسه القدرة على توفير مقالات عالية الجودة" هكذا تقوم أكاديميّة حسوب بدعوة جميع المبدعين العرب للنشر عليها والمساهمة بإثراء المحتوى العربيّ. 4. أراجيك موقع أراجيك arageek هو مجلّة شبابيّة عربيّة أُسّست عام 2012 وكان تركيزها في البدء على التقنيّة قبل أن تتوسّع للفنّ والتعليم وغيرها. تُتيح مدوّنات أراجيك الفرصة للكُتّاب والناشرين العرب "لسرد قصّتهم وتجربتهم". حيث تقول أنّ "لا فرق لديها بين القارئ والكاتب" حيث يساهم الجميع في صنع المحتوى الّذي يقرؤونه. كما تُشجّع المنصّة على المحتوى الأصليّ وغير المنسوخ كما تقوم بانتقاء المُفيد من التدوينات المُرسلة لنشرها. استهداف الجمهور الأجنبي إليك أفضل 4 مواقع وطرق يمكنك عبرها بناء معرض أعمال يستهدف العملاء الناطقين باللغة الإنجليزية: 1. موقع Medium (مجّانيّ) هذا الموقع Medium غنيٌّ عن التعريف. هو من أشهر منصّات التدوين على الإنترنت. يستخدمه الملايين لمشاركة أفكارهم حول كل ما يخطر في بالك. كما يمكنك استعماله كمعرض أعمال لعملك الاحترافيّ. سأشرح لك ذلك: الموقع معروف، فاستضافة واجهتك فيه لن تبدو للعملاء غير احترافيّة. التصميم سهل وأنيق ولا يشتّت الانتباه عن كتابتك. سهل الاستخدام ويمكنك نشر مقالتك فيه في غضون دقائق. ولكن هنالك سلبيّة واحدة كبيرة لاستخدام Medium؛ لن تستطيع إعادة إنتاج محتوىً معروض في مواقع أخرى. فعلى سبيل المثال إن كنت قد قمت بكتابة مقال لصالح أحد العملاء وكان عملك عظيمًا وأردت مشاركته على واجهتك في Medium فلن تستطيع فعل ذلك. لأنّ الموقع لا يسمح بربط محتوى خارجيّ. ما يعني أنّ كلّ ما تنشره عليه يجب أن يكون أصليًّا وغير منشور في موضع آخر. إنّه خيار رائع لتبدأ عن طريقه إن لم تكن تملك أعمالًا مسبقة تودّ مشاركتها، وأقل فعاليّة إن كانت مسيرتك قد بدأت بالفعل نوعًا ما. 2. موقع Pintrest (مجّانيّ) هذا صحيح، لا ينحصر استخدام Pintrest بالطعام المشهّي أو التحديق في صور الشقق الرائعة. يمكنك أيضًا استخدامه لعرض أعمالك الكتابيّة المستقلّة كما ترى في هذه الأمثلة: ربّما تكون هذه المقاربة غريبة بعض الشيء، لكنّها فعّالة على عدّة أصعدة: كونها غريبةً يميّزك عن باقي المستقلّين. يهتمّ Pintrest بالمرئيّات، وهذا ما يمكّنك من عرض صور مقالاتك (الّتي يجب أن تكون موجودة) كطريقة لجذب انتباه العملاء. يمكّنك الموقع من تصنيف عملك لعدّة تصانيف، ما يجعله أسهل للتصفّح. هذا الخيار جيّد أيضًا إن كنت تمتلك العديد من الأعمال السابقة. حيث يمكنك -على عكس Medium- وضع كلّ ما تحتاجه من روابط خارجيّة. فسيكون ممتازً في حال كثرة كتاباتك السابقة. أمّا سلبيّته هذا الخيار فهي صعوبة الاحتفاظ بانتباه العميل في واجهتك على هذا الموقع. المنصّة مليئة بالصوريّات فسينقر الأشخاص على ما يجذب عينيه. حسب خبرتي، لن ينظر العميل إلى عشرات الأعمال الّتي تعرضها، سيلقي نظرة على واحد أو اثنين فقط ثمّ يتّخذ قراره. فهذا يعني وجوب كونك انتقائيًّا جدًّا لتبدو واجهتك ظاهرةً للعيان. 3. ClearVoice (مجّانيّ) تعرض منصّة Clear Voice نفسها على أنّها منصّة للمستقلّين. تساعدك هذه المنصّة على بناء معرض أعمال لك وترسل لك بريدًا إلكترونيًّا إن عرض لك أحدهم عملًا. تبدو آلية عمل الموقع جميلة. هنا بعض ما يمكنك فعله مع ClearVoice: إضافة القدر الّذي تريده من الروابط لمقالات خارجيّة وتقوم المنصّة بشكل تلقائيّ بإظهار الصور فيها. إضافة كلّ المعلومات الّتي ترغب بإضافتها عن كلّ مقالة كتبتها (كالمجال أو المصدر وغيرها). كتابة خلاصات قصيرة لكلّ مقالة في واجهتك. كما تبحث المنصّة عن أي محتوى جديد باسمك وتذكّرك بأن تضيفها إلى واجهتك! هنا صورة عمّا تبدو عليه معرض أعمال مستقلّ على موقع ClearVoice: معرض أعمال المستقلّ على هذا الموقع سهلة الاستخدام ولكنّها تبدو احترافيّة حقًّا وتعطي انطباعًا حسنًا لدى العملاء. لاقى بعض الأشخاص حظًّا جيّدًا في العثور على عمل عبر هذه المنصّة لكن بشكل متفاوت. ربّما لا تستطيع الاعتماد بشكل كامل عليها لتأمين دخلك لكنّها مجّانيّة وتؤمن لك معرض أعمالً جيّدة، ولربّما يكون هذا كافيًا. 4. استضافة لدى WordPress (مدفوع) فلنبدأ بتوضيح حالتي سوء فهم منتشرتين عن امتلاك موقع لدى WordPress: إنّه مكلف. يمكن أن يكون مكلفًا إن أفرطت في الإضافات المدفوعة الغير ضروريّة. يمكنك بسهولة تجهيز موقعك الخاصّ بما لا يتجاوز 15$. إنّه معقّد للغاية. أجل، يمكن أن يكون بناء موقع ويب معقّدًا بعض الشيء، هذه حقيقة. لكن فعل ذلك على منصّة مثل WordPress سهّل الأمور كثيرًا. استخدمت المنصّة هذه لعدّة سنوات بشكل متقطّع ولم أشتكِ منها أبدًا. إن كنت لا تملك أيّ خبرة في تصميم المواقع WordPress مثاليٌّ لك. بالإضافة لتوفّر كمّ هائل من الموارد على الإنترنت عن كيفيّة استخدام المنصّة والتعامل معها. إنّها أيضًا خيار رائع لمعرض أعمال كاتب مستقلّ لأنّها تعطيك كامل التحكّم على عكس باقي الخيارات المذكورة هنا. تستطيع تخصيص واجهتك بالشكل الأنسب لك وإضافة شهادات العملاء السابقين وروابط لأعمال خارجيّة والكثير غير ذلك. علاوةً على ذلك فامتلاكك لموقع يحمل اسمك كمعرض أعمال لعملك يميّزك بشكل كبير. فجملة "زوروا واجهتي على موقعي الخاص" أفضل بكثير من "زوروا واجهتي على حسابي في Pintrest". ربّما لا يكون اسم الموقع ما يجلب الزبائن لكنّه حتمًا يجذب انتباههم. بالعودة إلى الفكرة الأساسيّة عن تخفيض النفقات خلال صناعة المعرض أعمال فأنت تملك العديد من الخيارات. كلّ ما تحتاج امتلاكه هو خطّة للبدء. يوفّر Bluehost خططًا تشاركيّة يبدأ سعرها من 5$ شهريًّا. تنصيب WordPress مجانيّ. كلّ ما تبقى هو حجز مسار موقع باسمك (عادةً ما تكلّف المواقع ‎.com حوالي 10$ سنويًّا). إن كانت هذه المبالغ تبدو مكلفة لك، فربّما يجب عليك إعادة النظر في خططك. الخلاصة لدى العديد من الكتّاب المستقلّين واجهات فارهة بمواقعهم المسمّاة باسمهم وتصاميمهم البرّاقة. ربّما يعني هذا الأسلوب جذب اهتمام الزبون فور دخوله لكنّها تكلّف الكثير من المال. تكلّف استضافة موقعك الخاصّ أقلّ ممّا تظنّ. يمكنك على سبيل المثال إيجاد استضافة تشاركية لقاء أقلّ من 5$ شهريًّا. ومن ثمّ تجهّز واجهتم عبر WordPress وتصبح جاهزًا للانطلاق. لا تزال تملك خيارات أخرى في حال كنت لا تمتلك الميزانيّة الكافية. هنالك كتّاب مستقلّون محترفون يستخدمون إحدى الطرق الذي ذكرناها لعرض أعمالهم بطريقة تجذب بها العملاء الجدد. فهنالك العديد من الخيارات الرخيصة؛ فلست تمتلك أيّ عذر لتأخير بناء واجهتك الخاصّة -إن كنت جادًّا حول بدء مهنة في الكتابة المستقلّة-. ترجمة -وبتصرّف- للمقال 4 Ways to Set Up a Freelance Portfolio for Cheap لصاحبه Alexander Cordova

في هذا الدرس سوف نقوم بتحويل تصميم تم إعداده باستخدام فوتوشوب وجعله صفحة ويب جاهزة وذلك باستخدام لغتي HTML وCSS (وهو أمر يُعرف أيضا تحت اسم “التكويد”). هذا هو التصميم الذي سوف نعمل على تكويده في هذا الدرس: استخراج بعض الصورقبل أن نبدأ في تكويد التصميم سوف نحتاج إلى استخراج بعض الصور منه (في الأسفل يوجد صورة توضيحية للملفات التي نحتاجها، وكوننا لا نملك الملف لاستخراج الملفات منه فيمكنك استعمال أي بديل تراه مناسبًا فالمهم هو أن تعرف كيفية التكويد وكتابة أكواد مناسبة). بنية ملف HTML <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>Chris Spooner Design Portfolio</title> <link href="style.css" rel="stylesheet" type="text/css" media="screen" /> </head> <body> <div id="container"> </div> </body> </html> يبدأ ملف الـHTML كما هو معتاد على وسم <doctype> و <head> وأخيرًا وسم <body>. كما أننا قمنا بربط ملف CSS بواسطة استعمال وسم <link> وأضفنا أيضًا وسم <div id="container"> ليعمل كحاوٍ لجميع محتوى الصفحة. <p id="logo"> <a href="#"><img src="images/logo.png" alt="Chris Spooner logo" /></a> </p> <ul id="nav"> <li><a href="index.html">Home</a></li> <li><a href="about.html">About</a></li> <li><a href="portfolio.html">Portfolio</a></li> <li><a href="contact.html">Contact</a></li> </ul> <div id="header"> <h1>Hello, I'm Chris Spooner.</h1> <h2>I craft websites that are beautiful on both the inside and out.</h2> <p class="btn"><a href="portfolio.html">View my portfolio</a></p> </div>لو نظرت إلى التصميم سوف تجد أن القائمة تأتي قبل الشعار ولكن مع ذلك فإننا سوف نقوم بإضافة الشعار قبل القائمة حتى نبقي كل شيء مرتّبًا ومنظمًا. وضعنا الشعار داخل وسم <p> واستعملنا العنصر <ul> ليحتوي على عناصر القائمة وأضفنا أيضًا وسمي <h1> و <h2> وبداخلهما عنوان ومقدمة بسيطة. <div id="content"> <h3>About Chris Spooner</h3> <p>I earn a living by creating custom brands and logo designs from scratch, as well as designing and building high quality websites and blogs, but I also enjoy producing the odd t-shirt graphic, illustration or character design. I pride myself in having the nerdy skills to build top notch creations online, as well as being knowledgeable in the print side of design.</p> <h3>My latest work</h3> <p>I’m forever creating design work for both myself as personal projects and as a hired gun for clients from around the world. Here’s a few of my most recent works.</p> <div class="portfolio-item"> <a href="#"><img src="images/portfolio-1.jpg" alt="View more info" /></a> <p class="btn"><a href="#">See more</a></p> </div> <div class="portfolio-item"> <a href="#"><img src="images/portfolio-2.jpg" alt="View more info" /></a> <p class="btn"><a href="#">See more</a></p> </div> <div class="portfolio-item"> <a href="#"><img src="images/portfolio-3.jpg" alt="View more info" /></a> <p class="btn"><a href="#">See more</a></p> </div> <div class="portfolio-item"> <a href="#"><img src="images/portfolio-4.jpg" alt="View more info" /></a> <p class="btn"><a href="#">See more</a></p> </div> </div> <div id="footer"> <p id="copyright">&copy; Chris Spooner / SpoonGraphics (Please don’t steal my work)</p> <p id="back-top"><a href="#">Going up?</a></p> </div>قمنا بعد ذلك بإضافة وسم <h3> وبداخله نص يعتبر أقل أهمية عن النص السابق (فكما تعلم أنّ وسم <h1> أهم من <h2> ومن <h3> وهكذا). بعد ذلك قمنا بإضافة العنصر <div id="content"> وبداخله يوجد المحتوى الرئيسي للصفحة والعديد من وسوم <div> كل واحد منها يحتوي على صورة مصغرة عن أحد الأعمال التي قمنا بها (وكأنها معرض أعمال مُصغّر). وأخيرًا يوجد هناك التذييل (footer) ممثلًا بالعنصر <div id="footer"> وبداخله حقوق الملكية وزر العودة للأعلى. الآن وبعد أن انتهينا من ملف الـHTML دعونا ننتقل إلى تنسيق الصفحة باستعمال CSS. تنسيقات CSSbody, div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, img, form, fieldset, input, textarea, blockquote { margin: 0; padding: 0; border: 0; } body { background: #f2f0eb url(images/bg.png); font: 16px Helvetica, Arial, Sans-Serif; color: #636363; line-height: 24px; } #container { width: 960px; margin: 0 auto; } #logo { margin: 10px auto 0 auto; position: relative; width: 183px; } بدأنا ملف الـCSS بتنسيقات بسيطة لإزالة التنيسقات الافتراضية للمتصفحات، وبعد ذلك قمنا بإضافة بعض التنسيقات لجسم المدونة (وسم <body>). لاحظ أننا قمنا في البداية بإضافة خلفية مزخرفة (صورة) إلى جسم المدونة وبعدها أضفنا بعض التنسيقات التي تخص الخطوط في الصفحة. قمنا بعدها بإعطاء العنصر الحاوي (container div) عرضًا بقيمة 960px واستعملنا أيضًا الخاصية margin: 0 auto لتوسيط العنصر في منتصف الصفحة، كما أننا أضفنا نفس الخاصية السابقة إلى الشعار حتى يتوسط في الصفحة. ul#nav { width: 940px; list-style: none; overflow: hidden; margin: -134px auto 25px auto; } ul#nav li { width: 126px; height: 33px; float: left; padding: 13px 0 0 0; background: url(images/nav-bg.png); font-weight: bold; text-align: center; text-transform: uppercase; } ul#nav li:nth-child(1) { margin: 0 60px 0 0; } ul#nav li:nth-child(2) { margin: 0 316px 0 0; } ul#nav li:nth-child(3) { margin: 0 60px 0 0; } ul#nav li:nth-child(4) { margin: 0; } ul#nav li a { color: #616369; text-decoration: none; } ul#nav li a:hover { color: #a12121; } سوف نحتاج لإضافة مجموعة من الخصائص للقائمة الرئيسية حتى تتماشى وتتوافق مع التصميم الذي نعمل عليه، فقمنا أولًا بتحريك العنصر <ul> إلى الأعلى وذلك باستخدام قيمة margin سالبة وبعدها قمنا بإعطاء كل عنصر من عناصر القائمة (عناصر <li>) مجموعة خصائص، أبعاد، خلفيات وتنسيقات خطوط حتى تتوافق مع التصميم الذي نريده. وحتى نجعل الصفحة تبدو كالتصميم تمامًا فإننا استخدمنا المحدد ()nth-child: حتى نُعطي قيم margin مختلفة لكل عنصر. #header { height: 244px; padding: 52px 0 0 57px; background: url(images/home-header.jpg); } #header h1 { font: 38px Georgia, Serif; color: #f2f0eb; letter-spacing: 2px; margin: 0 0 20px 0; text-shadow: 0px 3px 3px #494949; } #header h2 { width: 510px; font: 30px Georgia, Serif; color: #f2f0eb; letter-spacing: 2px; margin: 0 0 20px 0; text-shadow: 0px 3px 3px #494949; } #header p.btn a { display: block; width: 225px; height: 50px; overflow: hidden; background: url(images/home-header-btn.jpg); text-indent: -9999px; } لاحظ أننا أعطينا الترويسة (header) ارتفاعًا بقيمة 244px وذلك لأن ارتفاع صور الخلفية الذي أعطيناها لها هو 244px. بعد ذلك استخدمنا padding مناسب حتى نُبعد النصوص عن الحواف ونجعل كل شيء مناسبًا ومتوافقًا مع التصميم، وقمنا أيضًا بإعطاء الوسمين <h1> و <h2> الموجودين في الترويسة بعض تنسيقات الخطوط حتى تتوافق مع التصميم (نوع الخط Georgia واستخدمنا أيضًا الخاصية letter-spacing لزيادة المسافة بين كل أحرف الكلمات). يمكننا كذلك محاكاة تأثير الظل عن طريق استخدام الخاصية text-shadow، بينما أضفنا عرضًا بقيمة 510px للوسم <h2> حتى نمنع النص من الظهور فوق المنطقة المخصصة له. وأخيرًا قمنا باستخدام الخاصية ()background: url وبعض الخصائص الأخرى على العنصر الذي يحمل الفئة btn. وذلك لتحويله إلى زر كما هو موجود في التصميم. #content { background: url(images/content-bg.png) repeat-y; padding: 57px 69px 50px 69px; overflow: hidden; } #content h2 { font: 30px Georgia, Serif; letter-spacing: 2px; margin: 0 0 20px 0; } #content h3 { font: 26px Georgia, Serif; letter-spacing: 2px; margin: 0 0 20px 0; } #content p { margin: 0 0 30px 0; } #content a { color: #a12121; text-decoration: none; } #content a:hover { color: #671111; } #content .portfolio-item { width: 182px; padding: 4px; background: #eee; text-align: center; float: left; margin: 0 7px 14px 7px; } #content .portfolio-item p.btn { margin: 0; } #content .portfolio-item p.btn a { display: block; width: 183px; height: 29px; padding: 7px 0 0 0; background: url(images/see-more-bg.png); font-weight: bold; text-align: center; text-transform: uppercase; text-decoration: none; } الآن سنقوم بتنسيق المحتوى الرئيسي للمدونة. لاحظ أننا أعطينا العنصر content# صورة كخلفية وأضفنا padding بقيم معينة حتى نُبعد المحتوى عن الأطراف. بعد ذلك استخدمنا overflow: hidden حتى نتأكد من أنّ جميع العناصر الموجودة داخل هذا العنصر والتي تحمل الخاصية float لن تقوم بتشويه التصميم وتخطيط الصفحة (استخدام الخاصية overflow: hidden في مثل هذه الحالة يسمى clearing floats). قمنا كذلك باستخدام بعض الخصائص البسيطة للنصوص الموجودة داخل هذا العنصر (كنوع الخط وحجمه وبعض الأمور الأخرى). قمنا بعد ذلك بتنسيق الصور المصغرة وذلك بإعطائها خلفية بلون رمادي وإعطائها الخاصية float: left حتى تظهر جميع الصور إلى جانب بعضها أفقيًا، وأخيرًا قمنا بتنسيق عناصر <a> لنجعلها تبدو وكأنها أزرار وذلك بإعطائها خلفية باستعمال الخاصية ()background: url. #footer { background: url(images/footer-bg.png) no-repeat; padding: 40px 0 0 0; overflow: hidden; margin: 0 0 30px 0; } #footer p#copyright { font-size: 12px; float: left; margin: 0 0 0 30px; color: #b8b6b2; } #footer p#back-top { font-size: 12px; float: right; margin: 0 30px 0 0; } #footer a { color: #a12121; text-decoration: none; } #footer a:hover { color: #671111; } بقي علينا الآن تنسيق التذييل الخاص بالصفحة. الجزء الأسفل من المحتوى تم إضافته كخلفية للتذييل، وبعدها أضفنا padding بقيم مناسبة حتى ندفع بمحتوى التذييل إلى أسفل صورة الخلفية. لاحظ أننا استخدمنا no-repeat وذلك حتى نتأكد بأنّ الصورة تظهر مرة واحدة فقط ولا تتكرر. قمنا بإضافة خصائص نصيّة لكل من حقوق الملكية وكذلك زر العودة إلى الأعلى وقمنا أيضًا باستخدام الخاصية float لإزاحة العنصرين إلى يمين ويسار الصفحة. إضافة بعض الجافاسكربت لدعم متصفح IE8 وأقلإنّ متصفح IE8 والنسخ الأقدم منه لا تدعم المحدد nth-child: لذلك إذا أردت أن تدعم هذه المتصفحات فبإمكانك أن تستخدم مكتبة jQuery لتساعدنا في ذلك: $(document).ready(function() { $("ul#nav li:nth-child(1)").css("margin-right", "60px"); $("ul#nav li:nth-child(2)").css("margin-right", "316px"); $("ul#nav li:nth-child(3)").css("margin-right", "60px"); $("ul#nav li:nth-child(4)").css("margin-right", "0px"); });حتى وإن كانت تلك المتصفحات لا تدعم المحدد nth-child إلا أن استخدام هذا المحدد مع jQuery ممكن وسوف تقوم تلك المتصفحات بتطبيق التنسيقات بدون أي مشاكل. إنهاء الصفحات الداخليةبعد أن قدمنا بإنهاء الصفحة الرئيسية فإننا سوف نقوم ببناء الصفحات الداخلية للموقع. سوف تكون بنية هذه الصفحات متشابهة نوعًا ما مع القليل من الاختلافات كما أن فيها بعض العناصر المشتركة لذلك سيكون بناؤها أمرًا يسيرًا. <div id="header" class="page"> <h1>About Chris Spooner</h1> </div>لنقوم بتنسيق ترويسة أخرى يمكننا بكل بساطة أن نضيف فئة (class) للترويسة الخاصة بالصفحات الداخلية وبعدها نقوم بإعطاء هذه الترويسة حجمًا أصغر وصورة خلفية معينة. لقد قمنا مسبقًا بإنشاء الشيفرة البرمجية الخاصة بعناصر معرض الأعمال، لذلك يمكننا تكرار هذه العناصر لكل مشروع على حدة، وكل ما نحتاج لتغييره هو الصورة المصغرة الخاصة بكل مشروع. خاتمةوهكذا نكون قد قمنا بتكويد كامل التصميم. أتمنى أن تكونوا قد استفدتم من الدرس. ترجمة -وبتصرّف- للمقال How to Code a Stylish Portfolio Design in HTML/CSS لصاحبه Iggy.

لم تعد الوظائف كالسّابق حيث كان عليك الجلوس في مكان محدّد لوقت محدّد يملؤه الملل، فلقد تحولّ العالم كلّه إلى الرّقميّات وأصبح كلّ شيءٍ رقميًّا، وصار بإمكان النّاس العمل في أيّ مكان يريدونه، والفضل يعود للإنترنت. لم يعد هناك ما يُسمّى بالبحث عن وظيفة، فالفرص على الإنترنت أصبحت أكثر من أن تُعدّ، وقلّما تجد من يقرأ جرائد إعلانات التّوظيف لأنّ العمل الحرّ أصبح خيارًا متاحًا، ولكنّ عليك تذكّر بعض الأمور قبل أن تقرّر بدء العمل الحرّ، وأحد هذه الأمور هو البدء في تجهيز قائمة أعمالك. يمكنك أن تضع نسخًا من أعمالك السّابقة في قائمة وتسمّيها قائمة أعمال، ولكنّ ذلك لن يكون الخيار الأفضل على الأرجح، فأنت في عصر المعلومات، وعمل موقع ويب كمعرضٍ لأعمالك خيارٌ أفضل بكثير. قد تتساءل "لم عليّ إنشاء قائمةٍ بأعمالي؟ فعملي يسير على ما يُرام، لم عليّ بذل جهدي في أمر مزعجٍ كهذا سيستهلك وقتًا في تصنيف وتجميع أعمالي السّابقة؟" ستجد في هذا المقال بعض الأسباب الّتي ستقنعك بإنشاء موقع معرض أعمالك الآن: ستساعدك على التميز عن الباقينستواجهك منافسةٌ كبيرةٌ عند تقديم عرضك على عملٍ ما، ولتحسين فرصك أمام الزّبون يجب عليك إنشاء معرض أعمالٍ جميلٍ ومتميّز. إليك بعض النّصائح لجعل معرض أعمالك متميّزًا: أنشء موقعًا لمعرض أعمالك ذا تصميمٍ فنّيّ وجذّابضع أفضل أعمالك على الواجهةلا تضع أعمالك متوسّطة الجودةكن صادقًا ونزيهًااكتب عناوين جذّابة لأعمالكليرى زبائنك أعمالك في أي وقت وأي مكان صار لدى جميع النّاس هواتف ذكيّة، ولذلك عليك تهيئة معرض أعمالك ليراه زبائنك (عملاؤك المستقبليّون) في أيّ وقت يرغبون فيه بذلك، لذا اجعل معرض أعمالك جميلًا عن طريق: التّأكّد من أنّ الموقع يعمل بشكل جيّدتحسين نتائج الموقع في محركات البحثالتّأكّد من أنّك تستخدم رسومًا واضحةً وبسيطة لكنّها رائعةلحفظ الكثير من وقتك الوقت هو الحياة، وهو أهمّ شيء لصاحب العمل وللمستقلّ، ولذلك سيرغب أصحاب الأعمال في رؤية نماذج لعملك على الفور، وعندما يكون معرض أعمالك جاهزًا سيوفّر عليك النّقاشات والمقابلات الّتي تهدف للتّأكّد من مواهبك، وسيقودهم معرض أعمالك إلى الإجابة فورًا. لأنها تبين شخصيتك ستسمح لك بمشاركة أسلوب حياتك وشخصيّتك في أعمالك، فعليًّا أنت تشارك جزءًا من ذاتك مع النّاس عندما تنشر نماذج أعمالك، وسيتبيّن لصاحب العمل بسهولةٍ طبيعة الشّخص الّذي سيتعامل معه، كما يمكنك إدراج بعض شهاداتك ممّا سيجعلك أكثر وثوقيّة، كما أنّ توضيح لمساتك الشّخصيّة في أعمالك سيؤكّد ملكيّتك لها وأنّها ليست أول عشر نتائج وجدّتها عندما قمت بالبحث على Google. يمكنك الاستعانة بالنّصائح التّالية لجعل معرض أعمالك أكثر تعلّقًا بشخصيّتك: أضف شهاداتكاكتب بطريقة وصفيّة وبيّن ذاتك في ما تكتببيّن الصّعوبات الّتي واجهتك في أعمالك ومشاعرك أثناء القيام بهاأضف صورًا أثناء العمل إن كان ذلك ممكنًاتبين احترافيتك في عملك سيبيّن معرض أعمالك خبرتك الحقيقيّة، والموقع الّذي ستنشئه سيبيّن مهارتك وإبداعك وتنظيمك، وهذا يختلف كثيرًا عن كتابة قائمةٍ بإنجازاتك على ورقة. كلّما كان توثيق أعمالك وشهاداتك أكثر وضوحًا وتفصيلًا تبيّن لأصحاب الأعمال قدرتك على التّنظيم والإبداع، لذلك عليك الاهتمام بالعبارات وتصميم الصّفحة بأكبر قدرٍ ممكن. تجذب النظر دون بذل جهد لفت الانتباه وجذب الأنظار أمور أساسيّة لا يمكنك العيش بدونها في مجال تصميم صفحات الويب فالمنافسة شديدة، وعليك جذب النّظر إليك لأنّ هذه هي الطريقة الوحيدة لتجني المال، وعليك أن تجعل صاحب العمل ينظر إليك أكثر من أيّ شخصٍ آخر، وليس هناك أفضل من معرضِ أعمال مرتّب وجميلٍ للقيام بذلك، ستأتي إليك الوظيفة دون أن تطلبها حتّى. دع إنجازاتك تتكلّم عنك، ستوفّر الكثير من النّقاش مع الزّبائن لأنّك تريهم نماذج للنّتائج الّتي سيحصلون عليها بدلًا من الكلام الفارغ. سيجدك زبائنك المحتملون بسهولة سيكون هذا أفضل ما يقدّمه لك معرض أعمالك على الإطلاق، فهو على الإنترنت، وقد يعثر عليه أيّ زبون في أيّ وقت، فمعرض أعمالك يشبه إعلانًا كبيرًا تضعه في أحد الشّوارع، وستسوّق نفسك دون بذل أيّ جهد. ستعزز فرصتك للحصول على وظيفة سيسهّل معرض أعمالك على رجال الأعمال اتّخاذ قرارهم بتوظيفك، فهم يحبّون النّتائج السّريعة، وعندما يرون إنجازاتك وقدراتك وكم تجني من المال، فستحصل على أفضليّة في التّوظيف على الآخرين. خلاصة يتزايد انتشار مواقع الويب لعرض الأعمال، ولذلك عليك مواكبة ذلك كمستقلّ لعرض إنجازاتك لأنّ هذه هي الطّريقة الوحيدة لتحصل على الزّبائن وتحصل على وظيفة، أتمنّى لو تقوم الآن بإنشاء معرض أعمالك وتشاركه في التّعليقات كي نراه، بالتّوفيق. ترجمة -وبتصرّف- للمقال: 10Reasons Why You NEED to Launch Your Online Portfolio NOW لصاحبه: Rudolph Musngi. الصورة البارزة.

سنتعلم في هذا الدرس كيف نرسم التصميم العام لموقع معرض أعمال أنيق وجميل بواسطة برنامج فوتوشوب وباستخدام تأثيرات مختلفة وأساليب المزج وأنماط الطبقات. يتمتع الموقع الذي سنصممه بالأناقة والبساطة بذات الوقت وسيجذب رأس الصفحة المتناقض اهتمام المستخدمين. من ناحية أخرى فإن الفكرة هي الأناقة مع أسلوب طباعة كبير وتفاصيل خفيفة في عناصر الواجهة. بعد الانتهاء من التصميم وتجهيز ملف PSD يمكنك الذهاب إلى الدرس التالي لتتعلم كيفية برمجة وترميز التصميم باستخدام HTML و CSS. افتح ملفا جديدا على فوتوشوب. أنا اميل إلى العمل بأبعاد 1680×1050 للحصول على فكرة عما سيبدو عليه موقع الإنترنت في الشاشة العريضة. لوّن الخلفية باللون الرمادي الفاتح كلون الكْرِيم وطبّق فلتر noise من قائمة الفلاتر بقيمة 2%. بالزر الأيمن حوّل transform التحديد إلى 960px ثم ارسم أدلة لتحديد المركز والجوانب. استخدم أداة المستطيل مستدير الزوايا rounded rectangle لرسم منطقة المحتوى ولكن اترك حواف بقيمة 10px بعيدة عن الأدلة للسماح بظهور تأثير الظلال Drop Shadow التي سنضيفها لاحقًا. ألصق شعارك في مركز التصميم. استخدم أداة المستطيل مستدير الزوايا rounded rectangle tool لرسم زر في منطقة رأس الصفحة. غيّر خصائص المزج إلى Overlay للسماح بظهور الخامة الضمنية من خلال هذا الزر. أضف ظل داخلي رقيق لإعطاء الانطباع بأنه محفور داخل الأرضية. المفتاح هو تخفيف opacity نحو 10%. اصنع عدة نسخ من الزر وضعها على جانبي الشعار ثم أضف النص إلى كل زر منها. الصفحات النموذجية يجب أن تكون الصفحة الرئيسية، حول الموقع، معرض الأعمال وللاتصال بنا. انقر مع الضغط على مفتاح CMD أو Ctrl على مُصغّر منطقة المحتوى البيضاء ثم اسحب مع الضغط على مفتاح ALT عبر الجزء السفلي مع أداة marquee tool لترك تحديد قصير. لوّن هذه المنطقة باللون الأسود. افتح نافذة نمط الطبقة من أجل هذه الطبقة وأضف نقش متراكب. استخدمتُ هنا نمط الآيفون4 خامة القماش من Dr.Palaniraja. ارسم حدود رفيعة 4px عبر أسفل منطقة رأس الصفحة ولوّنها بالرمادي الفاتح. استخدم التدرج اللوني من الأسود إلى الشفافية لرسم ظلال قصيرة على طول حافة أسفل منطقة رأس الصفحة. خفف opacity لنحو 10%. استخدم خط Georgia لكتابة عنوان تقديمي أنيق في منطقة رأس الصفحة. أضف لمسة من الظل الفاتح شبه الشفاف إلى الحروف. ارسم زر باستخدام أداة المستطيل مستدير الزوايا rounded rectangle ثم استخدم نافذة نمط الطبقة لتجميل الزر. ابدأ مع تدرّج لوني مع الرمادي الداكن والفاتح القريب من ألوان أرضية منطقة رأس الصفحة. أعطي الزر مظهرًا مشطوفًا عبر التلاعب بالتوهج الداخلي Inner Glow بحدود رمادية فاتحة ثم أضف حدودًا رمادية داكنة بقيمة 1px. أكمِل تصميم الزر عبر إضافة النص واضبط الإعدادات لتأثير الظلال لإنشاء مظهر الإقحام داخل الأرضية. ألصق مثال عن عمل تصميم موقعك في رأس الصفحة. اصنع تحديد من منطقة رأس الصفحة ثم أضف قناع الطبقة لقص لقطة الشاشة على حجم الملف. أضف ظل Drop Shadow باستخدام تأثير أنماط طبقات الفوتوشوب ثم بالزر الأيمن اختر إنشاء طبقة Create Layer. استخدم خاصية الالتواء من ميزات التحول لثني الظل للخارج. خفف Opacity لمنحه مظهرًا وقعيًا. استخدم أسلوب الطباعة من رأس الصفحة في منطقة المحتوى الرئيسي ودوّن نسخة الجسم الرئيسي بواسطة خط sans-serif الكبير الجميل. ارسم مستطيل رمادي كقاعدة لمعاينة عنصر معرض الأعمال ثم اصنع زر مستطيل مستدير الزوايا بظلال داخلية. أكمل عنصر معرض الأعمال بمصغّر يبدأ بعرض المشروع ثم أضف نص الرابط مستخدمًا نمط النص في أزرار القائمة. اجمع Group وضاعف العناصر التي تمثل معرض الأعمال ووزعها بشكل صحيح مع استبدال الصورة المصغرة التي ستبرز آخر أعمالك. أكمل منطقة أسفل الصفحة بملاحظة حقوق النشر والرابط لأعلى الصفحة. فكرة الصفحة الرئيسية اكتملت الآن لذا دعونا نصمم الصفحات الداخلية. ضاعف ملف PSD وأطلق عليه اسم About. الصفحات الداخلية لا تحتاج إلى منطقة رأس كبيرة ولكن يمكننا أن نستخدم هذه المساحة لإظهار عنوان الصفحة. صغّر حجم منطقة رأس الصفحة. اضبط النص في رأس الصفحة لتقديم الصفحة. في هذه الحالة صفحة About ستكون بعنوان "About Chris Spooner" أو قد تكون فكرة جيدة لو استخدمت اسمك. ألصق نسخة جسم الصفحة لتملأ منطقة محتوى صفحة About. لا تنسَ أن تترك مساحة لوضع صورتك الشخصية. صفحة معرض الأعمال يمكن أن تصمم من خلال مضاعفة عناصر معرض الأعمال واستبدال المصغّرات بتصاميم مشاريعك. املأ الصفحة بعناصر معرض الأعمال المختارة. بما أننا بنينا هذا الموقع بنمط WordPress فسيكون علينا إنشاء مشاركة مدونة لكل من عناصر معرض الأعمال. استخدم مجموعة مختلفة من المستطيلات مستديرة الزوايا لتنسيق نموذج الاتصال في صفحة الاتصال ثم أدرج مجموعة من الأيقونة التي تمثل مواقع التواصل الاجتماعي المفضلة لديك. لا تنسَ أن تقرأ الدرس التالي لتتعلم كيف تحول ملف PSD هذا إلى موقع Html وCSS كامل. ترجمة -وبتصرّف- للمقال: How To Build a Stylish Portfolio Web Design Concept لصاحبه Chris Spooner.

عندما تبدأ العمل ككاتب حر، قد تشتري اسم نطاق، ترفع موقعك إلى شبكة الإنترنت وتنتظر ليتهافت عليه العملاء، ولكن الوقت يمرّ دون أن يحدث أي شيء. هذا ما حدث معي، وعليه قمت بمراجعة كل ما كتبت في الموقع وعلمت أن هناك خطأ ما، فذهبت لمواقع التواصل الاجتماعي واستفسرت عن الأمر، وكنت على أهبة الاستعداد للتغيير من أجل زيادة الإنتاج والكسب. ولكن هل تعرف ماذا حدث بعد ذلك؟ لم يحدث شيء. في نهاية المطاف، راجعت ما كنت أفعله و حاولت جاهداً لإيجاد مواضع الخطأ، وأخيراً اعترفت لنفسي، فالخطأ كان مؤلماً، إن موقعي كان شبه طارد للعملاء، وليس فيه عناصر جاذبة. إذا كنت كاتبًا مستقلًا وتحاول الحصول على عملاء، ولكن ذلك لم يحدث، فقد حان الوقت لمواجهة الحقيقة القاسية، وهي أن موقعك طارد لزواره، يحدث هذا حتى وإن كانت لديك الخبرات والمهارات الجاذبة، ولكن العملاء المحتملين ما إن يدخلوا موقعك الخاص حتى يولوا مُدبرين. مع أخذ ما سبق بعين الاعتبار، سأحاول وضع الخطوط العريضة للأسباب التي تجعل من موقعك موقعاً طارداً، ومن ثم أشرح ما يمكنك عمله لتغيير الأمور للأفضل. بدون موقع على الشبكةخطأ فادح، أتمنى أنك لم تقع فريسة له، ولكن الكثير من المستقلين ليس لديهم موقع على شبكة الإنترنت، فإذا كنت حتى الآن بدون موقع على الشبكة، فأنت تمارس العمل الحر بالطريقة الخطأ. أطلق موقعًا أو مدوّنة، ارفع إليه قالبًا جاهزًا، أو حتى استعن بمُصمّم لتصميم قالب لك، المهم يجب أن يكون له حضور على الإنترنت. ولكن ابتعد قدر المُستطاع عن المنصات التي تُقدم الاستضافة المجانية والتي توفر أدوات لبناء موقعك من دون برمجة،لأن الإعلانات التجارية التي تُظهرها هذه المواقع ستجعلك تبدو أقل مهنية، استثمر بعض المال لحجز استضافة، إذا كنت تريد أن تُظهر عملك أكثر احترافية. الفوضى البصريةوهي من أكبر المشاكل التي يعاني منها الكثير من المواقع، فقد تجعل من قراءة مُحتوى الموقع مهمّة صعبة جدًا، لوجود الكثير من النصوص المكدسة فوق بعضها البعض، وهناك الكثير من الصفحات التي لا داعي لها أيضاً، أو أن اختيارك للألوان اختيار غير موفق ومشتت لتفكير الزائر. فالعملاء المحتملين هم في عجلة من أمرهم في الغالب، فلا يحبذ معظمهم فكرة بذل مجهود كبير لقراءة كل النصوص الطويلة على موقعك، وبالتالي فالكرة في ملعبك الآن. فمن الأفضل دائماً: اعتماد البساطة في عرض المعلومات على الإنترنت.أن تكون الصفحات الرئيسية قليلة قدر الإمكان، تحمل عناوين واضحة، وسهلة التنقل فيما بينها.حاول جاهداً أن تكون الفقرات قصيرة، فكثير من الناس يقرأ بالمسح السريع للنص.ليتمكن العميل من العثور على المعلومة بسرعة، أجعل النص بلون غامق على خلفية بيضاء، وتأكد من وجود مساحات بيضاء أكثر من النص.أعمل على وضع الصور والرسوم بشكل مدروس وعند الحاجة إليها فقط وليس لملء الفراغات.صعوبة التواصل معكأحد أكبر الأخطاء التي يمكن أن ترتكبها على موقعك هو عدم توفير معلومات الاتصال بشكل مترافق مع الخدمات التي يمكن أن تقدمها، فقد تُكثر من كلمة "إذا" مثل: إذا كنت ترغب في الحصول على اتصال. إذا كان لديك مشكلة. إذا كنت تعتقد أنك بحاجة للمساعدة.وغيرها الكثير، ولكنك في المقابل لم تخبر العملاء المحتملين ما يجب عليهم القيام به بالضبط. قد تطرح عليهم الأسئلة ولكن تترك لهم مهمة البحث عن معلومات الاتصال للحصول على المزيد من المعلومات. فبدل من استعمال كلمة "إذا" وتترك للعميل يتخيل كيف يتصل، عليك أن تقول له ما يجب عليه القيام به بالضبط، على سبيل المثال: اتصل بي اليوم في الفترة بين كذا وكذا. يمكنك الاشتراك في قائمتي البريدية والحصول على التقرير الخاص بك مجاناً.وبعدها بشكل مباشر عليك إضافة معلومات الاتصال الخاصة بك. ويُفضل وجود رقم الهاتف في مقدمة معلومات الاتصال، ثم عنوانك البريدي، ولا تنتظر أن يقوم بملء نموذج الاتصال. لا بد أن تحتوي جميع الصّفحات نداء للإجراء call-to-action، بشكل يُسهّل على الزّائر للاتّصال بك بطريقة لا تتطلّب أي جهد من طرفه. الاستفاضة غير الضرورية في سرد المعلومات الشخصيةإذا انتابك شك حول أداء موقعك، وكنت تعتقد بأن هناك مُشكلَا فيه فأوّل ما يجب التّحقّق منه هو محتويات صفحة المعلومات الشخصية على الموقع، وطريقة سرد هذه المعلومات، لأن العميل المحتمل لن يطلب خدماتك بسبب قصّة حياتك ولكنه سيتعاقد معك إذا علم القيمة الحقيقية لما يمكن أن تقدمه له، وبالتالي فعندما تقوم بتجميع المحتوى لموقعك، تأكد من: التركيز على الزبائن وما يمكنك القيام به بالنسبة لهم.لا تكثر الحديث عن نفسك، اذكر القليل فقط (القدر الكافي الذي يُظهر جانبك الإنساني) حيث أن الإطناب سيُعطي الانطباع بأنك شخص مهووس بنفسه.لا تضع جميع الأعمال التي قمت بها، استعرض فقط أفضل العينات.حاول التركيز على المعلومات الأساسية ووضعها في الأعلى بشكل مرئي دون الحاجة للبحث المضني عنها.تزييف الحقائقعندما بدأت العمل كمستقل، أردت لموقعي أن يبدو أكثر مهنية وأكثر إثارة للإعجاب، لذلك كتبت بصيغة توحي بأنني جزء من فريق مؤسسة عريقة، ولم أدرك الخطأ الفادح الذي قمت به إلى أن تحدثت على الهاتف مع أحد العملاء وشرحت له أنني لا أستطيع القيام بالمهمة بالسرعة التي يطلبها لأنني وحدي، حيث أن الزبونة أرادت التعاقد معي على أساس الصيغة الملكية لكلمة "نحن" (والتي هي في حقيقة الأمر تتحدث عني وعن... قطتي) التي كانت واضحة في الموقع. لا حرج من استخدام صيغة جادة خاصّة إذا كانت هذه الصّيغة هي المُفضّلة لنوعية الزّبائن الذين تستهدفهم، لكن احذر من مغبة إظهار نفسك أكبر من حجمك الحقيقي، فقد يُعطي الأمر نتائج عكسية وستظهر بمظهر العامل الحُر الغبي. تجّنب الحديث عن نفسك بصيغة الغائب، أو أن تخلط ما بين صيغة المُتكلم والغائب معًا، تجّنب صيغة الجمع "نحن" وابتعد قدر الإمكان عن المُصطلحات الرّنانة واستبدلها بمُصطلحات أبسط. اكتب وكأنك تُخاطب عميلك مُباشرة، حدّثه مُباشرة وبكلمات بسيطة عن السّبب الذي يجعل من توظيفك هو الخيار الأنسب بالنّسبة له. لن يُساعد ذلك على جعلك موقعك يظهر بمظهر أفضل، بل سيُعطي الفرصة لزبائنك لمعرفة المزيد حولك ولزيادة فرص توظيفهم لك. حان الوقت لتصحيح الأمرإن أهم ما في الموضوع أن تدرك أن موقعك غير جاذب، وعندها فقط يمكنك العمل على تحديد مواقع الخلل فيه. ومع ذلك فمهمة إعادة صياغة كاملة للموقع ليست بالمهمة السهلة أبداً، وربما ستكون سببًا في صرفك النظر عن تغييره أو تأجيل هذه المهمة، يحدث ذلك حتى وإن كنت تعرف ما تريد فعله بالتحديد، فقد تجد نفسك تحدق في موقعك لمدى شهر وأنت على علم أنه غير جاذب، دون القيام بأي تغيير، لأنك لا تعلم من أين تبدأ. إذا أنتابك مثل هذا الشعور، فلا تحاول فعل كل شيء دفعة واحدة ولا أن تتجاهل المشكلة، ولكن أبدأ في التغييرات واحداً تلو الأخر حتى يتألق موقعك. وإليك بعض الأفكار التي قد تساعدك في ذلك: إقرأ النصوص الموجودة في موقعك بصوت عالِ، بذلك ستتمكن من معرفة الأماكن التي لا تتناسب وما ترُيد قوله وما يجب إبقاؤه وما يجب حذفه.اطلب من أحد أصدقائك الذين يعملون في مجال الكتابة والتّحرير، أن يطّلع على موقعك بهدف معرفة مدى سهولة قراءته.استخدم قالبًا جديداً يحتوي على المزيد من المساحات البيضاء، أو تواصل مع مصمم مواقع لمساعدتك في ذلك.حاول خفض ملف التعريف الخاص بك إلى فقرة أو اثنتين على الأكثر.أعد يومياً كتابة صفحة واحدة على الأقل من الصفحات القديمة على موقعك.أضف عنوان بريدك الإلكتروني إلى صفحة الاتصال الخاصة بك.اطلب من زملائك في المجال مراجعة عملك.إيجاد زبائن لك كمستقل هو في الغالب من أصعب التحديات، فلا تدع موقعك يجعلها أكثر صعوبة، خذ وقتاً كافياً للتأكد من سير موقعك، وأنه معك لا ضدك، وسيكون بذلك عما قريب أفضل مسوّق لك. هل تجد أي من هذه الأخطاء في موقعك؟ هل استخدمت أي من هذه النصائح لتجعل موقعك يزيد من تألقك؟ شاركنا أفكارك وتعليقاتك على الموضوع. ترجمة -وبتصرّف- للمقال: Why Your Freelance Website Stinks (Mine Did Too) and How to Fix It.