آموزش طراحی سایت فروشگاهی شخصی تجاری در بابل

طراحی حرفه ای سایت وب سازان شمال در بابل با پشتیبانی 24 ساعته و سئو بالا با متد gtmetrix

آموزش طراحی سایت فروشگاهی شخصی تجاری در بابل

طراحی حرفه ای سایت وب سازان شمال در بابل با پشتیبانی 24 ساعته و سئو بالا با متد gtmetrix

آموزش طراحی سایت فروشگاهی شخصی تجاری در بابل

بدون شک، برنامه نویسی یکی از مهم‌ترین مهارت‌هایی است که امروزه نه تنها برای فارغ التحصیلان و دانشجویان رشته مهندسی کامپیوتر، بلکه برای سایر رشته‌ها و زمینه‌ها کاربرد مهمی دارد .

طراح وب باید چه بداند؟

سه شنبه, ۶ فروردين ۱۳۹۸، ۱۲:۰۰ ب.ظ

جنبه های بسیاری برای ایجاد یک طراحی وب سایت وجود دارد. طراحان وب اغلب باید نقش های متعددی بازی کنند و در مورد ساخت پوسته های موثر و قابل استفاده سایت بسیار آگاه باشند.



بیشتر درس هایی که در طراحی وب یاد می گیرید از تجربه کاری می آید؛ یادگیری یک فرآیند تکرار است و هیچ راهی بهتر برای کسب دانش از اشتباهات (و پس از آن و یادگیری از آنها) وجود ندارد.

در این مقاله، ما 10 نکات ضروری و عمومی را که هر طراح وب سایت تازه کار باید بدانیم، مورد بحث قرار دهیم.


1. بهینه سازی گرافیک وب برای بارگذاری صفحات بهتر

با انتخاب فرمت مناسب و اطمینان از اینکه آن را به اندازه کوچک که احتمالا می تواند باشد، چگونگی بهینه سازی گرافیک وب خود را بیاموزید. حتی اگر مردم به اتصال به پهنای باند پیشروی می کنند، هنوز تعداد بسیار زیادی از آنها از اتصال اینترنت Dial-up استفاده می کنند. علاوه بر این، با ظهور فن آوری های تلفن همراه که لزوما سرعت های پهنای باند ندارند، با داشتن بارهای بارگذاری صفحات آهسته به دلیل حجم فایل های تصویر می توانند کاربران را خاموش کنند.


در اینجا یک قاعده کلی از شستشو برای برداشتن فرمت پرونده مناسب است: تصاویری که دارای رنگ جامد هستند، بهتر است به عنوان PNG و GIF ها ذخیره شوند، در حالی که تصاویر با رنگ های مداوم (مانند عکس ها) بهتر است به عنوان JPG ذخیره شوند.


بهینه سازی وب گرافیک برای بارگذاری صفحات بهتر


ابزارهای زیادی در اختیار شما قرار می گیرند که به شما کمک می کند تصاویر خود را بهینه سازی کنید و اندازه فایل های خود را کاهش دهید، این لیست ابزار برای بهینه سازی تصاویر خود را بررسی کنید.


با محدود کردن تعداد تصاویری که شما استفاده می کنید به حداقل حداقل، هوشمند بودن در مورد استفاده از تصاویر و کاهش اندازه فایل ها به همان اندازه که شما می توانید، به طور قابل توجهی کاهش زمان پاسخ صفحات وب سایت و بهبود عملکرد صفحه وب خود را.


2. آن را پاک و ساده نگه دارید

یک طراحی خوب وب فقط یک ظاهر بصری جذاب نیست، بلکه یک کاربرپسند است. طراحی وب ساده و ساده به طور معمول به یک وب طراحی با قابلیت استفاده بسیار بالا می انجامد که با هم ارتباطی ندارد.


با داشتن بیش از حد بسیاری از ویژگی ها و اجزای سایت در یک صفحه، احتمال ریسک بینندگان وب سایت را از هدف وب سایت ریسک می کنید. اطمینان حاصل کنید که هر عنصر صفحه دارای یک هدف است و سؤالات زیر را از خود بپرسید:


