На растерзание критикам. Работа "1"

[egrom92]

ну, чтож давайте по критикуйте)) с радостью по слушаю атекватную и обоснованную критику))

 

работа первая моя)) делал примерно 2 суток если собрать все часы в едино))

Пока только 1 страница, но это пока.

 

моя работа: тут

 

исходник: тута

 

В исходнике почти всё в картинках, я переписал в коды))

 

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

 

в общем я доволен первой работой))

[sigma77]

А с чем ты тогда заморочился? ))

Т.к. сейчас ну может только с фоном и цветом шрифта (кое-где) попал. Будь это работа на заказ, её бы и близко не приняли.

[Great Rash]

1) WORCK - это на каком языке?

2) <div class="border"></div> - это просто ужасно! так делали разделители во времена ИЕ5.5

3)

.monitor {background: url(images/monitor.png) no-repeat;width: 375px;height: 370px;position: relative;left: 600px;top: 23px;}

Это ужасно! Это даже не двойка, это кол с минусом. Вместо position: relative; и т.п. достаточно поставить float: right;

4) CLIENT LIST, OUR WORK, BOOK NOW! - это явно заголовки, а вы их параграфами сделали, зачем?

5) We build websites that blow you away. - это тоже заголовок, там не нужен <br> текст и так перенесется.

6) .blockbg1, .blockbg2, .blockbg3 - зачем там абсолютное позиционирование? Вы похоже вообще не понимаете как использовать float.

7) Need us say more? - опять же заголовок, а у вас <p>

8) Чо оно не по центру? Так и надо?

Всё очень плохо. Работайте ещё.

[egrom92]

А с чем ты тогда заморочился? ))

 

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

 

 

1) WORCK - это на каком языке?

 

как на каком?? на моём родном, непонятном))    

 

 

- это просто ужасно! так делали разделители во времена ИЕ5.5

 

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

 

Это ужасно! Это даже не двойка, это кол с минусом. Вместо position: relative; и т.п. достаточно поставить float: right;

 

ну то что ужасно, я тут с вами не соглашусь)) первая работа, попробовал свои силы, к цели добрался а то что я добрался через китай, хотя мог бы и напрямую добратся это уже дело практики)), главное узнать свои ошибки, проанализировать и желательно исправить, дабы закрепить, ужасно, это в том случае если я 10 раз кидал свои работы и те же самые ошибки постоянно допускал)) но это лично моё мнение которое не как не написаны с целью вас хоть как то задеть))

 

6) .blockbg1, .blockbg2, .blockbg3 - зачем там абсолютное позиционирование? Вы похоже вообще не понимаете как использовать float.

 

ну а по поводу "флота" я пробовал, но у меня постоянно заходил монитор на текст в случае если я уменьшаю размер экрана. я просто не придумал нечего лучше кроме как этот вариант. Но я буду признателен если объясните как было бы лучше, если объясните наглядно.

 

 

4) CLIENT LIST, OUR WORK, BOOK NOW! - это явно заголовки, а вы их параграфами сделали, зачем?

 

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

 

5) We build websites that blow you away. - это тоже заголовок, там не нужен <br>

текст и так перенесется.

 

ну а по поводу переноса строки, да согласен, но я решил перестраховаться, а авось я увеличил бы контейнер. ну в общем да)) вы по сути правы))

 

 

 

8) Чо оно не по центру? Так и надо?

 

ну судя по образцу то да, так и надо. если разговор про шаблон в целом.

 

Всё очень плохо.

 

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

 

Работайте ещё.

ну естесссно))

[Great Rash]

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

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

 

ну а по поводу "флота" я пробовал, но у меня постоянно заходил монитор на текст в случае если я уменьшаю размер экрана. я просто не придумал нечего лучше кроме как этот вариант. Но я буду признателен если объясните как было бы лучше, если объясните наглядно.

http://codepen.io/GreatRash/pen/xAfzI

хорошо, не могли бы вы предоставить свой вариант меню??

http://codepen.io/GreatRash/pen/wHyeF

ну а есть ли разница в том что я поставил к примеру параграф вместо заголовка??

Есть такое понятие как семантика документа. Но дело даже не в семантике (к которой я лично отношусь напревательски ), дело в том, что поисковики при выдаче страниц учитывают качество контента, а если у вас контент семантически верный, то например в гугле при прочих равных ваш сайт будет в выдаче выше. Поэтому, там где это оправдано, нужно стараться соблюдать правила семантики.

Это значит, что если у вас в тексте заголовок, то лучше следать его заголовком (<h1>, <h2>, <h3> и т.п.), если текст с параграфами, то разделить его на параграфы <p>, и так далее. Этим вы облегчите поисковым роботам (да и вообще любым роботам) разбор страницы и это положительно скажется на рейтинге сайта в целом.

[egrom92]

В общем я в вас вижу будущего специалиста

спасибо за добрые слова)) приятно)))

спасибо так же за примеры)) интересно, нужно ещё и разобраться в том что написал))

