Вопрос по инклудам на статическом HTML-ном сайте

Разный синтаксис. Разное ПО для поддержки. Лучше PHP. Поддержка на хостингах практически 100-процентная, инфы море, спецов в случае чего – тоже.

Я бы все же не ограничивался одними включениями, а взял какой-нибудь простой, но гибкий каркас.

Например, делаете файлы:

index.php

contact.php

Внутри:

<?php

include 'header.html';



include 'home.html';



include 'footer.html';

По аналогии и другие файлы. В итоге, изменяя один раз header.html, он изменится везде, так как включается во всех ваших файлах. Естественно, придется поменять ссылки в шаблонах (на аналогичные файлы с расширением *.php)

Дело в том, что я сам юрист по образованию, мы с коллегой занимаемся частной юридической практикой, снимаем небольшой офис. Пришли к тому, чтобы сделать себе юридический сайт своими силами. Это решение было принято около полутора лет тому назад... Разработку сайта я решил взять полностью на себя, как более молодой юрист (мне 35 лет) и лучше разбирающийся в компьютерах.

За прошедшее время я на хорошем уровне изучил HTML+CSS вёрстку, изучил фотошоп, нарезку из фотошопа, а также поверхностно прошёлся по JavaScript & JQuery (знаю только как корректно подключить скрипт, чтобы он работал, всё!). Увы, но пока РНР не изучал вообще. То есть, в вопросах программирования я не разбираюсь вообще, могу только корректно подключать скрипты на сайт. В частности, в качестве самостоятельной работы несколько раз я успешно уже верстал галереи на сайте и подключал скрипты ДжаваСкрипт на клик по картинке галереи (задний фон затеняется и показывает большой размер фото). То есть, имею опыт использовать чужие скрипты, но свои писать не умею, увы 😕 Есть к чему стремиться.

Сейчас уже необходимо запускать сайт, оплачен хостинг, зарегистрирован домен. Я понимаю, что мне ещё есть куда расти и двигаться, но хотелось бы уже с чего-то начать, запустить пусть и простой, но сайт-визитку. Поскольку время идёт, пусть поисковики его проиндексируют, песочница впереди ещё... Потому-то и интересует синтаксис инклудов, поскольку хотелось бы уже сейчас начать верстать с их помощью.

Также, вот буквально сейчас назрел вопрос относительно синтаксиса "медиа-запросов" для мобильной версии сайта (под разные разрешения мониторов). Хочу сделать сайт адаптивным на меди-запросах. Возможно, кто-либо посоветует (или как пример - покажет кусок кода) правильный синтаксис самих запросов.

По сути, это две основные проблемы у меня в данный момент: инклуды и меди-запросы. Спасибо. :)

---------- Добавлено 11.01.2017 в 21:33 ----------

danforth, спасибо за пояснения. Как я вижу, нужно менять названия расширений файлов? А если использовать Server Side Includes - там нужно менять *.html на *.php ?

Может быть, будет лучше SSI вместо PHP includes ? Чтобы не менять в меню ссылки на расширения файлов...

Есть готовые движки. Есть несложные каркасы, о чем я писал, – в них на начальном этапе можно вообще не программировать, а только нарезать шаблоны и вносить фактические данные (обычно в БД). Могу прислать что-нибудь простое, без админки бесплатно, и показать, как с этим работать.

Подберите какой-нибудь адаптивный html-шаблон. Ваши навыки помогут его отредактировать, не затрагивая такие сложные моменты, как собственно сама адаптивность.

Выше во вставке кода вам показали немного не так, как следовало бы сделать. Обычно в модели с множеством точек входа, реализованной на файлах, сначала определяют фактические данные, а потом уже подключают шаблон(ы).

---------- Добавлено 11.01.2017 в 22:49 ----------

P.S. Если к примеру в home.html находится основное содержимое в полностью статичном виде, то в этом случае лучше использовать readfile, а не include/require.

Не заморачивайтесь с SSI - функциональность там минимальная, имеет смысл, только если хотите сэкономить на хостинге.

Смысл инклюдинга в том, что подключаемый кусок кода ведёт себя так, как будто он написан на этом месте, но подключать можно разный код в зависимости от обстоятельств. Берёте HTML-код своей страницы и режете на куски, по принципу функциональности. Каждый кусок оформляете отдельным файлом и инклюдите в нужном месте. Причём в каждом из этих файлов тоже можно что-то подключать. Например, в файле body.inc можно подключить файл menu.inc. Эта схема работает для нескольких точек входа, в случае же с единой точкой входа схема немножко другая - это уже совсем не статический сайт.