آیا طراحی واقعا به این نیاز نیاز دارد؟

این عنصر چه کار می کند و چگونه به کاربر کمک می کند؟

اگر این عنصر را به طور ناگهانی حذف کنم، بیشتر مردم آن را می خواهند؟

چگونه این عنصر به هدف، پیام و هدف سایت چسبیده است؟

علاوه بر این، اگر چه ممکن است فوق العاده عالی باشد تا یک طراحی جدید یا طراحی رابط کاربری برای وب سایت شما ایجاد شود، مطمئن شوید که طراحی هنوز برای کاربران شما قابل دسترس و بصری است. افراد به الگوهای متداخل مشترک، ویژگی های سایت و رابط های وب عادت کرده اند و اگر طراحی شما واقعا منحصر به فرد باشد، مطمئن شوید که آن خیلی مبهم و گیج کننده نیست. خلاق باشید، بلکه ساده بودن آن را نیز حفظ کنید.


3. ناوبری مهمترین چیز است که شما طراحی می کنید

مهمترین ویژگی سایت، ناوبری وب سایت است بدون آن، کاربران هر صفحه ای را که اتفاق می افتد به زمین می چسبد. با این واقعیت آشکار از راه، ما در مورد برخی از نکات مهم در نظر گرفتن در هنگام ساخت یک طرح ناوبری صحبت کنید.


اول، بسیار مهم است که زمان کافی و برنامه ریزی زیادی در ساختار ناوبری سایت ایجاد شود. این عقل عمومی است، اما هنوز هم شگفت انگیز است که چگونه بسیاری از طرح های وب سایت را برای هدایت سایت هدایت می کند.


قرار دادن، سبک، تکنولوژی (آیا از جاوا اسکریپت یا فقط CSS استفاده می شود؟)، قابلیت استفاده و دسترسی به وب فقط بعضی از چیزهایی است که باید هنگام ایجاد طرح ناوبری در نظر بگیرید.


طراحی ناوبری شما باید به دلیل مرورگرهای مبتنی بر متن بدون CSS کار کند. همه چیز را که می خواهید از مرورگرهای متن لذت ببرید، اما هنوز در بسیاری از دستگاه های تلفن همراه شایع است. شاید مهمتر از همه، ناوبری که با غیرفعال CSS کار می کند (99.99٪ از زمان) از طریق خوانندگان صفحه نمایش قابل دسترسی است.


CSS غیر فعال شده است


ناوبری باید بدون نیاز به فن آوری های جانبی مشتری مانند جاوا اسکریپت یا فلش قابل دسترسی باشد و قابل استفاده باشد و ممکن است کاربران به دلایل مختلف نظیر امنیت یا سیاست شرکت، فعال یا غیرفعال شده باشند.


ضروری است که شما یک سیستم ناوبری خوب داشته باشید که در مکان بسیار قابل مشاهده است. ناوبری خوب در اسرع وقت صفحه وب بدون نیاز به حرکت به پایین صفحه وب قابل شناسایی است. این جایی است که نگه داشتن آن پاک و ساده نقش مهمی را بازی می کند: طراحی پیچیده و غیر متعارف می تواند منجر به سردرگمی کاربران شود.


کاربران هرگز نباید تعجب کنند، حتی برای یک ثانیه تقسیم، "ناوبری سایت کجاست؟"


برای سایت هایی که در یک سلسله مراتب و چند سطحی سازماندهی شده اند، اطمینان حاصل کنید که مسیر صفحات وب بین والدین و فرزندان آسان است. علاوه بر این، باید از صفحات سطح بالا (مانند صفحه اول سایت) از هر صفحه وب آسان باشد.


هدف اصلی ناوبری سایت شما این است که به کاربران اجازه می دهد تا به عنوان تعداد کمی از اقدامات و با کمی تلاش در جهت طرف مقابل به آنها دسترسی داشته باشند.


4. استفاده از فونت عاقلانه و روشمند