Это значит, что если у вас в тексте заголовок, то лучше сделать его заголовком

 

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

[Great Rash]

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

Собственно вся идея семантичного веба основана на том, чтобы дат возможность верстальщику облегчить работу по разбору документа программой-анализатором (это не обязательно поисковый робот, есть еще речевые браузеры например, тот же макбук умеет проговаривать содержимое страницы).

[egrom92]

всё, я понял)) спасибо)) к вечеру надеюсь исправлю ошибки свои))

хотел так же спросить, а можно ли делать из карт узоры и заливать их цветом??

 

вот мне просто понадобилось сделать треугольник, можно и спец символом попробовать, но я подумал сделать картой, но не как не получалось, мне просто интересно, реально или нет, если ли смысл продолжать поиск инфы по данному вопросу?

и если не реально то реально как-то с помощью ХТМЛ или ЦСС рисовать какие либо узоры, так как по идее 4-ёх угольник можно и круг нарисовать можно а вот многоугольник к примеру и накладывать на него стиль??

[Great Rash]

Многоугольники можно рисовать только в SVG (VML для старых ИЕ, ниже 9 версии).

[xzarxzes]

всё, я понял)) спасибо)) к вечеру надеюсь исправлю ошибки свои))

хотел так же спросить, а можно ли делать из карт узоры и заливать их цветом??

 

вот мне просто понадобилось сделать треугольник, можно и спец символом попробовать, но я подумал сделать картой, но не как не получалось, мне просто интересно, реально или нет, если ли смысл продолжать поиск инфы по данному вопросу?

и если не реально то реально как-то с помощью ХТМЛ или ЦСС рисовать какие либо узоры, так как по идее 4-ёх угольник можно и круг нарисовать можно а вот многоугольник к примеру и накладывать на него стиль??

https://css-tricks.com/examples/ShapesOfCSS/

[iKNG]

Прежде, чем выставлять на оценку, смотрите страницу во всех популярных браузерах. http://take.ms/6tnyL

P. S. Это снимок из SeaMonkey (а, значит, то же самое в Firefox)

[egrom92]

http://codepen.io/GreatRash/pen/wHyeF

 

вот тут у меня возникли некоторые вопросы. пытаюсь по тихому разобраться, что к чему и тут я заметил тут:

.menu {  position:absolute;  left:400px;  overflow: hidden;  height: 96px;  width:450px;  border-radius: 10px;  box-shadow: 0px 0px 5px 1px #77C0D3;} 

зачем тут высота стоит?? или это не обязательно? просто я уберал оставлял и разници не заметил не какой.

 

ну и так-же. вот тут

.item {  position: relative;  float: left;  width: 150px;  height: 96px;  font-size: 30px;  line-height: 96px;  text-align: center;  background: -webkit-linear-gradient(white, #E2E2E2);} 

 

частично прописано стиль шрифта. ну а вот у меня ещё стоит в этом блоке тег "а". так вот, как лучше поступить. прописать всё в основном блоке или же сделать отдельно стиль для тега "а"??

 

и я не как не могу понять, почему данный код:

.item:before {  content: "";  position: absolute;  top: 0;  left: 0;  width: 1px;  height: 100%;  background: -webkit-linear-gradient(#E2E2E2, white);}

не влияет на 3ий блок?? почему в конце третьего блока не появляется линия вертикальная шириной в 1 пиксель и с градиентом??

 

спасибо огромное также остальным за замеченные ошибки, будут исправлены))

 

 

а хотел бы так-же спросить, на сколько легко разобраться в коде мною написанном?

Edited March 1, 2014 by egrom92

[mihai]

Да кнопки ужас конечно, и фон побледнее надо.

[Great Rash]

зачем тут высота стоит?? или это не обязательно? просто я уберал оставлял и разници не заметил не какой.

Высота там стоит просто так, я когда пишу код, то пишу его черновик, а потом подчищаю. Тут забыл подчистить, можно и убрать. Зачем вы там опять влепили position: absolute?

частично прописано стиль шрифта. ну а вот у меня ещё стоит в этом блоке тег "а". так вот, как лучше поступить. прописать всё в основном блоке или же сделать отдельно стиль для тега "а"??

Надо просто заменить в коде <div> на <a>.

и я не как не могу понять, почему данный код не влияет на 3ий блок?? почему в конце третьего блока не появляется линия вертикальная шириной в 1 пиксель и с градиентом??

Данный код влияет на третий блок. Полоски стоят не после блоков, а перед блоками. А вот этот код:

.item:first-child:before {  display: none;}

прячет полоску у первого блока.

[egrom92]

Зачем вы там опять влепили position: absolute?

экспериментировал))

 

Надо просто заменить в коде

на .

ясно, странно что я не догадался)) странно что пытался разделить на задачу на 2 тега))

 

прячет полоску у первого блока.

спасибо, может покажется глупо, но я почему то не заметил сразу данной записи))

 

У меня пока что не как не получается усвоить :before и :after и что с ним связанно. в общем я очень надеюсь что у меня усвоится с опытом))