Стандарт WEB-2.0, Переходим с табличной вёрстки на более совершенный способ Опции

[TypoSlaed]

Затронув эту тему уже предчувствую, как на меня обрушитсяя лавина критики, упрёков и т.д. Ведь большинство хорошо уже освоились с табличной вёрсткой и привыкли с ней работаь. И зачем чтото менять, если итак всё "гладко".
Я спорить не буду если кому то так нравится, пусть сам себе и решает. Но полагаю что всем хорошо извесны недостатки такой вёрстки. Это, как правило - при загрузке страницы мы долго наблюдаем как картинки, блоки текста, нафигация и прочие элементы двигается по экрану, перемещается, переползает с места на место - оссобенно жудко, когда много всяких прибамбасов, а скорость инета очень низкая - ето копец.
Поэтому тем кто не хочет стоять на месте, а использовать самые пргрессивные технологии, прошу присойденятся.
Предлагаю в этом разделе выкладывать всем, кто шо знает о блочной вёрстке(div's) - это как я понял относится к CSS - дизайну. Задавать вопросы связаные с этой темой. Отвечать на эти вопросы.) Ну, короче, делится опытом.

PS....//Сейчас я ничем поделится не могу, но постараюсь побыстрее разобратся и сделать свой вклад.
Сейчас я просто выкладываю шаблоны c СSS-дизайном. Будем их разбирать и надевать на АС, кстати стандартная тема - Celestial тоже свёрстана, по новым стандартам, хотя, помойму, достаточно "лажно".

Вот несколько приличных темплатов:

1 -  chromz.zip ( 23.18 Кб ) Кол-во загрузок: 283

2 -  Antique_Modern.zip ( 34.64 Кб ) Кол-во загрузок: 163

3 -  pastelco.zip ( 69.36 Кб ) Кол-во загрузок: 321

4 -  Son_Of_A_Gun.zip ( 59.74 Кб ) Кол-во загрузок: 302

5 -  bwfixed.zip ( 173.25 Кб ) Кол-во загрузок: 142

6 -  simply_green_2_column.zip ( 4.21 Кб ) Кол-во загрузок: 88

7 -  bagatelle.zip ( 40.88 Кб ) Кол-во загрузок: 94

8 -  bitter_sweet.zip ( 27.56 Кб ) Кол-во загрузок: 108


А это скрины(от других тем):
 apple.jpg ( 163.8 Кб ) Кол-во загрузок: 480
 island.jpg ( 113.12 Кб ) Кол-во загрузок: 334
 transparentia.jpg ( 151.84 Кб ) Кол-во загрузок: 258


 web_2.gif ( 96.44 Кб ) Кол-во загрузок: 140
 transition.jpg ( 120.77 Кб ) Кол-во загрузок: 134
 template009.jpg ( 187.74 Кб ) Кол-во загрузок: 230


 butterf.jpg ( 181.77 Кб ) Кол-во загрузок: 119
 coffee_n_cream.jpg ( 137.1 Кб ) Кол-во загрузок: 72
 Underground11.gif ( 58.59 Кб ) Кол-во загрузок: 111


 CrystalX.gif ( 156.3 Кб ) Кол-во загрузок: 174
 cvety.jpg ( 121.37 Кб ) Кол-во загрузок: 106
 smooth_and_sleek.gif ( 63.21 Кб ) Кол-во загрузок: 89


 silverSide.jpg ( 139.07 Кб ) Кол-во загрузок: 213
 sunny.jpg ( 185.45 Кб ) Кол-во загрузок: 158
исходник:  sunny.zip ( 31.22 Кб ) Кол-во загрузок: 71


 dreamy.jpg ( 117.12 Кб ) Кол-во загрузок: 185
 stylized.gif ( 73.43 Кб ) Кол-во загрузок: 262
исходник:  stylized.zip ( 53.36 Кб ) Кол-во загрузок: 76

 art.gif ( 82.02 Кб ) Кол-во загрузок: 187
 terrafirma.jpg ( 114.65 Кб ) Кол-во загрузок: 208
исходник:  terrafirma.zip ( 33.67 Кб ) Кол-во загрузок: 62


Сообщение отредактировал TypoSlaed: Apr 4 2008, 14:54

[OMvitamin]

В принципе сейчас на joomla выпускаются в основном шаблоны в стиле 2.0.
Если что-то нравится, можно без проблем рипнуть на слаед.

[TypoSlaed]

Это ясно, то. Но это когда на всех делать, а если хочешь для себя чё-нить пооригинальнее сделать и штоб всё чётко было, то тут лучше чем Сам, никто не сделает. Это потому, что обьяснить трудно комуто что ты хочешь, если ты пока и сам не знаешь чего хочешь. А в самом процессе, по ходу дела и выясняешь это, методом научного тыка.

[teletehnika]

Ух ты, америку открыл, извини за резкость. Я уже для 3.2.3 версии делаю на слоях. Так что ничего нового в этом нет.

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

Замечу, ты очень даже не прав. Не про критику. Про всё гладко!

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

Всё движется в том случае если не верно сделан дизайн. Не поставь размеры на картинку и ты увидиш такое да и загрузка страницы увеличится. А почему? Да потому что браузер 2!!! раза будет смотреть а нет ли размеров на картинку.

Поэтому тем кто не хочет стоять на месте, а использовать самые пргрессивные технологии, прошу присойденятся.
Предлагаю в этом разделе выкладывать всем, кто шо знает о блочной вёрстке(div's) - это как я понял относится к CSS - дизайну. Задавать вопросы связаные с этой темой. Отвечать на эти вопросы.) Ну, короче, делится опытом.

Да мы то давно уже делимся, читаем дальше цитату...

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

Вот!!! Разберись и нас научи.

[Polotenchik]

В принципе сейчас на joomla выпускаются в основном шаблоны в стиле 2.0.
Если что-то нравится, можно без проблем рипнуть на слаед.

хм. если без проблем такое вот можно под 3.5 заточить?
h**p://www.joomlademo.de/index.php?mos_change_template=mf_whitesquid

Шаблоны в первом посту не понравились! для web 2.0 не тянут (IMG:http://antislaed.net/style_emoticons/default/smile.gif) ... ведь это не только div верстка...

[OMvitamin]

Шаблоны в первом посту не понравились! для web 2.0 не тянут smile.gif ... ведь это не только div верстка...

Ну это понятно, что не только. Шаблон который ты дал, можно заточить под что угодно. Только разница в том что joomla меню генерит из админки по пунктам, а в слаеде нужно будет это править в шаблоне, а так обычная шкурка на дивах и css в стиле веб2.0

[TypoSlaed]

Ух ты...

Затронув эту...

Замечу...

Я спорить не буду...

Всё движется.........

и т.д. (IMG:http://antislaed.net/style_emoticons/default/dont.gif)
teletehnika, к чему так дробить мой вступ?(IMG:http://antislaed.net/style_emoticons/default/90.gif) Я не собираюсь выяснять кто что лучше умеет. (IMG:http://antislaed.net/style_emoticons/default/54.gif)
Я лишь сам хочу разобратся как такие шаблоны подстроить под АС. И если ты уже открыл америку, то надеюсь что поможешь и мне разобратся.)
То что вы делитесь сдесь, это понятно. Только конкретно такой темы нет где разобраны все вопросы по натягиванию ЦСС вёрстки на АС.
Polotenchik, эти темы не обязаны комуто нравится. Я же сдесь не выставку провожу своих работ. Это бесплатные CSS шаблоны, которые я случайно повыбирал, чтоб разобрать как их можно переделать под АС.
Лично мне нравится их чёткий стиль и скорость загрузки. Если наполнить их контентом то они значительно изменятся внешне, а при наличии небольшой фантазии там вообще можно все разукрасить до неузнаваемости. На западе уже давно началась тенденция на минимализм. там переросли интерес к тяжёлым графическим дизайнам. А у нас ещё нет.
Да и в конце концов если у тебя планируется сайт на большую посещаемость, то будет ущщербно ставить тяжёлую графику, ведь не у всех есть быстрый интернет, и крепкие нервы чтоб ждать несколько минут загрузки. Это только можно позволить на хомяки ставить. Да и к примеру тот же Гугли - там вообще нету графики. Самая крутая компания, а графики нет! Почему? Полагаю потому что очень быстро грузится! Тем не менее это не вредит их посещаемости. Я конечно не такой аскет как Гугли, да и посещаемость такая не планируется, так что я се чёт могу ещё позволить.

(IMG:http://antislaed.net/style_emoticons/default/mu.gif)

--------------------
Чайник — человек, который мало знает, но хочет познать.

- самое оно! (про меня)

Сообщение отредактировал TypoSlaed: Feb 9 2008, 13:55

[JIopD]

Сам честно говоря верстаю в таком вот Веб 1.5 (IMG:http://antislaed.net/style_emoticons/default/smile.gif) Т.е. в таблицах с максималным применением Css. Полностью пока перейти немогу, не хватает опыта. Я ж только полгода как начал верстать...

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

[teletehnika]

Ладно, не обижайся на нас волкОв. Просто тему не так начал. А делиться опытом и своими наработками можно, кто же против. Только все ли желают опытом делиться?
Сразу вопрос. Какие различия web-1, 1,5 и 2.0

[OMvitamin]

Вопрос спорный.. никто толком не может дать определение 1.0 1,5 2.0, или как ещё у пэда на форуме придумали 3.0 3,5 и т.д.

ПРосто сам факт- это конечно стиль.. я думаю уже давно многие стали замечать изменения в интернете, что ни шаблон, везде этот стиль, что ни шаблон на заказ- тоже самое.
Исключения- разве что сайты High-tech тематики и колоссальные разработки на флэш. Но этого совсем не много, соответственно изза стоимости на работы по флэш.

[TypoSlaed]

Только докачал один диск в сети DC++ с flash-курсами по созданию сайтов.
Так вот сёдня решил его поюзать. Тока шо просмотрел один курс по CSS. Там нормальным языком, на примерах показуются все основные приёмы вёрстки. Я более-менее усвоил принцыпы.(шоб норм. усвоить нужна практика). Терь немнога легче будет разбиратся в тех исходниках што я выложил. Щас допишу месагу и приступлю.
Если кому надо будет, можно через сеть DC++ скачать.
Кста, на диске есть ещё такие курсы:

01 - Как создать сайт своими силами с нуля (141мб)
02 - HTML - язык создания сайтов - легко и доступно (57)
03 - CSS - создать стиль любому сайту это просто (107)
04 - Установка сервера - Тестирование сайта на своём компьютере (17)
05 - Dreamweaver - незаменимый помощник при создании сайта (151)
06 - Photoshop простым языком на примерах (~480) (ещё не докачан)
07 - Работа с графикой (60)
08 - Создаем электронные книги своими руками (35,5)
09 - Cоздаем свои видеоуроки в Camtasia Studio (70)
10 - Быстрое создание всплывающих окон (17,5)
11 - Учимся работать с технологией Flash (119)
12 - Создаем мозговые карты в Mind Manager (82)
13 - Учимся ставить форум на Ваш сайт (12,5)
14 - Как использовать готовые CMS движки (22)
15 - Создаем уроки для сайта с помощью Snag It (56)
16 - Как создается навигация для сайта (47)
17 - Бонусный курс (81)

Я всего ещё не смотрел. Только CSS и Навигацию. Там ещё к курсам бонусные проги есть, щтоб практичиски можно было всё опробовать и облегчить се жизнь.
Короче хорошие курсы для тех кто не хочет тратить много времени на освоение. Каждый курс в SFX-архиве, размеры Мб в скобках.

Сообщение отредактировал TypoSlaed: Apr 10 2008, 13:31

[TypoSlaed]

Сразу вопрос. Какие различия web-1, 1,5 и 2.0

Ну, лично, как я понял. в старых стандартах небыло больших средств для свободного творчиства, самым большим досижением, которое уже позже появилось, были таблицы (в 1,5, кажется) ну и в общем все украшательства (форматирование) вставлялись прямо в теги (хотя и сейчас так многие верстают) в итоге получается целый винигрет - смешивание разметки, украшательства и контента, всё в одном.
На смену этого пришла более усовершенствованая версия ХТМЛа - XHTML, и в добавок, совсем аж замечательная "технология" - CSS.
Вобщем теперь HTML/XHTML отвечает только за контент с минимальным кол-вом тегов, а все украшательства и ответственность за внешний вид ложатся на файлик css. Этот файл может распространятся на все странички сайта, как отдельная унифицированая библиотека. Т.е. теперь загружая страничку с сайта загружается и CSS-файл, он кешируется и когда мы переходим на другую страничку того же сайта, то загружается один лишь хтмл с контентом, а вся основная разметка дизайна берётся из кешированого CSS. Это очень сильно унифицирут сайт, делает его значительно меньше, ускоряет загрузку страниц, и самое важное, что теперь если надо изменить стиль на всех страницах одним махом, то достаточно подредактировать CSS-файл. Вобщем изменением одного CSS-ика можно менять дизайн сайта как перчатки. Но это далеко не все возможности. Там очень гибкие возможности для творчества. По CSS-дизу много книг толстых написано, вот у меня к примеру в pdf - "философия css-дизайна"(я её не читал) Вообще говорят што возможности для свободного творчества у этого языка безграничны.

Вот. Уверен что все это и так знают. Ну на всяк случ написал, хай новички читають.

[JIopD]

Ждите пишу большую статью верстание для чайников.. coming soon (IMG:http://antislaed.net/style_emoticons/default/smile.gif)

[cr3ator]

1.0 - table, font, iframe и пр. "молодой html"
1.5 - dhtml, css, java-applet, java-script, phtml
2.0 - div, xml, xhtml, span, ajax, мода.

imho

Сообщение отредактировал cr3ator: Feb 10 2008, 14:12

[teletehnika]

Ладно, вот это было давно и никто не читал: http://antislaed.net/index.php?showtopic=903

[TypoSlaed]

(IMG:http://antislaed.net/style_emoticons/default/149.gif)

Вобщем, что я хочу сказать. Зная базово хтмл, просмотрев курс по css, я понял что нифига сложного там нет. Я по большому счёту не имея опыта в верстании на хтмле, а тем более переделки щаблонов под АС, за день освоил базово хтмл, и цсс, а уже на другой уже переделывал css-шаблон под АС. Конечно, хочу предупредить новичков которые будут читать это, что если вы совсем зелёные и не имеете общего представления о принцыпах работы гипертекстовых документов, о том что такое Сайт, Сервер, Трафик, PHP, потребуется времени немного более для осмысления. Те же кто имеет небольшой опыт верстания в хтмл, без труда за несколько часов могут освоить и перейти на ЦСС.
Сам CSS язык предоставляет широчайшие возможности для WEB-творчиства. CSS для веб-дизайнера, это как Фотошоп для дизайнера. Там столько всевозможных функций и эффектов, что многие веб-дизайнеры ими не пользуются и не знают их назначения, хотя используя самые базовые элементы, делают просто шедевры. Всем извесно что при использовании CSS-языка стилей, всё оформление, каждый блок, элемент дизайна описывается и размечается в CSS
-файле. В самом же хтмле только указывается порядок размещения этих элементов дизайна и стилей. CSS-блоки которые идут на замену типичным html-таблицам вызываются при помощи тега <div>, обычно пишется <div id="header"> или <div class="blok1">, где параметр id или class говорит что надо вызвать конкретный обьект определённый в файле стилей, в данном примере - header (шапка сайта). Писать об отличиях параметров id и class, пожалуй небуду, шота обломна, кто собирается этим заниматся сами быстро разберутся.
Ну а что касаеца переделки CSS-под АС то по сложности примерно так же как и табличные. Для этого надо знать как переделывать табличные и базово ознакомится с CSS. Над первым шаблоном прийдётся поколбасится чтоб перестроить себе мозги, ето в любом деле так. Но последующие, я уверен, будут верстатся с такой же лёгкостью (или сложностью) как и хтмл-табличные. Если я - простой чайник, за пару дней разобрался как всё это устроено да и ещё дримвивером научился более-менее пользоватся, то кто тада не сможет)))

(IMG:http://antislaed.net/style_emoticons/default/34.gif)

Сразу догадываюсь что меня попросят выложить свои адаптации СSS-шаблонов для для АС. Сразу скажу, что только сделал основной - index.html - шаблон, другие шалоны не переделывал, потому что в процессе работы, понял что под мою тему надо ещё много графических элементов дорисовать, и в общем рещил весь дизайн перепланировать, штоб пооригенальней было, так что сейчас я в фотошопе над дизайном пока парюсь. Да и эту тему я не смогу выложить потому что мне нужен эксклюзив. Потом когда своё сделаю, тогда смогу спокойно народным творчеством заниматся.

[TypoSlaed]

Вот наконец-то преодолел лень :)) и залил несколко основных курсов (из перечисленых выше) на сервер.
Повторюсь: эти курсы являются видеоуроками, там в реальном времени на примерах показуется и рассказуется как всё делается. В курсах даются основные азы, которые помогут в дальнейшем самостоятельном практическом изучении. После этих курсов любой новичёк может спокойно брать готовый шаблон (html, css) и начать его редактировать.
Мне они очень помогли в экономии времени на изучение :))
Так что у каво безлимитный интернет скачивайте, думаю не пожалеете.
Тем кто уже нормально знает ХТМЛ возможно нет необходимости смотреть хтмл-урок. Но если возникнут пробелы при изучении курса по CSS или Dreamveawer, то обязательно скачайте и просмотрите его.
Это к тому, что нельзя изучить CSS и Dreamveawer без начального знания HTML.
Каждый курс разбит ещё на несколько уроков. К каждому курсу есть бонусные приложения в виде программ или исходников которые используются в уроках.

1. HTML - язык создания сайтов - легко и доступно Скачать (59 Mb)
2. CSS - создать стиль любому сайту это просто Скачать (50 Mb)
3. Dreamweaver - незаменимый помощник при создании сайта Скачать (109 Mb)

/-----------------------------------------------\

| Пароль на архивы: as-forum |

\-----------------------------------------------/

[SKKS]

Вот наконец-то преодолел лень (IMG:http://antislaed.net/style_emoticons/default/smile.gif) ) и залил несколко основных курсов (из перечисленых выше) на сервер.

И как с этого подлого сайта скачивать файлы????

[Elf]

Dreamweaver - незаменимый помощник при создании сайта Скачать (109 Mb)

А помойму заменимый (IMG:http://antislaed.net/style_emoticons/default/smile.gif) По стандарту ДА обучают на нем (IMG:http://antislaed.net/style_emoticons/default/smile.gif)

[teletehnika]

Ну да, намудрёно но всё просто. В опере не работает а в ИЕ спокойно. Попробовал, качает. Мне ненадо а то как я потом закину на место. Вдруг кому не хватит.

[GoogleBot]