اگرچه هزاران فونت وجود دارد، شما واقعا می توانید از یک انگشت کوچک استفاده کنید (دحداقل تا CSS3 به طور کامل توسط مرورگرهای اصلی پشتیبانی می شود). آن را نقطه به چسبیدن به فونت های امن وب است. اگر فونت های ایمن وب را دوست ندارید، یک طراحی وب سایت که به تدریج افزایش یافته است را در نظر بگیرید که sIFR یا Cufon را استفاده می کند.


استفاده از فونت را پایدار نگه دارید. اطمینان حاصل کنید که سرفصل ها بصری هستند - متن پاراگراف متفاوت است. استفاده از فضای سفید، نیشگون گرفتن خط ارتفاع، اندازه قلم، و فاصله نامه نامه ای برای ایجاد محتوای دلپذیر برای خواندن و بدون نیاز به اسکن کردن.


شاید یکی از چیزهایی که طراحان وب اغلب اشتباه می کنند اندازه فونت هستند. از آنجا که ما می خواهیم به همان اندازه که متن را در یک صفحه وب می توانیم متناسب کنیم، گاهی اوقات اندازه فونت ها را به اندازه های نامناسب کوچک اندازه می کنیم. سعی کنید اندازه فونت را در و حداکثر 12 پیکسل در صورت امکان، به ویژه برای متن پاراگراف نگه دارید. درحالیکه بسیاری از افراد در معرض نواختن اندازه کوچک متن نیستند، فکر می کنند در مورد کاربران قدیمی و افراد مبتلا به کم بینایی و سایر انواع اختلالات بینایی فکر کنید.


5. درک دسترسی به رنگ

پس از صحبت کردن در مورد فونت ها، ما همچنین باید اهمیت استفاده از رنگ های مناسب را ذکر کنیم.


شما باید رنگ کنتراست رنگ پس زمینه و پیش زمینه را برای خوانایی و برای کاربران کم بینایی در نظر بگیرید. به عنوان مثال، متن سیاه و سفید در پس زمینه سفید دارای کنتراست بالا است، در حالی که متن نارنجی در پس زمینه قرمز شما چشم خود را تحت فشار قرار می دهد.


کنتراست رنگ


همچنین از رنگهایی استفاده کنید که برای افرادی که با اشکال خاصی از رنگ نابینایی قابل دسترسی هستند (از ابزار Whcheck استفاده کنید که به شما کمک می کند تا برای انواع خاصی از رنگ کوری تست کنید).


برخی ترکیبات رنگ تنها زمانی کار می کنند که رنگ به جای رنگ پس زمینه به عنوان رنگ پیش زمینه استفاده شود. به عنوان مثال، متن آبی تیره در پس زمینه صورتی در مقابل اما متن صورتی در پس زمینه آبی، رنگ های مشابه، اما سطوح مختلف از قابلیت خواندن و راحتی خواندن. مهم این است که نه تنها یک ترکیب رنگی خوب داشته باشیم بلکه آن را به عناصر سمت راست در صفحه اعمال کنیم.


ترکیب رنگ


6. شما باید بدانید چگونه خودتان کد خود را وارد کنید

با ویراستاران مختلف WYSIWYG سیل در بازار، ساده شده است به عنوان 1-2-3 برای طراحی سایت. با این حال، بسیاری از این ویراستاران بدون نیاز به استفاده از کد آشغال، ساخت ساختار HTML خود را ضعیف طراحی، سخت تر برای حفظ و به روز رسانی، و باعث اندازه فایل های خود را به نفوذ.


با نوشتن کد خودتان، با کد تمیز، واضح و مختصر آشنا می شوید که لذت خواندن و نگهداری آن را دارد. کد که شما می توانید افتخار خود را به تماس بگیرید.


دانستن اینکه چگونه از WYSIWYG یا IDE با استفاده از پیش نمایش بصری استفاده کنید، از HTML و CSS یاد نمی گیرید. شما باید بدانید که برای ایجاد طرح های وب مؤثر، معنایی و بهینه سازی شده وب سایت چه می گذرد.


7. بهینه سازی موتورهای جستجو را فراموش نکن