Для адаптивности вопрос стоит не в медиа-запросах, а в медиа-css. Простейший пример:

@media (max-width: 480px) {
  .imgblock {
    margin: 10px;
  }
}

Коллега, спасибо вам за беспокойство. Реально приятно, что люди тут на форуме проникаются твоими проблемами и пытаются реально помочь. Расскажу своё видение ситуации.

Как я уже упоминал, занимаюсь самообучением я уже почти два года. За это время нарыл до десяти курсов по вёрстке, в частности от Специалиста при мгту им Баумана (на торрентах их себе скачал). Вот, лежит курс от Борисова по РНР и ждёт своего часа... Курс неплохой, судя по отзывам, четыре уровня по РНР, курс кажется от 2013 года выпуска. Плюс, курсы от Линды по программированию и веб-дизайну. Иными словами, работаю я достаточно упорно и активно.

Вёрстку изучил, что называется, "от и до". Также хорошо проработал фотошоп, слои, отрисовку и нарезку макетов. Блин, как мне надоели эти видео-лекции, вы даже себе не представляете! Но держусь, упорно продолжаю работать над своими навыками.

Да, вы правы, мои навыки вёрстки позволяют мне отредактировать и изменить под себя абсолютно любой макет. Адаптивность я тоже отработал, просто синтаксис пока смущает, "погуглю" ещё на досуге этот вопрос. А так, база у меня уже есть, причем серьёзная.

За плечами у меня также есть уже два статических сайта - один для фермерского хозяйства, с галереями (отрабатывал навыки построения галерей, их у меня там получилось тридцать штук, очень красивый сайт в итоге выстрелил, в топы Яндекса и Гугла - сам даже не ожидал, оказывается в этой нише была малая конкуренция, и я своими галереями всех просто уложил на лопатки). Так вот, заказчик, он же хозяин фермерского хозяйства, просто "выпал в осадок" от количества звонков с сайта. Я просто завёл там новый номер сотового телефона, и хозяин мог видеть кто звонит именно с сайта. Кроме галерей там у меня статьи. Всего около 80 статических страниц HTML, но как этот сайт выстрелил в Гугле !!! Вы бы видели, буквально порвал всех на части, в серпе состоит в топ-3 железно уже полгода. Кстати говоря, тематика этого фермерского хозяйства: свиньи, козы, плюс выращивание молодняка и корма для коз и свиней, породистые козы и свиньи, козьий сыр, козье молоко, свинина и так далее. Именно этот проект просто впечатлил самого меня, и после этого я начал работать над собой ещё более усердно, потому-что заказчик чуть ли не со слезами счастья на глазах благодарил...

Второй проект, который я сделал - это статический сайт для салона стоматологических услуг. Тут ситуация не такая радужная, как в сайте выше. Тут конкуренция покруче, и пока просто сайт висит даже не в топ-10... Счётчики поставил от Гугла и Яндекса, зарегестрировал в Гугле, Яндексе и Майл.ру. Дальше думаю, что с ним делать... Всё делал сам: оплатил и заказал хостинг, домены, работаю с группой поддержки хостинга, настроил зеркала (с www / без www). Умею устанавливать и работать с Денвером. Пробовал на Денвере фактическую работу Server Side Includes. Но тогда не впечатлило, сейчас вот опять задумался о них... Кстати говоря, оба вышеуказанных проекта были мною сделаны не столько за деньги, сколько просто ради практики. Адаптивность на них пока не делал, хотя в планах есть - хочу через CSS с помощью медиа-запросов запилить адаптивные шаблоны. Хорошо, что в Гугл Хроме в отладчике (F12) уже сделали просто шикарную возможность просматривать под раные устройства, даже имитировать нажатие пальцем. Шикарно! Всем рекомендую обратить внимание, кто еще не использовал.

Вот теперь наконец-то дошёл до своего сайта - юридического... То есть, опыт кое-какой запуска проектов уже есть, просто хотел тут у уважаемых форумчан уточнить вопросы синтаксиса инклудов и медиа-запросов. Больше меня прельщают SSI - наверное, потому-что я их уже отрабатывал немного под Дневером. Следующий мой этап - программирование - PHP & MySQL, JavaScript. Материалы для изучения уже лежат, ждут своего часа.

Сайт хочу делать строго на статике (html), не исключаю применение инклудов, также применение скриптов, только точечно, там где они действительно понадобятся. Никаких ЦМС - никаких автоматизаций. Только хардкор, только ручная работа :)

---------- Добавлено 11.01.2017 в 22:35 ----------

