وب سایت های استاتیک صفحات وب از قبل ساخته شده هستند که برای هر کاربر وب سایت همان محتوای را نشان می دهند. بر خلاف وب سایت های پویا ، هیچ برگشتی و پایگاه داده ای وجود ندارد که بر اساس آنچه کاربران انجام می دهند ، محتوای شخصی سازی شده را ارائه دهند.
این بدان معنی است که وب سایت های استاتیک بار بار سریعتر ، میزبانی ارزان تر ، امنیت بیشتر و پشتیبانی کمتری برای نگهداری از یک سایت پویا دارند.
اگرچه محتوای یک سایت استاتیک محتوای “ثابت” است ، اما نیازی به ثابت بودن یا کسل کننده نیست. هنوز هم می توانید شکل ها ، فیلم ها و جلوه ها را اضافه کنید. البته محدودیت هایی در سایت های استاتیک وجود دارد ، اما توسعه دهندگان هوشمند معمولاً می توانند راه حل هایی پیدا کنند تا دقیقاً آنچه را که می خواهند بدست آورند.
بیایید به نه نمونه استاتیک وب سایت هایی که در تعدادی از وب سایت های استفاده از مشاغل بسیار مؤثر هستند ، نگاه کنیم.
در هر مثال ، من با وب سایت استاتیک یا سازنده وب سایت مورد استفاده در هر مثال تماس می گیرم و برای تأکید بر موارد خاص در صفحه برای الهام بخشیدن به عنوان الهام می گیرم.
اظهار: مبتدیان در ایجاد یک وب سایت ساده استاتیک با وب سایت مثل ویکس همه چیز یک نکته است و کلیک کنید ، لازم نیست چیزی را رمزگذاری کنید. چیزهای بیشتری برای دانستن اینکه آیا می خواهید یک سایت پیشرفته با استفاده از ژنراتور سایت استاتیک ایجاد کنید ، وجود دارد.
1. وب سایت استاتیک در یک فریلنسر: سوفی بریتین
ساخته شده با ویکس
سوفی انگلیس ، یک طراح محصول آزاد در نیویورک ، دارای یک وب سایت استاتیک جلا است که کار او را نشان می دهد و اتصال آن را آسان تر می کند.
سایت بسیار ساده است. ما در مورد دو صفحه ، چهار رنگ ، چندین اثر موش و در کل کمتر از 500 صحبت می کنیم.
اما هیچ چیز گم نشده است.
تمرکز سایت کار گذشته اوست که در تصاویر با کیفیت بالا فیلمبرداری شده است. هیچ چیز مبتکر در نحوه تسویه حساب او وجود ندارد ، اما مشخص است که وی خواستار پروژه های طراح برای مارک های اصلی است.
ما به یک وب سایت واقعاً نزدیک از تمام شیوه های رایگان که یک ژرمین سریع استخدام می کنیم نگاه می کنیم. ممکن است ما به یک رزومه (شاید) نگاه کنیم ، اما ما 100 ٪ وب سایت هر نویسنده ، طراح ، توسعه دهنده یا نقش دیگری را که برای پر کردن آن نیاز داریم بررسی می کنیم.
اگر شما یک توسعه دهنده کامل هستید ، سایت پویا راهی عالی برای نشان دادن توانایی های خود است.
برای هر کس دیگری ، عناصر پیچیده صفحات احتمالاً تمرکز کار شما را می گیرند.
2. وب سایت استاتیک آموزشی مثال: CSS مدرن
ساخته شده با سوری
Modern CSS یک وب سایت استاتیک با تن درس و راهنماهای توسعه دهندگان وب است. این بنا توسط استفانی اکلز ، مهندس/معلم با اشتیاق به توسعه قسمت جلویی ساخته و نگهداری می شود.
اثبات مهارت استفانی با CSS در همه جا در این سایت است ، از طرح منحصر به فرد درسهای فردی تا قوس ، بر تأثیرات موش تأکید می کند. او آشکارا چیزهای خود را می داند.
با عمیق تر شدن در درس ها ، شما محتوای زیبایی را پیدا خواهید کرد و دقیقاً توضیح می دهید که چگونه می توانید ظاهر مورد نظر وب سایت را برای خودتان بازآفرینی کنید.
برخی از تبلیغات خوب در این سایت وجود دارد که احتمالاً درآمد کمی دارند. اما با وب سایت های آموزشی ، این معمولاً محتوای پرداخت شده (دوره ها و سایر دارایی های دیجیتالی) است که منجر به درآمد می شوند.
از این نظر ، CSS مدرن بسیار عالی است زیرا تمام محتوا رایگان است. خاله من اکیداً توصیه می کنم اگر قصد دارید برخی از رمزگذاری دستی را در سایت استاتیک خود انجام دهید ، آن را بررسی کنید.
3. نمونه کارها استاتیک نمونه: یوهانس آرنولد
ساخته شده با نسخه
وب سایت های استاتیک یک خانه عالی برای اوراق بهادار ایجاد می کنند. در مثال ما ، عکاس یوهانس آرنولد با موفقیت کار خود را نشان می دهد و سایت را پاک و آسان برای حرکت می کند.
من دوست دارم که او یک صفحه جداگانه برای نمونه کارها خود ندارد – صفحه اصلی این است. می توانید بر روی تصاویر کلیک کرده و با یک گالری بزرگتر برای هر پروژه به یک صفحه جداگانه بروید.
هیچ حواس پرتی از عکاسی یوهانس وجود ندارد. تصاویر و چندین فیلم تنها چیزی است که فضای سفید را می شکند. بدون رنگ ، جلوه های پس زمینه ، هیچ مورد دیگری در صفحه برای انسداد نیست. تنها متن طولانی تر از کتیبه در صفحه آن برای من است.
برای برخی از طراحان وب ، شاید وب سایت من نمونه کارها که دقیقاً چه کاری می توانید انجام دهید.
اما برای بخش عمده ای از افرادی که سعی در به اشتراک گذاشتن کار خود دارند ، وب سایت فقط قفسه ای است که کار گذشته را نشان می دهد. یک قفسه ساده خوب است – شما می خواهید مردم روی نمونه کارها خود تمرکز کنند ، نه در سایت.
4. یک وب سایت استاتیک چند زبانه: بیایید رمزگذاری کنیم
ساخته شده با هوس
صبر کنید ، اگر می خواهید بیش از یک زبان داشته باشید ، سایت های استاتیک بد نیست؟
بله ، من بیشتر اوقات می گویم که این ساده ترین گزینه شما نخواهد بود. اما بگویید که از سراسر جهان ترافیک زیادی دارید و یک وب سایت استاتیک چند زبانه می خواهید – پیچیده است ، اما می تواند اتفاق بیفتد.
بگذارید رمزگذاری یک بدنه گواهینامه باشد که گواهینامه های SSL رایگان و خودکار را برای بیش از 300 میلیون وب سایت در سراسر جهان فراهم می کند.
اکنون که شما باید یک سرویس اساسی را که توسط میلیون ها نفر استفاده می شود ، ارائه دهید ، به یک وب سایت نیاز دارید که بتواند مقیاس کند – یک سایت استاتیک ساده حس کاملی را ایجاد می کند.
با دانستن این مشکلات ، بیایید برای ایجاد یک وب سایت استاتیک چند زبانه ، برای کار با ژنراتور استاتیک هوگو رمزگذاری کنیم. شما می توانید نتایج را برای خودتان ببینید تا ببینید که چگونه آنها این کار را انجام داده اند.
یک دکمه زبان با یک نماد بصری وجود دارد که 27 زبان مختلف را ارائه می دهد.
با کلیک بر روی ترجمه ، به سادگی شما را به یک صفحه جدید هدایت می کند (به عنوان مثال برای کره ای) که شامل همان سایت اما به زبان دلخواه است.
بیایید رمزگذاری کنیم ما پول و وقت بیشتری را در یک سایت پویا خرج خواهیم کرد. به عنوان یک هدف غیر انتفاعی با مقصد فوق العاده بالا آنلاین ، استفاده از یک سایت استاتیک انتخاب شده و کارآمدتر قطعاً جاده است.
با همکاری با هوگو ، اجازه دهید Encrypt بتواند سایت استاتیک را که همه دوست دارند نگه دارد و آن را برای میلیون ها نفر دیگر در دسترس قرار دهد.
5. وب سایت استاتیک تجارت مثال: مارتین کانتینر
ساخته شده با گتس
مارتین کانتینر برای ذخیره ساحل غربی ایالات متحده ، به ظروف یخچال و خشک می فروشد ، اجاره و اجاره می کند ، آنها از یک وب سایت استاتیک برای جذب مشتریان جدید استفاده می کنند.
این شرکت با نشان دادن محصول خود و استفاده از بررسی های مشتریان خوشحال ، به روش های معمول اعتبار می دهد.
هیچ چیز خیالی وجود ندارد ، اما این یک قدم بر روی اصلی است. این فقط یک عکس از یک تریلر نیست ، بلکه یک گالری کوتاه است که به مردم امکان می دهد آن را از بسیاری از زوایا ببینند. نه آرم مشتری بزرگ و چهار بررسی کتبی برای کلیک وجود دارد.
این به سختی مقدار ظالمانه ای برای ورود به ژنراتور سایت استاتیک است. تجارت شما مطمئناً به چندین مکان یا نیم قرن در تجارت مانند مارتین کانتینر نیاز ندارد تا ده ها تصویر و تعداد انگشت شماری از بررسی مشتری را قرار دهد.
این اشتباه است که فکر کنید برای ایجاد یک وب سایت خوب به یک طراحی مزاحم نیاز دارید. شما فقط باید به اصول اولیه ضربه بزنید و آن را تمیز نگه دارید.
6. وب سایت استاتیک مثال: ویدین کندی
ساخته شده با گتس
ویدین کندی ، غول تبلیغاتی با مشتریانی مانند نایک ، مک دونالد ، فیفا دارای یک وب سایت پر جنب و جوش است که با گتسبی ایجاد شده است.
کل بخش فوق با تاشو ویدئویی است که بر جدیدترین کار آنها تأکید می کند ، و همانطور که به پایین می روید ، عناصر دیگری از صفحات و تأثیرات موش وجود دارد.
صفحه اصلی WK نمونه ای عالی از یک وب سایت استاتیک با حرکت زیادی است. بله ، هر کاربر همان تجربه را بدست می آورد (یعنی هیچ چیز پویا وجود ندارد) ، اما این به دور از کاری است که بسیاری از مردم فکر می کنند یک وب سایت استاتیک می تواند انجام دهد.
در کنار انیمیشن ها و جلوه ها ، تعدادی از جزئیات دیگر وجود داشت که فکر می کردم آنها بسیار خوب کار می کنند. به عنوان مثال ، WK دارای مکان های اداری است که در Colonthine تحتانی با ساعتهای زنده ذکر شده است که زمان محلی را نشان می دهد. آیا متوجه ساعتهای تاریک برای مکانهایی خارج از ساعات اداری شده اید؟
7. وب سایت استاتیک غیر انتفاعی مثال: دموکراسی دیجیتال
ساخته شده در: جکیل
دموکراسی دیجیتال یک سازمان غیر انتفاعی است ، “که در تقاطع حقوق بشر و فناوری ها کار می کند.”
وب سایت آنها نشان می دهد که چه کاری انجام داده اند ، ابزارهای خود را به اشتراک می گذارد و درگیر شدن افراد را برای افراد آسان تر می کند.
اثبات کار گذشته آنها در صفحات ساده عناصر فیلمبرداری شده است: تصاویر با وضوح بالا ، بلوک های متن کوتاه ، اعداد غول پیکر که توجه به “70 پروژه در 38 کشور” را به خود جلب می کنند.
گزینه های مختلفی برای اهدای یا پیوستن به جامعه وجود دارد. با تمام فضای سفید و طرح رنگ ساده ، دکمه های کمک های نارنجی معمولی بدون اینکه مزاحم باشند ، از بین می روند.
استفاده از آن لحظات کوچک که در آن شخصی نام سازمانها را از دست می دهد یا از طریق رسانه های اجتماعی زخمی می شود ، مهم است.
مردم می خواهند بخشی از چیز واقعی باشند. دقیقاً آنچه را که او برای هدف غیر انتفاعی انجام داد و به کجا هدایت شد ، به آنها نشان دهید. هیچ مازاد مورد نیاز نیست – سازمان غیر انتفاعی برای هزینه کردن منابع در یک وب سایت متجاوز ، امتیاز جایزه ای کسب نمی کند.
8. وب سایت استاتیک شرکت SaaS مثال: cypress.io
ساخته شده آسترو
Cypress.io ، یک شرکت تست انتهای جلو ، اصول اولیه را میخکوب کرده و چرخش منحصر به فرد محصول خود را با استفاده از یک سایت استاتیک قرار می دهد.
اما لارس! گزینه ای برای این سایت وجود دارد – این در یک وب سایت استاتیک چگونه است؟
خوب ، اگر مورد را مورد بازرسی قرار دهید ، می فهمید که این یک Iframe است ، به این معنی که Chatbot در واقع یکی دیگر از وب سایت های (پویا) است که ورودی بازدید کنندگان را پردازش می کند. “محدودیت” یکی دیگر از سایت های استاتیک که توسعه دهندگان می توانند به راحتی کار کنند.
همراه با chatbot ، cypress.io تمام تنظیماتی را که شخص از وب سایت SaaS که در Navbar سازماندهی شده است – محصول ، قیمت گذاری و غیره در زیر متن شخصیت ، دکمه هایی برای بارگیری برنامه رایگان برای آزمایش برای همیشه و اسناد برای استفاده از آن دارد. یک لمس خوب ، هرچند که در SaaS به سختی بی نظیر است.
به طور کلی ، منطقه تاشو فوقانی سایت برای هر کسی که نرم افزار خریداری کرده است ، متداول ، قابل اعتماد و فوراً خوانا است.
هر وب سایت SaaS در مورد همین کار انجام می دهد – و این خوب است. خریداران به دنبال چندین چیز مهم هستند و می خواهند بتوانند به سرعت توانایی های خود را مقایسه کنند.
بقیه صفحه اصلی نحوه عملکرد محصول با یک فیلم را در بر می گیرد و به دنبال آن محصول Scrllytelling. Scrolytelling برای من خیلی شیرین است ، اما تمرکز بر نحوه عملکرد محصول آنها هوشمند است.
حداقل برنامه سرو سرو با چرخه تست 10K در هر ماه ارائه می شود. راندمان کمی برای همکاری و مدیریت آزمایش به سرعت اضافه می شود. خریداران بالقوه قطعاً می خواهند ببینند که چگونه در مقایسه با سایر محصولات حرکت می کند.
ساخته شده با جکیل
سیستم های طراحی وب ایالات متحده (USWDS) در حال انتشار یک دانش دانش برای کمک به سایر سازمان های دولتی هستند که وب سایت های خود را در دسترس تر ، با ارزش و امن تر قرار می دهند.
به طور خلاصه ، آنها کدی را برای توسعه دهندگان ، قاب های سیم برای طراحان و راهنمایی ها برای کمک به سایر سازمان های دولتی برای ساختن وب سایت های بهتر فراهم می کنند.
این یک وب سایت مبتنی بر دانش بسیار متداول به روشی خوب است. طرح ناوبری قابل تشخیص است. این اطلاعات به روشی منطقی و منطقی سازماندهی شده است.
در حالت ایده آل ، مستندات به طور مکرر نیازی به تغییر نخواهد داشت ، به این معنی که سایت استاتیک باید به خوبی کار کند. اما این برای اساس دانش هر شرکتی واجب نیست.
اگر دائماً در حال توسعه فرایندها هستید ، همانطور که ما جوانه های سریع انجام می دهیم ، احتمالاً می خواهید از نرم افزار سنتی تری برای یک پایگاه دانش استفاده کنید که ویرایش ، همکاری و انتشار را تسهیل می کند. برای ما ، وب سایت استاتیک در حال حاضر به عنوان یک پایگاه دانش وحشت زده می شود.
اما برای شرکت های بزرگ و مطمئناً برای دولت ایالات متحده ، ابزارها و فرآیندهای فیلمبرداری شده در مستندات باید ماندگاری طولانی داشته باشند.