یک طراح خوب همیشه باید به یاد داشته باشید که هنگام طراحی یک سایت، اصول اولیه جستجوگر را حفظ کنید. به عنوان مثال، ساختار محتوای وب را به طوری که متن مهم به عنوان عنوان (به عنوان مثال عنوان صفحه و آرم) نشان داده شده است. این جایی است که یادگیری نحوه درست کد کردن را مفید می داند. دانستن صحیح، معنایی و مبتنی بر استانداردهای HTML / CSS - شما به سرعت متوجه خواهید شد که divs بهتر از جداول برای طرح بندی وب است نه تنها برای نمایش دقیق محتوای سایت بلکه برای رتبه بندی موتورهای جستجو؛ شما همچنین می دانید که جایگزینی تصویر پس زمینه متن CSS ایده خوبی است.


8. درک کنید که مردم بی قراری هستند

افراد به طور میانگین فقط چند ثانیه صرف می کنند تا تصمیم بگیرند که آیا می خواهند بیشتر بخوانند یا به سایت دیگری هدایت شوند. بنابراین، شما به عنوان یک طراح وب باید راه را برای تشویق کاربران به انتخاب گزینه قبلی در طول این ثمرات ثمره راه اندازی کنید.


بدانید که تعداد زیادی بازدید کننده به پایین صفحه نگاه نمی کنند تا تمامی مطالب صفحه را مشاهده کنند، اگر آنچه که در بالای صفحه می بینند، آنها را مورد علاقه نمی کند. به یاد داشته باشید عناصر مهم خود را در بالای صفحه نگه دارید تا جایی که آنها به راحتی قابل مشاهده باشند، اما نیمی از صفحه را از دست ندهید که بتواند کاربران را تهدید کند و آنها را از خواندن بیشتر در صفحه پایین بیاورد. نیمی از طراحی وب سایت یک نقطه فروش را در نظر بگیرید: یک فروشنده باشید، مردم را به این فکر می اندازید که می خواهند ببینند که چه چیزی در سایت شما وجود دارد.


9. یاد بگیرید درباره (و بدانید) دلربا مرورگر یاد بگیرید

یکی از چیزهایی که شما باید به عنوان یک طراح وب بدانید این است که کار شما در یک محیط فریبنده و غیرقابل پیش بینی است: مرورگرهای وب. کافی نیست که طرحهای شما در چند مرورگر وب کار کنند؛ آنها باید در موقعیتهای بسیار زیادی در مرورگر کار کنند که شما احتمالا آن را داشته باشید. قبل از تولید - نمونه اولیه خود را با استفاده از ابزارهایی مانند Browsershots تست کنید.


مرورگرها


10. طراحی هایی را که انعطاف پذیر و قابل نگهداری هستند طراحی کنید

یک طراح وب خوب اطمینان می دهد که سایت به راحتی می تواند در آینده به روز شود یا تغییر یابد. طراحی وب سایت هایی که قابل خواندن و آسان برای حفظ هستند نشانه ای از طراح وب بزرگ است. با جدا کردن سبک از ساختار، کار خود را به شکل مدولار انجام دهید.


می دانید که صنعت ما پویا و جوان است - چیزها در زمان بسیار کوتاهی تغییر می کنند. نگه داشتن این فکر در ذهن خواهد ساخت ایجاد طرح های وب انعطاف پذیر.


راهنمایی های طراحی وب خود چیست؟

اگر راهنمایی بیشتری برای به اشتراک گذاشتن به طراح وب اولیه داشته باشید،


نظرات  (۰)

هيچ نظري هنوز ثبت نشده است

ارسال نظر

ارسال نظر آزاد است، اما اگر قبلا در بیان ثبت نام کرده اید می توانید ابتدا وارد شوید.
شما میتوانید از این تگهای html استفاده کنید:
<b> یا <strong>، <em> یا <i>، <u>، <strike> یا <s>، <sup>، <sub>، <blockquote>، <code>، <pre>، <hr>، <br>، <p>، <a href="" title="">، <span style="">، <div align="">
تجدید کد امنیتی