Вот это классное пояснение - спасибо, коллега! Я никак не мог сформулировать данный момент, вы помогли мне в этом. Экономить на хостинге у меня смысла нет - под свой юридический сайт я заказал платный, надёжный хостинг с максимальным тарифным пакетом, то есть там уже всё есть, что только может быть. В том числе поддержка абсолютно всех технологий. Сервера у хостера, кстати, физически находятся в США и Германии, что тоже меня порадовало.

Ну в общем тут всё уже описали, пока я трясся в электричке с работы домой.

Но если идти дальше, то можно и кое какой динамический контент присобачить (ведь как известно, первое, что хочет лбой начинающий вебмастер, это добавить новости на сайт :) ), используя для этого текстовые файлы, например подобный код выведет n последних новостей из файла news.txt с использованием шаблона news_item_view.html (сейчас накидал за 10 минут);

вставка в тело страницы блока

<?php

	include_once ('news.php');

	$news = new News;

	print $news -> showLast(3);

?>

news.txt

11.01.2017:Краткая новость 1: Текст краткой новости;

10.01.2017:Краткая новость 2: Текст краткой новости;

09.01.2017:Краткая новость 3: Текст краткой новости;

08.01.2017:Краткая новость 4: Текст краткой новости;

news_item_view.html

<h2>{title}</h2>

<small>{date}</small>

<p>{description}</p>

news.php

class News

{

	protected $NewsFilename = 'news.txt';

	

	// показывает n последних новостей

	public function showLast($total = 3)

	{

		$news       = explode(";",rtrim(file_get_contents($this -> NewsFilename),";"));

		$viewFile    = file_get_contents('news_item_view.html');

		$output     = '';

		

		if (sizeof($news) > $total )

			$maxLines = $total;

		else

			$maxLines = sizeof($news);

		

		for ($line=0; $line<$maxLines; $line++)

		{

			$lineExploded = explode(':',trim($news[$line]));

			$view = array(

						'{date}' 		=> date("d.m.Y",strtotime($lineExploded[0])),

						'{title}' 		=> $lineExploded[1],

						'{description}' => $lineExploded[2],

					);

			$search 	= array_keys($view);

			$replace 	= array_values($view);

			$output    .=  str_replace($search,$replace,$viewFile);

		}

	return $output;

	}

	

}

Начните смотреть Курсы по PHP Борисова (Бауманка), те что вы сказали чуть выше. Можете скачать версию 2016 года на nnm club. У него отличные курсы, которые действительно могут научить. Для новичка подходят идеально. Главное делайте домашку, перепечатывайте с экрана, пробуйте код на "ощупь", вырабатывайте память, следить как препод форматирует текст, какими инструментами пользуется.

Для SSI нет необходимости менять расширение. Советую вам забыть про SSI, потому что это старый и не гибкий способ.

Файлы с расширением *.php по умолчанию обрабатываются интерпретатором PHP. Можно настроить, чтобы интерпретатор обрабатывал любые расширения, даже exe, mp3, и прочие. Главное, чтобы они содержали код, написанный на PHP. Однако, никто это в здравом уме не делает, поэтому ответ на ваш вопрос: да, все файлы для языка программирования PHP должны иметь расширение *.php, если вы умышленно не захотите изменить это, имея весомые аргументы. Вы должны понять, что расширение, это абстракция, важно содержимое файла.

Из советов, который вы можете проигнорировать, могу сказать одно: PHP не лучший язык для обучения программированию, однако неплох для быстрого зарабатывания денег, так как низкий порог вхождения.

---------- Добавлено 11.01.2017 в 21:50 ----------

silicoid, ООП автору пока рано, вы ему это для вдохновения написали?

в общем-то да. Я начал изучение пхп в 2002м с того, что неделю разбирался "почему эта чертова гостевая книга у всех работает, а у меня нет"

Иногда действует мотивирующе, кстати

Коллега, немного не понял ваше сообщение о "быстром зарабатывании денег". Честно говоря, вряд-ли я с моими "навыками" программирования, а точнее отсутствием таковых, смогу зарабатывать когда-либо на этом приличные деньги. Тем более, что у меня именно юридическое образование, то есть гуманитарное... Ай-тишный ВУЗ я не заканчивал, к сожалению.

Хотя, если у вас есть удачные примеры из вашых друзей/знакомых, которые пришли из гуманитарной сферы и стали неплохо зарабатывать в ай-ти (программировании), прошу привести эти примеры для вдохновения! Было бы интересно почитать истории жизни людей и их прихода в профессию программиста. Ведь писать код - это совсем не просто, а мне уже 35 лет. Возраст, когда "джуном" хрен возьмут на какую-то "шхуну", остаётся только фриланс... Или нет?...