Facebook是否为移动和桌面设计了不同的网页

Question

我是Web Dev的新手，但是对HTML和CSS为我的项目设计了一些社交网络页面，但我很困惑。

我是否与桌面分开设计移动网络？如果是，是否可以使用PHP告诉哪个页面发送到设备？

最后是Facebook使用此方法？

Answer 1

它们不会完全不同的页面，但会为不同的设备尺寸使用断点。

@media (min-width:320px)  { /* smartphones, iPhone, portrait 480x320 phones */ }
@media (min-width:481px)  { /* portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide. */ }
@media (min-width:641px)  { /* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones */ }
@media (min-width:961px)  { /* tablet, landscape iPad, lo-res laptops ands desktops */ }
@media (min-width:1025px) { /* big landscape tablets, laptops, and desktops */ }
@media (min-width:1281px) { /* hi-res laptops and desktops */ }

这是涉及的CSS的一个示例。您可以在https://www.w3schools.com/cssref/csss3_pr_mediaquery.asp

Answer 2

欢迎来到堆栈。首先，这不是询问这种类型的我要结帐软件工程的最佳场所。我不熟悉Facebook的内部运作，但我会假设，因为它们是一家大型公司，它们从头开始创建移动网站，以获得最佳的用户体验。您不必从头开始创建移动网站。您可以使用响应式Web设计同时创建一个移动站点和桌面站点。这是使用CSS和HTML处理的，因此您可以使用PHP服务器代码或任何服务器代码进行操作，但PHP代码对此不负责。有许多UI框架可以帮助您这样做，例如Bootstrap。

Answer 3

要实现不同的视图，具体取决于设备获取页面，您应该使用响应框架，并且不使用需要多次设计您的页面（例如，用于移动和桌面）

您可以创建自己的一个或使用Bootstrap：

与世界上的网络上建立响应迅速的移动优先项目 最受欢迎的前端组件库。

Bootstrap是用于使用HTML，CSS和 JS。快速原型您的想法或与我们的整个应用程序构建您的整个应用 SASS变量和混合物，响应式网格系统，广泛的预构建 组件和功能强大的插件。

bootstrap可以使用任何语言，因此即使是php。

Facebook还开发并使用了React。